Introducing bottombar for notifications

h/css/common.scss

@@ -655,6 +655,37 @@ blockquote {
   }
 }
 
+.bottombar {
+  @include smallshadow;
+  background: $white;
+  border: solid 1px $grayLighter;
+  height: 2em;
+  position: fixed;
+  left: -1px;
+  right: -1px;
+  bottom: .5em;
+  z-index: 5;
+
+  .barbutton {
+    &:hover {
+      @include box-shadow(inset 0 1px 3px hsla(0, 0%, 0%, .1));
+    }
+
+    &:active {
+      @include box-shadow(inset 0 2px 3px hsla(0, 0%, 0%, .1));
+    }
+  }
+
+  .inner > * {
+    padding: .3em;
+
+    &.pull-right {
+      display: inline-block;
+      font-family: $sansFontFamily;
+    }
+  }
+}
+
 
 //MAIN CONTENT///////
 .content {

h/css/sidebar.scss

@@ -110,6 +110,14 @@ svg { -webkit-tap-highlight-color: rgba(255, 255, 255, 0); }
   }
 }
 
+.bottombar {
+  position: fixed;
+  border-top-left-radius: 4px;
+  border-bottom-left-radius: 4px;
+  left: 7px;
+  bottom: .5em;
+}
+
 //CONTROLBAR STUFF////////////////////////////////
 .controlbar {
   position: absolute;

h/js/controllers.coffee

@@ -439,6 +439,32 @@ class App
 
         $scope.has_update = false
 
+    # Notifications
+    $scope.notifications = []
+
+    $scope.removeNotificationUpdate = ->
+      index = -1
+      for notif in $scope.notifications
+        if notif.type is 'update'
+          index = $scope.notifications.indexOf notif
+          break
+
+      if index > -1 then $scope.notifications.splice index,1
+
+    $scope.addUpdateNotification = ->
+      # Do not add an update notification twice
+      unless $scope.has_update
+        notification =
+          type: 'update'
+          text: 'Reload to seen new annotations'
+          callback: =>
+            $scope.reloadAnnotations()
+            $scope.removeNotificationUpdate()
+          close: $scope.removeNotificationUpdate
+
+        $scope.notifications.unshift notification
+        $scope.has_update = true
+
     $scope.initUpdater = ->
       $scope.has_update = false
       path = window.location.protocol + '//' + window.location.hostname + ':' +
@@ -477,23 +503,21 @@ class App
               if action is 'create'
                 continue # We have created this
               if action is 'update'
-                if check.message.pdated is annotation.updated then continue
+                if check.message.updated is annotation.updated then continue
                 else
-                  $scope.has_update = true
+                  $scope.addUpdateNotification()
                   break
               if action is 'delete'
                 # We haven't deleted this yet
-                $scope.has_update = true
+                $scope.addUpdateNotification()
                 break
             else
               if action is 'delete'
                 continue # Probably our own delete or doesn't concern us
               else
-                $scope.has_update = true
+                $scope.addUpdateNotification()
                 break
 
-          #$scope.$digest()
-
     $timeout =>
       $scope.initUpdater()
     , 5000
@@ -885,9 +909,17 @@ class Search
     refresh()
 
 
+class Notification
+  this.inject = ['$scope']
+  constructor: (
+    $scope
+  ) ->
+
+
 angular.module('h.controllers', ['bootstrap', 'h.streamfilter'])
   .controller('AppController', App)
   .controller('AnnotationController', Annotation)
   .controller('EditorController', Editor)
   .controller('ViewerController', Viewer)
   .controller('SearchController', Search)
+  .controller('NotificationController', Notification)

h/js/directives.coffee

@@ -326,6 +326,20 @@ tags = ['$window', ($window) ->
   restrict: 'C'
 ]
 
+notification = ['$filter', ($filter) ->
+  link: (scope, elem, attrs, controller) ->
+    return unless controller?
+
+    # Publish the controller
+    scope.model = controller
+  controller: 'NotificationController'
+  priority: 100  # Must run before ngModel
+  require: '?ngModel'
+  restrict: 'C'
+  scope: {}
+  templateUrl: 'notification.html'
+]
+
 angular.module('h.directives', ['ngSanitize'])
   .directive('authentication', authentication)
   .directive('markdown', markdown)
@@ -339,4 +353,5 @@ angular.module('h.directives', ['ngSanitize'])
   .directive('userPicker', userPicker)
   .directive('ngBlur', ngBlur)
   .directive('repeatAnim', repeatAnim)
+  .directive('notification', notification)