diff --git a/pom.xml b/pom.xml index 493d7372..de197a34 100644 --- a/pom.xml +++ b/pom.xml @@ -438,11 +438,6 @@ mousetrap 1.4.6 - - org.webjars - spin-js - 1.3.3 - org.webjars momentjs diff --git a/src/main/webapp/WEB-INF/wro.xml b/src/main/webapp/WEB-INF/wro.xml index fea88b02..b59ce88a 100644 --- a/src/main/webapp/WEB-INF/wro.xml +++ b/src/main/webapp/WEB-INF/wro.xml @@ -22,8 +22,6 @@ webjar:device.min.js - webjar:spin.js - webjar:moment.min.js webjar:langs.min.js @@ -32,12 +30,14 @@ webjar:angular-route.min.js webjar:angular-sanitize.min.js webjar:angular-touch.min.js + webjar:angular-animate.min.js webjar:angular-ui-router.min.js webjar:ui-utils.min.js webjar:ui-select2.js webjar:ui-bootstrap-tpls.min.js webjar:ng-infinite-scroll.min.js + /vendor/angular-loading-bar/loading-bar.0.3.0.min.js webjar:ng-grid.min.js webjar:ng-grid.min.css @@ -46,6 +46,8 @@ /vendor/readabilicons/css/*.css + /vendor/angular-loading-bar/loading-bar.min.css + diff --git a/src/main/webapp/js/controllers.js b/src/main/webapp/js/controllers.js index ece34127..01d7e4e9 100644 --- a/src/main/webapp/js/controllers.js +++ b/src/main/webapp/js/controllers.js @@ -430,7 +430,6 @@ module.controller('TagDetailsCtrl', ['$scope', '$state', '$stateParams', 'FeedSe module.controller('ToolbarCtrl', [ '$scope', - '$http', '$state', '$stateParams', '$route', @@ -442,24 +441,15 @@ module.controller('ToolbarCtrl', [ 'ServerService', 'FeedService', 'MobileService', - function($scope, $http, $state, $stateParams, $route, $location, SettingsService, EntryService, ProfileService, AnalyticsService, + function($scope, $state, $stateParams, $route, $location, SettingsService, EntryService, ProfileService, AnalyticsService, ServerService, FeedService, MobileService) { - function totalActiveAjaxRequests() { - return ($http.pendingRequests.length + $.active); - } - $scope.keywords = $location.search().q; $scope.session = ProfileService.get(); $scope.ServerService = ServerService.get(); $scope.settingsService = SettingsService; $scope.MobileService = MobileService; - $scope.loading = true; - $scope.$watch(totalActiveAjaxRequests, function() { - $scope.loading = (totalActiveAjaxRequests() !== 0); - }); - $scope.$watch('settingsService.settings.readingMode', function(newValue, oldValue) { if (newValue && oldValue && newValue != oldValue) { SettingsService.save(); diff --git a/src/main/webapp/js/directives.js b/src/main/webapp/js/directives.js index 03a0d128..6fab2685 100644 --- a/src/main/webapp/js/directives.js +++ b/src/main/webapp/js/directives.js @@ -273,46 +273,6 @@ module.directive('category', [function() { }; }]); -/** - * Reusable spinner component - */ -module.directive('spinner', function() { - return { - scope : { - shown : '=' - }, - restrict : 'A', - link : function($scope, element) { - element.addClass('spinner'); - var opts = { - lines : 11, // The number of lines to draw - length : 5, // The length of each line - width : 3, // The line thickness - radius : 8, // The radius of the inner circle - corners : 1, // Corner roundness (0..1) - rotate : 0, // The rotation offset - color : '#000', // #rgb or #rrggbb - speed : 1.3, // Rounds per second - trail : 60, // Afterglow percentage - shadow : false, // Whether to render a shadow - hwaccel : true, // Whether to use hardware acceleration - zIndex : 2e9, // The z-index (defaults to 2000000000) - top : 'auto', // Top position relative to parent in px - left : 'auto' // Left position relative to parent in px - }; - var spinner = new Spinner(opts); - $scope.$watch('shown', function(shown) { - if (shown) { - spinner.spin(); - element.append(spinner.el); - } else { - spinner.stop(); - } - }); - } - }; -}); - module.directive('draggable', function() { return { restrict : 'A', diff --git a/src/main/webapp/js/main.js b/src/main/webapp/js/main.js index 0d97fe7a..e77e1843 100644 --- a/src/main/webapp/js/main.js +++ b/src/main/webapp/js/main.js @@ -1,8 +1,12 @@ -var app = angular.module('commafeed', ['ngRoute', 'ngTouch', 'ui.utils', 'ui.bootstrap', 'ui.router', 'ui.select2', 'commafeed.directives', - 'commafeed.controllers', 'commafeed.services', 'commafeed.filters', 'ngSanitize', 'infinite-scroll', 'ngGrid']); +var app = angular.module('commafeed', ['ngRoute', 'ngTouch', 'ngAnimate', 'ui.utils', 'ui.bootstrap', 'ui.router', 'ui.select2', + 'commafeed.directives', 'commafeed.controllers', 'commafeed.services', 'commafeed.filters', 'ngSanitize', 'infinite-scroll', + 'ngGrid', 'chieffancypants.loadingBar']); -app.config(['$routeProvider', '$stateProvider', '$urlRouterProvider', '$httpProvider', '$compileProvider', - function($routeProvider, $stateProvider, $urlRouterProvider, $httpProvider, $compileProvider) { +app.config(['$routeProvider', '$stateProvider', '$urlRouterProvider', '$httpProvider', '$compileProvider', 'cfpLoadingBarProvider', + function($routeProvider, $stateProvider, $urlRouterProvider, $httpProvider, $compileProvider, cfpLoadingBarProvider) { + + cfpLoadingBarProvider.includeSpinner = false; + cfpLoadingBarProvider.latencyThreshold = 0; $compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|ftp|mailto|javascript):/); var interceptor = ['$rootScope', '$q', function(scope, $q) { diff --git a/src/main/webapp/sass/app.scss b/src/main/webapp/sass/app.scss index ab6d39b6..f4dec7b6 100644 --- a/src/main/webapp/sass/app.scss +++ b/src/main/webapp/sass/app.scss @@ -6,6 +6,7 @@ @import "components/entry-list"; @import "components/subscription-list"; @import "components/help"; +@import "components/loading-bar"; @import "mobile/mobile"; diff --git a/src/main/webapp/sass/components/_loading-bar.scss b/src/main/webapp/sass/components/_loading-bar.scss new file mode 100644 index 00000000..55c9ffcd --- /dev/null +++ b/src/main/webapp/sass/components/_loading-bar.scss @@ -0,0 +1,12 @@ +#loading-bar .bar { + background: #2c3e50; +} + +#loading-bar .peg { + box-shadow: 0 0 10px #2c3e50, 0 0 5px #2c3e50; +} + +#loading-bar-spinner .spinner-icon { + border-top-color: #2c3e50; + border-left-color: #2c3e50; +} \ No newline at end of file diff --git a/src/main/webapp/templates/_toolbar.html b/src/main/webapp/templates/_toolbar.html index 39e6b014..2f03e9a4 100644 --- a/src/main/webapp/templates/_toolbar.html +++ b/src/main/webapp/templates/_toolbar.html @@ -131,7 +131,6 @@ -
\ No newline at end of file diff --git a/src/main/webapp/vendor/angular-loading-bar/loading-bar.0.3.0.min.js b/src/main/webapp/vendor/angular-loading-bar/loading-bar.0.3.0.min.js new file mode 100644 index 00000000..74085cf1 --- /dev/null +++ b/src/main/webapp/vendor/angular-loading-bar/loading-bar.0.3.0.min.js @@ -0,0 +1,7 @@ +/*! + * angular-loading-bar v0.3.0 + * https://chieffancypants.github.io/angular-loading-bar + * Copyright (c) 2014 Wes Cruver + * License: MIT + */ +!function(){"use strict";angular.module("angular-loading-bar",["chieffancypants.loadingBar"]),angular.module("chieffancypants.loadingBar",[]).config(["$httpProvider",function(a){var b=["$q","$cacheFactory","$timeout","$rootScope","cfpLoadingBar",function(b,c,d,e,f){function g(){d.cancel(i),f.complete(),k=0,j=0}function h(b){var d,e=a.defaults;if("GET"!==b.method||b.cache===!1)return b.cached=!1,!1;d=b.cache===!0&&void 0===e.cache?c.get("$http"):void 0!==e.cache?e.cache:b.cache;var f=void 0!==d?void 0!==d.get(b.url):!1;return void 0!==b.cached&&f!==b.cached?b.cached:(b.cached=f,f)}var i,j=0,k=0,l=f.latencyThreshold;return{request:function(a){return a.ignoreLoadingBar||h(a)||(e.$broadcast("cfpLoadingBar:loading",{url:a.url}),0===j&&(i=d(function(){f.start()},l)),j++,f.set(k/j)),a},response:function(a){return h(a.config)||(k++,e.$broadcast("cfpLoadingBar:loaded",{url:a.config.url}),k>=j?g():f.set(k/j)),a},responseError:function(a){return h(a.config)||(k++,e.$broadcast("cfpLoadingBar:loaded",{url:a.config.url}),k>=j?g():f.set(k/j)),b.reject(a)}}}];a.interceptors.push(b)}]).provider("cfpLoadingBar",function(){this.includeSpinner=!0,this.includeBar=!0,this.latencyThreshold=100,this.parentSelector="body",this.$get=["$document","$timeout","$animate","$rootScope",function(a,b,c,d){function e(){b.cancel(k),q||(d.$broadcast("cfpLoadingBar:started"),q=!0,t&&c.enter(n,m),s&&c.enter(p,m),f(.02))}function f(a){if(q){var c=100*a+"%";o.css("width",c),r=a,b.cancel(j),j=b(function(){g()},250)}}function g(){if(!(h()>=1)){var a=0,b=h();a=b>=0&&.25>b?(3*Math.random()+3)/100:b>=.25&&.65>b?3*Math.random()/100:b>=.65&&.9>b?2*Math.random()/100:b>=.9&&.99>b?.005:0;var c=h()+a;f(c)}}function h(){return r}function i(){d.$broadcast("cfpLoadingBar:completed"),f(1),k=b(function(){c.leave(n,function(){r=0,q=!1}),c.leave(p)},500)}var j,k,l=this.parentSelector,m=a.find(l),n=angular.element('
'),o=n.find("div").eq(0),p=angular.element('
'),q=!1,r=0,s=this.includeSpinner,t=this.includeBar;return{start:e,set:f,status:h,inc:g,complete:i,includeSpinner:this.includeSpinner,latencyThreshold:this.latencyThreshold,parentSelector:this.parentSelector}}]})}(); \ No newline at end of file diff --git a/src/main/webapp/vendor/angular-loading-bar/loading-bar.min.css b/src/main/webapp/vendor/angular-loading-bar/loading-bar.min.css new file mode 100644 index 00000000..47db6dd2 --- /dev/null +++ b/src/main/webapp/vendor/angular-loading-bar/loading-bar.min.css @@ -0,0 +1,8 @@ +/*! + * angular-loading-bar v0.3.0 + * https://chieffancypants.github.io/angular-loading-bar + * Copyright (c) 2014 Wes Cruver + * License: MIT + */ + +#loading-bar,#loading-bar-spinner{pointer-events:none;-webkit-pointer-events:none;-webkit-transition:350ms linear all;-moz-transition:350ms linear all;-o-transition:350ms linear all;transition:350ms linear all}#loading-bar.ng-enter,#loading-bar.ng-leave.ng-leave-active,#loading-bar-spinner.ng-enter,#loading-bar-spinner.ng-leave.ng-leave-active{opacity:0}#loading-bar.ng-enter.ng-enter-active,#loading-bar.ng-leave,#loading-bar-spinner.ng-enter.ng-enter-active,#loading-bar-spinner.ng-leave{opacity:1}#loading-bar .bar{-webkit-transition:width 350ms;-moz-transition:width 350ms;-o-transition:width 350ms;transition:width 350ms;background:#29d;position:fixed;z-index:2000;top:0;left:0;width:100%;height:2px}#loading-bar .peg{display:block;position:absolute;right:0;width:100px;height:100%;box-shadow:0 0 10px #29d,0 0 5px #29d;opacity:1;-webkit-transform:rotate(3deg) translate(0px,-4px);-moz-transform:rotate(3deg) translate(0px,-4px);-ms-transform:rotate(3deg) translate(0px,-4px);-o-transform:rotate(3deg) translate(0px,-4px);transform:rotate(3deg) translate(0px,-4px)}#loading-bar-spinner{display:block;position:fixed;z-index:100;top:10px;left:10px}#loading-bar-spinner .spinner-icon{width:14px;height:14px;border:solid 2px transparent;border-top-color:#29d;border-left-color:#29d;border-radius:10px;-webkit-animation:loading-bar-spinner 400ms linear infinite;-moz-animation:loading-bar-spinner 400ms linear infinite;-ms-animation:loading-bar-spinner 400ms linear infinite;-o-animation:loading-bar-spinner 400ms linear infinite;animation:loading-bar-spinner 400ms linear infinite}@-webkit-keyframes loading-bar-spinner{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-moz-keyframes loading-bar-spinner{0%{-moz-transform:rotate(0deg);transform:rotate(0deg)}100%{-moz-transform:rotate(360deg);transform:rotate(360deg)}}@-o-keyframes loading-bar-spinner{0%{-o-transform:rotate(0deg);transform:rotate(0deg)}100%{-o-transform:rotate(360deg);transform:rotate(360deg)}}@-ms-keyframes loading-bar-spinner{0%{-ms-transform:rotate(0deg);transform:rotate(0deg)}100%{-ms-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes loading-bar-spinner{0%{transform:rotate(0deg);transform:rotate(0deg)}100%{transform:rotate(360deg);transform:rotate(360deg)}} \ No newline at end of file