recovery code

src/app/accounts/accountsLoginController.js

@@ -7,6 +7,10 @@ angular
         $scope.twoFactorProviderConstants = constants.twoFactorProvider;
         $scope.rememberTwoFactor = { checked: false };
 
+        if ($state.current.name.indexOf('twoFactor') > -1 && (!$scope.twoFactorProviders || !$scope.twoFactorProviders.length)) {
+            $state.go('frontend.login.info', { returnState: returnState });
+        }
+
         var returnState;
         if (!$state.params.returnState && $state.params.org) {
             returnState = {
@@ -24,6 +28,15 @@ angular
                 email: $state.params.email ? $state.params.email : rememberedEmail,
                 rememberEmail: rememberedEmail !== null
             };
+
+            $timeout(function () {
+                $("#masterPassword").focus();
+            });
+        }
+        else {
+            $timeout(function () {
+                $("#email").focus();
+            });
         }
 
         var _email,
@@ -90,6 +103,10 @@ angular
             $scope.twoFactorPromise.then(function () {
                 $analytics.eventTrack('Logged In From Two-step');
                 loggedInGo();
+            }, function () {
+                if ($scope.twoFactorProvider === constants.twoFactorProvider.u2f) {
+                    init();
+                }
             });
         };
 

src/app/accounts/accountsRegisterController.js

@@ -2,7 +2,7 @@ angular
     .module('bit.accounts')
 
     .controller('accountsRegisterController', function ($scope, $location, apiService, cryptoService, validationService,
-        $analytics, $state) {
+        $analytics, $state, $timeout) {
         var params = $location.search();
         var stateParams = $state.params;
         $scope.createOrg = stateParams.org;
@@ -23,6 +23,16 @@ angular
         };
         $scope.readOnlyEmail = stateParams.email !== null;
 
+
+        $timeout(function () {
+            if ($scope.model.email) {
+                $("#name").focus();
+            }
+            else {
+                $("#email").focus();
+            }
+        });
+
         $scope.registerPromise = null;
         $scope.register = function (form) {
             var error = false;

src/app/accounts/views/accountsLoginTwoFactor.html

@@ -146,7 +146,7 @@
 <hr />
 <ul>
     <li>
-        <a stop-click href="#" ng-click="anotherMethod()">Use another two-step method</a>
+        <a stop-click href="#" ng-click="anotherMethod()">Use another two-step login method</a>
     </li>
     <li>
         <a ui-sref="frontend.login.info({returnState: returnState})">Back to log in</a>

src/app/accounts/views/accountsRecover.html

@@ -4,10 +4,9 @@
     </div>
     <div class="login-box-body">
         <p class="login-box-msg">
-            Lost your authenticator app?
-            <a href="https://help.bitwarden.com/article/lost-two-step-device/" target="_blank">
-                Help me!
-            </a>
+            In the event that you cannot access your account through your normal two-step login methods, you can use your
+            two-step login recovery code to disable all two-step providers on your account.
+            <a href="https://help.bitwarden.com/article/lost-two-step-device/" target="_blank">Learn more</a>
         </p>
         <div class="text-center" ng-show="success">
             <div class="callout callout-success">

src/app/services/apiService.js

@@ -127,6 +127,7 @@
             putYubi: { url: _apiUri + '/two-factor/yubikey', method: 'POST', params: {} },
             disable: { url: _apiUri + '/two-factor/disable', method: 'POST', params: {} },
             recover: { url: _apiUri + '/two-factor/recover', method: 'POST', params: {} },
+            getRecover: { url: _apiUri + '/two-factor/get-recover', method: 'POST', params: {} }
         });
 
         _service.settings = $resource(_apiUri + '/settings', {}, {

src/app/settings/settingsTwoStepController.js

@@ -51,4 +51,13 @@
                 provider.enabled = enabled;
             });
         };
+
+        $scope.viewRecover = function () {
+
+            var modal = $uibModal.open({
+                animation: true,
+                templateUrl: 'app/settings/views/settingsTwoStepRecover.html',
+                controller: 'settingsTwoStepRecoverController'
+            });
+        }
     });

src/app/settings/settingsTwoStepRecoverController.js

@@ -0,0 +1,44 @@
+angular
+    .module('bit.settings')
+
+    .controller('settingsTwoStepRecoverController', function ($scope, apiService, $uibModalInstance, cryptoService,
+        $analytics) {
+        $analytics.eventTrack('settingsTwoStepRecoverController', { category: 'Modal' });
+        $scope.code = null;
+
+        $scope.auth = function (model) {
+            var masterPasswordHash = cryptoService.hashPassword(model.masterPassword);
+
+            $scope.authPromise = apiService.twoFactor.getRecover({}, {
+                masterPasswordHash: masterPasswordHash
+            }).$promise.then(function (apiResponse) {
+                $scope.code = formatString(apiResponse.Code);
+                $scope.authed = true;
+            });
+        };
+
+        $scope.print = function () {
+            if (!$scope.code) {
+                return;
+            }
+
+            $analytics.eventTrack('Print Recovery Code');
+            var w = window.open();
+            w.document.write('<div style="font-size: 18px; text-align: center;"><p>bitwarden two-step login recovery code:</p>' +
+                '<pre>' + $scope.code + '</pre></div><p style="text-align: center;">' + new Date() + '</p>');
+            w.print();
+            w.close();
+        };
+
+        function formatString(s) {
+            if (!s) {
+                return null;
+            }
+
+            return s.replace(/(.{4})/g, '$1 ').trim().toUpperCase();
+        }
+
+        $scope.close = function () {
+            $uibModalInstance.close();
+        };
+    });

src/app/settings/views/settingsTwoStep.html

@@ -4,10 +4,15 @@
 <section class="content">
     <div class="box box-danger">
         <div class="box-header with-border">
-            <h3 class="box-title">Recovery Code</h3>
+            <h3 class="box-title"><i class="fa fa-warning"></i> Recovery Code <i class="fa fa-warning"></i></h3>
         </div>
         <div class="box-body">
-            Get it!
+            The recovery code allows you to access your account in the event that you can no longer use your normal
+            two-step login provider (ex. you lose your device). bitwarden support won't be able to assist you if you lose
+            access to your account. We recommend you write down or print the recovery code and keep it in a safe place.
+        </div>
+        <div class="box-footer">
+            <button type="button" class="btn btn-default btn-flat" ng-click="viewRecover()">View Recovery Code</button>
         </div>
     </div>
     <div class="box box-default">

src/app/settings/views/settingsTwoStepRecover.html

@@ -0,0 +1,48 @@
+<div class="modal-header">
+    <button type="button" class="close" ng-click="close()" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+    <h4 class="modal-title">
+        <i class="fa fa-key"></i> Two-step Login <small>recovery code</small>
+    </h4>
+</div>
+<form name="authTwoStepForm" ng-submit="authTwoStepForm.$valid && auth(authModel)" api-form="authPromise"
+      ng-if="!authed">
+    <div class="modal-body">
+        <p>Enter your master password to view your recovery code.</p>
+        <div class="callout callout-danger validation-errors" ng-show="authTwoStepForm.$errors">
+            <h4>Errors have occurred</h4>
+            <ul>
+                <li ng-repeat="e in authTwoStepForm.$errors">{{e}}</li>
+            </ul>
+        </div>
+        <div class="form-group" show-errors>
+            <label for="masterPassword">Master Password</label>
+            <input type="password" id="masterPassword" name="MasterPasswordHash" ng-model="authModel.masterPassword"
+                   class="form-control" required api-field />
+        </div>
+    </div>
+    <div class="modal-footer">
+        <button type="submit" class="btn btn-primary btn-flat" ng-disabled="authTwoStepForm.$loading">
+            <i class="fa fa-refresh fa-spin loading-icon" ng-show="authTwoStepForm.$loading"></i>Continue
+        </button>
+        <button type="button" class="btn btn-default btn-flat" ng-click="close()">Close</button>
+    </div>
+</form>
+<div ng-if="authed">
+    <div class="modal-body text-center">
+        <div ng-if="code">
+            <p>Your two-step login recovery code:</p>
+            <p class="lead"><code class="text-lg">{{code}}</code></p>
+        </div>
+        <div ng-if="!code">
+            You have not enabled any two-step login providers yet. After you have enabled a two-step login provider you can
+            check back here for your recovery code.
+        </div>
+    </div>
+    <div class="modal-footer">
+        <button type="submit" class="btn btn-primary btn-flat" ng-if="code" ng-click="print()">
+            <i class="fa fa-print"></i>
+            Print Code
+        </button>
+        <button type="button" class="btn btn-default btn-flat" ng-click="close()">Close</button>
+    </div>
+</div>

src/index.html

@@ -197,6 +197,7 @@
     <script src="app/settings/settingsTwoStepDuoController.js"></script>
     <script src="app/settings/settingsTwoStepU2fController.js"></script>
     <script src="app/settings/settingsTwoStepEmailController.js"></script>
+    <script src="app/settings/settingsTwoStepRecoverController.js"></script>
     <script src="app/settings/settingsTwoStepYubiController.js"></script>
     <script src="app/settings/settingsSessionsController.js"></script>
     <script src="app/settings/settingsDomainsController.js"></script>