Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Timer with less clear/setTimeout calls...
$(window).bind('mousemove mousedown mouseup scroll keydown keyup focus', debounce(10E3, function() {
	// idle
}));
// Requires timer.js
function debounce( delay, callback, timer ) {
timer = timer || Timer();
return function() {
timer.set( delay, callback, this, arguments );
};
}
$(window).mousemove(silencer(function(e) {
	document.body.innerHTML = '<h1>x=' + e.pageX + ' y=' + e.pageY + '</h1>';
}, 800, 100));

In this example mousemove is handled every 800ms, and once after 100ms mouse is resting.

Demo 1, Demo 2

// Requires timer.js
function silencer( callback, delay, timeout ) {
var delay_until = 0,
timer = Timer(),
now = Date.now || function(){ return +new Date(); };
timeout = timeout || delay;
function step() {
delay_until = now() + delay;
callback.apply( this, arguments );
}
return function() {
if ( now() < delay_until ) {
timer.set( timeout, step, this, arguments );
} else {
timer.clear();
step.apply( this, arguments );
}
};
}
var Timer = (function( G ) {
return function Timer( g ) {
g = g || G;
var noargs = [],
timer_id,
callback,
context,
args;
function onTimeout() {
var _callback = callback,
_context = context,
_args = args;
timer_id = callback = context = args = 0;
_callback.apply( _context, _args || noargs );
}
return {
set: function( delay, _callback, _context, _args ) {
callback = _callback;
context = _context;
args = _args;
timer_id && g.clearTimeout( timer_id );
timer_id = g.setTimeout( onTimeout, delay );
return this;
},
clear: function() {
if ( timer_id ) {
g.clearTimeout( timer_id );
timer_id = callback = context = args = 0;
}
return this;
}
};
};
})( this );
// Timer implementation that reduces setTimeout/clearTimeout calls.
// NOTE: something worse accuracy in not WebKit browsers (JS time accuracy).
var Timer = (function( G ) {
return function Timer( g ) {
g = g || G;
var noargs = [],
Date = g.Date,
now = Date.now || function(){ return +new Date(); },
timer_id,
end_time,
callback,
context,
args;
function onTimeout() {
var dt = end_time - now();
if ( dt > 0 ) {
timer_id = g.setTimeout( onTimeout, dt );
} else {
var _callback = callback,
_context = context,
_args = args;
timer_id = callback = context = args = 0;
_callback.apply( _context, _args || noargs );
}
}
return {
set: function( delay, _callback, _context, _args ) {
var t = end_time;
end_time = now() + delay;
callback = _callback;
context = _context;
args = _args;
if ( !timer_id || end_time < t ) {
timer_id && g.clearTimeout( timer_id );
timer_id = g.setTimeout( onTimeout, delay );
}
return this;
},
clear: function() {
if ( timer_id ) {
g.clearTimeout( timer_id );
timer_id = callback = context = args = 0;
}
return this;
}
};
};
})( this );
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment