diff --git a/PlexRequests.UI/Content/Angular/angular-loading-spinner.js b/PlexRequests.UI/Content/Angular/angular-loading-spinner.js new file mode 100644 index 000000000..c25717c81 --- /dev/null +++ b/PlexRequests.UI/Content/Angular/angular-loading-spinner.js @@ -0,0 +1,25 @@ +(function(){ + angular.module('ngLoadingSpinner', ['angularSpinner']) + .directive('usSpinner', ['$http', '$rootScope' ,function ($http, $rootScope){ + return { + link: function (scope, elm, attrs) + { + $rootScope.spinnerActive = false; + scope.isLoading = function () { + return $http.pendingRequests.length > 0; + }; + + scope.$watch(scope.isLoading, function (loading) + { + $rootScope.spinnerActive = loading; + if(loading){ + elm.removeClass('ng-hide'); + }else{ + elm.addClass('ng-hide'); + } + }); + } + }; + + }]); +}).call(this); \ No newline at end of file diff --git a/PlexRequests.UI/Content/Angular/angular-spinner.min.js b/PlexRequests.UI/Content/Angular/angular-spinner.min.js new file mode 100644 index 000000000..ef727fe75 --- /dev/null +++ b/PlexRequests.UI/Content/Angular/angular-spinner.min.js @@ -0,0 +1,2 @@ +!function(a){"use strict";function b(a,b){a.module("angularSpinner",[]).factory("usSpinnerService",["$rootScope",function(a){var b={};return b.spin=function(b){a.$broadcast("us-spinner:spin",b)},b.stop=function(b){a.$broadcast("us-spinner:stop",b)},b}]).directive("usSpinner",["$window",function(c){return{scope:!0,link:function(d,e,f){function g(){d.spinner&&d.spinner.stop()}var h=b||c.Spinner;d.spinner=null,d.key=a.isDefined(f.spinnerKey)?f.spinnerKey:!1,d.startActive=a.isDefined(f.spinnerStartActive)?f.spinnerStartActive:d.key?!1:!0,d.spin=function(){d.spinner&&d.spinner.spin(e[0])},d.stop=function(){d.startActive=!1,g()},d.$watch(f.usSpinner,function(a){g(),d.spinner=new h(a),(!d.key||d.startActive)&&d.spinner.spin(e[0])},!0),d.$on("us-spinner:spin",function(a,b){b===d.key&&d.spin()}),d.$on("us-spinner:stop",function(a,b){b===d.key&&d.stop()}),d.$on("$destroy",function(){d.stop(),d.spinner=null})}}}])}"function"==typeof define&&define.amd?define(["angular","spin"],b):b(a.angular)}(window); +//# sourceMappingURL=angular-spinner.min.js.map \ No newline at end of file diff --git a/PlexRequests.UI/Content/app/app.js b/PlexRequests.UI/Content/app/app.js index af97fb710..197a8a7f6 100644 --- a/PlexRequests.UI/Content/app/app.js +++ b/PlexRequests.UI/Content/app/app.js @@ -1,4 +1,4 @@ (function() { - module = angular.module('PlexRequests', []); + module = angular.module('PlexRequests', ['ngLoadingSpinner']); module.constant("moment", moment); }()); \ No newline at end of file diff --git a/PlexRequests.UI/Content/spin.min.js b/PlexRequests.UI/Content/spin.min.js new file mode 100644 index 000000000..aa2b9c3df --- /dev/null +++ b/PlexRequests.UI/Content/spin.min.js @@ -0,0 +1,2 @@ +// http://spin.js.org/#v2.3.2 +!function(a,b){"object"==typeof module&&module.exports?module.exports=b():"function"==typeof define&&define.amd?define(b):a.Spinner=b()}(this,function(){"use strict";function a(a,b){var c,d=document.createElement(a||"div");for(c in b)d[c]=b[c];return d}function b(a){for(var b=1,c=arguments.length;c>b;b++)a.appendChild(arguments[b]);return a}function c(a,b,c,d){var e=["opacity",b,~~(100*a),c,d].join("-"),f=.01+c/d*100,g=Math.max(1-(1-a)/b*(100-f),a),h=j.substring(0,j.indexOf("Animation")).toLowerCase(),i=h&&"-"+h+"-"||"";return m[e]||(k.insertRule("@"+i+"keyframes "+e+"{0%{opacity:"+g+"}"+f+"%{opacity:"+a+"}"+(f+.01)+"%{opacity:1}"+(f+b)%100+"%{opacity:"+a+"}100%{opacity:"+g+"}}",k.cssRules.length),m[e]=1),e}function d(a,b){var c,d,e=a.style;if(b=b.charAt(0).toUpperCase()+b.slice(1),void 0!==e[b])return b;for(d=0;d',c)}k.addRule(".spin-vml","behavior:url(#default#VML)"),h.prototype.lines=function(a,d){function f(){return e(c("group",{coordsize:k+" "+k,coordorigin:-j+" "+-j}),{width:k,height:k})}function h(a,h,i){b(m,b(e(f(),{rotation:360/d.lines*a+"deg",left:~~h}),b(e(c("roundrect",{arcsize:d.corners}),{width:j,height:d.scale*d.width,left:d.scale*d.radius,top:-d.scale*d.width>>1,filter:i}),c("fill",{color:g(d.color,a),opacity:d.opacity}),c("stroke",{opacity:0}))))}var i,j=d.scale*(d.length+d.width),k=2*d.scale*j,l=-(d.width+d.length)*d.scale*2+"px",m=e(f(),{position:"absolute",top:l,left:l});if(d.shadow)for(i=1;i<=d.lines;i++)h(i,-2,"progid:DXImageTransform.Microsoft.Blur(pixelradius=2,makeshadow=1,shadowopacity=.3)");for(i=1;i<=d.lines;i++)h(i);return b(a,m)},h.prototype.opacity=function(a,b,c,d){var e=a.firstChild;d=d.shadow&&d.lines||0,e&&b+d>1)+"px"})}for(var i,k=0,l=(f.lines-1)*(1-f.direction)/2;k", $"", - $"", + //$"", $"", $"", $"", @@ -224,7 +224,9 @@ namespace PlexRequests.UI.Helpers sb.Append($""); sb.Append($""); sb.Append($""); - + sb.Append($""); + sb.Append($""); + sb.Append($""); return helper.Raw(sb.ToString()); } diff --git a/PlexRequests.UI/Views/UserManagement/Index.cshtml b/PlexRequests.UI/Views/UserManagement/Index.cshtml index eb01aa8c9..cfd0f12ec 100644 --- a/PlexRequests.UI/Views/UserManagement/Index.cshtml +++ b/PlexRequests.UI/Views/UserManagement/Index.cshtml @@ -3,11 +3,14 @@ @Html.LoadUserManagementAssets()
+ + Spinner Active: + {{spinnerActive}}