http://kiss.com.tw/data/jquery.idletimer.js

1/*! Idle Timer - v1.0.1 - 2014-03-21
2* https://github.com/thorst/jquery-idletimer
3* Copyright (c) 2014 Paul Irish; Licensed MIT */
4/*
5	mousewheel (deprecated) -> IE6.0, Chrome, Opera, Safari
6	DOMMouseScroll (deprecated) -> Firefox 1.0
7	wheel (standard) -> Chrome 31, Firefox 17, IE9, Firefox Mobile 17.0
8
9	//No need to use, use DOMMouseScroll
10	MozMousePixelScroll -> Firefox 3.5, Firefox Mobile 1.0
11
12	//Events
13	WheelEvent -> see wheel
14	MouseWheelEvent -> see mousewheel
15	MouseScrollEvent -> Firefox 3.5, Firefox Mobile 1.0
16*/
17(function ($) {
18
19    $.idleTimer = function (firstParam, elem) {
20        var opts;
21        if ( typeof firstParam === "object" ) {
22            opts = firstParam;
23            firstParam = null;
24        } else if (typeof firstParam === "number") {
25            opts = { timeout: firstParam };
26            firstParam = null;
27        }
28
29        // element to watch
30        elem = elem || document;
31
32        // defaults that are to be stored as instance props on the elem
33        opts = $.extend({
34            idle: false,                // indicates if the user is idle
35            timeout: 30000,             // the amount of time (ms) before the user is considered idle
36            events: "mousemove keydown wheel DOMMouseScroll mousewheel mousedown touchstart touchmove MSPointerDown MSPointerMove" // define active events
37        }, opts);
38
39        var jqElem = $(elem),
40            obj = jqElem.data("idleTimerObj") || {},
41
42            /* (intentionally not documented)
43             * Toggles the idle state and fires an appropriate event.
44             * @return {void}
45             */
46            toggleIdleState = function (e) {
47
48                var obj = $.data(elem, "idleTimerObj") || {};
49
50                // toggle the state
51                obj.idle = !obj.idle;
52
53                // store toggle state date time
54                obj.olddate = +new Date();
55
56                // create a custom event, with state and name space
57                var event = $.Event((obj.idle ? "idle" : "active") + ".idleTimer");
58
59                // trigger event on object with elem and copy of obj
60                $(elem).trigger(event, [elem, $.extend({}, obj), e]);
61            },
62            /**
63             * Handle event triggers
64             * @return {void}
65             * @method event
66             * @static
67             */
68            handleEvent = function (e) {
69
70                var obj = $.data(elem, "idleTimerObj") || {};
71
72                // this is already paused, ignore events for now
73                if (obj.remaining != null) { return; }
74
75                /*
76                mousemove is kinda buggy, it can be triggered when it should be idle.
77                Typically is happening between 115 - 150 milliseconds after idle triggered.
78                @psyafter & @kaellis report "always triggered if using modal (jQuery ui, with overlay)"
79                @thorst has similar issues on ios7 "after $.scrollTop() on text area"
80                */
81                if (e.type === "mousemove") {
82                    // if coord are same, it didn't move
83                    if (e.pageX === obj.pageX && e.pageY === obj.pageY) {
84                        return;
85                    }
86                    // if coord don't exist how could it move
87                    if (typeof e.pageX === "undefined" && typeof e.pageY === "undefined") {
88                        return;
89                    }
90                    // under 200 ms is hard to do, and you would have to stop, as continuous activity will bypass this
91                    var elapsed = (+new Date()) - obj.olddate;
92                    if (elapsed < 200) {
93                        return;
94                    }
95                }
96
97                // clear any existing timeout
98                clearTimeout(obj.tId);
99
100                // if the idle timer is enabled, flip
101                if (obj.idle) {
102                    toggleIdleState(e);
103                }
104
105                // store when user was last active
106                obj.lastActive = +new Date();
107
108                // update mouse coord
109                obj.pageX = e.pageX;
110                obj.pageY = e.pageY;
111
112                // set a new timeout
113                obj.tId = setTimeout(toggleIdleState, obj.timeout);
114
115            },
116            /**
117             * Restore initial settings and restart timer
118             * @return {void}
119             * @method reset
120             * @static
121             */
122            reset = function () {
123
124                var obj = $.data(elem, "idleTimerObj") || {};
125
126                // reset settings
127                obj.idle = obj.idleBackup;
128                obj.olddate = +new Date();
129                obj.lastActive = obj.olddate;
130                obj.remaining = null;
131
132                // reset Timers
133                clearTimeout(obj.tId);
134                if (!obj.idle) {
135                    obj.tId = setTimeout(toggleIdleState, obj.timeout);
136                }
137
138            },
139            /**
140             * Store remaining time, stop timer
141             * You can pause from an idle OR active state
142             * @return {void}
143             * @method pause
144             * @static
145             */
146            pause = function () {
147
148                var obj = $.data(elem, "idleTimerObj") || {};
149
150                // this is already paused
151                if ( obj.remaining != null ) { return; }
152
153                // define how much is left on the timer
154                obj.remaining = obj.timeout - ((+new Date()) - obj.olddate);
155
156                // clear any existing timeout
157                clearTimeout(obj.tId);
158            },
159            /**
160             * Start timer with remaining value
161             * @return {void}
162             * @method resume
163             * @static
164             */
165            resume = function () {
166
167                var obj = $.data(elem, "idleTimerObj") || {};
168
169                // this isn't paused yet
170                if ( obj.remaining == null ) { return; }
171
172                // start timer
173                if ( !obj.idle ) {
174                    obj.tId = setTimeout(toggleIdleState, obj.remaining);
175                }
176
177                // clear remaining
178                obj.remaining = null;
179            },
180            /**
181             * Stops the idle timer. This removes appropriate event handlers
182             * and cancels any pending timeouts.
183             * @return {void}
184             * @method destroy
185             * @static
186             */
187            destroy = function () {
188
189                var obj = $.data(elem, "idleTimerObj") || {};
190

191                //clear any pending timeouts
192                clearTimeout(obj.tId);
193
194                //Remove data
195                jqElem.removeData("idleTimerObj");
196
197                //detach the event handlers
198                jqElem.off("._idleTimer");
199            },
200            /**
201            * Returns the time until becoming idle
202            * @return {number}
203            * @method remainingtime
204            * @static
205            */
206            remainingtime = function () {
207
208                var obj = $.data(elem, "idleTimerObj") || {};
209
210                //If idle there is no time remaining
211                if ( obj.idle ) { return 0; }
212
213                //If its paused just return that
214                if ( obj.remaining != null ) { return obj.remaining; }
215
216                //Determine remaining, if negative idle didn't finish flipping, just return 0
217                var remaining = obj.timeout - ((+new Date()) - obj.lastActive);
218                if (remaining < 0) { remaining = 0; }
219
220                //If this is paused return that number, else return current remaining
221                return remaining;
222            };
223
224
225        // determine which function to call
226        if (firstParam === null && typeof obj.idle !== "undefined") {
227            // they think they want to init, but it already is, just reset
228            reset();
229            return jqElem;
230        } else if (firstParam === null) {
231            // they want to init
232        } else if (firstParam !== null && typeof obj.idle === "undefined") {
233            // they want to do something, but it isnt init
234            // not sure the best way to handle this
235            return false;
236        } else if (firstParam === "destroy") {
237            destroy();
238            return jqElem;
239        } else if (firstParam === "pause") {
240            pause();
241            return jqElem;
242        } else if (firstParam === "resume") {
243            resume();
244            return jqElem;
245        } else if (firstParam === "reset") {
246            reset();
247            return jqElem;
248        } else if (firstParam === "getRemainingTime") {
249            return remainingtime();
250        } else if (firstParam === "getElapsedTime") {
251            return (+new Date()) - obj.olddate;
252        } else if (firstParam === "getLastActiveTime") {
253            return obj.lastActive;
254        } else if (firstParam === "isIdle") {
255            return obj.idle;
256        }
257
258        /* (intentionally not documented)
259         * Handles a user event indicating that the user isn't idle. namespaced with internal idleTimer
260         * @param {Event} event A DOM2-normalized event object.
261         * @return {void}
262         */
263        jqElem.on($.trim((opts.events + " ").split(" ").join("._idleTimer ")), function (e) {
264            handleEvent(e);
265        });
266
267
268        // Internal Object Properties, This isn't all necessary, but we
269        // explicitly define all keys here so we know what we are working with
270        obj = $.extend({}, {
271            olddate : +new Date(),          // the last time state changed
272            lastActive: +new Date(),       // the last time timer was active
273            idle : opts.idle,               // current state
274            idleBackup : opts.idle,         // backup of idle parameter since it gets modified
275            timeout : opts.timeout,         // the interval to change state
276            remaining : null,               // how long until state changes
277            tId : null,                     // the idle timer setTimeout
278            pageX : null,                   // used to store the mouse coord
279            pageY : null
280        });
281
282        // set a timeout to toggle state. May wish to omit this in some situations
283        if (!obj.idle) {
284            obj.tId = setTimeout(toggleIdleState, obj.timeout);
285        }
286
287        // store our instance on the object
288        $.data(elem, "idleTimerObj", obj);
289
290        return jqElem;
291    };
292
293    // This allows binding to element
294    $.fn.idleTimer = function (firstParam) {
295        if (this[0]) {
296            return $.idleTimer(firstParam, this[0]);
297        }
298
299        return this;
300    };
301
302})(jQuery);