two factor email setup

src/app/services/apiService.js

@@ -115,6 +115,7 @@
             list: { method: 'GET', params: {} },
             getEmail: { url: _apiUri + '/two-factor/get-email', method: 'POST', params: {} },
             getAuthenticator: { url: _apiUri + '/two-factor/get-authenticator', method: 'POST', params: {} },
+            sendEmail: { url: _apiUri + '/two-factor/send-email', method: 'POST', params: {} },
             putEmail: { url: _apiUri + '/two-factor/email', method: 'POST', params: {} },
             putAuthenticator: { url: _apiUri + '/two-factor/authenticator', method: 'POST', params: {} },
             disable: { url: _apiUri + '/two-factor/disable', method: 'POST', params: {} },

src/app/settings/settingsTwoStepController.js

@@ -67,6 +67,20 @@
 
                 authenticatorModal.result.then(function () {
                     
+                });
+            }
+            else if(provider.type === constants.twoFactorProvider.email) {
+                var emailModal = $uibModal.open({
+                    animation: true,
+                    templateUrl: 'app/settings/views/settingsTwoStepEmail.html',
+                    controller: 'settingsTwoStepEmailController',
+                    resolve: {
+                        enabled: function () { return provider.enabled; }
+                    }
+                });
+
+                emailModal.result.then(function () {
+
                 });
             }
         };

src/app/settings/settingsTwoStepEmailController.js

@@ -0,0 +1,97 @@
+angular
+    .module('bit.settings')
+
+    .controller('settingsTwoStepEmailController', function ($scope, apiService, $uibModalInstance, cryptoService,
+        authService, toastr, $analytics, constants) {
+        $analytics.eventTrack('settingsTwoStepEmailController', { category: 'Modal' });
+        var _profile = null,
+            _masterPasswordHash;
+
+        $scope.updateModel = {
+            token: null,
+            email: null
+        };
+
+        $scope.auth = function (model) {
+            _masterPasswordHash = cryptoService.hashPassword(model.masterPassword);
+
+            var response = null;
+            $scope.authPromise = apiService.twoFactor.getEmail({}, {
+                masterPasswordHash: _masterPasswordHash
+            }).$promise.then(function (apiResponse) {
+                response = apiResponse;
+                return authService.getUserProfile();
+            }).then(function (profile) {
+                _profile = profile;
+                $scope.enabled = response.Enabled;
+                $scope.updateModel.email = $scope.enabled ? response.Email : _profile.email;
+                $scope.authed = true;
+            });
+        };
+
+        $scope.sendEmail = function (model) {
+            $scope.emailError = false;
+            $scope.emailSuccess = false;
+
+            if (!model || !model.email || model.email.indexOf('@') < 0) {
+                $scope.emailError = true;
+                $scope.emailSuccess = false;
+                return;
+            }
+
+            $scope.emailLoading = true;
+            apiService.twoFactor.sendEmail({}, {
+                masterPasswordHash: _masterPasswordHash,
+                email: model.email
+            }, function (response) {
+                $scope.emailError = false;
+                $scope.emailSuccess = true;
+                $scope.emailLoading = false;
+            }, function (response) {
+                $scope.emailError = true;
+                $scope.emailSuccess = false;
+                $scope.emailLoading = false;
+            });
+        };
+
+        $scope.submit = function (model) {
+            if (!model || !model.token) {
+                disable();
+                return;
+            }
+
+            update(model);
+        };
+
+        function disable() {
+            if (!confirm('Are you sure you want to disable the email provider?')) {
+                return;
+            }
+
+            $scope.submitPromise = apiService.twoFactor.disable({}, {
+                masterPasswordHash: _masterPasswordHash,
+                type: constants.twoFactorProvider.email
+            }, function (response) {
+                $analytics.eventTrack('Disabled Two-step Email');
+                toastr.success('Email has been disabled.');
+                $scope.close();
+            }).$promise;
+        }
+
+        function update(model) {
+            $scope.submitPromise = apiService.twoFactor.putEmail({}, {
+                email: model.email.toLowerCase().trim(),
+                token: model.token.replace(' ', ''),
+                masterPasswordHash: _masterPasswordHash
+            }, function (response) {
+                $analytics.eventTrack('Enabled Two-step Email');
+                $scope.enabled = response.Enabled;
+                model.email = response.Email;
+                model.token = null;
+            }).$promise;
+        }
+
+        $scope.close = function () {
+            $uibModalInstance.close();
+        };
+    });

src/app/settings/views/settingsTwoStepEmail.html

@@ -0,0 +1,77 @@
+<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>email</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 modify two-step login settings.</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>
+<form name="submitTwoStepForm" ng-submit="submitTwoStepForm.$valid && submit(updateModel)" api-form="submitPromise"
+      ng-if="authed">
+    <div class="modal-body">
+        <div ng-if="enabled">
+            <div class="callout callout-success">
+                <h4><i class="fa fa-check-circle"></i> Enabled</h4>
+                <p>Two-step log via email is enabled on your account.</p>
+            </div>
+            Email: <strong>{{updateModel.email}}</strong>
+        </div>
+        <div ng-if="!enabled">
+            <div class="callout callout-danger validation-errors" ng-show="submitTwoStepForm.$errors">
+                <h4>Errors have occurred</h4>
+                <ul>
+                    <li ng-repeat="e in submitTwoStepForm.$errors">{{e}}</li>
+                </ul>
+            </div>
+            <p>Setting up two-step login with email is easy, just follow these steps:</p>
+            <h4>1. Enter the email that you wish to receive verification codes</h4>
+            <div class="form-group" show-errors>
+                <label for="token" class="sr-only">Email</label>
+                <input type="text" id="email" name="Email" placeholder="Email" ng-model="updateModel.email"
+                       class="form-control" required api-field />
+            </div>
+            <button type="button" class="btn btn-default btn-flat" ng-click="sendEmail(updateModel)" ng-disabled="emailLoading">
+                <i class="fa fa-refresh fa-spin loading-icon" ng-show="emailLoading"></i>
+                Send Email
+            </button>
+            <span class="text-green" ng-if="emailSuccess">Verification code email was sent.</span>
+            <span class="text-red" ng-if="emailError">An error occurred when trying to send the email.</span>
+            <h4 style="margin-top: 30px;">
+                2. Enter the resulting 6 digit verification code from the email
+            </h4>
+            <div class="form-group" show-errors>
+                <label for="token" class="sr-only">Verification Code</label>
+                <input type="text" id="token" name="Token" placeholder="Verification Code" ng-model="updateModel.token"
+                       class="form-control" required api-field />
+            </div>
+        </div>
+    </div>
+    <div class="modal-footer">
+        <button type="submit" class="btn btn-primary btn-flat" ng-disabled="submitTwoStepForm.$loading">
+            <i class="fa fa-refresh fa-spin loading-icon" ng-show="submitTwoStepForm.$loading"></i>
+            {{enabled ? 'Disable' : 'Enable'}}
+        </button>
+        <button type="button" class="btn btn-default btn-flat" ng-click="close()">Close</button>
+    </div>
+</form>

src/index.html

@@ -189,6 +189,7 @@
     <script src="app/settings/settingsChangePasswordController.js"></script>
     <script src="app/settings/settingsChangeEmailController.js"></script>
     <script src="app/settings/settingsTwoStepAuthenticatorController.js"></script>
+    <script src="app/settings/settingsTwoStepEmailController.js"></script>
     <script src="app/settings/settingsSessionsController.js"></script>
     <script src="app/settings/settingsDomainsController.js"></script>
     <script src="app/settings/settingsTwoStepController.js"></script>