|
1
|
$(function() {
|
|
2
|
|
|
3
|
// append modal to <body>
|
|
4
|
$body.append('<div class="uk-modal" id="modal_idle">' +
|
|
5
|
'<div class="uk-modal-dialog">' +
|
|
6
|
'<div class="uk-modal-header">' +
|
|
7
|
'<h3 class="uk-modal-title">Your session is about to expire!</h3>' +
|
|
8
|
'</div>' +
|
|
9
|
'<p>You\'ve been inactive for a while. For your security, we\'ll log you out automatically.</p>' +
|
|
10
|
'<p>Click "Stay Online" to continue your session.</p>' +
|
|
11
|
'<p>Your session will expire in <span class="uk-text-bold md-color-red-500" id="sessionSecondsRemaining"></span> seconds.</p>' +
|
|
12
|
'<div class="uk-modal-footer uk-text-right">' +
|
|
13
|
'<button id="staySigned" type="button" class="md-btn md-btn-flat uk-modal-close">Stay Online</button><button type="button" class="md-btn md-btn-flat md-btn-flat-primary" id="logoutSession">Logout</button>' +
|
|
14
|
'</div>' +
|
|
15
|
'</div>' +
|
|
16
|
'</div>');
|
|
17
|
|
|
18
|
var modal = UIkit.modal("#modal_idle", {
|
|
19
|
bgclose: false
|
|
20
|
}),
|
|
21
|
session = {
|
|
22
|
//Logout Settings
|
|
23
|
inactiveTimeout: 5000, //(ms) The time until we display a warning message
|
|
24
|
warningTimeout: 30000, //(ms) The time until we log them out
|
|
25
|
minWarning: 5000, //(ms) If they come back to page (on mobile), The minumum amount, before we just log them out
|
|
26
|
warningStart: null, //Date time the warning was started
|
|
27
|
warningTimer: null, //Timer running every second to countdown to logout
|
|
28
|
autologout: {
|
|
29
|
logouturl: "login.html"
|
|
30
|
},
|
|
31
|
logout: function () { //Logout function once warningTimeout has expired
|
|
32
|
window.location = session.autologout.logouturl;
|
|
33
|
}
|
|
34
|
},
|
|
35
|
$sessionCounter = $('#sessionSecondsRemaining').html(session.warningTimeout/1000);
|
|
36
|
|
|
37
|
$(document).on("idle.idleTimer", function (event, elem, obj) {
|
|
38
|
//Get time when user was last active
|
|
39
|
var diff = (+new Date()) - obj.lastActive - obj.timeout,
|
|
40
|
warning = (+new Date()) - diff;
|
|
41
|
|
|
42
|
//On mobile js is paused, so see if this was triggered while we were sleeping
|
|
43
|
if (diff >= session.warningTimeout || warning <= session.minWarning) {
|
|
44
|
modal.hide();
|
|
45
|
} else {
|
|
46
|
//Show dialog, and note the time
|
|
47
|
$sessionCounter.html(Math.round((session.warningTimeout - diff) / 1000));
|
|
48
|
modal.show();
|
|
49
|
session.warningStart = (+new Date()) - diff;
|
|
50
|
|
|
51
|
//Update counter downer every second
|
|
52
|
session.warningTimer = setInterval(function () {
|
|
53
|
var remaining = Math.round((session.warningTimeout / 1000) - (((+new Date()) - session.warningStart) / 1000));
|
|
54
|
if (remaining >= 0) {
|
|
55
|
$sessionCounter.html(remaining);
|
|
56
|
} else {
|
|
57
|
session.logout();
|
|
58
|
}
|
|
59
|
}, 1000)
|
|
60
|
}
|
|
61
|
});
|
|
62
|
|
|
63
|
$body
|
|
64
|
//User clicked ok to stay online
|
|
65
|
.on('click','#staySigned', function () {
|
|
66
|
clearTimeout(session.warningTimer);
|
|
67
|
modal.hide();
|
|
68
|
})
|
|
69
|
//User clicked logout
|
|
70
|
.on('click','#logoutSession', function () {
|
|
71
|
session.logout();
|
|
72
|
});
|
|
73
|
|
|
74
|
//Set up the timer, if inactive for 5 seconds log them out
|
|
75
|
$(document).idleTimer(session.inactiveTimeout);
|
|
76
|
|
|
77
|
});
|