Javascript auto logout code
Conceptually, you only need 1 timer running at a time. One timer that runs for 14 minutes and another that runs for another minute (15 minutes total). Once the 14 minute timer runs out, kill it and then start the 1 minute timer. If that one minute timer runs out, log the user out. If the user presses the "Stay Logged In" button, kill the 1 minute timer and restart the 14 minute timer. Rinse and repeat.
I changed your code the best I could. Hope you get the point.
// Set timeout variables.
var timoutWarning = 840000; // Display warning in 14 Mins.
var timoutNow = 60000; // Warning has been shown, give the user 1 minute to interact
var logoutUrl = 'logout.php'; // URL to logout page.
var warningTimer;
var timeoutTimer;
// Start warning timer.
function StartWarningTimer() {
warningTimer = setTimeout("IdleWarning()", timoutWarning);
}
// Reset timers.
function ResetTimeOutTimer() {
clearTimeout(timeoutTimer);
StartWarningTimer();
$("#timeout").dialog('close');
}
// Show idle timeout warning dialog.
function IdleWarning() {
clearTimeout(warningTimer);
timeoutTimer = setTimeout("IdleTimeout()", timoutNow);
$("#timeout").dialog({
modal: true
});
// Add code in the #timeout element to call ResetTimeOutTimer() if
// the "Stay Logged In" button is clicked
}
// Logout the user.
function IdleTimeout() {
window.location = logoutUrl;
}
update to @VtoCorleone's answer :
var warningTimeout = 840000;
var timoutNow = 60000;
var warningTimerID,timeoutTimerID;
function startTimer() {
// window.setTimeout returns an Id that can be used to start and stop a timer
warningTimerID = window.setTimeout(warningInactive, warningTimeout);
}
function warningInactive() {
window.clearTimeout(warningTimerID);
timeoutTimerID = window.setTimeout(IdleTimeout, timoutNow);
$('#modalAutoLogout').modal('show');
}
function resetTimer() {
window.clearTimeout(timeoutTimerID);
window.clearTimeout(warningTimerID);
startTimer();
}
// Logout the user.
function IdleTimeout() {
document.getElementById('logout-form').submit();
}
function setupTimers () {
document.addEventListener("mousemove", resetTimer, false);
document.addEventListener("mousedown", resetTimer, false);
document.addEventListener("keypress", resetTimer, false);
document.addEventListener("touchmove", resetTimer, false);
document.addEventListener("onscroll", resetTimer, false);
startTimer();
}
$(document).on('click','#btnStayLoggedIn',function(){
resetTimer();
$('#modalAutoLogout').modal('hide');
});
$(document).ready(function(){
setupTimers();
});
I had to do the same functionality for our project. Used the following code:-
<script>
$(document).click(function(){
if(typeof timeOutObj != "undefined") {
clearTimeout(timeOutObj);
}
timeOutObj = setTimeout(function(){
localStorage.clear();
window.location = "/";
}, 1200000); //will expire after twenty minutes
});
</script>
The above code will set a timer every time we click anywhere on the screen. In case we don't click it auto-logs out to home screen.