Jquery timeout code not re-running after first time user extends session

Question

I wrote a Jquery function that blacks out the screen after a certain amount of inactivity, creates a pop-up that allows the user to click a button to stay logged in, and logs them out (closing the application window) if they do not respond in time.

The environment is ASP.NET (VB). We don't technically use master pages, but we do have a parent page in which our header, footer and nav reside, and my Jquery code is called from that window, loaded via an IFrame.

I've got a function in the child window that reports activity (currently keydown, mousedown and blur) to the parent window, and resets the timer. My code seems to be working fine, except in one scenario. If the user is prompted with the timeout warning, and then they click the button to continue their session, if they take no action on the page (mouseclick, keydown, etc.) then the timeout code is not running a second time.

Here is my main jquery function:

function pop_init() {
    // show modal div
    $("html").css("overflow", "hidden");
    $("body").append("<div id='popup_overlay'></div><div id='popup_window'></div>");
    //$("#popup_overlay").click(popup_remove);  // removed to make sure user clicks button to continue session.
    $("#popup_overlay").addClass("popup_overlayBG");
    $("#popup_overlay").fadeIn("slow");

    // build warning box
    $("#popup_window").append("<h1>Warning!!!</h1>");
    $("#popup_window").append("<p id='popup_message'><center>Your session is about to expire.  Please click the button below to continue working without losing your session.</center></p>");
    $("#popup_window").append("<div class='buttons'><center><button id='continue' class='positive' type='submit'><img src='images/green-checkmark.png' alt=''/> Continue Working</button></center></div>");

    // attach action to button
    $("#continue").click(session_refresh);

    // display warning window
    popup_position(400, 300);
    $("#popup_window").css({ display: "block" }); //for safari using css instead of show
    $("#continue").focus();
    $("#continue").blur();

    // set pop-up timeout
    SESSION_ALIVE = false;
    window.setTimeout(popup_expired, WARNING_TIME);
}

Here is the code from the parent window:

<script language="javascript" type="text/javascript">
            var timer = false;
            window.reportChildActivity = function() {
                if (timer !== false) {
                    clearTimeout(timer);
                }
                //SESSION_ALIVE = true;
                timer = window.setTimeout(pop_init, SESSION_TIME);
            }
  </script>

Here is the code from the child window:

<script type="text/javascript">
    $(document).ready(function() {
        window.parent.reportChildActivity();
    });
</script>
<script type="text/javascript">
    $(document).bind("mousedown keydown blur", function() {        
            window.parent.reportChildActivity();
    });

The last script runs in a file (VB.NET ascx file) that builds the header/menu options for every page in our system.

The last line in the pop_init function clearly should be re-starting the timer, but for some reason it doesn't seem to be working.

Thanks for any help and insight you may have.

Forgot to add my code for the session_refresh function:

function session_refresh() {
    SESSION_ALIVE = true;
    $(".buttons").hide();
    $("#popup_message").html("<center><br />Thank you!  You may now resume using the system.<br /></center>");
    window.setTimeout(popup_remove, 1000);
    $("#popup_window").fadeOut("slow", function() { $('#popup_window,#popup_overlay').trigger("unload").unbind().remove(); });
    var timer = false;
    window.reportChildActivity = function() {
        if (timer !== false) {
            clearTimeout(timer);
        }
        timer = window.setTimeout(pop_init, SESSION_TIME);
    }
}

Answer 1

You need to restart your timer after the user clicks the button.

Answer 2

use this: http://www.erichynds.com/jquery/a-new-and-improved-jquery-idle-timeout-plugin/

Answer 3

Well, I seem to have fixed the problem by changing this:

var timer = false;
    window.reportChildActivity = function() {
        if (timer !== false) {
            clearTimeout(timer);
        }
        timer = window.setTimeout(pop_init, SESSION_TIME);
    }

to this:

if (timer !== false) {
            clearTimeout(timer);
        }
        timer = window.setTimeout(pop_init, SESSION_TIME);

I didn't need to re-declare the reportChildActivity function as I was.