PDA

View Full Version : Multiple alarm clocks on one page



julmado
04-23-2006, 05:48 AM
Greetings!

I'd like to add several alarms on one HTML page.

I have found the following script that seems to work, but I am at a loss at to how to add many alarms. For example one at 12:00, another at 13:30 etc.

Anyone have any suggestions? I am sure it is quite straightforward but I can't wrap my head around it.

<html>

<head>
<title>Current Time</title>
<script language="JavaScript" type="text/javascript">

<!--
var sound = "none.wav";

function sivamtime() {
now=new Date();
hour=now.getHours();
min=now.getMinutes();
sec=now.getSeconds();

if (min<=9) { min="0"+min; }
if (sec<=9) { sec="0"+sec; }
if (hour>12) {
hour=hour-12;
add="pm"; }
else {
hour=hour;
add="am"; }
if (hour==12) { add="pm"; }
if (hour==00) { hour="12"; }

document.hours.clock.value = (hour<=9) ? "0"+hour : hour;
document.minutes.clock.value = min;
document.seconds.clock.value = sec;
document.ampm.clock.value= add;
setTimeout("sivamtime()", 1000);
}

function alarm() {
timer = "";
note = document.arlm.message.value;
if (note == '') {note = 'ALARM!!';}

hrs = document.arlm.hr.value;
min = document.arlm.mts.value;
apm = document.arlm.am_pm.value;

if (document.arlm.time.selectedIndex==0) { timer = "2"; }
if (document.arlm.time.selectedIndex==1) { timer = "5"; }
if (document.arlm.time.selectedIndex==2) { timer = "10"; }
if (document.arlm.time.selectedIndex==3) { timer = "15"; }
if (document.arlm.time.selectedIndex==4) { timer = "20"; }
if (document.arlm.time.selectedIndex==5) { timer = "30"; }

if ((document.hours.clock.value == hrs) &&
(document.minutes.clock.value == min) &&
(document.ampm.clock.value == apm) &&
(document.arlm.snooze.checked == true)) {
musicwin=window.open("","","width=200,height=50")
if (navigator.appName=="Explorer")
musicwin.document.write("<body onLoad=\"setTimeout('location.reload();window.focus()'," + timer*60*1000 + ");\"><bgsound src=" + sound + " loop='finite'>" + note)
else
musicwin.document.write("<body onLoad=\"setTimeout('history.go(0);window.focus()'," + timer*60*1000 + ");\"><embed src=" + sound + " hidden='true' border='0' autostart='true' loop='false'>" + note)
musicwin.document.close(); return false; }

if ((document.arlm.snooze.checked == true) && (document.arlm.time.value == "")) {
alert('You have not set the\nminutes for snooze!'); return false; }

if (document.arlm.snooze.checked == false) {
document.arlm.time.value = ""; }

if ((document.hours.clock.value == hrs) &&
(document.minutes.clock.value == min) &&
(document.ampm.clock.value == apm) &&
(document.arlm.snooze.checked == false)) {
alert(note); return false; }

if (hrs == '') {alert('The Hour field is empty'); return false}
if (min == '') {alert('The Minute field is empty'); return false}
if (apm == '') {alert('The am/pm field is empty'); return false}

if (hrs.length == 1) {document.arlm.hr.value = '0' + hrs}
if (min.length == 1) {document.arlm.mts.value = '0' + min}
if (hrs.length > 2) {alert('The Hour is wrongly typed.'); return false}
if (min.length > 2) {alert('The Minute is wrongly typed.'); return false}
if (apm != 'am' && apm != 'pm' ) {alert('The am/pm is wrongly typed.'); return false}

setTimeout("alarm()", 1000);}

//-->
</script>


</head>

<body bgcolor="#669900" onLoad="sivamtime()">

<table border="0" align="center" bgcolor="#c0c0c0" cellspacing="0" cellpadding="2" width="136">
<tr>
<td colspan="4">
<font size="1" face="verdana, arial, helvetica, ms sans serif">
<b>Current Time</b>
</font>
</td>
</tr>
<tr>
<td>
<form name="hours">
<p><input type="text" size="2" name="clock"></p>
</form>
</td>
<td>
<form name="minutes">
<p><input type="text" size="2" name="clock" /></p>
</form>
</td>
<td>
<form name="seconds">
<p><input type="text" size="2" name="clock" /></p>
</form>
</td>
<td>
<form name="ampm">
<p><input type="text" size="2" name="clock" /></p>
</form>
</td>
</tr>
</table>

<table border="0" align="center" bgcolor="#c0c0c0" cellspacing="0" cellpadding="2" width="136">
<tr>
<td colspan="3">
<form name="arlm">
<font face="verdana, arial, helvetica, ms sans serif" size="1">First Break</font></td>
</tr>
<tr align="center">
<td>
<font size="1" face="verdana, arial, helvetica, ms sans serif">
*Hour*
</font>
</td>
<td>
<font size="1" face="verdana, arial, helvetica, ms sans serif">
**Minute
</font>
</td>
<td>
<font size="1" face="verdana, arial, helvetica, ms sans serif">
*am/pm
</font>
</td>
</tr>
<tr align="center">
<td>
<input type="text" size="2" name="hr" onFocus="select()" value="00" />
</td>
<td>
**<input type="text" size="2" name="mts" onFocus="select()" value="00" />
</td>
<td>
*<input type="text" size="2" name="am_pm" onFocus="select()" value="am" />
</td>
</tr>
<tr align="center">
<td colspan="3">
<font size="1" face="verdana, arial, helvetica, ms sans serif">
Message
</font>
</td>
</tr>
<tr align="center">
<td colspan="3">
<input type="text" size="15" name="message" />
</td>
</tr>
<tr align="center">
<td bgcolor="#a0a0a0" colspan="3">
<input type="checkbox" name="snooze" value="ON">
<font size="1" face="verdana, arial, helvetica, ms sans serif">Snooze? *<br />
<select name="time">
<option value="0">2</option>
<option value="1">5</option>
<option value="2">10</option>
<option value="3">15</option>
<option value="4">20</option>
<option value="5">30</option>
</select> Minutes</font>
</td>
</tr>
<tr>
<td align="center" colspan="3">
<input type="button" size="2" value="Set Alarm" onClick="alarm()" />
</td>
</tr>
<tr>
<td align="center" colspan="3">
<input type="button" size="2" value="Reset" onClick="reset()" />
</form>
</td>
</tr>
</table>


</body>

</html>