From 3919578e7ce6380031c0a97b547f20c2a028f403 Mon Sep 17 00:00:00 2001
From: Dani Palou <dani@moodle.com>
Date: Mon, 9 Nov 2015 10:21:13 +0100
Subject: [PATCH] MOBILE-1308 ui: Auto-focus some input elements

---
 config.xml                                    |  1 +
 .../components/courses/templates/search.html  |  2 +-
 .../login/templates/credentials.html          |  2 +-
 .../components/login/templates/reconnect.html |  2 +-
 www/core/components/login/templates/site.html |  2 +-
 www/core/directives/autofocus.js              | 43 +++++++++++++++++++
 www/core/lib/app.js                           | 13 ++++++
 7 files changed, 61 insertions(+), 4 deletions(-)
 create mode 100644 www/core/directives/autofocus.js

diff --git a/config.xml b/config.xml
index 2a27c192a5d..7c6a91732aa 100644
--- a/config.xml
+++ b/config.xml
@@ -18,6 +18,7 @@
   <preference name="BackupWebStorage" value="none"/>
   <preference name="SplashScreen" value="screen"/>
   <preference name="SplashScreenDelay" value="3000"/>
+  <preference name="KeyboardDisplayRequiresUserAction" value="false" />
   <feature name="StatusBar">
     <param name="ios-package" value="CDVStatusBar" onload="true"/>
   </feature>
diff --git a/www/core/components/courses/templates/search.html b/www/core/components/courses/templates/search.html
index 659b75e9eb4..a73f1a7bc40 100644
--- a/www/core/components/courses/templates/search.html
+++ b/www/core/components/courses/templates/search.html
@@ -3,7 +3,7 @@
         <form class="list">
             <label class="item item-input">
                 <i class="icon ion-search placeholder-icon"></i>
-                <input type="text" placeholder="{{ 'mm.courses.search' | translate}}" ng-model="searchText">
+                <input type="text" placeholder="{{ 'mm.courses.search' | translate}}" ng-model="searchText" mm-auto-focus>
             </label>
             <button class="button button-block" ng-click="search(searchText)" ng-disabled="searchText.length < 3">
                 {{ 'mm.courses.search' | translate }}
diff --git a/www/core/components/login/templates/credentials.html b/www/core/components/login/templates/credentials.html
index 3e8fb730815..d34fa6a5c51 100644
--- a/www/core/components/login/templates/credentials.html
+++ b/www/core/components/login/templates/credentials.html
@@ -5,7 +5,7 @@
       <form>
         <label class="item item-input item-stacked-label">
           <span class="input-label">{{ 'mm.login.username' | translate }}</span>
-          <input type="text" placeholder="{{ 'mm.login.username' | translate }}" ng-model="credentials.username" autocapitalize="off" autocorrect="off">
+          <input type="text" placeholder="{{ 'mm.login.username' | translate }}" ng-model="credentials.username" autocapitalize="off" autocorrect="off" mm-auto-focus>
         </label>
         <label class="item item-input item-stacked-label">
           <span class="input-label">{{ 'mm.login.password' | translate }}</span>
diff --git a/www/core/components/login/templates/reconnect.html b/www/core/components/login/templates/reconnect.html
index 02c2d380ca6..9ef0733aacf 100644
--- a/www/core/components/login/templates/reconnect.html
+++ b/www/core/components/login/templates/reconnect.html
@@ -13,7 +13,7 @@ <h2>{{ 'mm.login.username' | translate }}</h2>
             <form>
                 <label class="item item-input item-stacked-label">
                     <span class="input-label">{{ 'mm.login.password' | translate }}</span>
-                    <input type="password" placeholder="{{ 'mm.login.password' | translate }}" ng-model="credentials.password">
+                    <input type="password" placeholder="{{ 'mm.login.password' | translate }}" ng-model="credentials.password" mm-auto-focus>
                 </label>
                 <div class="item">
                     <button class="button button-block" ng-click="login()">{{ 'mm.login.loginbutton' | translate }}</button>
diff --git a/www/core/components/login/templates/site.html b/www/core/components/login/templates/site.html
index c80be67f484..f4e1fca464a 100644
--- a/www/core/components/login/templates/site.html
+++ b/www/core/components/login/templates/site.html
@@ -8,7 +8,7 @@
         <form>
           <label class="item item-input item-stacked-label">
             <span class="input-label">{{ 'mm.login.siteaddress' | translate }}</span>
-            <input type="url" placeholder="moodle.org" ng-model="siteurl" mm-no-input-validation ng-change="validate(siteurl)" >
+            <input type="url" placeholder="moodle.org" ng-model="siteurl" mm-no-input-validation ng-change="validate(siteurl)" mm-auto-focus >
           </label>
           <div class="item">
               <button class="button button-block" ng-click="connect(siteurl)" ng-disabled="isInvalidUrl">{{ 'mm.login.connect' | translate }}</button>
diff --git a/www/core/directives/autofocus.js b/www/core/directives/autofocus.js
new file mode 100644
index 00000000000..cc60c0c2642
--- /dev/null
+++ b/www/core/directives/autofocus.js
@@ -0,0 +1,43 @@
+// (C) Copyright 2015 Martin Dougiamas
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//     http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+angular.module('mm.core')
+
+/**
+ * Directive to auto focus an element when a view is loaded.
+ *
+ * @module mm.core
+ * @ngdoc directive
+ * @name mmAutoFocus
+ */
+.directive('mmAutoFocus', function($mmApp) {
+    return {
+        restrict: 'A',
+        link: function(scope, el) {
+            // Wait for transition to finish before auto-focus.
+            var unregister = scope.$watch(function() {
+                return ionic.transition.isActive;
+            }, function(isActive) {
+                if (!isActive) {
+                    el[0].focus();
+                    unregister(); // Stop watching.
+                    if (ionic.Platform.isAndroid()) {
+                        // On some Android versions the keyboard doesn't open automatically.
+                        $mmApp.openKeyboard();
+                    }
+                }
+            });
+        }
+    };
+});
diff --git a/www/core/lib/app.js b/www/core/lib/app.js
index c76ba16c223..a0460ecdbb3 100644
--- a/www/core/lib/app.js
+++ b/www/core/lib/app.js
@@ -238,6 +238,19 @@ angular.module('mm.core')
             return promise.$$state.status === 1;
         };
 
+        /**
+         * Open the keyboard if plugin is available.
+         *
+         * @return {Boolean} True if plugin is available, false otherwise.
+         */
+        self.openKeyboard = function() {
+            if (typeof cordova != 'undefined' && cordova.plugins && cordova.plugins.Keyboard && cordova.plugins.Keyboard.show) {
+                cordova.plugins.Keyboard.show();
+                return true;
+            }
+            return false;
+        };
+
         /**
          * Resolves when the app is ready.
          *