JavaScript Alarm Clock

Examples

Landing time:

Alarm will write here in 1 minute:

Default clock:

Clock with custom time format and timezone:

Clock that ticks every 5 seconds:

Recurrent alarm (every 7 seconds):

Code

<script type="text/javascript" src="date.format.min.js"></script>
<script type="text/javascript" src="date.format.i18n.hu.js"></script>
<script type="text/javascript" src="alarm-clock.min.js"></script>
<script type="text/javascript">
<!--
function alarm1_callback(timeStr, message)
{
    document.getElementById("alarm1").innerHTML = timeStr + ": " + message;
    alert("The time is: "+timeStr+", the message is: "+message);
}
function alarm2_callback(timeStr, message)
{
    var now = new Date();
    var elapsed = Math.floor((now.getTime() - message) / 1000);
    document.getElementById("alarm2").innerHTML = timeStr + ": elapsed " + elapsed + " seconds";
}
window.onload = function()
{
    var now = new Date();
    var one_min = new Date(now.getTime() + 60000);
    var alarm1 = new Alarm({date:one_min, alarmCallback:alarm1_callback, message:"1 minute passed!"});
    document.getElementById("landing").innerHTML = alarm1.toTimeStr("yyyy. mmmm dd. dddd HH:MM:ss");
    var clock1 = new Clock({id:"clock1"});
    var clock2 = new Clock({id:"clock2", format:"HH:MM Z", tz:"+0330"});
    var clock3 = new Clock({id:"clock3", interval:5000});
    var now_7s = new Date(now.getTime() + 7000);
    var alarm2 = new Alarm({date:now_7s, recurrent:7000, alarmCallback:alarm2_callback, message:now.getTime()});
}
// -->
</script>
<div class="example">
<div>Landing time: <span id="landing"></span></div>
<div>Alarm will write here in 1 minute: <span id="alarm1"></span></div>
<div>Default clock: <span id="clock1"></span></div>
<div>Clock with custom time format and timezone: <span id="clock2"></span></div>
<div>Clock that ticks every 5 seconds: <span id="clock3"></span></div>
<div>Recurrent alarm (every 7 seconds): <span id="alarm2"></span></div>
</div>

Download

You need to download alarm-clock.js and optionally date.format.js if you want to use date formats.

You can read about time format strings here.

Below are some translations for date format: