diff --git a/src/app/accounts/accountsLoginController.js b/src/app/accounts/accountsLoginController.js index 645d7f00..8f280ede 100644 --- a/src/app/accounts/accountsLoginController.js +++ b/src/app/accounts/accountsLoginController.js @@ -4,6 +4,7 @@ angular .controller('accountsLoginController', function ($scope, $rootScope, $cookies, apiService, cryptoService, authService, $state, constants, $analytics, $uibModal, $timeout, $window) { $scope.state = $state; + $scope.twoFactorProviderConstants = constants.twoFactorProvider; var returnState; if (!$state.params.returnState && $state.params.org) { diff --git a/src/app/accounts/accountsTwoFactorMethodsController.js b/src/app/accounts/accountsTwoFactorMethodsController.js index 50fd0a34..5b0ce661 100644 --- a/src/app/accounts/accountsTwoFactorMethodsController.js +++ b/src/app/accounts/accountsTwoFactorMethodsController.js @@ -7,41 +7,34 @@ $scope.providers = []; if (providers.hasOwnProperty(constants.twoFactorProvider.authenticator)) { - $scope.providers.push({ - id: constants.twoFactorProvider.authenticator, - name: 'Authenticator App' - }); + add(constants.twoFactorProvider.authenticator); } if (providers.hasOwnProperty(constants.twoFactorProvider.yubikey)) { - $scope.providers.push({ - id: constants.twoFactorProvider.yubikey, - name: 'YubiKey' - }); + add(constants.twoFactorProvider.yubikey); } if (providers.hasOwnProperty(constants.twoFactorProvider.email)) { - $scope.providers.push({ - id: constants.twoFactorProvider.email, - name: 'Email' - }); + add(constants.twoFactorProvider.email); } if (providers.hasOwnProperty(constants.twoFactorProvider.duo)) { - $scope.providers.push({ - id: constants.twoFactorProvider.duo, - name: 'Duo' - }); + add(constants.twoFactorProvider.duo); } if (providers.hasOwnProperty(constants.twoFactorProvider.u2f)) { - $scope.providers.push({ - id: constants.twoFactorProvider.u2f, - name: 'FIDO U2F Security Key' - }); + add(constants.twoFactorProvider.u2f); } $scope.choose = function (provider) { - $uibModalInstance.close(provider.id); + $uibModalInstance.close(provider.type); }; $scope.close = function () { $uibModalInstance.dismiss('close'); }; + + function add(type) { + for (var i = 0; i < constants.twoFactorProviderInfo.length; i++) { + if (constants.twoFactorProviderInfo[i].type === type) { + $scope.providers.push(constants.twoFactorProviderInfo[i]); + } + } + } }); diff --git a/src/app/accounts/views/accountsLoginTwoFactor.html b/src/app/accounts/views/accountsLoginTwoFactor.html index 90b4804b..b5bd7a40 100644 --- a/src/app/accounts/views/accountsLoginTwoFactor.html +++ b/src/app/accounts/views/accountsLoginTwoFactor.html @@ -1,8 +1,9 @@ -
-

+

+ -
@@ -30,7 +31,8 @@
-
+ +
@@ -58,7 +60,7 @@
-
+
@@ -85,7 +87,7 @@
-
+
diff --git a/src/app/accounts/views/accountsTwoFactorMethods.html b/src/app/accounts/views/accountsTwoFactorMethods.html index c1a7c596..6d8f6400 100644 --- a/src/app/accounts/views/accountsTwoFactorMethods.html +++ b/src/app/accounts/views/accountsTwoFactorMethods.html @@ -2,9 +2,10 @@

Two-step Providers

-
+
+

{{::provider.name}}

{{::provider.description}}

 diff --git a/src/app/constants.js b/src/app/constants.js index 311f0d34..50762f38 100644 --- a/src/app/constants.js +++ b/src/app/constants.js @@ -28,6 +28,45 @@ angular.module('bit') u2f: 4, remember: 5 }, + twoFactorProviderInfo: [ + { + type: 0, + name: 'Authenticator App', + description: 'Use an authenticator app (such as Authy or Google Authenticator) to generate time-based ' + + 'verification codes.', + enabled: false, + free: true, + image: 'authapp.png' + }, + { + type: 3, + name: 'YubiKey OTP Security Key', + description: 'Use a YubiKey to access your account. Works with YubiKey 4, 4 Nano, 4C, and NEO devices.', + enabled: false, + image: 'yubico.png' + }, + { + type: 2, + name: 'Duo', + description: 'Verify with Duo Security using the Duo Mobile app, SMS, phone call, or U2F security key.', + enabled: false, + image: 'duo.png' + }, + { + type: 4, + name: 'FIDO U2F Security Key', + description: 'Use any FIDO U2F enabled security key to access your account.', + enabled: false, + image: 'fido.png' + }, + { + type: 1, + name: 'Email', + description: 'Verification codes will be emailed to you.', + enabled: false, + image: 'gmail.png' + } + ], plans: { free: { basePrice: 0, diff --git a/src/app/settings/settingsTwoStepController.js b/src/app/settings/settingsTwoStepController.js index c044ba64..cee8202e 100644 --- a/src/app/settings/settingsTwoStepController.js +++ b/src/app/settings/settingsTwoStepController.js @@ -1,41 +1,9 @@ angular .module('bit.settings') - .controller('settingsTwoStepController', function ($scope, apiService, authService, toastr, $analytics, constants, + .controller('settingsTwoStepController', function ($scope, apiService, toastr, $analytics, constants, $filter, $uibModal) { - $scope.providers = [ - { - type: constants.twoFactorProvider.authenticator, - name: 'Authenticator App', - description: 'Use auth app.', - enabled: false, - free: true - }, - { - type: constants.twoFactorProvider.yubikey, - name: 'YubiKey OTP', - description: '', - enabled: false - }, - { - type: constants.twoFactorProvider.duo, - name: 'Duo', - description: '', - enabled: false - }, - { - type: constants.twoFactorProvider.u2f, - name: 'FIDO U2F Security Key', - description: '', - enabled: false - }, - { - type: constants.twoFactorProvider.email, - name: 'Email', - description: '', - enabled: false - } - ]; + $scope.providers = constants.twoFactorProviderInfo; apiService.twoFactor.list({}, function (response) { for (var i = 0; i < response.Data.length; i++) { @@ -50,80 +18,37 @@ } }); - authService.getUserProfile().then(function (profile) { - _profile = profile; - }); - $scope.edit = function (provider) { if (provider.type === constants.twoFactorProvider.authenticator) { - var authenticatorModal = $uibModal.open({ - animation: true, - templateUrl: 'app/settings/views/settingsTwoStepAuthenticator.html', - controller: 'settingsTwoStepAuthenticatorController', - resolve: { - enabled: function () { return provider.enabled; } - } - }); - - authenticatorModal.result.then(function (enabled) { - provider.enabled = enabled; - }); + typeName = 'Authenticator'; } - 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 (enabled) { - provider.enabled = enabled; - }); + else if (provider.type === constants.twoFactorProvider.email) { + typeName = 'Email'; } else if (provider.type === constants.twoFactorProvider.yubikey) { - var yubiModal = $uibModal.open({ - animation: true, - templateUrl: 'app/settings/views/settingsTwoStepYubi.html', - controller: 'settingsTwoStepYubiController', - resolve: { - enabled: function () { return provider.enabled; } - } - }); - - yubiModal.result.then(function (enabled) { - provider.enabled = enabled; - }); + typeName = 'Yubi'; } else if (provider.type === constants.twoFactorProvider.duo) { - var yubiModal = $uibModal.open({ - animation: true, - templateUrl: 'app/settings/views/settingsTwoStepDuo.html', - controller: 'settingsTwoStepDuoController', - resolve: { - enabled: function () { return provider.enabled; } - } - }); - - yubiModal.result.then(function (enabled) { - provider.enabled = enabled; - }); + typeName = 'Duo'; } else if (provider.type === constants.twoFactorProvider.u2f) { - var u2fModal = $uibModal.open({ - animation: true, - templateUrl: 'app/settings/views/settingsTwoStepU2f.html', - controller: 'settingsTwoStepU2fController', - resolve: { - enabled: function () { return provider.enabled; } - } - }); - - u2fModal.result.then(function (enabled) { - provider.enabled = enabled; - }); + typeName = 'U2f'; } + else { + return; + } + + var modal = $uibModal.open({ + animation: true, + templateUrl: 'app/settings/views/settingsTwoStep' + typeName + '.html', + controller: 'settingsTwoStep' + typeName + 'Controller', + resolve: { + enabled: function () { return provider.enabled; } + } + }); + + modal.result.then(function (enabled) { + provider.enabled = enabled; + }); }; }); diff --git a/src/app/settings/views/settingsTwoStep.html b/src/app/settings/views/settingsTwoStep.html index 1cf00887..6f3bcacc 100644 --- a/src/app/settings/views/settingsTwoStep.html +++ b/src/app/settings/views/settingsTwoStep.html @@ -19,26 +19,8 @@ -
-
- - -
+ 		+ {{::provider.name}} {{::provider.name}} diff --git a/src/images/two-factor/authapp.png b/src/images/two-factor/authapp.png new file mode 100644 index 00000000..f37e3f17 Binary files /dev/null and b/src/images/two-factor/authapp.png differ diff --git a/src/images/two-factor/duo.png b/src/images/two-factor/duo.png new file mode 100644 index 00000000..ab2e4340 Binary files /dev/null and b/src/images/two-factor/duo.png differ diff --git a/src/images/two-factor/fido.png b/src/images/two-factor/fido.png new file mode 100644 index 00000000..ae7d7b55 Binary files /dev/null and b/src/images/two-factor/fido.png differ diff --git a/src/images/two-factor/gmail.png b/src/images/two-factor/gmail.png new file mode 100644 index 00000000..b47a12b1 Binary files /dev/null and b/src/images/two-factor/gmail.png differ diff --git a/src/images/two-factor/yubico.png b/src/images/two-factor/yubico.png new file mode 100644 index 00000000..21aac2da Binary files /dev/null and b/src/images/two-factor/yubico.png differ