This repository has been archived by the owner on Sep 19, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 196
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
10 changed files
with
73 additions
and
119 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -13,59 +13,63 @@ Authored by Mike Grabski @HackedByChinese <[email protected]> | |
Licensed under [MIT](http://www.opensource.org/licenses/mit-license.php) | ||
|
||
## Requirements | ||
* Angular 1.2.0 or later (earlier might be possible but not tested). | ||
* Angular 1.2.0 or later. | ||
|
||
## What NgIdle Does | ||
Check out the Overview in the wiki. | ||
|
||
## Getting Help / "How do I..." | ||
|
||
I know a lot of GH projects give you the basics on the README and don't bother with a wiki. I assure you [our wiki is fully operational](https://github.com/HackedByChinese/ng-idle/wiki) and documents the full API. Before opening an issue asking me how to do something, please stop by the wiki first; I'll probably just end up linking you to your answer in the wiki anyways :wink:. | ||
|
||
## Getting Started | ||
|
||
Include `angular-idle.js` after `angular.js`. You can install using Bower with this command: `bower install --save ng-idle`. | ||
|
||
Bare bones example: | ||
|
||
// include the `ngIdle` module | ||
var app = angular.module('demo', ['ngIdle']); | ||
|
||
app | ||
.controller('EventsCtrl', function($scope, Idle) { | ||
$scope.events = []; | ||
|
||
$scope.$on('IdleStart', function() { | ||
// the user appears to have gone idle | ||
}); | ||
|
||
$scope.$on('IdleWarn', function(e, countdown) { | ||
// follows after the IdleStart event, but includes a countdown until the user is considered timed out | ||
// the countdown arg is the number of seconds remaining until then. | ||
// you can change the title or display a warning dialog from here. | ||
// you can let them resume their session by calling Idle.watch() | ||
}); | ||
|
||
$scope.$on('IdleTimeout', function() { | ||
// the user has timed out (meaning idleDuration + timeout has passed without any activity) | ||
// this is where you'd log them | ||
}); | ||
|
||
$scope.$on('IdleEnd', function() { | ||
// the user has come back from AFK and is doing stuff. if you are warning them, you can use this to hide the dialog | ||
}); | ||
|
||
$scope.$on('Keepalive', function() { | ||
// do something to keep the user's session alive | ||
}); | ||
|
||
}) | ||
.config(function(IdleProvider, KeepaliveProvider) { | ||
// configure Idle settings | ||
IdleProvider.idle(5); // in seconds | ||
IdleProvider.timeout(5); // in seconds | ||
KeepaliveProvider.interval(2); // in seconds | ||
}) | ||
.run(function(Idle){ | ||
// start watching when the app runs. also starts the Keepalive service by default. | ||
Idle.watch(); | ||
}); | ||
// include the `ngIdle` module | ||
var app = angular.module('demo', ['ngIdle']); | ||
|
||
app | ||
.controller('EventsCtrl', function($scope, Idle) { | ||
$scope.events = []; | ||
|
||
$scope.$on('IdleStart', function() { | ||
// the user appears to have gone idle | ||
}); | ||
|
||
$scope.$on('IdleWarn', function(e, countdown) { | ||
// follows after the IdleStart event, but includes a countdown until the user is considered timed out | ||
// the countdown arg is the number of seconds remaining until then. | ||
// you can change the title or display a warning dialog from here. | ||
// you can let them resume their session by calling Idle.watch() | ||
}); | ||
|
||
$scope.$on('IdleTimeout', function() { | ||
// the user has timed out (meaning idleDuration + timeout has passed without any activity) | ||
// this is where you'd log them | ||
}); | ||
|
||
$scope.$on('IdleEnd', function() { | ||
// the user has come back from AFK and is doing stuff. if you are warning them, you can use this to hide the dialog | ||
}); | ||
|
||
$scope.$on('Keepalive', function() { | ||
// do something to keep the user's session alive | ||
}); | ||
|
||
}) | ||
.config(function(IdleProvider, KeepaliveProvider) { | ||
// configure Idle settings | ||
IdleProvider.idle(5); // in seconds | ||
IdleProvider.timeout(5); // in seconds | ||
KeepaliveProvider.interval(2); // in seconds | ||
}) | ||
.run(function(Idle){ | ||
// start watching when the app runs. also starts the Keepalive service by default. | ||
Idle.watch(); | ||
}); | ||
|
||
You may use `Keepalive` and `Idle` independently if you desire, but they are contained in the same script. | ||
|
||
|
@@ -83,7 +87,7 @@ Contributors are welcome. I use the `git-flow` lifecyle, so `master` is the stab | |
|
||
## Developing | ||
|
||
You will need Node/NPM, Grunt, and Bower. Once you checkout from git, run `npm install`. This will install all dev and bower dependencies so you can immediately build and test your working copy. | ||
You will need Node/NPM and Grunt (don't forget `grunt-cli`). Once you checkout from git, run `npm install`. This will install all dev and bower dependencies so you can immediately build and test your working copy. | ||
|
||
### Building | ||
You can build the module by running `grunt build`. | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,6 +1,6 @@ | ||
/*** Directives and services for responding to idle users in AngularJS | ||
* @author Mike Grabski <[email protected]> | ||
* @version v1.0.2 | ||
* @version v1.0.3 | ||
* @link https://github.com/HackedByChinese/ng-idle.git | ||
* @license MIT | ||
*/ | ||
|
@@ -200,7 +200,7 @@ angular.module('ngIdle.idle', ['ngIdle.keepalive', 'ngIdle.localStorage']) | |
function getExpiry() { | ||
var obj = LocalStorage.get('expiry'); | ||
|
||
return obj.time; | ||
return new Date(obj.time); | ||
} | ||
|
||
function setExpiry(date) { | ||
|
@@ -276,7 +276,7 @@ angular.module('ngIdle.idle', ['ngIdle.keepalive', 'ngIdle.localStorage']) | |
|
||
var wrap = function(event) { | ||
if (event.key === 'ngIdle.expiry' && event.newValue !== event.oldValue) { | ||
var val = LocalStorage.parseJson(event.newValue); | ||
var val = angular.fromJson(event.newValue); | ||
if (val.id === id) return; | ||
svc.interrupt(true); | ||
} | ||
|
@@ -393,36 +393,18 @@ angular.module('ngIdle.title', []) | |
}]); | ||
|
||
angular.module('ngIdle.localStorage', []) | ||
.factory('IdleLocalStorage', ['$window', function($window) { | ||
.service('IdleLocalStorage', ['$window', function($window) { | ||
var storage = $window.localStorage; | ||
|
||
function tryParseJson(value) { | ||
try { | ||
return JSON.parse(value, function(key, value) { | ||
var match = /^(\d{4})-(\d{2})-(\d{2})T(\d{2}):(\d{2}):(\d{2}(?:\.\d*)?)Z$/.exec(value); | ||
if (match) return new Date(value); | ||
|
||
return value; | ||
}); | ||
} | ||
catch(e) { | ||
return value; | ||
} | ||
} | ||
|
||
|
||
return { | ||
set: function(key, value) { | ||
storage.setItem('ngIdle.'+key, JSON.stringify(value)); | ||
storage.setItem('ngIdle.'+key, angular.toJson(value)); | ||
}, | ||
get: function(key) { | ||
var raw = storage.getItem('ngIdle.'+key); | ||
return tryParseJson(raw); | ||
return angular.fromJson(storage.getItem('ngIdle.'+key)); | ||
}, | ||
remove: function(key) { | ||
storage.removeItem('ngIdle.'+key); | ||
}, | ||
parseJson: function(raw) { | ||
return tryParseJson(raw); | ||
} | ||
}; | ||
}]); | ||
|
Oops, something went wrong.