javascriptjquerysetinterval

Increase setInterval time over time?


I'm using this code to run a function every x seconds as long as there are no mouse movements or keys pressed. How can I increase the timer with 2x the value for every round as long as there is no user activity and cap it at 300000?

This is what I have so far, but I guess I need to actually get my time variable into the the setInterval again as it's been updated.

var idleTime = 0;
var time = 5000;
$(document).ready(function () {
    // Zero the idle timer on mouse movement.
    $(this).on('mousemove', function (e) {
        idleTime = 0;
        time = 5000;
    });
    $(this).on('keypress', function (e) {
        idleTime = 0;
        time = 5000;
    });
    var idleInterval = setInterval(timerIncrement, time);
});

function timerIncrement() {
    idleTime = idleTime + 1;
    if (idleTime > 1) {
        time = time*2;
        if( time > 300000 ) { time = 300000; }
        refreshContent();
    }
}

Solution

  • I have modified your code to this, I think this is what you need see console after running (don't move your mouse it will reset timer),

    var time = 5000;
    var idleInterval;
    $(document).ready(function () {
        
        idleInterval = setInterval(timerIncrement, time);
        
        $(this).on('mousemove', function (e) {
            idleTime = 0;
            time = 5000;
        	clearInterval(idleInterval);
        	idleInterval = setInterval(timerIncrement, time);
        });
        $(this).on('keypress', function (e) {
            idleTime = 0;
            time = 5000;
        	clearInterval(idleInterval);
        	idleInterval = setInterval(timerIncrement, time);
        });
    });
    
    function timerIncrement() {
    
        console.log('refreshContent is called after '+time+' milliseconds');
        refreshContent();
    
        time = time*2;
        if( time > 300000 ) { time = 300000; }
        clearInterval(idleInterval);
        idleInterval = setInterval(timerIncrement, time);
    }	
    function refreshContent()
    {
        console.log('Stuffs you want to do when refresh content is called');
    }
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>