Better autofocus (#1664)

Author: hyperreality

modules/articles/client/views/admin/form-article.client.view.html

@@ -12,7 +12,7 @@ <h1>{{vm.article._id ? 'Edit Article' : 'New Article'}}</h1>
       <fieldset>
         <div class="form-group" show-errors>
           <label class="control-label" for="title">Title</label>
-          <input name="title" type="text" ng-model="vm.article.title" id="title" class="form-control" placeholder="Title" required>
+          <input name="title" type="text" ng-model="vm.article.title" id="title" class="form-control" placeholder="Title" required autofocus>
           <div ng-messages="vm.form.articleForm.title.$error" role="alert">
             <p class="help-block error-text" ng-message="required">Article title is required.</p>
           </div>

modules/core/client/directives/auto-focus.client.directive.js

@@ -20,7 +20,9 @@
     function link(scope, element, attrs) {
       if ($window.innerWidth >= 800) {
         $timeout(function() {
-          element[0].focus();
+          var el = element[0];
+          el.focus();
+          el.selectionStart = el.selectionEnd = el.value.length;
         }, 100);
       }
     }

modules/users/client/views/admin/edit-user.client.view.html

@@ -7,7 +7,7 @@ <h1>User <span ng-bind="vm.user.username"></span></h1>
       <fieldset>
         <div class="form-group" show-errors>
           <label for="firstName">First Name</label>
-          <input type="text" id="firstName" name="firstName" class="form-control" ng-model="vm.user.firstName" placeholder="First Name" required />
+          <input type="text" id="firstName" name="firstName" class="form-control" ng-model="vm.user.firstName" placeholder="First Name" required autofocus />
           <div ng-messages="vm.userForm.firstName.$error" role="alert">
             <p class="help-block error-text" ng-message="required">First name is required.</p>
           </div>

modules/users/client/views/password/forgot-password.client.view.html

@@ -5,7 +5,7 @@ <h3 class="col-md-12 text-center">Restore your password</h3>
     <form name="vm.forgotPasswordForm" ng-submit="vm.askForPasswordReset(vm.forgotPasswordForm.$valid)" class="form-horizontal" novalidate autocomplete="off">
       <fieldset>
         <div class="form-group" show-errors>
-          <input type="text" id="username" name="username" class="form-control" ng-model="vm.credentials.username" placeholder="Username" lowercase required>
+          <input type="text" id="username" name="username" class="form-control" ng-model="vm.credentials.username" placeholder="Username" lowercase required autofocus>
           <div ng-messages="vm.forgotPasswordForm.username.$error" role="alert">
             <p class="help-block error-text" ng-message="required">Enter a username.</p>
           </div>

modules/users/client/views/password/reset-password.client.view.html

@@ -5,7 +5,7 @@ <h3 class="col-md-12 text-center">Reset your password</h3>
       <fieldset>
         <div class="form-group" show-errors>
           <label for="newPassword">New Password</label>
-          <input type="password" id="newPassword" name="newPassword" class="form-control" ng-model="vm.passwordDetails.newPassword" placeholder="New Password" autocomplete="new-password" uib-popover="{{vm.getPopoverMsg()}}" uib-popover-trigger="focus" uib-popover-placement="top" password-validator required>
+          <input type="password" id="newPassword" name="newPassword" class="form-control" ng-model="vm.passwordDetails.newPassword" placeholder="New Password" autocomplete="new-password" uib-popover="{{vm.getPopoverMsg()}}" uib-popover-trigger="focus" uib-popover-placement="top" password-validator required autofocus>
           <div ng-messages="vm.resetPasswordForm.newPassword.$error" role="alert">
             <p class="help-block error-text" ng-message="required">Enter a new password.</p>
             <div ng-repeat="passwordError in passwordErrors">

modules/users/client/views/settings/change-password.client.view.html

@@ -4,7 +4,7 @@
       <fieldset>
         <div class="form-group" show-errors>
           <label for="currentPassword">Current Password</label>
-          <input type="password" id="currentPassword" name="currentPassword" class="form-control" ng-model="vm.passwordDetails.currentPassword" placeholder="Current Password" required>
+          <input type="password" id="currentPassword" name="currentPassword" class="form-control" ng-model="vm.passwordDetails.currentPassword" placeholder="Current Password" required autofocus>
           <div ng-messages="vm.passwordForm.currentPassword.$error" role="alert">
             <p class="help-block error-text" ng-message="required">Your current password is required.</p>
           </div>