We Keep Coding

Inactivity on the page, how to make a window? [duplicate]

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>I'm Back!</li>
</ul>
</div>

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

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);
});

function always ignore the first argument?

I have a content that will show when we scroll.
when the content show, user can close it. If user choose to close it and then refresh the page. Even user scroll up the page, the content will not show up until 10 minutes.
heres my code:
var popUp= document.getElementById("popup");
var closePopUp= document.getElementsByClassName('popup-close');
var halfScreen= document.body.offsetHeight/2;
var showOnce = true;
var delay;
function slideUp(){
popUp.style.maxHeight="400px";
popUp.style.padding="10px 20px";
popUp.style.opacity="1";
if(popUp.className==="closed"){
popUp.className="";
}
}
function slideDown(){
popUp.style.maxHeight="0";
popUp.style.padding="0 20px";
popUp.style.opacity="0";
// add class closed for cache
if(popUp.className===""){
popUp.className="closed";
localStorage.setItem('closed', 'true'); //store state in localStorage
}
}
I set the interval for user that close the content than refresh the page
// start interval
function startDelay() {
delay = setInterval(slideUp, 1000);
}
// clear interval
function clearDelay() {
window.clearTimeout(delay);
}
// check if cache heve class close
window.onload = function() {
var closed = localStorage.getItem('closed');
if(closed === 'true'){
popUp.className="closed";
}
}
here, I put 2 arguments for first time visit and multiple time
// show popup when scroll 50%
window.onscroll = function scroll(ev) {
// first time visited
if ((popUp.className==="closed" && window.innerHeight+window.scrollY) >= halfScreen && showOnce){
startDelay();
showOnce = false;
}
// same user multiple time visited the site
else if((popUp.className==="" && window.innerHeight+window.scrollY) >= halfScreen && showOnce){
slideUp();
showOnce = false;
}
};
// close button when click close
for(var i = 0; i<closePopUp.length; i++){
closePopUp[i].addEventListener('click', function(event) {
slideDown();
});
}
when I first time open the page, the content show up, and it gets closed class when I choose to close the content (it's correct). But after I scroll to top refresh the page, its show with interval (correct too).
problem:
1. if i refresh not on top of page, the content will show immediatly.
2. after i refresh and scroll and close the content. the content show again.
its like it read the function again? please help

javascript autologout for inactivity for 10 minutes

hello all i am writing a code for auto logout for inactivity for about 20 minutes which should interact with keyboard as well as mouse and i have following code which works for most of the function but it is not resetting the timer for mouse movement and keyboard activity.
var timoutWarning = 9000; // Display warning in 14 Mins.
var timoutNow = 9000; // Warning has been shown, give the user 1 minute to interact
var logoutUrl = 'logout.php'; // URL to logout page.
var warningTimer;
var timeoutTimer;
// Start warning timer.
function StartWarningTimer() {
warningTimer = setTimeout("IdleWarning()", timoutWarning);
}
// Reset timers.
function ResetTimeOutTimer() {
clearTimeout(timeoutTimer);
StartWarningTimer();
$("#timeout").hide();
}
// Show idle timeout warning dialog.
function IdleWarning() {
clearTimeout(warningTimer);
timeoutTimer = setTimeout("IdleTimeout()", timoutNow);
$("#timeout").show();
}
// Logout the user.
function IdleTimeout() {
window.location = logoutUrl;
}
$( document ).ready(function() {
StartWarningTimer();
});
$('html').mousemove(function() {
ResetTimeOutTimer();
});
i want the code should intract with mouse movement and keyboard press
all kind of help is appreciated please suggest me something

At first, you should not use setTimeout this way - inactive tabs getting slower, so there's no guarantee that your code will be executed in 14 minute. The better way to do that is to check repeatedly the elapsed time.
var startTime = +new Date();
function checkForWarning () {
if (+new Date() - startTime > maxInactiveTime) {
// show warning
}
}
You can track activity this way:
$(document)
.on('click', ResetTimeOutTimer)
.on('mousemove', ResetTimeOutTimer);
Hope it helps.

setTimeout function if user not active

I can do something such as the following every 30 seconds to reload the page, and the backend logic will determine which session have been invalidated:
setInterval(function () {
location.reload()
}, 30000);
However, how would I only run this 30s location.reload() if the user is not active? For example, how banks will have a user-timeout if the user has not been active on the page (which only starts counting after the user is 'inactive'). How would this be done?

One way is to track mousemoves. If the user has taken focus away from the page, or lost interest, there will usually be no mouse activity:
(function() {
var lastMove = Date.now();
document.onmousemove = function() {
lastMove = Date.now();
}
setInterval(function() {
var diff = Date.now() - lastMove;
if (diff > 1000) {
console.log('Inactive for ' + diff + ' ms');
}
}, 1000);
}());

First define what "active" means. "Active" means probably, sending a mouse click and a keystroke.
Then, design your own handler for these situations, something like this:
// Reseting the reload timer
MyActivityWatchdog.prototype.resetReloadTimer = function(event) {
var reloadTimeInterval = 30000;
var timerId = null;
...
if (timerId) {
window.clearInterval(timerId);
}
timerId = window.setInterval( reload... , reloadTimeInterval);
...
};
Then, make sure the necessary event handler will call resetReloadTimer(). For that, you have to look what your software already does. Are there key press handlers? Are there mouse movement handlers? Without knowing your code, registering keypress or mousemove on document or window and could be a good start:
window.onmousemove = function() {
...
activityWatchdog.resetReloadTimer();
...
};
But like this, be prepared that child elements like buttons etc. won't fire the event, and that there are already different event handlers. The compromise will be finding a good set of elements with registered handlers that makes sure "active" will be recognized. E.g. if you have a big rich text editor in your application, it may be enough to register only there. So maybe you can just add the call to resetReloadTimer() to the code there.

To solve the problem, use window blur and focus, if the person is not there for 30 seconds ,it will go in the else condition otherwise it will reload the page .
setTimeout(function(){
$(window).on("blur focus", function(e) {
var prevType = $(this).data("prevType");
if (prevType != e.type) { // reduce double fire issues
switch (e.type) {
case "blur":
$('div').text("user is not active on page ");
break;
case "focus":
location.reload()
break;
}
}
$(this).data("prevType", e.type);
})},30000);
DEMO : http://jsfiddle.net/rpawdg6w/2/

You can check user Session in a background , for example send AJAX call every 30 - 60 seconds. And if AJAX's response will be insufficient (e.g. Session expired) then you can reload the page.
var timer;
function checkSession() {
$.ajax({
url : 'checksession.php',
success: function(response) {
if (response == false) {
location.reload();
}
}
});
clearTimeout(timer);
timer = setTimeout(checkSession,30 * 1000);
}
checkSession();

Close popup after x minutes unless there was activity

I have a link that when clicked, opens a new window using:
var win = window.open(url,....);
This window contains a flash game.
I want to close the window after 20 minutes of inactivity.
I know I can create a timeout using:
var t = setTimeout("dosomething()", 5000)
But how can I figure out if there was activity or not on the popup?
If the user interacts with the flash, can I get this information still via the dom events?
I want to avoid the situation of closing the window while they are playing :)
This is in a IE based environment.

theInterval = 0;
function doSomething(){
do something;
}
function ScheduleDoSomething(){
theInterval = setInterval(function () {
doSomething();}, timeToClose);
}
jQuery(document).keydown(function (e) {
clearInterval(theInterval);scheduleDoSomething();
});
I hope this helps.

How about adding a listening event for the mousemove, keypress, and click events and clearing the timer every time the events happen.
var t = setTimeout(closeWindow, 5000);
$(document).on('mousemove keypress click', function(){
clearTimeout(t);
t = setTimeout(closeWindow, 5000);
});
function closeWindow(){
window.close();
}