Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature/allow manual control #357

Open
wants to merge 7 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
18 changes: 17 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -152,7 +152,15 @@ $http.post('/save', data, {

```

#### Auto Increment
By default, the loading bar will increment by a random amount that gets smaller as the bar fills, you can disable this:

```js
angular.module('myApp', ['angular-loading-bar'])
.config(['cfpLoadingBarProvider', function(cfpLoadingBarProvider) {
cfpLoadingBarProvider.autoIncrement = false;
}])
```


## How it works:
Expand Down Expand Up @@ -190,7 +198,15 @@ cfpLoadingBar.status() // Returns the loading bar's progress.

cfpLoadingBar.complete()
// Set the loading bar's progress to 100%, and then remove it from the DOM.

//
// If your requests don't go through the $http service and can't be automatically detected,
// use the following
cfpLoadingBar.push(x)
// signals the start of a request
// it will broadcast x on the 'cfpLoadingBar:loading' event when called
cfpLoadingBar.pop(y)
// signals the completion of a request
// if it is the last request to complete, broadcasts y on the 'cfpLoadingBar:loaded' event
```

## Events
Expand Down
2 changes: 1 addition & 1 deletion build/loading-bar.css
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
/*!
* angular-loading-bar v0.9.0
* https://chieffancypants.github.io/angular-loading-bar
* Copyright (c) 2016 Wes Cruver
* Copyright (c) 2017 Wes Cruver
* License: MIT
*/

Expand Down
115 changes: 59 additions & 56 deletions build/loading-bar.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
/*!
* angular-loading-bar v0.9.0
* https://chieffancypants.github.io/angular-loading-bar
* Copyright (c) 2016 Wes Cruver
* Copyright (c) 2017 Wes Cruver
* License: MIT
*/
/*
Expand Down Expand Up @@ -32,39 +32,7 @@ angular.module('chieffancypants.loadingBar', ['cfp.loadingBarInterceptor']);
angular.module('cfp.loadingBarInterceptor', ['cfp.loadingBar'])
.config(['$httpProvider', function ($httpProvider) {

var interceptor = ['$q', '$cacheFactory', '$timeout', '$rootScope', '$log', 'cfpLoadingBar', function ($q, $cacheFactory, $timeout, $rootScope, $log, cfpLoadingBar) {

/**
* The total number of requests made
*/
var reqsTotal = 0;

/**
* The number of requests completed (either successfully or not)
*/
var reqsCompleted = 0;

/**
* The amount of time spent fetching before showing the loading bar
*/
var latencyThreshold = cfpLoadingBar.latencyThreshold;

/**
* $timeout handle for latencyThreshold
*/
var startTimeout;


/**
* calls cfpLoadingBar.complete() which removes the
* loading bar from the DOM.
*/
function setComplete() {
$timeout.cancel(startTimeout);
cfpLoadingBar.complete();
reqsCompleted = 0;
reqsTotal = 0;
}
var interceptor = ['$q', '$cacheFactory', '$log', 'cfpLoadingBar', function ($q, $cacheFactory, $log, cfpLoadingBar) {

/**
* Determine if the response has already been cached
Expand Down Expand Up @@ -100,14 +68,7 @@ angular.module('cfp.loadingBarInterceptor', ['cfp.loadingBar'])
// Check to make sure this request hasn't already been cached and that
// the requester didn't explicitly ask us to ignore this request:
if (!config.ignoreLoadingBar && !isCached(config)) {
$rootScope.$broadcast('cfpLoadingBar:loading', {url: config.url});
if (reqsTotal === 0) {
startTimeout = $timeout(function() {
cfpLoadingBar.start();
}, latencyThreshold);
}
reqsTotal++;
cfpLoadingBar.set(reqsCompleted / reqsTotal);
cfpLoadingBar.push({url: config.url});
}
return config;
},
Expand All @@ -119,13 +80,7 @@ angular.module('cfp.loadingBarInterceptor', ['cfp.loadingBar'])
}

if (!response.config.ignoreLoadingBar && !isCached(response.config)) {
reqsCompleted++;
if (reqsCompleted >= reqsTotal) {
$rootScope.$broadcast('cfpLoadingBar:loaded', {url: response.config.url, result: response});
setComplete();
} else {
cfpLoadingBar.set(reqsCompleted / reqsTotal);
}
cfpLoadingBar.pop({url: response.config.url, result: response});
}
return response;
},
Expand All @@ -137,13 +92,7 @@ angular.module('cfp.loadingBarInterceptor', ['cfp.loadingBar'])
}

if (!rejection.config.ignoreLoadingBar && !isCached(rejection.config)) {
reqsCompleted++;
if (reqsCompleted >= reqsTotal) {
$rootScope.$broadcast('cfpLoadingBar:loaded', {url: rejection.config.url, result: rejection});
setComplete();
} else {
cfpLoadingBar.set(reqsCompleted / reqsTotal);
}
cfpLoadingBar.pop({url: rejection.config.url, result: rejection});
}
return $q.reject(rejection);
}
Expand Down Expand Up @@ -192,6 +141,37 @@ angular.module('cfp.loadingBar', [])
var includeBar = this.includeBar;
var startSize = this.startSize;

/**
* The total number of requests made
*/
var reqsTotal = 0;

/**
* The number of requests completed (either successfully or not)
*/
var reqsCompleted = 0;

/**
* The amount of time spent fetching before showing the loading bar
*/
var latencyThreshold = this.latencyThreshold;

/**
* $timeout handle for latencyThreshold
*/
var startTimeout;

/**
* calls cfpLoadingBar.complete() which removes the
* loading bar from the DOM.
*/
function setComplete() {
$timeout.cancel(startTimeout);
_complete();
reqsCompleted = 0;
reqsTotal = 0;
}

/**
* Inserts the loading bar element into the dom, and sets it to 2%
*/
Expand Down Expand Up @@ -321,12 +301,35 @@ angular.module('cfp.loadingBar', [])
}, 500);
}

function _push(info) {
$rootScope.$broadcast('cfpLoadingBar:loading', info);
if (reqsTotal === 0) {
startTimeout = $timeout(function() {
_start();
}, latencyThreshold);
}
reqsTotal++;
_set(reqsCompleted / reqsTotal);
}

function _pop(info) {
reqsCompleted++;
if (reqsCompleted >= reqsTotal) {
$rootScope.$broadcast('cfpLoadingBar:loaded', info);
setComplete();
} else {
_set(reqsCompleted / reqsTotal);
}
}

return {
start : _start,
set : _set,
status : _status,
inc : _inc,
complete : _complete,
push : _push,
pop : _pop,
autoIncrement : this.autoIncrement,
includeSpinner : this.includeSpinner,
latencyThreshold : this.latencyThreshold,
Expand Down
2 changes: 1 addition & 1 deletion build/loading-bar.min.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

5 changes: 3 additions & 2 deletions build/loading-bar.min.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

23 changes: 12 additions & 11 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -31,16 +31,17 @@
},
"homepage": "https://chieffancypants.github.io/angular-loading-bar",
"devDependencies": {
"karma-jasmine": "^0.1.3",
"karma-coffee-preprocessor": "^0.2.0",
"karma-phantomjs-launcher": "^0.1.0",
"karma": "~0.12.0",
"karma-coverage": "^0.1.0",
"grunt": "~0.4.1",
"grunt-contrib-jshint": "~0.6.4",
"grunt-contrib-uglify": "^0.9.1",
"grunt-contrib-cssmin": "~0.12.0",
"grunt-karma": "~0.11.0",
"grunt-contrib-concat": "^0.5.0"
"grunt": "^1.0.1",
"grunt-contrib-concat": "^1.0.1",
"grunt-contrib-cssmin": "^2.2.0",
"grunt-contrib-jshint": "^1.1.0",
"grunt-contrib-uglify": "^3.0.0",
"grunt-karma": "^2.0.0",
"jasmine-core": "^2.6.2",
"karma": "^1.7.0",
"karma-coffee-preprocessor": "^1.0.1",
"karma-coverage": "^1.1.1",
"karma-jasmine": "^1.1.0",
"karma-phantomjs-launcher": "^1.0.4"
}
}