Save annotation state to drafts whenever annotation component is destroyed

Prior to this unsaved changes were lost when an annotation being edited
was scrolled off-screen and the annotation component was destroyed.

There was already a mechanism in place for persisting unsaved changes
to a temporary store when switching accounts and when switching groups
but this was only triggered when the signed in user changed or the
focused group changed.

This commit unifies the handling of all three cases by listening
for the '$destroy' event which is fired whenever an <annotation>
is about to be destroyed.

h/static/scripts/directive/annotation.js

@@ -268,15 +268,12 @@ function AnnotationController(
     // are empty
     $rootScope.$on(events.BEFORE_ANNOTATION_CREATED, deleteIfNewAndEmpty);
 
-    // Call `onDestroy()` when this AnnotationController's scope is removed.
+    // Call `onDestroy()` when the component is destroyed.
     $scope.$on('$destroy', onDestroy);
 
     // Call `onGroupFocused()` whenever the currently-focused group changes.
     $scope.$on(events.GROUP_FOCUSED, onGroupFocused);
 
-    // Call `onUserChanged()` whenever the user logs in or out.
-    $scope.$on(events.USER_CHANGED, onUserChanged);
-
     // New annotations (just created locally by the client, rather then
     // received from the server) have some fields missing. Add them.
     domainModel.user = domainModel.user || session.state.userid;
@@ -322,34 +319,28 @@ function AnnotationController(
   }
 
   function onDestroy() {
+    // If the annotation component is destroyed whilst the annotation is being
+    // edited, persist temporary state so that we can restore it if the
+    // annotation editor is later recreated.
+    //
+    // The annotation component may be destroyed when switching accounts,
+    // when switching groups or when the component is scrolled off-screen.
+    if (vm.editing()) {
+      saveToDrafts(drafts, domainModel, vm);
+    }
+
     if (vm.cancelTimestampRefresh) {
       vm.cancelTimestampRefresh();
     }
   }
 
   function onGroupFocused() {
-    if (vm.editing()) {
-      saveToDrafts(drafts, domainModel, vm);
-    }
-
     // New annotations move to the new group, when a new group is focused.
     if (isNew(domainModel)) {
       domainModel.group = groups.focused().id;
     }
   }
 
-  function onUserChanged(event, args) {
-    // If the user creates an annotation while signed out and then signs in
-    // we want those annotations to still be in the sidebar after sign in.
-    // So we need to save a draft of the annotation here on sign in because
-    // app.coffee / the routing code is about to destroy all the
-    // AnnotationController instances and only the ones that have saved drafts
-    // will be re-created.
-    if (vm.editing() && session.state.userid) {
-      saveToDrafts(drafts, domainModel, vm);
-    }
-  }
-
   /** Save this annotation if it's a new highlight.
    *
    * The highlight will be saved to the server if the user is logged in,

h/static/scripts/directive/test/annotation-test.js

@@ -1271,7 +1271,7 @@ describe('annotation', function() {
       });
     });
 
-    describe('onGroupFocused()', function() {
+    describe('when component is destroyed', function () {
       it('if the annotation is being edited it updates drafts', function() {
         var parts = createDirective();
         parts.controller.isPrivate = true;
@@ -1283,25 +1283,25 @@ describe('annotation', function() {
         });
         fakeDrafts.update = sinon.stub();
 
-        $rootScope.$broadcast(events.GROUP_FOCUSED);
+        parts.scope.$broadcast('$destroy');
 
         assert.calledWith(
           fakeDrafts.update,
           parts.annotation, {isPrivate:true, tags:[], text:'unsaved-text'});
       });
 
-      it('if the annotation isn\'t being edited it doesn\'t update drafts',
-         function() {
+      it('if the annotation isn\'t being edited it doesn\'t update drafts', function() {
          var parts = createDirective();
          parts.controller.isPrivate = true;
          fakeDrafts.update = sinon.stub();
 
-           $rootScope.$broadcast(events.GROUP_FOCUSED);
+         parts.scope.$broadcast('$destroy');
 
          assert.notCalled(fakeDrafts.update);
-         }
-      );
+       });
+    });
 
+    describe('onGroupFocused()', function() {
       it('updates domainModel.group if the annotation is new', function () {
         var annotation = fixtures.newAnnotation();
         annotation.group = 'old-group-id';