Thanks Adrian,
For some reason I was thinking user_session_length was days (not hours), so ignore my decimal numbers in the original post.
The auto logout code below works fine, but I am wondering if updating the session would be better accomplished with 2 globals (get_session_date & set_session_date) instead of the ajax call I am making to force the session to update?
I did try using a <%get_session_date%> global, but for some reason the session_date was always wrong when I pulled it from the database (last digit always off by 2) and session_date was not updating at all when I tried to use a <%set_session_date' global%> :-/
The biggest problem/concern I have with my working solution is that I am updating the session 'onclick'. I would prefer to update the session only when there is a click on an actual link (not a click anywhere on the page). Basically I would like to update the session whenever the Links SQL base code would do a session update.
My reason for needing an auto-logout feature is that I load some of my page #content via ajax, and if a session expires while sitting on an ajax-loaded page, any subsequent click redirects to the the login page, but the entire site was loading into the #content div of the page. Auto logout circumvents the problem by logging user out after warning them.
My javascript code is below. Suggestions for improvement would be appreciated. Uses jQuery to display the dialog, calendar and tabs. I've attached a screen grab.
File: /local/include_common_head.html
Code:
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script>
<%if user.Username~%>
<%Links::Config::load_vars%>
var _second = 1000;
var _minute = _second * 60;
var _hour = _minute * 60;
var _day = _hour *24
var _expire_time = ("<%cfg_user_session_length%>" * 3600000); // (60 * 60 * 1000) for milliseconds
var _warn_time = 30000; // warn user 30 seconds before session expires. 0 for no warning
var closed = true;
var start = new Date().getTime();
var end = start + _expire_time;
var wait_time = end - start;
var timer;
var expire_countdown;
function showRemaining() {
var now = new Date().getTime();
var distance = end - now;
if (distance < 0 ) {
clearInterval( expire_countdown ); // stop the timer from continuing ..
} else {
var days = Math.floor(distance / _day);
var hours = Math.floor( (distance % _day) / _hour);
var minutes = Math.floor( (distance % _hour) / _minute);
var seconds = Math.floor( (distance % _minute) / _second);
var dialogElement = document.getElementById('session_end_time');
dialogElement.innerHTML = seconds;
var countdownElement = document.getElementById('test_counter');
countdownElement.innerHTML = 'Session Expires in: ';
countdownElement.innerHTML += days + ' Days ';
countdownElement.innerHTML += hours + ' Hours ';
countdownElement.innerHTML += minutes + ' Minutes ';
countdownElement.innerHTML += seconds + ' Seconds';
}
}
expire_countdown = setInterval(showRemaining, 1000); // Always show counter (only for testing)
function checkExpire_init() {
timer=setInterval(auto_logout, wait_time - _warn_time);
$("#dialog").dialog({
autoOpen: false,
modal: true,
position: 'top',
resizable: false,
title: 'Session Ending Soon',
show: 'blind',
hide: 'explode',
width: 450,
position: ['center',140],
buttons: {
"Resume": function() {
$(this).dialog("close");
closed = true;
clearInterval(expire_countdown);
reset_timer();
registerEvent(window, 'onclick', reset_timer);
} ,
"Log Out": function() {
$(this).dialog("destroy");
closed = true;
clearInterval(expire_countdown);
clearInterval(timer);
window.location="<%config.db_cgi_url%>/user.cgi?logout=1";
}
}
});
}
function auto_logout() {
if(_warn_time > 0) {
unregisterEvent(window, 'onclick', reset_timer);
$("#dialog").dialog('open');
closed = false;
expire_countdown = setInterval(showRemaining, 1000);
setTimeout(function() {
if (closed !== true) {
$("#dialog").dialog('destroy');
closed = true;
clearInterval(expire_countdown);
clearInterval(timer);
window.location="<%config.db_cgi_url%>/user.cgi?logout=1";
}
}, _warn_time);
} else {
clearInterval(timer);
window.location="<%config.db_cgi_url%>/user.cgi?logout=1";
}
}
function reset_timer() {
start = new Date().getTime();
end = start + _expire_time;
wait_time = end - start;
$.ajax({
url: '#',
async: false,
});
clearInterval(timer);
timer=setInterval(auto_logout, wait_time - _warn_time);
}
registerEvent(window, 'onclick', reset_timer);
<%~endif%>
$(document).ready(function(){
<%if user.Username~%>
checkExpire_init();
<%~endif%>
});
</script>
File: local/include_header.html
Code:
<div id="dialog" name="dialog" style="display:none;">
<p align="left">For security, you are about to be logged out due to inactivity.</p>
<p align="left">Unless you click Resume, you will be logged out in <span id="session_end_time">30</span> seconds.</p>
</div>
File: include_content_top.html (to show continual countdown/resetting for testing)
Code:
<div id="test_counter">no session</div><br/>
So thanks again to anyone who has suggestions to improve this Auto logout or session expiration warning system.
RGB World, Inc. - Software & Web Development.
rgbworld.com