Thursday, May 10, 2012

Automatic Log Off Using JQuery

Automatic Log Off Using JQuery

Plugin : Idle Plugin

The plugin is actually created by Erich Hynds

This is one of the greatest plugin used for Automatic Logging Off the Account when the user sits idle for a couple of minutes.

Add scripts in the page, both idletimer.js and idletimeout.js

Here is the DOM structure

<div id="idletimeout">
    You will be logged off in  
    <span><!-- countdown place holder --></span> 
    &nbsp;seconds due to inactivity. 
    <a id="idletimeout-resume" href="#">
      Click here to continue using this web page 
    </a>.
</div>
 
This is the java script that is to be used for this plugin to use
 
$.idleTimeout('#idletimeout', '#idletimeout a', {
 idleAfter: 5,//to show the warning bar after 5 seconds
 pollingInterval: 2,//this is the time after which server url is intimated 
 keepAliveURL: 'keepalive.php', //to keep the server session alive
 serverResponseEquals: 'OK',
 onTimeout: function(){
  $(this).slideUp();
  window.location = "timeout.htm";
 },
 onIdle: function(){//showing the bar of warning
  $(this).slideDown(); // show the warning bar
 },
 onCountdown: function( counter ){ //countdown timer
  $(this).find("span").html( counter ); // update the counter
 },
 onResume: function(){ //hiding the warning bar 
  $(this).slideUp(); // hide the warning bar
 }
});