Added show direct functionality back

Gemfile

@@ -6,3 +6,4 @@ gem "json"
 gem "haml"
 gem "RedCloth"
 gem "sass"
+gem "uglifier"

Gemfile.lock

@@ -37,6 +37,9 @@ GEM
       ffi (~> 1.0)
       multi_json (~> 1.0)
       rubyzip
+    uglifier (1.2.4)
+      execjs (>= 0.3.0)
+      multi_json (>= 1.0.2)
 
 PLATFORMS
   ruby
@@ -48,3 +51,4 @@ DEPENDENCIES
   jasmine
   json
   sass
+  uglifier

Rakefile

@@ -5,6 +5,7 @@ require "RedCloth"
 require_relative "spec/support/jasmine_config.rb"
 load "jasmine/tasks/jasmine.rake"
 
+DEBUG         = true
 ROOT_DIR      = File.expand_path(File.dirname(__FILE__))
 EXTENSION_DIR = File.join(ROOT_DIR, "ext")
 SOURCE_DIR    = File.join(ROOT_DIR, "src")
@@ -71,35 +72,55 @@ namespace :build do
   desc "Compile CoffeeScript to JavaScript"
   task :coffee do
     require "coffee-script"
+    require "uglifier"
     opts = { :merge_subdirectories => true }
-    compile_sources("coffee", opts) { |c| CoffeeScript.compile(c, :bare => true) }
+    compile_sources("coffee", opts) do |content|
+      js = CoffeeScript.compile(content, :bare => true)
+      if DEBUG
+        js
+      else
+        Uglifier.compile js
+      end
+    end
   end
 
   desc "Compile HAML to HTML"
   task :haml do
     require "haml"
-    compile_sources("haml") { |c| Haml::Engine.new(c).render }
+    compile_sources("haml") do |content|
+      Haml::Engine.new(content).render
+    end
   end
 
   desc "Compile SASS to CSS"
   task :sass do
     require "sass"
-    compile_sources("sass") { |c| Sass::Engine.new(c).render }
+    compile_sources("sass") do |content|
+      Sass::Engine.new(content).render
+    end
   end
 
   desc "Compile YAML to JSON"
   task :yml do
     require "yaml"
     require "json"
-    compile_sources("yml") { |c| JSON.pretty_generate(JSON.parse(YAML.load(c).to_json)) }
+    compile_sources("yml") do |content|
+      json = YAML.load(content).to_json
+      JSON.pretty_generate JSON.parse(json)
+    end
   end
+
+  desc "Compile and copy over all extension files but leave human-readable"
+  task :debug => [:coffee, :haml, :sass, :yml]
 end
 
 namespace :jasmine do
   desc "Compile CoffeeScript specs to JavaScript specs"
   task :compile do
-    opts = { :input_dir => "../spec", :output_dir => "../spec" }
-    compile_sources("coffee", "js", opts) { |c| CoffeeScript.compile(c, :bare => true) }
+    opts = { input_dir: "../spec", output_dir: "../spec" }
+    compile_sources("coffee", "js", opts) do |content|
+      CoffeeScript.compile content, :bare => true
+    end
   end
 end
 
@@ -129,8 +150,13 @@ task :zip do
   end
 end
 
+desc "Turn debug off"
+task :production do
+  DEBUG = false
+end
+
 desc "Compile and copy over all extension files"
-task :build => ["build:coffee", "build:haml", "build:sass", "build:yml", :raw]
+task :build => [:production, "build:coffee", "build:haml", "build:sass", "build:yml", :raw]
 
 desc "Compile spec CoffeeScripts and setup tests"
 task :spec => ["jasmine:compile", "jasmine"]

src/css/content.css.sass

@@ -24,6 +24,12 @@
 
 /* CSS */
 div.com-block
+  .commentheader
+    a
+      cursor: pointer
+    .filter
+      padding-left: 0.25em
+
   div.filter_explanation
     @include horizontal-list(", ")
     color: #bbb
@@ -78,9 +84,12 @@ div.post div.ablePic > img
   max-width: 300px
   padding: 0
 
-div.ableHighlight
+div.highlight
   background-color: #eee
 
+div.collapsed
+  display: none
+
 /* Highlight myself */
 div.ableMe
   background-color: #ffc

src/js/content/comment.js.coffee

@@ -1,19 +1,57 @@
 class Comment
-  constructor: (@node, @index, @post) ->
+  constructor: (@node, @index, @post, @previous) ->
     @id        = @node.id.replace("comment_", "").parseInt()
     @header    = @node.getElementsByTagName("h2")[0]
     @content   = (p.textContent for p in @node.getElementsByTagName("p")).join("\n")
     @depth     = @node.className.substr(-1).parseInt()
     @name      = @extractName()
     @link      = @extractLink()
     @timestamp = @extractTimestamp()
+    @previous.setNext this if @previous?
 
     if @name is Settings.username
       @isMe = yes
       @node.className += " ableMe"
     else
       @isMe = no
 
+  setNext: (@next) ->
+
+  showDirect: =>
+    positionOf = (node) ->
+      top = 0
+      while node.offsetParent
+        top  += node.offsetTop
+        node  = node.offsetParent
+      top
+
+    offset  = window.scrollY - positionOf(@node)
+    comment = this
+    depth   = comment.depth + 1
+    if comment.node.className.indexOf("highlight") is -1
+      while depth isnt 0
+        node = comment.node
+        if comment.depth < depth
+          node.className += " highlight"
+          node.getElementsByClassName("collapser")[0].textContent = "+"
+          depth = comment.depth
+        else
+          node.className += " collapsed"
+        comment = comment.previous
+    else
+      # getElementsByClassName returns an immutable array that will change if you remove classes
+      highlighted = (node for node in document.getElementsByClassName("highlight"))
+      for node in highlighted
+        node.className = node.className.replace(" highlight", "")
+        node.getElementsByClassName("collapser")[0].textContent = "-"
+
+      collapsed = (node for node in document.getElementsByClassName("collapsed"))
+      for node in collapsed
+        node.className = node.className.replace(" collapsed", "")
+
+    # Return focus to original node
+    window.scrollTo 0, [ positionOf(@node) + offset ]
+
   extractName: ->
     strong = @header.firstChild
     if strong.hasChildNodes()
@@ -40,47 +78,38 @@ class Comment
   # Filters are organized together to make it easier
   filterName:    => Filter.dialog "string", "name", @name
   filterLink:    => Filter.dialog "string", "link", @link
-  filterContent: -> Filter.dialog "string", "content"
   filterCustom:  -> Filter.dialog "regex",  "content"
 
   addControls: ->
     nodes = DOMBuilder.create([
       { tag: "span", class: "pipe", text: "|" }
-      "filters: "
       {
-        tag: "div"
-        class: "filters"
-        children:
-          tag: "ul"
-          children: [{
-            tag: "li"
-            children:
-              tag: "a"
-              text: "name"
-              events:
-                click: @filterName
-          }, {
-            tag: "li"
-            children:
-              tag: "a"
-              text: "link"
-              events:
-                click: @filterLink
-          }, {
-            tag: "li"
-            children:
-              tag: "a"
-              text: "content"
-              events:
-                click: @filterContent
-          }, {
-            tag: "li"
-            children:
-              tag: "a"
-              text: "custom"
-              events:
-                click: @filterCustom
-          }]
+        tag: "a"
+        class: "collapser"
+        text: "-"
+        events:
+          click: @showDirect
+      }
+      { tag: "span", class: "pipe", text: "|" }
+      "filter"
+      {
+        tag: "a"
+        class: "filter"
+        text: "name"
+        events:
+          click: @filterName
+      }, {
+        tag: "a"
+        class: "filter"
+        text: "link"
+        events:
+          click: @filterLink
+      }, {
+        tag: "a"
+        class: "filter"
+        text: "custom"
+        events:
+          click: @filterCustom
       }
     ])
 

src/js/content/post.js.coffee

@@ -3,8 +3,9 @@ class Post
     @container   = document.getElementById("commentcontainer")
     @comments    = do =>
       if @container?
+        previousComment = null
         for block, index in @container.getElementsByClassName("com-block")
-          new Comment(block, index, this)
+          previousComment = new Comment(block, index, this, previousComment)
       else
         null
     @isThreaded = yes