Merge branch 'TheHollidayInn-directives-test-task-focus' into develop

test/spec/directives/focus-element.directive.js

@@ -0,0 +1,30 @@
+'use strict';
+
+describe('focusElement Directive', function() {
+  var elementToFocus, scope;
+
+  beforeEach(module('habitrpg'));
+
+  beforeEach(inject(function($rootScope, $compile) {
+    scope = $rootScope.$new();
+
+    scope.focusThisLink = false;
+    var element = '<input data-focus-element="focusThisLink" />';
+
+    elementToFocus = $compile(element)(scope);
+    scope.$digest();
+  }));
+
+  it('places focus on the element it is applied to when the expression it binds to evaluates to true', inject(function($timeout) {
+    var focusSpy = sandbox.spy();
+
+    elementToFocus.appendTo(document.body);
+    elementToFocus.on('focus', focusSpy);
+    scope.focusThisLink = true;
+    scope.$digest();
+
+    $timeout.flush();
+    expect(document.activeElement.dataset.focusElement).to.eql("focusThisLink");
+    expect(focusSpy).to.have.been.called;
+    }));
+});

test/spec/directives/focus-me.directive.spec.js

@@ -1,28 +0,0 @@
-'use strict';
-
-describe('focusMe Directive', function() {
-  var element, scope;
-
-  beforeEach(module('habitrpg'));
-
-  beforeEach(inject(function($rootScope, $compile) {
-    scope = $rootScope.$new();
-
-    element = "<input focus-me></input>";
-
-    element = $compile(element)(scope);
-    scope.$digest();
-  }));
-
-  it('focuses the element when appended to the DOM', function() {
-    inject(function($timeout) {
-      var focusSpy = sandbox.spy();
-
-      element.appendTo(document.body);
-      element.on('focus', focusSpy);
-
-      $timeout.flush();
-      expect(focusSpy).to.have.been.called;
-    });
-  });
-});

website/public/js/directives/focus-element.directive.js

@@ -3,18 +3,18 @@
 (function(){
   angular
     .module('habitrpg')
-    .directive('taskFocus', taskFocus);
+    .directive('focusElement', focusElement);
 
-  taskFocus.$inject = ['$timeout'];
+  focusElement.$inject = ['$timeout'];
 
   /**
    * Directive that places focus on the element it is applied to when the
    * expression it binds to evaluates to true.
    */
 
-  function taskFocus($timeout) {
+  function focusElement($timeout) {
     return function($scope, elem, attrs) {
-      $scope.$watch(attrs.taskFocus, function(newVal) {
+      $scope.$watch(attrs.focusElement, function(newVal) {
         if (newVal) {
           $timeout(function() {
             elem[0].focus();

website/public/js/directives/focus-me.directive.js

@@ -1,25 +0,0 @@
-'use strict';
-
-(function(){
-  angular
-    .module('habitrpg')
-    .directive('focusMe', focusMe);
-
-  focusMe.$inject = [
-    '$timeout',
-    '$parse'
-  ];
-
-  function focusMe($timeout, $parse) {
-    return {
-      link: function($scope, element, attrs) {
-        var model = $parse(attrs.focusMe);
-        $scope.$watch(model, function(value) {
-          $timeout(function() {
-            element[0].focus();
-          });
-        });
-      }
-    }
-  }
-}());

website/public/manifest.json

@@ -60,7 +60,6 @@
 
             "js/directives/close-menu.directive.js",
             "js/directives/expand-menu.directive.js",
-            "js/directives/focus-me.directive.js",
             "js/directives/from-now.directive.js",
             "js/directives/habitrpg-tasks.directive.js",
             "js/directives/hrpg-sort-checklist.directive.js",
@@ -68,7 +67,7 @@
             "js/directives/hrpg-sort-tasks.directive.js",
             "js/directives/popover-html-popup.directive.js",
             "js/directives/popover-html.directive.js",
-            "js/directives/task-focus.directive.js",
+            "js/directives/focus-element.directive.js",
             "js/directives/when-scrolled.directive.js",
 
             "js/controllers/authCtrl.js",

website/views/options/social/index.jade

@@ -127,7 +127,7 @@ script(type='text/ng-template', id='modals/copyChatToDo.html')
     .form-group
       input.form-control(type='text',ng-model='text', ng-model-options="{debounce: 1000}")
     .form-group
-      textarea.form-control(rows='5',ng-model='notes', ng-model-options="{debounce: 1000}", focus-me)
+      textarea.form-control(rows='5',ng-model='notes', ng-model-options="{debounce: 1000}", focus-element='true')
 
     hr
 

website/views/shared/modals/members.jade

@@ -47,7 +47,7 @@ script(type='text/ng-template', id='modals/private-message.html')
   .modal-header
     h4=env.t('pmHeading', {name: "{{profile.profile.name}}"})
   .modal-body
-    textarea.form-control(type='text',rows='5',ui-keydown='{"meta-enter":"sendPrivateMessage(profile._id, _message)"}',placeholder=env.t('needsTextPlaceholder'),ng-model='_message', focus-me)
+    textarea.form-control(type='text',rows='5',ui-keydown='{"meta-enter":"sendPrivateMessage(profile._id, _message)"}',placeholder=env.t('needsTextPlaceholder'),ng-model='_message', focus-element='true')
     include ../formatting-help
   .modal-footer
     //- Due to a quirk in Bootstrap UI, we need to wrap this so the tooltip can

website/views/shared/tasks/task_view/add_new.jade

@@ -1,6 +1,6 @@
 form.task-add(name='new{{list.type}}form', ng-hide='obj._locked', ng-submit='addTask(obj[list.type+"s"],list)', novalidate)
-  textarea(rows='6', task-focus='list.bulk && list.focus', ng-model='list.newTask', placeholder='{{list.placeHolderBulk}}', ng-if='list.bulk', ui-keydown='{"meta-enter ctrl-enter":"addTask(obj[list.type+\'s\'],list)"}', required)
+  textarea(rows='6', focus-element='list.bulk && list.focus', ng-model='list.newTask', placeholder='{{list.placeHolderBulk}}', ng-if='list.bulk', ui-keydown='{"meta-enter ctrl-enter":"addTask(obj[list.type+\'s\'],list)"}', required)
-  input(type='text', task-focus='!list.bulk && list.focus', ng-model='list.newTask', placeholder='{{list.placeHolder}}', ng-if='!list.bulk', required)
+  input(type='text', focus-element='!list.bulk && list.focus', ng-model='list.newTask', placeholder='{{list.placeHolder}}', ng-if='!list.bulk', required)
   button(type='submit', ng-disabled='new{{list.type}}form.$invalid')
    div.empty-task-notification( ng-show='new{{list.type}}form.$invalid', tooltip=env.t("emptyTask") )
      span.glyphicon.glyphicon-plus