Fix 'Post to' button not updating when groups changed

The 'group' property on the scope used by the 'Post to' button
was set when the component was instantiated but not updated
if the group subsequently changed.

Fix this and simplify the code by using the 'bindToController'
facility from Angular 1.3.x to avoid copying properties
from the directive's scope to the controller.

This means that 'vm.group' expressions in the controller now
update when the corresponding attribute changes.

h/static/scripts/directive/publish-annotation-btn.js

 'use strict';
 
-// @ngInject
-function PublishAnnotationBtnController($scope) {
-  var vm = this;
-
-  vm.group = {
-    name: $scope.group.name,
-    type: $scope.group.public ? 'public' : 'group'
-  };
-  vm.showDropdown = false;
-  vm.privateLabel = 'Only Me';
-
-  updatePublishActionLabel();
-
-  this.save = function () {
-    $scope.onSave();
-  };
-
-  this.cancel = function () {
-    $scope.onCancel();
-  }
-
-  this.setPrivacy = function (level) {
-    $scope.onSetPrivacy({level: level});
-  }
-
-  $scope.$watch('isShared', function () {
-    updatePublishActionLabel();
-  });
-
-  function updatePublishActionLabel() {
-    if ($scope.isShared) {
-      vm.publishDestination = vm.group.name;
-    } else {
-      vm.publishDestination = vm.privateLabel;
-    }
-  }
-}
-
 /**
  * @ngdoc directive
  * @name publishAnnotationBtn
@@ -47,7 +9,23 @@ function PublishAnnotationBtnController($scope) {
 // @ngInject
 module.exports = function () {
   return {
-    controller: PublishAnnotationBtnController,
+    bindToController: true,
+    controller: function () {
+      this.showDropdown = false;
+      this.privateLabel = 'Only Me';
+
+      this.publishDestination = function () {
+        return this.isShared ? this.group.name : this.privateLabel;
+      }
+
+      this.groupType = function () {
+        return this.group.public ? 'public' : 'group';
+      }
+
+      this.setPrivacy = function (level) {
+        this.onSetPrivacy({level: level});
+      }
+    },
     controllerAs: 'vm',
     restrict: 'E',
     scope: {

h/templates/client/publish_annotation_btn.html

 <div dropdown="" class="publish-annotation-btn__btn" is-open="vm.showDropdown" keyboard-nav>
   <dropdown-menu-btn
-    label="'Post to ' + vm.publishDestination"
-    on-click="vm.save()"
+    label="'Post to ' + vm.publishDestination()"
+    on-click="vm.onSave()"
     on-toggle-dropdown="vm.showDropdown = !vm.showDropdown"
-    title="Publish this annotation to {{vm.publishDestination}}"
+    title="Publish this annotation to {{vm.publishDestination()}}"
     dropdown-menu-label="Change annotation sharing setting"
-    is-disabled="!canPost">
+    is-disabled="!vm.canPost">
   </dropdown-menu-btn>
   <div class="publish-annotation-btn__dropdown-container">
     <ul class="dropdown-menu pull-center group-list publish-annotation-btn__dropdown-menu" role="menu">
       <li class="dropdown-menu__row" ng-click="vm.setPrivacy('shared')">
         <div class="group-item">
           <div class="group-icon-container">
-            <i class="small" ng-class="'h-icon-' + vm.group.type"></i>
+            <i class="small" ng-class="'h-icon-' + vm.groupType()"></i>
           </div>
           <div class="group-details">
             <div class="group-name-container">
@@ -37,7 +37,7 @@
   </div>
 </div>
 <button class="publish-annotation-cancel-btn btn-clean"
-        ng-click="vm.cancel()"
+        ng-click="vm.onCancel()"
         title="Cancel changes to this annotation"
         >
   <i class="h-icon-cancel-outline publish-annotation-cancel-btn__icon btn-icon"></i> Cancel