Add groupList directive to display user's groups

This commit adds a list of groups to the "topbar" when the groups
feature flag is enabled.

h/static/scripts/app-controller.coffee

@@ -5,13 +5,13 @@ module.exports = class AppController
   this.$inject = [
     '$controller', '$document', '$location', '$route', '$scope', '$window',
     'auth', 'drafts', 'features', 'identity',
-    'streamer', 'annotationUI',
+    'session', 'streamer', 'annotationUI',
     'annotationMapper', 'threading'
   ]
   constructor: (
      $controller,   $document,   $location,   $route,   $scope,   $window,
      auth,   drafts,   features,   identity,
-     streamer,   annotationUI,
+     session,   streamer,   annotationUI,
      annotationMapper, threading
   ) ->
     $controller('AnnotationUIController', {$scope})
@@ -21,6 +21,9 @@ module.exports = class AppController
     #     if ($scope.feature('foo')) { ... }
     $scope.feature = features.flagEnabled
 
+    # Allow all child scopes access to the session
+    $scope.session = session
+
     $scope.auth = auth
     isFirstRun = $location.search().hasOwnProperty('firstrun')
 

h/static/scripts/app.coffee

@@ -102,6 +102,7 @@ module.exports = angular.module('h', [
 .directive('deepCount', require('./directive/deep-count'))
 .directive('formInput', require('./directive/form-input'))
 .directive('formValidate', require('./directive/form-validate'))
+.directive('groupList', require('./directive/group-list'))
 .directive('markdown', require('./directive/markdown'))
 .directive('privacy', require('./directive/privacy'))
 .directive('simpleSearch', require('./directive/simple-search'))

h/static/scripts/directive/group-list.js

+'use strict';
+
+/**
+ * @ngdoc directive
+ * @name groupList
+ * @restrict AE
+ * @description Displays a list of groups of which the user is a member.
+ */
+module.exports = function () {
+  return {
+    restrict: 'AE',
+    scope: {
+      groups: '='
+    },
+    templateUrl: 'group_list.html'
+  };
+};

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

@@ -11,6 +11,7 @@ describe 'AppController', ->
   fakeIdentity = null
   fakeLocation = null
   fakeParams = null
+  fakeSession = null
   fakeStore = null
   fakeStreamer = null
   fakeStreamFilter = null
@@ -67,6 +68,8 @@ describe 'AppController', ->
 
     fakeParams = {id: 'test'}
 
+    fakeSession = {}
+
     fakeStore = {
       SearchResource: {
         get: sinon.spy()
@@ -99,6 +102,7 @@ describe 'AppController', ->
     $provide.value 'identity', fakeIdentity
     $provide.value '$location', fakeLocation
     $provide.value '$routeParams', fakeParams
+    $provide.value 'session', fakeSession
     $provide.value 'store', fakeStore
     $provide.value 'streamer', fakeStreamer
     $provide.value 'streamfilter', fakeStreamFilter

h/static/styles/app.scss

@@ -129,6 +129,9 @@ ol {
   }
 }
 
+.group-list {
+  margin-right: 0.5em;
+}
 
 .user-picker {
   .avatar {

h/templates/client/group_list.html

+<span role="button" class="dropdown-toggle" data-toggle="dropdown">
+  Groups
+  <i class="h-icon-arrow-drop-down"></i>
+</span>
+<ul class="dropdown-menu pull-right" role="menu">
+  <li ng-repeat="group in groups">
+    <a ng-href="{{group.url}}" ng-bind="group.name" target="_blank"></a>
+  </li>
+  <li>
+    <a href="/groups/new" target="_blank"><i class="h-icon-add"></i> Create a group</a>
+  </li>
+</ul>