...

View Full Version : Count down/up script /alarm clock



neil9999
04-09-2004, 11:57 AM
Hi,

This script counts up, counts down and incorperates an alarm clock!



<html>

<head>
<script type="text/javascript">
var hv;
var mv;
var sv;
var timer;
var timer2;
function set(){
hv=document.getElementById("h").value*1;
mv=document.getElementById("m").value*1;
sv=document.getElementById("s").value*1;
}
function countup(){
if(sv!=59){
sv++
}
else if(mv!=59){
mv++
sv=0;
}
else if(hv!=59){
hv++
mv=0;
sv=0;
}
else{
alert("Finished counting up!")
clearTimeout(timer);
}
if(sv<10){
sv2="0"+sv;
}
else{sv2=sv}
if(mv<10){
mv2="0"+mv;
}
else{mv2=mv}
if(hv<10){
hv2="0"+hv;
}
else{hv2=hv}
document.getElementById("h").value=hv2;
document.getElementById("m").value=mv2;
document.getElementById("s").value=sv2;
}
function countdown(){
if(sv!=00){
sv--
}
else if(mv!=00){
mv--
sv=59;
}
else if(hv!=00){
hv--
mv=59;
sv=59;
}
else{
alert("Finished counting down!")
clearTimeout(timer2);
}
if(sv<10){
sv2="0"+sv;
}
else{sv2=sv}
if(mv<10){
mv2="0"+mv;
}
else{mv2=mv}
if(hv<10){
hv2="0"+hv;
}
else{hv2=hv}
document.getElementById("h").value=hv2;
document.getElementById("m").value=mv2;
document.getElementById("s").value=sv2;
}
function thetime(){
var d=new Date();
var hours=d.getHours();
var mins=d.getMinutes();
var secs=d.getSeconds();
if(hours<10){
hours="0"+hours;
}
if(mins<10){
mins="0"+mins;
}
if(secs<10){
secs="0"+secs;
}
document.getElementById("times").value=hours+":"+mins+":"+secs;
if(timer==true && hours==hv && mins==mv && secs==sv){
alert("Alarm ringing!")
}
}
function alarmonoff(){
if(document.getElementById("alarmbut").value=="Turn alarm on/set"){
timer=true;
document.getElementById("alarmbut").value="Turn alarm off/set";
}
else{
timer=false;
document.getElementById("alarmbut").value="Turn alarm on/set";
}
}
</script>
</head>

<body onload="setInterval('thetime()',500)">

<table border="0">
<tr>
<td colspan="2"><input value="00" size="2" id="h">:<input value="00" size="2" id="m">:<input value="00" size="2" id="s"></td>
</tr>
<tr>
<td><input type="text" size="8" id="times"></td>
<td><input type="button" value="Stop" onclick="set(); clearTimeout(timer); clearTimeout(timer2)"></td>
</tr>
<tr>
<td><input type="button" value="Count up" onclick="set(); timer=setInterval('countup()',1000)"></td>
<td><input type="button" value="Count down" onclick="set(); timer2=setInterval('countdown()',1000)"></td>
</tr>
<tr>
<td colspan="2"><input type="button" value="Turn alarm on/set" onclick="set(); alarmonoff()" id="alarmbut"></td>
</tr>
</table>

</body>

</html>


To count up, enter time to count up from. stops and alerts at 59:59:59. Press stop to stop.

To count down, enter time to count down from. Stops and alerts at 00:00:00. Press stop to stop.

To set alarm, enter time. Click Turn alarm on/set once or Turn alarm off/set twice. Click Turn alarm off/set to cancel alarm.

Any comments/suggestions welcome,

Neil

neil9999
04-14-2004, 09:18 AM
New version. Lap stops updating the counter textbox, but continues to count internally. Cont. starts updating again. To set alarm, press 'set' then 'turn alarm on'.

Neil

GeForce
04-17-2004, 03:15 PM
That's a great little script Neil! Very useful ;) May I have permission to make it available on my website (www.livescripts.net (http://www.livescripts.net))? It would be much appreciated and would get your script used widely by our visitors. Of course, all the credits to you will be kept in.

Thanks,

Jonathan :cool:

neil9999
04-17-2004, 09:32 PM
Of course you may use it - please just credit it as neil9999, no email or website or anything. I am working on a better version which is alot more accurate - see http://forums.webdeveloper.com/showthread.php?threadid=32576&goto=newpost . Keep looking here, and I should have a better version up soon. Also planned is for the alarm to be able to be set to different dates, countdown to dates and anything else I think of :p

Neil

GeForce
04-18-2004, 12:06 PM
Neil,

Thanks very much, you can see the script here: http://www.livescripts.net/go.asp?link=a/26.html. I changed one thing: before, the body tag had the onload event handler in it, I moved it into the JavaScript.

So, insted of

<body onload="setInterval(x,x)">
it is now:

<script type="text/javascript">
onload=setInterval(x,x);
</script>
This makes it easier for the users ;)

Jonathan

neil9999
04-18-2004, 12:27 PM
Great, you might want to include some instructions on how to use the different features:


Alarm

To set the alarm, type in the time, click 'Set' and Click 'Turn alarm on'.

To turn alarm off, click 'Turn alarm off'.

To set alarm whilst count up/down is running, click 'lap', follow 'To set the alarm' and click 'Cont.'

Alert appears when set time is reached.

Count up/Down

To count up, enter time to count up from and click 'Count up'. Alert appears when 59:59:59 is reached.

To count down, enter time to count down from and click 'Count down'. Alert appears when 00:00:00 is reached.

To stop counting, click 'Stop'.

To use lap feature (pause display of counting, but keep counting in the background), click 'Lap'. Click 'Lap' again to update time. Click 'Cont.' to continuously update counting again.

Time until

To calculate how long it is to go to a particular time, click 'Time until...'. Difference is calculated, and 'Countdown timer' is started.



Hope this helps,

Good luck,

Neil

neil9999
04-18-2004, 01:50 PM
I see you've updated it, but now you have to scroll right to see all the instructions. To solve this, just remove <pre> and </pre> and put <p> at the start and </p> at the end of each paragraph/line.

Neil

GeForce
04-18-2004, 07:27 PM
Sorry mate, thats because I use a high screen resolution. I'll fix that now ...

JAVAEOC
04-21-2004, 04:29 AM
Correct me if i am wrong, but i belive you have used setTimeOut for ur timer, is this correct? if so then that is a bad way of doing it, cuz the cpu delays and it gets inacurate, you should try binding it to the browsers clock :D

have fun, but its a good idea, and looks good so far

gj :thumbsup:

GeForce
04-21-2004, 07:55 AM
For the timer yes, but for the actual clock, no. The setTimeOut just updates the displayed clock to the system clock.

I think :D

JAVAEOC
04-21-2004, 01:15 PM
Yes, but that is inacurate, even tho not by much, but if you tell it to add one every second to ur timer, then it has a delay of about a millisecond or so, thats why I said try using the pc time to update the timer.... Its more acurate

GeForce
01-22-2005, 11:00 PM
Hi Java,

What I mean is that the setTimeOut tells the computer to synchronise the displayed clock with the computers clock at a certain interval.

Jon

llogan777
04-18-2007, 06:16 PM
Neil,

I wanted to try and add multiple timers for different clocks. Here is what I did and I find that when I start and stop the timer with another button it starts counting from the time on the first timer. Here is what I added to try it. I used the same function for the countup and added a 1 to it. Eventually I wanted to add up to 4 timers to time different events.

function countup1(){
if(sv!=59){
sv++
}
else if(mv!=59){
mv++
sv=0;
}
else if(hv!=59){
hv++
mv=0;
sv=0;
}
else{
alert("Finished counting up!")
clearTimeout(timer);
}
if(sv<10){
sv2="0"+sv;
}
else{sv2=sv}
if(mv<10){
mv2="0"+mv;
}
else{mv2=mv}
if(hv<10){
hv2="0"+hv;
}
else{hv2=hv}
document.getElementById("h").value=hv2;
document.getElementById("m").value=mv2;
document.getElementById("s").value=sv2;
}

Down below I referenced the countup1 function like this.

<td><input type="button" value="Count up" onclick="set(); timer=setInterval('countup1()',1000)"></td>

Also I wanted to set it up to where it just counts seconds and doesn't go to minutes or hours. Anybody got a good idea how to do that.

Thanks in advance.

Lee

kosstr12
04-28-2007, 03:31 AM
yes, it is a very nice script, good job =]

llogan777
05-15-2007, 12:55 AM
yes, it is a very nice script, good job =]
The one question I have now about the script is can I make the font bigger on the boxes. For instance the countdown box. I really need a bigger font so that I could sary display it on an overhead projector screen.

Thanks.

moises
08-13-2008, 08:40 PM
Hi,

This script counts up, counts down and incorperates an alarm clock!



<html>

<head>
<script type="text/javascript">
var hv;
var mv;
var sv;
var timer;
var timer2;
function set(){
hv=document.getElementById("h").value*1;
mv=document.getElementById("m").value*1;
sv=document.getElementById("s").value*1;
}
function countup(){
if(sv!=59){
sv++
}
else if(mv!=59){
mv++
sv=0;
}
else if(hv!=59){
hv++
mv=0;
sv=0;
}
else{
alert("Finished counting up!")
clearTimeout(timer);
}
if(sv<10){
sv2="0"+sv;
}
else{sv2=sv}
if(mv<10){
mv2="0"+mv;
}
else{mv2=mv}
if(hv<10){
hv2="0"+hv;
}
else{hv2=hv}
document.getElementById("h").value=hv2;
document.getElementById("m").value=mv2;
document.getElementById("s").value=sv2;
}
function countdown(){
if(sv!=00){
sv--
}
else if(mv!=00){
mv--
sv=59;
}
else if(hv!=00){
hv--
mv=59;
sv=59;
}
else{
alert("Finished counting down!")
clearTimeout(timer2);
}
if(sv<10){
sv2="0"+sv;
}
else{sv2=sv}
if(mv<10){
mv2="0"+mv;
}
else{mv2=mv}
if(hv<10){
hv2="0"+hv;
}
else{hv2=hv}
document.getElementById("h").value=hv2;
document.getElementById("m").value=mv2;
document.getElementById("s").value=sv2;
}
function thetime(){
var d=new Date();
var hours=d.getHours();
var mins=d.getMinutes();
var secs=d.getSeconds();
if(hours<10){
hours="0"+hours;
}
if(mins<10){
mins="0"+mins;
}
if(secs<10){
secs="0"+secs;
}
document.getElementById("times").value=hours+":"+mins+":"+secs;
if(timer==true && hours==hv && mins==mv && secs==sv){
alert("Alarm ringing!")
}
}
function alarmonoff(){
if(document.getElementById("alarmbut").value=="Turn alarm on/set"){
timer=true;
document.getElementById("alarmbut").value="Turn alarm off/set";
}
else{
timer=false;
document.getElementById("alarmbut").value="Turn alarm on/set";
}
}
</script>
</head>

<body onload="setInterval('thetime()',500)">

<table border="0">
<tr>
<td colspan="2"><input value="00" size="2" id="h">:<input value="00" size="2" id="m">:<input value="00" size="2" id="s"></td>
</tr>
<tr>
<td><input type="text" size="8" id="times"></td>
<td><input type="button" value="Stop" onclick="set(); clearTimeout(timer); clearTimeout(timer2)"></td>
</tr>
<tr>
<td><input type="button" value="Count up" onclick="set(); timer=setInterval('countup()',1000)"></td>
<td><input type="button" value="Count down" onclick="set(); timer2=setInterval('countdown()',1000)"></td>
</tr>
<tr>
<td colspan="2"><input type="button" value="Turn alarm on/set" onclick="set(); alarmonoff()" id="alarmbut"></td>
</tr>
</table>

</body>

</html>


To count up, enter time to count up from. stops and alerts at 59:59:59. Press stop to stop.

To count down, enter time to count down from. Stops and alerts at 00:00:00. Press stop to stop.

To set alarm, enter time. Click Turn alarm on/set once or Turn alarm off/set twice. Click Turn alarm off/set to cancel alarm.

Any comments/suggestions welcome,

Neil

thanks for the script :thumbsup:

macwiz
08-14-2008, 07:42 PM
Um... that link is just some junk page with links and all. No scripts.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum