PDA

View Full Version : problem with timers in code, please help


cat_evilness
01-06-2003, 07:04 PM
Happy new year everyone. I've been working on the below code for ages and I just can't figure out what's wrong. There are problems with the counters, like when you push one button one of the other counters will stop working or stick. And sometimes if you push a button the counter for that button will count down mega quickly.. I'd appreaciate any help you can give me..

Thanks Cat x

<html>
<head>
<script language="javascript">
<!--
var hungerValue='10';
var moodValue='10';
var healthValue='10';
var fitnessValue='10';
var energyValue='10';

function hungerScript(){
if(hungerValue>=10){
hungerValue=10
}
if ( hungerValue == 10 || hungerValue == 0 )
document.f1.elements[0].disabled = true;
else
document.f1.elements[0].disabled = false;
countdown.innerHTML=hungerValue;
if(hungerValue<=0){
clearTimeout(Timer)
}
else{
hungerValue--;
Timer=setTimeout("hungerScript();", 3000);
}
}
function moodScript(){
if(moodValue>=10){
moodValue=10
}
if ( moodValue == 10 || moodValue == 0 )
document.f2.elements[0].disabled = true;
else
document.f2.elements[0].disabled = false;
countdown2.innerHTML=moodValue;
if(moodValue<=0){
clearTimeout(Timer)
}
else{
moodValue--;
Timer=setTimeout("moodScript();", 3000);
}
}
function healthScript(){
if(healthValue>=10){
healthValue=10
}
if ( healthValue == 10 || healthValue == 0 )
document.f3.elements[0].disabled = true;
else
document.f3.elements[0].disabled = false;
countdown3.innerHTML=healthValue;
if(healthValue<=0){
clearTimeout(Timer)
}
else{
healthValue--;
Timer=setTimeout("healthScript();", 3000);
}
}
function fitnessScript(){
if(fitnessValue>=10){
fitnessValue=10
}
if ( fitnessValue == 10 || fitnessValue == 0 )
document.f4.elements[0].disabled = true;
else
document.f4.elements[0].disabled = false;
countdown4.innerHTML=fitnessValue;
if(fitnessValue<=0){
clearTimeout(Timer)
}
else{
fitnessValue--;
Timer=setTimeout("fitnessScript();", 3000);
}
}
function energyScript(){
if(energyValue>=10){
energyValue=10
}
if ( energyValue == 10 || energyValue == 0 )
document.f5.elements[0].disabled = true;
else
document.f5.elements[0].disabled = false;
countdown5.innerHTML=energyValue;
if(energyValue<=0){
clearTimeout(Timer)
}
else{
energyValue--;
Timer=setTimeout("energyScript();", 3000);
}
}
function feed(){
clearTimeout(Timer)
hungerValue+=2
hungerScript()
}
function play(){
clearTimeout(Timer)
moodValue+=2
moodScript()
}
function medicine(){
clearTimeout(Timer)
healthValue+=2
healthScript()
}
function exercise(){
clearTimeout(Timer)
fitnessValue+=2
fitnessScript()
}
function bed(){
clearTimeout(Timer)
energyValue+=2
energyScript()
}
//-->
</script>
<title>Virtual Pet - Version 1.0</title>
</head>
<body onload="hungerScript();moodScript();healthScript();fitnessScript();energyScript();" bgcolor="#0099FF" text="#ffff99" link="#00ff00" alink="#ffa500" vlink="#ff0000">
<basefont size="3">
<table width="500" valign="top" border="0">
<tr>
<td width="190" valign="left" align="left" border="0">
<table width="190" valign="top" border="1">
<td width="190" height="100" bgcolor="#FF9900" valign="left" align="left" border="1">
Hunger:</br>
Mood:</br>
Health:</br>
Fitness:</br>
Energy:</br>
</td>
<td width="40" bgcolor="#FF9900" valign="left" align="left" border="0">
<span id="countdown"></span></br>
<span id="countdown2"></span></br>
<span id="countdown3"></span></br>
<span id="countdown4"></span></br>
<span id="countdown5"></span></br>
</td>
</table>
</td>
<td width="180" valign="left" align="left" border="0">
</td>
<td width="180" valign="left" align="left" border="0">
<table width="180" valign="top" border="1">
<td width="180" height="100" bgcolor="#FF9900" valign="left" align="left" border="1">
<table width="180" valign="top" border="1">
<tr>
<td width="40" bgcolor="#FF9900" valign="left" align="left" border="1">
<form name="f1" action="feed.html" target="virtualpet">
<input type="submit" value="Feed" onclick="feed()" style="background: #ff3600; font-weight: bold">
</form>
</td>
<td width="40" bgcolor="#FF9900" valign="left" align="left" border="1">
<form name="f2" action="play.html" target="virtualpet">
<input type="submit" value="Play" onclick="play()" style="background: #ff3600; font-weight: bold">
</form>
</td>
<td width="40" bgcolor="#FF9900" valign="left" align="left" border="1">
<form name="f3" action="medicine.html" target="virtualpet">
<input type="submit" value="Medicine" onclick="medicine()" style="background: #ff3600; font-weight: bold">
</form>
</td>
</tr>
<tr>
<td width="40" bgcolor="#FF9900" valign="left" align="left" border="1">
<form name="f4" action="exercise.html" target="virtualpet">
<input type="submit" value="Exercise" onclick="exercise()" style="background: #ff3600; font-weight: bold">
</form>
</td>
<td width="40" bgcolor="#FF9900" valign="left" align="left" border="1">
<form name="f5" action="sleep.html" target="virtualpet">
<input type="submit" value="Bed" onclick="bed()" style="background: #ff3600; font-weight: bold"><br>
</form>
</td>
</tr>
</table>

</td>
</table>
</td>
</tr>
</table>
</body>
</html>

Roelf
01-06-2003, 07:16 PM
you've got one Timer variable, where multiple functions start and stop or reassign it. Use different timervarables, like FoodTimer, MoodTimer etc. Maybe that way it works, dont have time to test it, but its just a feeling

cat_evilness
01-06-2003, 07:28 PM
thankyou.. that works perfectly now :thumbsup: