diff --git a/docs-web/src/main/webapp/src/app/docs/app.js b/docs-web/src/main/webapp/src/app/docs/app.js
index cdcfb0d1..8c706924 100644
--- a/docs-web/src/main/webapp/src/app/docs/app.js
+++ b/docs-web/src/main/webapp/src/app/docs/app.js
@@ -5,7 +5,7 @@
*/
angular.module('docs',
// Dependencies
- ['ui.router', 'ui.route', 'ui.bootstrap', 'ui.keypress', 'ui.validate', 'dialog',
+ ['ui.router', 'ui.route', 'ui.bootstrap', 'ui.keypress', 'ui.validate', 'dialog', 'ngProgress',
'ui.sortable', 'restangular', 'ngSanitize', 'ngTouch', 'colorpicker.module', 'angularFileUpload']
)
@@ -345,4 +345,21 @@ angular.module('docs',
$state.go(redirect, toParams);
}
});
+})
+/**
+ * Initialize ngProgress.
+ */
+.run(function($rootScope, ngProgressFactory, $http) {
+ $rootScope.ngProgress = ngProgressFactory.createInstance();
+
+ // Watch for the number of XHR running
+ $rootScope.$watch(function() {
+ return $http.pendingRequests.length > 0
+ }, function(count) {
+ if (count == 0) {
+ $rootScope.ngProgress.complete();
+ } else {
+ $rootScope.ngProgress.start();
+ }
+ });
});
\ No newline at end of file
diff --git a/docs-web/src/main/webapp/src/app/docs/controller/Navigation.js b/docs-web/src/main/webapp/src/app/docs/controller/Navigation.js
index d21bbb09..adbef67b 100644
--- a/docs-web/src/main/webapp/src/app/docs/controller/Navigation.js
+++ b/docs-web/src/main/webapp/src/app/docs/controller/Navigation.js
@@ -56,11 +56,4 @@ angular.module('docs').controller('Navigation', function($scope, $http, $state,
});
$event.preventDefault();
};
-
- /**
- * Returns true if at least an asynchronous request is in progress.
- */
- $scope.isLoading = function() {
- return $http.pendingRequests.length > 0;
- };
});
\ No newline at end of file
diff --git a/docs-web/src/main/webapp/src/index.html b/docs-web/src/main/webapp/src/index.html
index 384c59b1..035de3a7 100644
--- a/docs-web/src/main/webapp/src/index.html
+++ b/docs-web/src/main/webapp/src/index.html
@@ -37,6 +37,7 @@
+
@@ -92,10 +93,6 @@
-
-
![](img/loader.gif)
-
-
diff --git a/docs-web/src/main/webapp/src/lib/angular.ngprogress.js b/docs-web/src/main/webapp/src/lib/angular.ngprogress.js
new file mode 100644
index 00000000..52bafac6
--- /dev/null
+++ b/docs-web/src/main/webapp/src/lib/angular.ngprogress.js
@@ -0,0 +1,220 @@
+/*
+ ngprogress 1.1.2 - slim, site-wide progressbar for AngularJS
+ (C) 2013 - Victor Bjelkholm
+ License: MIT
+ Source: https://github.com/VictorBjelkholm/ngProgress
+ Date Compiled: 2015-07-27
+ */
+angular.module('ngProgress.provider', ['ngProgress.directive'])
+ .service('ngProgress', function () {
+ 'use strict';
+ return ['$document', '$window', '$compile', '$rootScope', '$timeout', function($document, $window, $compile, $rootScope, $timeout) {
+ this.autoStyle = true;
+ this.count = 0;
+ this.height = '2px';
+ this.$scope = $rootScope.$new();
+ this.color = 'white';
+ this.parent = $document.find('body')[0];
+ this.count = 0;
+
+ // Compile the directive
+ this.progressbarEl = $compile('')(this.$scope);
+ // Add the element to body
+ this.parent.appendChild(this.progressbarEl[0]);
+ // Set the initial height
+ this.$scope.count = this.count;
+ // If height or color isn't undefined, set the height, background-color and color.
+ if (this.height !== undefined) {
+ this.progressbarEl.eq(0).children().css('height', this.height);
+ }
+ if (this.color !== undefined) {
+ this.progressbarEl.eq(0).children().css('background-color', this.color);
+ this.progressbarEl.eq(0).children().css('color', this.color);
+ }
+ // The ID for the interval controlling start()
+ this.intervalCounterId = 0;
+
+ // Starts the animation and adds between 0 - 5 percent to loading
+ // each 400 milliseconds. Should always be finished with progressbar.complete()
+ // to hide it
+ this.start = function () {
+ // TODO Use requestAnimationFrame instead of setInterval
+ // https://developer.mozilla.org/en-US/docs/Web/API/window.requestAnimationFrame
+ this.show();
+ var self = this;
+ clearInterval(this.intervalCounterId);
+ this.intervalCounterId = setInterval(function () {
+ if (isNaN(self.count)) {
+ clearInterval(self.intervalCounterId);
+ self.count = 0;
+ self.hide();
+ } else {
+ self.remaining = 100 - self.count;
+ self.count = self.count + (0.15 * Math.pow(1 - Math.sqrt(self.remaining), 2));
+ self.updateCount(self.count);
+ }
+ }, 200);
+ };
+ this.updateCount = function (new_count) {
+ this.$scope.count = new_count;
+ if(!this.$scope.$$phase) {
+ this.$scope.$apply();
+ }
+ };
+ // Sets the height of the progressbar. Use any valid CSS value
+ // Eg '10px', '1em' or '1%'
+ this.setHeight = function (new_height) {
+ if (new_height !== undefined) {
+ this.height = new_height;
+ this.$scope.height = this.height;
+ if(!this.$scope.$$phase) {
+ this.$scope.$apply();
+ }
+ }
+ return this.height;
+ };
+ // Sets the color of the progressbar and it's shadow. Use any valid HTML
+ // color
+ this.setColor = function(new_color) {
+ if (new_color !== undefined) {
+ this.color = new_color;
+ this.$scope.color = this.color;
+ if(!this.$scope.$$phase) {
+ this.$scope.$apply();
+ }
+ }
+ return this.color;
+ };
+ this.hide = function() {
+ this.progressbarEl.children().css('opacity', '0');
+ var self = this;
+ self.animate(function () {
+ self.progressbarEl.children().css('width', '0%');
+ self.animate(function () {
+ self.show();
+ }, 500);
+ }, 500);
+ };
+ this.show = function () {
+ var self = this;
+ self.animate(function () {
+ self.progressbarEl.children().css('opacity', '1');
+ }, 100);
+ };
+ // Cancel any prior animations before running new ones.
+ // Multiple simultaneous animations just look weird.
+ this.animate = function(fn, time) {
+ if(this.animation !== undefined) { $timeout.cancel(this.animation); }
+ this.animation = $timeout(fn, time);
+ };
+ // Returns on how many percent the progressbar is at. Should'nt be needed
+ this.status = function () {
+ return this.count;
+ };
+ // Stops the progressbar at it's current location
+ this.stop = function () {
+ clearInterval(this.intervalCounterId);
+ };
+ // Set's the progressbar percentage. Use a number between 0 - 100.
+ // If 100 is provided, complete will be called.
+ this.set = function (new_count) {
+ this.show();
+ this.updateCount(new_count);
+ this.count = new_count;
+ clearInterval(this.intervalCounterId);
+ return this.count;
+ };
+ this.css = function (args) {
+ return this.progressbarEl.children().css(args);
+ };
+ // Resets the progressbar to percetage 0 and therefore will be hided after
+ // it's rollbacked
+ this.reset = function () {
+ clearInterval(this.intervalCounterId);
+ this.count = 0;
+ this.updateCount(this.count);
+ return 0;
+ };
+ // Jumps to 100% progress and fades away progressbar.
+ this.complete = function () {
+ this.count = 100;
+ this.updateCount(this.count);
+ var self = this;
+ clearInterval(this.intervalCounterId);
+ $timeout(function () {
+ self.hide();
+ $timeout(function () {
+ self.count = 0;
+ self.updateCount(self.count);
+ }, 200);
+ }, 500);
+ return this.count;
+ };
+ // Set the parent of the directive, sometimes body is not sufficient
+ this.setParent = function(newParent) {
+ if(newParent === null || newParent === undefined) {
+ throw new Error('Provide a valid parent of type HTMLElement');
+ }
+
+ if(this.parent !== null && this.parent !== undefined) {
+ this.parent.removeChild(this.progressbarEl[0]);
+ }
+
+ this.parent = newParent;
+ this.parent.appendChild(this.progressbarEl[0]);
+ };
+ // Gets the current element the progressbar is attached to
+ this.getDomElement = function () {
+ return this.progressbarEl;
+ };
+ this.setAbsolute = function() {
+ this.progressbarEl.css('position', 'absolute');
+ };
+ }];
+ })
+ .factory('ngProgressFactory', ['$injector', 'ngProgress', function($injector, ngProgress) {
+ var service = {
+ createInstance: function () {
+ return $injector.instantiate(ngProgress);
+ }
+ };
+ return service;
+ }]);
+angular.module('ngProgress.directive', [])
+ .directive('ngProgress', ["$window", "$rootScope", function ($window, $rootScope) {
+ var directiveObj = {
+ // Replace the directive
+ replace: true,
+ // Only use as a element
+ restrict: 'E',
+ link: function ($scope, $element, $attrs, $controller) {
+ // Watch the count on the $rootScope. As soon as count changes to something that
+ // isn't undefined or null, change the counter on $scope and also the width of
+ // the progressbar. The same goes for color and height on the $rootScope
+ $scope.$watch('count', function (newVal) {
+ if (newVal !== undefined || newVal !== null) {
+ $scope.counter = newVal;
+ $element.eq(0).children().css('width', newVal + '%');
+ }
+ });
+ $scope.$watch('color', function (newVal) {
+ if (newVal !== undefined || newVal !== null) {
+ $scope.color = newVal;
+ $element.eq(0).children().css('background-color', newVal);
+ $element.eq(0).children().css('color', newVal);
+ }
+ });
+ $scope.$watch('height', function (newVal) {
+ if (newVal !== undefined || newVal !== null) {
+ $scope.height = newVal;
+ $element.eq(0).children().css('height', newVal);
+ }
+ });
+ },
+ // The actual html that will be used
+ template: ''
+ };
+ return directiveObj;
+ }]);
+
+angular.module('ngProgress', ['ngProgress.directive', 'ngProgress.provider']);
\ No newline at end of file
diff --git a/docs-web/src/main/webapp/src/style/main.less b/docs-web/src/main/webapp/src/style/main.less
index 588f939b..34f76a9f 100644
--- a/docs-web/src/main/webapp/src/style/main.less
+++ b/docs-web/src/main/webapp/src/style/main.less
@@ -241,4 +241,33 @@ input[readonly].share-link {
background: rgba(255, 255, 255, 0.5);
padding: 20px;
border-radius: 4px
+}
+
+/* Styling for the ngProgress itself */
+#ngProgress {
+ margin: 0;
+ padding: 0;
+ z-index: 99998;
+ background-color: green;
+ color: green;
+ box-shadow: 0 0 10px 0; /* Inherits the font color */
+ height: 2px;
+ opacity: 0;
+
+ /* Add CSS3 styles for transition smoothing */
+ -webkit-transition: all 0.5s ease-in-out;
+ -moz-transition: all 0.5s ease-in-out;
+ -o-transition: all 0.5s ease-in-out;
+ transition: all 0.5s ease-in-out;
+}
+
+/* Styling for the ngProgress-container */
+#ngProgress-container {
+ position: fixed;
+ margin: 0;
+ padding: 0;
+ top: 0;
+ left: 0;
+ right: 0;
+ z-index: 99999;
}
\ No newline at end of file