FS-8026 [Verto-Communicator] #resolve Add an autofocus directive to both dialpad…

FS-8026 [Verto-Communicator] #resolve Add an autofocus directive to both dialpad and login so that enter will just work. On dialpad useful to provide keyboard only input without the need to using the mouse.

html5/verto/verto_communicator/js/directives.js

@@ -85,3 +85,25 @@ vertoDirectives.directive('showControls',
       link: link
     };
   });
+
+/*
+Sometimes autofocus HTML5 directive just isn't enough with SPAs.
+This directive will force autofocus to work properly under those circumstances.
+*/
+(function () {
+  'use strict';
+
+  vertoDirectives.directive('autofocus', ['$timeout',
+    function ($timeout) {
+      return {
+        restrict: 'A',
+        link: function ($scope, $element) {
+          $timeout(function () {
+            console.log('Focusing...');
+            $element[0].focus();
+          });
+        }
+      };
+    }
+  ]);
+})();
\ No newline at end of file

html5/verto/verto_communicator/partials/dialpad.html

@@ -41,7 +41,7 @@
               <i class="mdi-action-settings-phone"></i>
             </a>
           </span>
-          <input name="dialpadnumber" type="text" class="form-control text-center" placeholder="Enter an extension" ng-model="dialpadNumber" />
+          <input name="dialpadnumber" type="text" class="form-control text-center" placeholder="Enter an extension" ng-model="dialpadNumber" autofocus/>
           <span class="input-group-btn">
             <a href="" ng-click="backspace()">
               <i class="mdi-content-backspace"></i>

html5/verto/verto_communicator/partials/login.html

@@ -11,7 +11,7 @@
         <form name="form" class="css-form" novalidate ng-init="advanced = false">
           <div class="form-group {{ (((!form.name.$pristine || form.$submitted) && !form.name.$valid) ? 'has-error': '') }}">
             <label class="control-label" for="login-name">Name</label>
-            <input type="text" name="name" class="form-control" id="login-name" placeholder="Your name" required="" ng-model="verto.data.name">
+            <input type="text" name="name" class="form-control" id="login-name" placeholder="Your name" required="" ng-model="verto.data.name" autofocus>
           </div>
           <div class="form-group {{ (((!form.email.$pristine || form.$submitted) && !form.email.$valid) ? 'has-error': '') }}">
             <label class="control-label" for="login-email">Email</label>