AngularJS Focus Only Timeouts

Today’s blog is about a little factory I created to solve a particularly interesting problem, basically we have a timer on our page that updates every second and I didn’t want or need that timer to update whilst not on the page so I developed a widget that does the following:

– Only runs the timeout when the page is focussed.
– Allows the pausing and un-pausing of all timeouts registered with it.
– Allows pausing of individual timeouts by name.
– Allows removing timeouts from the page.

You can download the file with all my modules in it here: http://www.mediafire.com/?96p8pk72u0h2rfr and see an example in a JS fiddle here: http://jsfiddle.net/Xanetia/xuBV7/

The JSFiddle has some issues due to it being in frames or something like that, but does work if you run it in a new tab/window (you should be able to right click and select “Open in new…”).

For using the factory, the functions you will need to use are:

FocusOnlyTimeouts.addTimeout(unique_name_string, function, timeout_in_milliseconds); //runs the function passed as if used in a recursive timeout function. - note that the function must be a reference or a function itself, ie example not example() otherwise the function will only be run when the timeout is added to the factory.

FocusOnlyTimeouts.pauseTimeout(unique_name_string);//pauses the named timeout

FocusOnlyTimeouts.unpauseTimeout(unique_name_string);//unpauses or restarts the named timeout

FocusOnlyTimeouts.pauseAll();//pauses ALL timeouts

FocusOnlyTimeouts.unpauseAll();//unpauses or restarts ALL timeouts

FocusOnlyTimeouts.stopTimeout(unique_name_string);//the timeout function will not be run again and the timeout will be deleted from the factories memory

About Simeon Cheeseman

I enjoy a wide variety of computer and board games, have a BSc in Computer Science and have played percussion for 18 years.

Posted on September 4, 2012, in AngularJS, Javascript and tagged , , , , , , . Bookmark the permalink. Leave a comment.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: