Simple “time to stop working” jQuery counter with alert

I am sure there are tons of countdowns out there, but I think none was built for this special purpose. I was playing with the jquery counter and just came to me: I want an alert to remind me to stop working and tell me to go home when it’s time.

Yes, of course I could just use the phone alert…but this is funnier…and I can say “I made this” 😀

The good part, is that you can pin the tab in your favorite browser (I am a Chrome evangelist) and every time you start it, it also starts the timer. The counter restarts automatically every day, so you don’t have to worry about it and it shows the alert no matter what you are doing when time finishes.

I customized so it pup ups the alert every day at 5:30pm exempt on Friday when it shows me the alert al 2:30pm. Feel free to do it your way.

This counter was actually used on a website to let the user know client-side, the time has left to complete an online exam. I have then converted it into a funnier counter. Hope you like it.

I use a local installation of XAMPP and give it a special website where to run, but there is really no need for all this trouble. You can run this from any place like your normal server or even from your desktop. It is just pure html with two lines of javascript included.

The counter with alert snippet

Here is the main snipped that does all the job. Also don’t forget to include the jQuery library.

var d = new Date();
var month   = d.getMonth()+1;
var day     = d.getDate();
var year    = d.getFullYear();
var day_in_week = d.getDay();
var hour    = (day_in_week == 5 ? 14-1 : 17-1);
var minute  = 30;
var second  = 00;
var s1      = '/';
var s2      = ':';
var output  = month+s1+day+s1+year+ ' ' +hour+s2+minute+s2+second;
$('#myCounter').countdown({
date: output
}, function () {
alert('Go home now...you must be very tired!');
});

var d = new Date();

var month = d.getMonth()+1;

var day = d.getDate();

var year = d.getFullYear();

var day_in_week = d.getDay();

var hour = (day_in_week == 5 ? 14-1 : 17-1);

var minute = 30;

var second = 00;

var s1 = '/';

var s2 = ':';

var output = month+s1+day+s1+year+ ' ' +hour+s2+minute+s2+second;

$('#myCounter').countdown({

date: output

}, function () {

alert('Go home now...you must be very tired!');

});

You can see a demo file on Github. And you must download the main jquery.countdown.min.js from the @eka7a repository. YOu also have there a small demo and some documentation, but for a more generic purpose.

simple-jquery-counter

Feel free to edit and set up for you needs. You can let me know if you find other curious ways to use it.

Simple “time to stop working” jQuery counter with alert

The counter with alert snippet

Like this:

Related

Leave a Reply Cancel reply

The counter with alert snippet

Share this:

Like this:

Related

Leave a Reply Cancel reply