Implement multiple selection of annotations

Pressing Ctrl (or Compose), and clicking on a highlight,
or a tab on the heatmap now adds annotations to the current selection.
A second such clicks removes them agian.

k

h/js/guest.coffee

@@ -198,6 +198,11 @@ class Annotator.Guest extends Annotator
         (a.id for a in annotations)
       ]
 
+  xorToViewer: (annotations) =>
+    @panel?.notify
+      method: "xorToViewer"
+      params: (a.id for a in annotations)
+
   updateViewer: (viewName, annotations) =>
     @panel?.notify
       method: "updateViewer"
@@ -270,30 +275,34 @@ class Annotator.Guest extends Annotator
     else
       super
 
-  onAnchorMouseover: (annotations) ->
+  onAnchorMouseover: (event, annotations) ->
     if (@tool is 'highlight') or @visibleHighlights
       this.addEmphasis annotations
 
-  onAnchorMouseout: (annotations) ->
+  onAnchorMouseout: (event, annotations) ->
     if (@tool is 'highlight') or @visibleHighlights
       this.removeEmphasis annotations
 
   # When clicking on a highlight in highlighting mode,
   # set @noBack to true to prevent the sidebar from closing
-  onAnchorMousedown: (annotations) =>
+  onAnchorMousedown: (event, annotations) =>
     if (@tool is 'highlight') or @visibleHighlights
       @noBack = true
 
   # When clicking on a highlight in highlighting mode,
   # tell the sidebar to bring up the viewer for the relevant annotations
-  onAnchorClick: (annotations) =>
+  onAnchorClick: (event, annotations) =>
     return unless (@tool is 'highlight') or @visibleHighlights and @noBack
 
     # Switch off dynamic mode; we are going to "Selection" scope
     @plugins.Heatmap.dynamicBucket = false
 
-    # Tell sidebar to show the viewer for these annotations
-    this.showViewer "Selection", annotations
+    if event.metaKey or event.ctrlKey
+      # Tell sidebar to add these annotations to the sidebar
+      this.xorToViewer annotations
+    else
+      # Tell sidebar to show the viewer for these annotations
+      this.showViewer "Selection", annotations
 
     # We have already prevented closing the sidebar, now reset this flag
     @noBack = false

h/js/plugin/heatmap.coffee

@@ -468,7 +468,10 @@ class Annotator.Plugin.Heatmap extends Annotator.Plugin
         else
           d3.event.stopPropagation()
           @dynamicBucket = false
-          annotator.showViewer "Selection", @buckets[bucket]
+          if d3.event.ctrlKey or d3.event.metaKey
+            annotator.xorToViewer @buckets[bucket]
+          else
+            annotator.showViewer "Selection", @buckets[bucket]
 
     tabs.exit().remove()
 

h/js/services.coffee

@@ -227,6 +227,10 @@ class Hypothesis extends Annotator
       $rootScope.$apply => this.updateViewer viewName, this._getAnnotationsFromIDs ids
     )
 
+    .bind('xorToViewer', (ctx, ids = []) =>
+      $rootScope.$apply => this.xorToViewer this._getAnnotationsFromIDs ids
+    )
+
     .bind('setTool', (ctx, name) =>
       $rootScope.$apply => this.setTool name
     )
@@ -315,6 +319,30 @@ class Hypothesis extends Annotator
         annotation.reply_list = children.sort(@sortAnnotations).reverse()
         @buildReplyList children
 
+  xorToViewer: (annotations=[]) =>
+    annotations = annotations.filter (a) -> a?
+    @element.injector().invoke [
+      '$rootScope',
+      ($rootScope) =>
+        if $rootScope.view is "Selection"
+          # We are already in selection mode; just XOR this list
+          # to the current selection
+          @buildReplyList annotations
+          list = $rootScope.annotations
+          for a in annotations
+            if a in list
+              list.splice list.indexOf(a), 1
+            else
+              list.push a
+        else
+          # We are not in selection mode,
+          # so we switch to it, and make this list
+          # the new selection
+          $rootScope.view = "Selection"
+          $rootScope.annotations = annotations
+    ]
+    this
+
   updateViewer: (viewName, annotations=[]) =>
     annotations = annotations.filter (a) -> a?
     @element.injector().invoke [