Form and field directives, form loading spinner

src/popup/app/directives/directivesModule.js

@@ -0,0 +1,2 @@
+angular
+    .module('bit.directives', []);

src/popup/app/directives/fieldDirective.js

@@ -0,0 +1,30 @@
+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;
+            }
+        };
+    });

src/popup/app/directives/formDirective.js

@@ -0,0 +1,35 @@
+angular
+    .module('bit.directives')
+
+    .directive('bitForm', function ($rootScope, validationService) {
+        return {
+            require: 'form',
+            restrict: 'A',
+            link: function (scope, element, attrs, formCtrl) {
+                var watchPromise = attrs.bitForm || null;
+                if (watchPromise) {
+                    scope.$watch(watchPromise, formSubmitted.bind(null, formCtrl, scope));
+                }
+            }
+        };
+
+        function formSubmitted(form, scope, promise) {
+            if (!promise || !promise.then) {
+                return;
+            }
+
+            // reset errors
+            form.$errors = null;
+
+            // start loading
+            form.$loading = true;
+
+            promise.then(function success(response) {
+                form.$loading = false;
+            }, function failure(reason) {
+                form.$loading = false;
+                validationService.addErrors(form, reason);
+                scope.$broadcast('show-errors-check-validity');
+            });
+        }
+    });