Overhaul the threading, sort, and view further

Lots of changes to massively simplify things and make them much more
performant.

- The thread directive gets a few changes
  - Cleared up confusing tuple unpacking in favor of named properties
    in the render queue as per the suggestion of @aron
  - The replies and annotation are set at once. Since the replies in
    turn render lazily, this should be fast enough for all but an
    unwieldy number of threads. If we hit that wall, we'll have to do
    some filtering / pagination.
  - The directive is now triggered only on attributes and parses the
    attribute value to get the thread
- The threads are rendered from a single thread root rather than using
  a global list of annotations that must be watched for its threads to
  be extracted. This results in a huge performance gain because this
  thread container has a stable set of children.
  - When the first `annotationsLoaded` callback arrives, we set a new
    root from the result of asking the threading plugin to thread them
  - Lots of hackery during store reloads goes away because we just nuke
    the thread root and reload
- The application controller does not have to modify a root annotation
  set at all anymore
- Use of the root scope in the controllers goes away entirely
- The ongoing edit is now stored in the scope again so that it can be
  be pinned to the top of the thread list
- The editor view and controller go away completely because the top
  level edit is now pinned to the top of the list, removing the need
  to re-render annotations between editing and viewing
- The selected annotations are now a hash of annotation ids to true
  values if the annotation is selected, or null if the selection is
  empty
- An ng-show is used to show/hide the selected/unselected annotations,
  further reducing re-renders
- The view state is gone complete and now there is only sort
- The sort is not applied programmatically in the controller, but a
  simple watch on the name of the sort is used to set the predicate
  and reverse settings as scope properties that feed into an orderBy
  filter on the thread list, reducing the number of extra watches we
  have to do and further reducing the code
- The sort is no longer an animated dropdown, but sits at the top of
  the list always (I assume we can style this better, so have at it)
- Unnecessary helper and logging functions are removed from the
  annotator service because silence is golden

h/static/scripts/app.coffee

@@ -38,9 +38,6 @@ configure = [
     $routeProvider.when '/a/:id',
       controller: 'AnnotationViewerController'
       templateUrl: 'viewer.html'
-    $routeProvider.when '/editor',
-      controller: 'EditorController'
-      templateUrl: 'editor.html'
     $routeProvider.when '/viewer',
       controller: 'ViewerController'
       templateUrl: 'viewer.html'

h/static/scripts/directives.coffee

@@ -175,7 +175,7 @@ tabReveal = ['$parse', ($parse) ->
 ]
 
 
-thread = ['$$rAF', '$filter', '$window', ($$rAF, $filter, $window) ->
+thread = ['$$rAF', '$parse', '$window', ($$rAF, $parse, $window) ->
   # Helper -- true if selection ends inside the target and is non-empty
   ignoreClick = (event) ->
     sel = $window.getSelection()
@@ -193,9 +193,9 @@ thread = ['$$rAF', '$filter', '$window', ($$rAF, $filter, $window) ->
     renderFrame = $$rAF ->
       renderFrame = null
 
-      [scope, data] = renderQueue.shift()
-      while renderQueue[0]?[0] is scope
-        angular.extend data, renderQueue.shift()[1]
+      {scope, data} = renderQueue.shift()
+      while renderQueue[0]?.scope is scope
+        angular.extend data, renderQueue.shift().data
 
       angular.extend scope, data
       scope.$digest()
@@ -204,6 +204,7 @@ thread = ['$$rAF', '$filter', '$window', ($$rAF, $filter, $window) ->
 
   link: (scope, elem, attr, ctrl) ->
     childrenEditing = {}
+    threadWatch = $parse(attr.thread)
 
     scope.annotation = null
     scope.replies = null
@@ -214,7 +215,7 @@ thread = ['$$rAF', '$filter', '$window', ($$rAF, $filter, $window) ->
       scope.collapsed = !scope.collapsed
 
     scope.$on 'destroy', ->
-      renderQueue = ([s, _] for [s, _] in renderQueue is s isnt scope)
+      renderQueue = (item for item in renderQueue if item.scope isnt scope)
 
     scope.$on 'toggleEditing', (event) ->
       {$id, editing} = event.targetScope
@@ -227,19 +228,15 @@ thread = ['$$rAF', '$filter', '$window', ($$rAF, $filter, $window) ->
       else
         delete childrenEditing[$id]
 
-    scope.$watch 'thread', (thread) ->
+    scope.$watchCollection threadWatch, (thread) ->
       return unless thread
       annotation = thread.message
-      renderQueue.push [scope, {annotation}]
+      replies = thread.children
+      data = {annotation, replies}
+      renderQueue.push {scope, data}
       render()
 
-    scope.$watchCollection 'thread.children', (children) ->
-      return unless children
-      replies = $filter('orderBy')(children, 'message.updated', true)
-      renderQueue.push [scope, {replies}]
-      render()
-
-  restrict: 'C'
+  scope: true
 ]
 
 

h/static/scripts/directives/annotation.coffee

@@ -61,8 +61,12 @@ class Annotation
       annotation = $scope.model
 
       # Forbid saving comments without a body (text or tags)
-      if annotator.isComment(annotation) and not annotation.text and
-      not annotation.tags?.length
+      unless (
+        annotation.references?.length or
+        annotation.target?.length or
+        annotation.tags?.length or
+        annotation.text
+      )
         $window.alert "You can not add a comment without adding some text, or at least a tag."
         return
 
@@ -146,12 +150,8 @@ class Annotation
 
     $scope.$watch 'model.id', (id) ->
       if id?
-        $scope.thread = annotator.threading.getContainer(id)
-
-        # Check if this is a brand new annotation
-        if drafts.contains $scope.model
-          $scope.editing = true
-
+        $scope.thread = $scope.model.thread
+        $scope.editing = drafts.contains $scope.model
         link = documentHelpers.absoluteURI("/a/#{$scope.model.id}")
         $scope.shared_link = link
 

h/static/scripts/services.coffee

@@ -159,11 +159,6 @@ class Hypothesis extends Annotator
           for action, roles of annotation.permissions
             unless userId in roles then roles.push userId
 
-    # Remove annotations from the view when they are deleted
-    this.subscribe 'annotationDeleted', (a) =>
-      scope = @element.scope()
-      scope.annotations = scope.annotations.filter (b) -> b isnt a
-
   _setupXDM: (options) ->
     $rootScope = @element.injector().get '$rootScope'
 
@@ -257,53 +252,37 @@ class Hypothesis extends Annotator
   _setupDocumentAccessStrategies: -> this
   _scan: -> this
 
-  # (Optionally) put some HTML formatting around a quote
-  getHtmlQuote: (quote) -> quote
-
-  # Just some debug output
-  loadAnnotations: (annotations) ->
-    console.log "Loaded", annotations.length, "annotations."
-    super
-
   # Do nothing in the app frame, let the host handle it.
   setupAnnotation: (annotation) ->
     annotation.highlights = []
     annotation
 
   toggleViewerSelection: (annotations=[]) =>
-    annotations = annotations.filter (a) -> a?
     scope = @element.scope()
-    # XOR this list to the current selection
-    list = scope.annotations = scope.annotations.slice()
+    selected = scope.selectedAnnotations or {}
     for a in annotations
-      index = list.indexOf a
-      if index isnt -1
-        list.splice index, 1
+      if selected[a.id]
+        delete selected[a.id]
       else
-        list.push a
-    # View and sort the selection
-    scope.applyView "Selection"
-    scope.applySort scope.viewState.sort
+        selected[a.id] = true
+    if Object.keys(selected).length
+      scope.selectedAnnotations = selected
+    else
+      scope.selectedAnnotations = null
     this
 
   updateViewer: (annotations=[]) =>
-    annotations = annotations.filter (a) -> a?
-    scope = @element.scope()
-    commentFilter = angular.bind(this, this.isComment)
-    comments = (scope.$root.annotations or []).filter(commentFilter)
-    scope.annotations = annotations
-    scope.applySort scope.viewState.sort
-    scope.annotations = [scope.annotations..., comments...]
+    # TODO: re-implement
     this
 
   showViewer: (annotations=[]) =>
-    location = @element.injector().get('$location')
-    location.path('/viewer').replace()
     scope = @element.scope()
-    scope.annotations = annotations
-    scope.applyView 'Selection'
-    scope.applySort scope.viewState.sort
+    selected = {}
+    for a in annotations
+      selected[a.id] = true
+    scope.selectedAnnotations = selected
     this.show()
+    this
 
   addEmphasis: (annotations=[]) =>
     annotations = annotations.filter (a) -> a? # Filter out null annotations
@@ -323,31 +302,9 @@ class Hypothesis extends Annotator
         method: 'adderClick'
 
   showEditor: (annotation) =>
+    @element.injector().get('drafts').add(annotation)
+    @element.scope().ongoingEdit = annotation
     this.show()
-    @element.injector().invoke [
-      '$location', '$rootScope', 'drafts', 'identity',
-      ($location,   $rootScope,   drafts,   identity) =>
-        @ongoing_edit = annotation
-
-        unless this.plugins.Auth? and this.plugins.Auth.haveValidToken()
-          $rootScope.$apply ->
-            identity.request()
-          for p in @providers
-            p.channel.notify method: 'onEditorHide'
-          return
-
-        # Set the path
-        search =
-          id: annotation.id
-          action: 'create'
-        $location.path('/editor').search(search)
-
-        # Store the draft
-        drafts.add annotation
-
-        # Digest the change
-        $rootScope.$digest()
-    ]
     this
 
   show: =>
@@ -469,16 +426,6 @@ class Hypothesis extends Annotator
         method: 'setVisibleHighlights'
         params: state
 
-  # Is this annotation a comment?
-  isComment: (annotation) ->
-    # No targets and no references means that this is a comment
-    not (annotation.references?.length or annotation.target?.length)
-
-  # Is this annotation a reply?
-  isReply: (annotation) ->
-    # The presence of references means that this is a reply
-    annotation.references?.length
-
   # Discard all drafts, deleting unsaved annotations from the annotator
   discardDrafts: ->
     return @element.injector().get('drafts').discard()

h/static/scripts/streamsearch.coffee

@@ -26,13 +26,7 @@ class StreamSearch
     terms = searchfilter.generateFacetedFilter $scope.search.query
     queryparser.populateFilter streamfilter, terms
 
-    $scope.updater?.then (sock) ->
-      filter = streamfilter.getFilter()
-      sock.send(JSON.stringify({filter}))
-
-    annotator.plugins.Store?.annotations = []
-    $rootScope.applyView 'Document'  # Non-sensical but works for now
-    $rootScope.applySort 'Newest'
+    $scope.sort.name = 'Newest'
 
 
 angular.module('h.streamsearch', imports, configure)

h/static/styles/common.scss

@@ -354,44 +354,3 @@ html {
     box-shadow:3px 3px 4px #999999;
   }
 }
-
-
-// View and Sort tabs ////////////////////
-.viewsort {
-  @include single-transition(top, .25s);
-  @include transition-timing-function(cubic-bezier(0, 1, .55, 1));
-  width: 100%;
-  text-align: center;
-  position: fixed;
-  top: 29px;
-  right: 0;
-  z-index: 4;
-
-  &.ng-hide {
-    @include transition-timing-function(cubic-bezier(1, .55, 0, 1));
-    top: 0;
-    display:block!important;
-    overflow: hidden;
-  }
-}
-
-.viewsort > .dropdown {
-  @include smallshadow(0);
-  border-bottom-right-radius: 24px 72px;
-  border-bottom-left-radius: 24px 72px;
-  font-family: $sans-font-family;
-  font-weight: 300;
-  background: $white;
-  border: solid 1px $gray-lighter;
-  padding: 0 10px;
-  margin: 0 3px;
-  display: inline-block;
-
-  .dropdown-menu {
-    margin-top: 0;
-
-    &:before, &:after {
-      display: none;
-    }
-  }
-}