Show Popup after 10min of inactive

Question

Hello, can't find a code :x Can someone post, or explain how can i make a Popup after 10minutes of inactive ?

When member is inactive of 10minutes after Page is loaded, the members will get a Popup with some Buttons and Text

<div>
    <p>Away from keyboard?</p>
    <ul class="button">
        <li><a href="#0">I'm Back!</a></li>
    </ul>
</div>

Perhaps try the solution provided here http://stackoverflow.com/questions/667555/detecting-idle-time-in-javascript-elegantly — Joseph Young, Dec 21 '15 at 21:00

score 1 · Answer 1 · edited May 23 '17 at 12:31

1

 var seconds = 0;
        var timeoutCounter = setInterval(function(){
        seconds++;
        if(sec == 600) {
    // do stuff to launch popup
    clearInterval(timeoutCounter);
    }
        }, 1000);


    $(document).mousemove(function (e) {
clearInterval(timeoutCounter);
        seconds = 0;
    setInterval(timeoutCounter);
        });
        $(document).keypress(function (e) {
            clearInterval(timeoutCounter);
            seconds = 0;
    setInterval(timeoutCounter);
        });

This basically runs every second - and if it's the 600th second, it quits after running your code.

Source for idle checking

edited May 23 '17 at 12:31

Community

1
1

answered Dec 21 '15 at 20:59

itamar

3,837
5
35
60

You don't check if the user is idle or not. You have to monitor mouse / keyboard. – Ilya Dec 21 '15 at 21:02
@Ilya The person who owns the page should be able to set seconds = 0, when the user makes a meaningful interaction. Sometimes you don't want to do that too generically. – spozun Dec 21 '15 at 21:05
This is not working for what the OP is asking for 'after 10 minutes of inactive ' so I suggest you to let the OP know that or to update your answer with a note. – Franco Dec 21 '15 at 21:10
@Ilya and Franco you're absolutely right. Added the idle checker. – itamar Dec 21 '15 at 21:27

score 0 · Answer 2 · edited Dec 21 '15 at 21:45

Attach the events to the document object along with the setTimeout method to display the popup. One way to do it is

var popupTimer,
        TIME_OUT = 600;

// function that displays the popup
function displayPopup() {
    // display the popup here
}

// Set the timeout to display the popup
popupTimer = setTimeout(displayPopup, TIME_OUT);

// attch events to the document object
// you can add more events here based on
// what events you want to track
$(document).on('click change keypress', function() {

  // clear the timeout whenever the event is handled
  clearTimeout(popupTimer);

  // Reset the timer
  popupTimer = setTimeout(displayPopup, TIME_OUT);
});

Show Popup after 10min of inactive

2 Answers2

Linked

Related