Stop UpdatePanel when Inactive

Question

Hi I would like to do the following:

Use JavaScript to stop the update panel from "updating" when the browser is inactive, and restart once it’s active again. I was looking at: Inacivity with JavaScript. I was hoping that I could use this to accomplish what I want; can someone point me in the right direction? Thank you very much!

[EDIT] I am using a Timer for the updates so if I can somehow disable the Timer from JavaScript I think I can do this.

Answer 1

I recommend reading this book: http://oreilly.com/catalog/9780596527471/. It tells you everything you need to know about the ASP.NET AJAX UpdatePanel Control. For API documentation please visit: http://msdn.microsoft.com/nb-no/library/bb311028(en-us).aspx.

Answer 2

What's about taking advantage of current window object's 'mousemove' event? If mouse has been moved, set the timer for 1 min or so, and deactivate event. Repeat this cycle using setInterval().

It would also help, if the user had snoozed for a while.

Answer 3

add this script inside the head event,

---

"<"script type ="text/javascript">

        var timerEnabled = true;

    function ToggleTimer(btn, timerID)
    {
        // Toggle the timer enabled state
        timerEnabled = !timerEnabled;

        // Get a reference to the Timer
        var timer = $find(timerID);
        if (timerEnabled)
        { 
            btn.value = 'Pause';
            // Start timer
            timer._startTimer();
        }
        else
        {
            btn.value = 'Resume'; 
            // Stop timer
            timer._stopTimer();
        }

    }
</script>*

add an asp.net label control inside the update panel for testing

<asp:Label Id = "Label1" Text = "" runat="server"/>

add an html button outside the update pannel

<input type ="button" id = "btntimercontroller" value = "Pause" onclick ="return ToggleTimer(btntimercontroller,'<%= ajaxtimer.ClientID%>' );"/>

to check if the timer stops add this code in aspx.cs file

---

protected void Page_Load(object sender, EventArgs e)

 {

      Label1.Text = DateTime.Now.ToLongTimeString();

 }

Just omit the (") mark in the Script because it will cause an error...

Answer 4

window.blur = function() { stopTimer() }
window.focus = function() { startTimer() }

browser compatibility may apply. Hope this helps.

Answer 5

I found a potential solution here: http://www.thefutureoftheweb.com/blog/detect-browser-window-focus

i only have IE8 to test with right now, which has a couple issues. first, clicking around the various elements on a page will fire the focusin event, so you need a way to check if the timer is already running. that's not too hard. ie8 also fires the focusout event while you're clicking around, so we have to delay the actual timer stoppage to make sure the window doesn't actually have focus. fortunately ie8 appears to always fire focusin right after focusout while you're clicking on the page, so we can cancel a pending timer shutdown on the focusin handler.

i think this should be pretty close to a working solution. (adapted from the link)

// indicates if your refresh timer is running
var updatePanelTimerRunning = true;

// timer id for shutdown procedure
var killTimerID = -1;

function stopTimer(e) {
    // prepare to shutdown
    if (updatePanelTimerRunning && killTimerID == -1) {
        killTimerID = setTimeout(timerShutdown, 1000);
    }
}

function startTimer(e) {

    // cancel pending timer shutdown
    clearTimeout(killTimerID);
    killTimerID = -1;

    if (!updatePanelTimerRunning) {
        // TODO start the update panel refresh timer here
        updatePanelTimerRunning = true;
    }
}

function timerShutdown() {
    // TODO do actual update panel timer stopping here.
    updatePanelTimerRunning = false;
}


if (/*@cc_on ! @*/ false) { // check for Internet Explorer

    document.attachEvent('onfocusin', startTimer);
    document.attachEvent('onfocusout', stopTimer);
}
else {
    // window.onfocus = stopTimer;
    // window.onblur = startTimer;

    window.addEventListener('focus', startTimer, false);
    window.addEventListener('blur', stopTimer, false);
}