Merge pull request #169 from whiteout-io/dev/WO-699

refactored focusMe directive into common directives as woFocusMe

src/js/controller/write.js

@@ -448,29 +448,6 @@ var WriteCtrl = function($scope, $filter, $q) {
 
 var ngModule = angular.module('write', []);
 
-ngModule.directive('focusMe', function($timeout, $parse) {
-    return {
-        //scope: true,   // optionally create a child scope
-        link: function(scope, element, attrs) {
-            var model = $parse(attrs.focusMe);
-            scope.$watch(model, function(value) {
-                if (value === true) {
-                    $timeout(function() {
-                        var el = element[0];
-                        el.focus();
-                        // set cursor to start of textarea
-                        if (el.type === 'textarea') {
-                            el.selectionStart = 0;
-                            el.selectionEnd = 0;
-                            el.scrollTop = 0;
-                        }
-                    }, 100);
-                }
-            });
-        }
-    };
-});
-
 ngModule.directive('focusInput', function($timeout, $parse) {
     return {
         //scope: true,   // optionally create a child scope

src/js/directive/common.js

@@ -143,4 +143,24 @@ ngModule.directive('woDropdown', function($document, $timeout) {
     };
 });
 
+ngModule.directive('woFocusMe', function($timeout, $parse) {
+    return function(scope, element, attrs) {
+        var model = $parse(attrs.woFocusMe);
+        scope.$watch(model, function(value) {
+            if (value === true) {
+                $timeout(function() {
+                    var el = element[0];
+                    el.focus();
+                    // set cursor to start of textarea
+                    if (el.type === 'textarea') {
+                        el.selectionStart = 0;
+                        el.selectionEnd = 0;
+                        el.scrollTop = 0;
+                    }
+                }, 100);
+            }
+        });
+    };
+});
+
 module.exports = ngModule;

src/tpl/action-bar.html

@@ -20,7 +20,7 @@
       <svg><use xlink:href="#icon-search" /><title>Search</title></svg>
       <input class="input-text" type="text" ng-model="searchText"
         ng-change="displaySearchResults(searchText)"
-        placeholder="Search" focus-me="state.mailList.searching">
+        placeholder="Search" wo-focus-me="state.mailList.searching">
     </div>
   </div><!--/action-bar__search-->
 

src/tpl/create-account.html

@@ -10,7 +10,7 @@
         <p class="form__error-message" ng-show="errMsg">{{errMsg}}</p>
         <div class="form__row">
           <div class="input-email-fixed-domain">
-            <input class="input-text" ng-model="user" required type="text" focus-me="true" tabindex="1"
+            <input class="input-text" ng-model="user" required type="text" wo-focus-me="true" tabindex="1"
               pattern='[a-zA-Z0-9\.]+' placeholder="User name"
               autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false">
             <span>@wmail.io</span>

src/tpl/login-existing.html

@@ -12,7 +12,7 @@
         <div class="form__row">
           <input type="password" ng-model="passphrase"
             class="input-text input-text--big" ng-class="{'input-text--error':incorrect}"
-            placeholder="Passphrase" tabindex="1" focus-me="true" required>
+            placeholder="Passphrase" tabindex="1" wo-focus-me="true" required>
         </div>
         <div class="spinner-block" ng-show="busy">
           <span class="spinner spinner--big"></span>

src/tpl/login-privatekey-download.html

@@ -13,7 +13,7 @@
 
           <div class="form__row">
             <input type="text" class="input-text input-text--big" ng-class="{'input-text--error':incorrect}"
-              size="6" maxlength="6" ng-model="recoveryToken" placeholder="Token" focus-me="step === 1" pattern="([a-zA-Z0-9]*)" required>
+              size="6" maxlength="6" ng-model="recoveryToken" placeholder="Token" wo-focus-me="step === 1" pattern="([a-zA-Z0-9]*)" required>
           </div>
           <div class="spinner-block" ng-show="busy">
             <span class="spinner spinner--big"></span>
@@ -44,7 +44,7 @@
 
           <div class="form__row">
             <div class="input-code">
-              <input type="text" class="input-text" size="4" maxlength="4" ng-model="code0" focus-me="step === 2" focus-next required ng-paste="handlePaste($event)"> -
+              <input type="text" class="input-text" size="4" maxlength="4" ng-model="code0" wo-focus-me="step === 2" focus-next required ng-paste="handlePaste($event)"> -
               <input type="text" class="input-text" size="4" maxlength="4" ng-model="code1" focus-next required> -
               <input type="text" class="input-text" size="4" maxlength="4" ng-model="code2" focus-next required> -
               <input type="text" class="input-text" size="4" maxlength="4" ng-model="code3" focus-next required> -

src/tpl/login-set-credentials.html

@@ -32,7 +32,7 @@
         </div>
         <div class="form__row">
           <input class="input-text" type="text" ng-model="realname"
-            placeholder="Full name (optional)" focus-me="true" tabindex="2">
+            placeholder="Full name (optional)" wo-focus-me="true" tabindex="2">
         </div>
         <div class="form__row" ng-hide="useOAuth">
           <input ng-required="!useOAuth" class="input-text" type="password"

src/tpl/mail-list.html

@@ -17,7 +17,7 @@
       <svg><use xlink:href="#icon-search" /><title>Search</title></svg>
       <input class="input-text" type="text" ng-model="searchText"
         ng-change="displaySearchResults(searchText)"
-        placeholder="Search" focus-me="state.mailList.searching">
+        placeholder="Search" wo-focus-me="state.mailList.searching">
     </div>
   </div>
 

src/tpl/privatekey-upload.html

@@ -26,7 +26,7 @@
         <p class="typo-paragraph">Please confirm the keychain code you have written down.</p>
         <form class="form">
           <div class="input-code">
-            <input type="text" class="input-text" size="4" maxlength="4" ng-model="code0" focus-me="step === 2" focus-next ng-paste="handlePaste($event)"> -
+            <input type="text" class="input-text" size="4" maxlength="4" ng-model="code0" wo-focus-me="step === 2" focus-next ng-paste="handlePaste($event)"> -
             <input type="text" class="input-text" size="4" maxlength="4" ng-model="code1" focus-next> -
             <input type="text" class="input-text" size="4" maxlength="4" ng-model="code2" focus-next> -
             <input type="text" class="input-text" size="4" maxlength="4" ng-model="code3" focus-next> -
@@ -39,7 +39,7 @@
       <div ng-show="step === 3">
         <p class="typo-paragraph">Please enter a memorable name for this device e.g. “MacBook Work”.</p>
         <form class="form">
-          <input type="text" class="input-text" ng-model="deviceName" placeholder="Device name" focus-me="step === 3">
+          <input type="text" class="input-text" ng-model="deviceName" placeholder="Device name" wo-focus-me="step === 3">
         </form>
       </div>
 

src/tpl/set-passphrase.html

@@ -13,7 +13,7 @@
 
     <form class="form" name="form">
       <div class="form__row">
-        <input class="input-text" type="password" ng-model="oldPassphrase" placeholder="Current passphrase" tabindex="1" focus-me="true">
+        <input class="input-text" type="password" ng-model="oldPassphrase" placeholder="Current passphrase" tabindex="1" wo-focus-me="true">
       </div>
 
       <p class="form__error-message" ng-show="passphraseMsg && passphraseRating < 2">{{passphraseMsg}}</p>

src/tpl/validate-phone.html

@@ -10,7 +10,7 @@
         <p class="form__error-message" ng-show="errMsg">{{errMsg}}</p>
         <div class="form__row">
           <input type="text" class="input-text input-text--big" ng-class="{'input-text--error': errMsg}"
-          size="6" maxlength="6" ng-model="token" placeholder="Code" required pattern="([a-zA-Z0-9]*)" focus-me="true" tabindex="1">
+          size="6" maxlength="6" ng-model="token" placeholder="Code" required pattern="([a-zA-Z0-9]*)" wo-focus-me="true" tabindex="1">
         </div>
         <div class="spinner-block" ng-show="busy">
           <span class="spinner spinner--big"></span>

src/tpl/write.html

@@ -64,7 +64,7 @@
       </ul>
     </header>
 
-    <textarea class="write__body" ng-model="body" spellcheck="true" focus-me="state.lightbox === 'write' && writerTitle === 'Reply'" tabindex="3"></textarea>
+    <textarea class="write__body" ng-model="body" spellcheck="true" wo-focus-me="state.lightbox === 'write' && writerTitle === 'Reply'" tabindex="3"></textarea>
 
     <div class="write__submit">
       <button wo-touch="sendToOutbox()" class="btn" ng-class="{'btn--invalid': sendBtnSecure === false}" ng-disabled="!okToSend" tabindex="4">{{sendBtnText || 'Send'}}</button>