出来上がりを画像の変化で知らせる

画像の変化で出来上がりを知らせます。

Mission26

出来上がりを画像の変化で知らせる

カップ麺の仕上がりを画像の張り替えで伝えるようにします。
timer()の関数内、
if(c==0)はcが0になった時を意味します。
f=0;でタイマーの状態をoffにします。
document.images["RAMEN"].src="image/ramen.gif";で出来上がりのラーメンの画像に張り替えます。

<html>
…

f=0;
function timers()
{
f=1;
allget("S","<input type='button' value= 'リセット' onclick='timerr1()'>");
document.images["RAMEN"].src= "image/ramenw.gif";
c=180000;
setTimeout("timer()",10);
}

function timerr1()
{
f=0;
allget("S","リセットしています");
setTimeout("timerr2()",1000);
}

function timerr2()
{
allget("S","<input type='button' value= '3分待つだけ' onclick='timers()'>");
allget("MATI","<b><font size= '+1'>完成まで 03:00:000</font></b>");
allget("BOU","<img src= 'image/tb.gif' width='180' height='10' border= '0'>");
document.images["RAMEN"].src= "image/ramen.gif";
}

function timer()
{
if(f!=1) return;
c=c-10;
allget("MATI","<b><font size= '+1'>完成まで "+c+"ミリ秒</ font></b>");
allget("BOU","<img src='image/tb.gif' width= '"+Math.ceil(c/1000)+"' height='10' border= '0'>");

  if(c==0)
  {
  f=0;
  document.images["RAMEN"].src= "image/ramen.gif";
  allget("S","<input type= 'button' value='3分待つだけ' onclick='timers()' >");
  }
  else
  {
  setTimeout("timer()",10);
  }
}

…
</html>

プログラムの実行結果が表示されます。