From 47b500d7c0342a979edb6eeec614a7680c06e75c Mon Sep 17 00:00:00 2001 From: Kyle Spearrin Date: Tue, 20 Sep 2016 16:17:31 -0400 Subject: [PATCH] login form styling. server validation errors displayed as sweet alerts --- .../app/accounts/accountsLoginController.js | 5 +- .../app/accounts/views/accountsLogin.html | 51 +++++++++------ src/popup/app/current/views/current.html | 2 +- src/popup/app/directives/fieldDirective.js | 30 --------- src/popup/app/directives/formDirective.js | 6 +- src/popup/app/services/servicesModule.js | 2 +- src/popup/app/services/validationService.js | 62 +++++++------------ src/popup/app/vault/views/vaultAddSite.html | 14 ++--- src/popup/app/vault/views/vaultEditSite.html | 14 ++--- src/popup/index.html | 1 - src/popup/less/components.less | 15 +++++ 11 files changed, 91 insertions(+), 111 deletions(-) delete mode 100644 src/popup/app/directives/fieldDirective.js diff --git a/src/popup/app/accounts/accountsLoginController.js b/src/popup/app/accounts/accountsLoginController.js index 14183cde..ab570664 100644 --- a/src/popup/app/accounts/accountsLoginController.js +++ b/src/popup/app/accounts/accountsLoginController.js @@ -2,7 +2,10 @@ .module('bit.accounts') .controller('accountsLoginController', function ($scope, $state, loginService, userService) { - $scope.login = function (model) { + popupUtils.initListSectionItemListeners(); + + $scope.loginPromise = null; + $scope.login = function (model, form) { $scope.loginPromise = loginService.logIn(model.email, model.masterPassword); $scope.loginPromise.then(function () { diff --git a/src/popup/app/accounts/views/accountsLogin.html b/src/popup/app/accounts/views/accountsLogin.html index d5639886..adf08979 100644 --- a/src/popup/app/accounts/views/accountsLogin.html +++ b/src/popup/app/accounts/views/accountsLogin.html @@ -1,22 +1,33 @@ - - +
+
+
+ Cancel +
+
+ + +
+
bitwarden
+
+
- - +
+
+
+ + + +
+
+ + + +
+
+
-
- -

- Get master password hint -

-
- - +

+ Get master password hint +

+
+
diff --git a/src/popup/app/current/views/current.html b/src/popup/app/current/views/current.html index 0386241d..8c03c730 100644 --- a/src/popup/app/current/views/current.html +++ b/src/popup/app/current/views/current.html @@ -2,7 +2,7 @@
-
Current Tab Sites
+
Current Tab
diff --git a/src/popup/app/directives/fieldDirective.js b/src/popup/app/directives/fieldDirective.js deleted file mode 100644 index b9066666..00000000 --- a/src/popup/app/directives/fieldDirective.js +++ /dev/null @@ -1,30 +0,0 @@ -angular - .module('bit.directives') - - .directive('bitField', function () { - var linkFn = function (scope, element, attrs, ngModel) { - ngModel.$registerError = registerError; - ngModel.$validators.validate = validator; - - function validator() { - ngModel.$setValidity('bit', true); - return true; - } - - function registerError() { - ngModel.$setValidity('bit', false); - } - }; - - return { - require: 'ngModel', - restrict: 'A', - compile: function (elem, attrs) { - if (!attrs.name || attrs.name === '') { - throw 'bit-field element does not have a valid name attribute'; - } - - return linkFn; - } - }; - }); diff --git a/src/popup/app/directives/formDirective.js b/src/popup/app/directives/formDirective.js index cefdf1b6..0a89eda7 100644 --- a/src/popup/app/directives/formDirective.js +++ b/src/popup/app/directives/formDirective.js @@ -18,9 +18,6 @@ return; } - // reset errors - form.$errors = null; - // start loading form.$loading = true; @@ -28,8 +25,7 @@ form.$loading = false; }, function failure(reason) { form.$loading = false; - validationService.addErrors(form, reason); - scope.$broadcast('show-errors-check-validity'); + validationService.showError(reason); }); } }); diff --git a/src/popup/app/services/servicesModule.js b/src/popup/app/services/servicesModule.js index 3c9059b0..961b3c29 100644 --- a/src/popup/app/services/servicesModule.js +++ b/src/popup/app/services/servicesModule.js @@ -1,2 +1,2 @@ angular - .module('bit.services', ['angular-jwt']); + .module('bit.services', ['angular-jwt', 'oitozero.ngSweetAlert']); diff --git a/src/popup/app/services/validationService.js b/src/popup/app/services/validationService.js index 1af09d10..662f4a12 100644 --- a/src/popup/app/services/validationService.js +++ b/src/popup/app/services/validationService.js @@ -1,61 +1,47 @@ angular .module('bit.services') - .factory('validationService', function () { + .factory('validationService', function (SweetAlert) { var _service = {}; - _service.addErrors = function (form, reason) { - var data = reason.data; + _service.showError = function (data) { var defaultErrorMessage = 'An unexpected error has occured.'; - form.$errors = []; + var errors = []; if (!data || !angular.isObject(data)) { - form.$errors.push(defaultErrorMessage); - return; + errors.push(defaultErrorMessage); } - - if (!data.validationErrors) { + else if (!data.validationErrors) { if (data.message) { - form.$errors.push(data.message); + errors.push(data.message); } else { - form.$errors.push(defaultErrorMessage); - } - - return; - } - - for (var key in data.validationErrors) { - if (!data.validationErrors.hasOwnProperty(key)) { - continue; - } - - for (var i = 0; i < data.validationErrors[key].length; i++) { - _service.addError(form, key, data.validationErrors[key][i]); + errors.push(defaultErrorMessage); } } - }; + else { + for (var key in data.validationErrors) { + if (!data.validationErrors.hasOwnProperty(key)) { + continue; + } - _service.addError = function (form, key, errorMessage, clearExistingErrors) { - if (clearExistingErrors || !form.$errors) { - form.$errors = []; - } - - var pushError = true; - for (var i = 0; i < form.$errors.length; i++) { - if (form.$errors[i] === errorMessage) { - pushError = false; - break; + for (var i = 0; i < data.validationErrors[key].length; i++) { + errors.push(data.validationErrors[key][i]); + } } } - if (pushError) { - form.$errors.push(errorMessage); + if (errors.length) { + SweetAlert.swal({ + title: 'Error', + text: errors[0], + type: 'error', + showCancelButton: false, + confirmButtonText: 'Ok' + }); } - if (key && key !== '' && form[key] && form[key].$registerError) { - form[key].$registerError(); - } + return errors; }; return _service; diff --git a/src/popup/app/vault/views/vaultAddSite.html b/src/popup/app/vault/views/vaultAddSite.html index 39301246..7a6bd3c3 100644 --- a/src/popup/app/vault/views/vaultAddSite.html +++ b/src/popup/app/vault/views/vaultAddSite.html @@ -18,19 +18,19 @@
- +
- +
- +
- +
Generate Password @@ -42,13 +42,13 @@
-
- +
@@ -58,7 +58,7 @@
- +
diff --git a/src/popup/app/vault/views/vaultEditSite.html b/src/popup/app/vault/views/vaultEditSite.html index e1fe6bac..856f0429 100644 --- a/src/popup/app/vault/views/vaultEditSite.html +++ b/src/popup/app/vault/views/vaultEditSite.html @@ -18,19 +18,19 @@
- +
- +
- +
- +
Generate Password @@ -42,13 +42,13 @@
-
- +
@@ -58,7 +58,7 @@
- +
diff --git a/src/popup/index.html b/src/popup/index.html index fccbdd47..511f9d7d 100644 --- a/src/popup/index.html +++ b/src/popup/index.html @@ -38,7 +38,6 @@ - diff --git a/src/popup/less/components.less b/src/popup/less/components.less index 753f8a1f..71a4be8f 100644 --- a/src/popup/less/components.less +++ b/src/popup/less/components.less @@ -348,6 +348,21 @@ } } } + + &.list-section-item-icon-input { + padding: 15px 15px; + + .fa { + float: left; + color: @list-icon-color; + margin-top: 3px; + } + + input { + display: inline-block; + margin-left: 10px; + } + } } &.list-no-selection {