Focus on a group

When a user clicks on a group name in the "scope selector" dropdown
menu, we want to filter the visible annotations by group. This commit
implements a rather inefficient but functional approach to this, simply
reloading the angular view.

In addition, we make sure that the initial annotation load includes a
filter on the currently-focused group, and we discard non-focused-group
annotations coming in over the websocket.

h/static/scripts/app-controller.coffee

@@ -36,6 +36,10 @@ module.exports = class AppController
     # Default sort
     $scope.sort = name: 'Location'
 
+    $scope.$on('groupFocused', (event) ->
+      $route.reload()
+    )
+
     identity.watch({
       onlogin: (identity) -> $scope.auth.user = auth.userid(identity)
       onlogout: -> $scope.auth.user = null

h/static/scripts/app.coffee

@@ -12,8 +12,8 @@ socket = null
 resolve =
   store: ['store', (store) -> store.$promise]
   streamer: [
-    '$websocket', 'annotationMapper'
-    ($websocket,   annotationMapper) ->
+    '$websocket', 'annotationMapper', 'groups'
+    ($websocket,   annotationMapper,   groups) ->
       # Get the socket URL
       url = new URL('/ws', baseURI)
       url.protocol = url.protocol.replace('http', 'ws')
@@ -32,6 +32,14 @@ resolve =
         action = message.options.action
         annotations = message.payload
         return unless annotations?.length
+
+        # Discard annotations that aren't from the currently focused group.
+        # FIXME: Have the server only send us annotations from the focused
+        # group in the first place.
+        annotations = annotations.filter((ann) ->
+          return ann.group == groups.focused().id
+        )
+
         switch action
           when 'create', 'update', 'past'
             annotationMapper.loadAnnotations annotations

h/static/scripts/groups.js

@@ -10,7 +10,7 @@
 var STORAGE_KEY = 'hypothesis.groups.focus';
 
 // @ngInject
-function groups(localStorage, session) {
+function groups(localStorage, session, $rootScope) {
   // The currently focused group. This is the group that's shown as selected in
   // the groups dropdown, the annotations displayed are filtered to only ones
   // that belong to this group, and any new annotations that the user creates
@@ -56,6 +56,7 @@ function groups(localStorage, session) {
       if (typeof g !== 'undefined') {
         focused = g;
         localStorage.setItem(STORAGE_KEY, g.id);
+        $rootScope.$broadcast('groupFocused', g.id);
       }
     }
   };

h/static/scripts/test/groups-test.js

@@ -19,6 +19,7 @@ var sessionWithThreeGroups = function() {
 describe('groups', function() {
   var fakeSession;
   var fakeLocalStorage;
+  var fakeRootScope;
   var sandbox;
 
   beforeEach(function () {
@@ -29,6 +30,9 @@ describe('groups', function() {
       getItem: sandbox.stub(),
       setItem: sandbox.stub()
     };
+    fakeRootScope = {
+      $broadcast: sandbox.stub()
+    }
   });
 
   afterEach(function () {
@@ -36,7 +40,7 @@ describe('groups', function() {
   });
 
   function service() {
-    return groups(fakeLocalStorage, fakeSession);
+    return groups(fakeLocalStorage, fakeSession, fakeRootScope);
   }
 
   describe('.all()', function() {

h/static/scripts/test/widget-controller-test.coffee

@@ -10,6 +10,7 @@ describe 'WidgetController', ->
   fakeStreamer = null
   fakeStreamFilter = null
   fakeThreading = null
+  fakeGroups = null
   sandbox = null
   viewer = null
 
@@ -58,6 +59,10 @@ describe 'WidgetController', ->
       root: {}
     }
 
+    fakeGroups = {
+      focused: -> {id: 'foo'}
+    }
+
     $provide.value 'annotationMapper', fakeAnnotationMapper
     $provide.value 'annotationUI', fakeAnnotationUI
     $provide.value 'crossframe', fakeCrossFrame
@@ -65,6 +70,7 @@ describe 'WidgetController', ->
     $provide.value 'streamer', fakeStreamer
     $provide.value 'streamFilter', fakeStreamFilter
     $provide.value 'threading', fakeThreading
+    $provide.value 'groups', fakeGroups
     return
 
   beforeEach inject ($controller, $rootScope) ->

h/static/scripts/widget-controller.coffee

@@ -3,11 +3,11 @@ angular = require('angular')
 
 module.exports = class WidgetController
   this.$inject = [
-    '$scope', 'annotationUI', 'crossframe', 'annotationMapper',
+    '$scope', 'annotationUI', 'crossframe', 'annotationMapper', 'groups',
     'streamer', 'streamFilter', 'store', 'threading'
   ]
   constructor:   (
-     $scope,   annotationUI, crossframe, annotationMapper,
+     $scope,   annotationUI,   crossframe,   annotationMapper,   groups,
      streamer,   streamFilter,   store,   threading
   ) ->
     $scope.isStream = true
@@ -23,6 +23,7 @@ module.exports = class WidgetController
         offset: offset
         sort: 'created'
         order: 'asc'
+        group: groups.focused().id
       q = angular.extend(queryCore, query)
 
       store.SearchResource.get q, (results) ->