Tạo đồng hồ đếm ngược (countdown) trong AS3

Trong bài trước tôi đã giới thiệu cách tạo 1 đồng hồ đếm xuôi sử dụng Timer trong AS3, bài này tôi tiếp tục giới thiệu cách tạo 1 đồng hồ đếm ngược cũng dựa trên những gì chúng ta đã làm ở bài trước, chỉ phải thay đổi 1 chút cho phù hợp với yêu cầu mới.

Yêu cầu của bài này là tạo 1 đồng hồ đếm ngược, trong đó người dùng có thể nhập thời gian cho đồng hồ đếm. Để hiểu rõ hơn yêu cầu, bạn hãy click vào hình dưới để xem kết quả cuối cùng.

Để làm bài này chúng ta cần 3 Input Text lần lượt là “hour_txt“, “minute_txt” và “second_txt“. Và cũng cần 4 buttons “start_btn“, “stop_btn“, “continue_btn” và “reset_btn“.

ActionScript:

stop_btn.visible = false;
reset_btn.visible = false;
continue_btn.visible = false;

var t_hrs:int;
var t_mins:int;
var t_secs:int;

updateTime();

function updateTime():void
{
   second_txt.text = "";
   minute_txt.text = "";
   hour_txt.text = "";

   if (t_hrs < 10)
   {
      hour_txt.text = "0" + t_hrs;
   }
   else
   {
      hour_txt.text = String(t_hrs);
   }
   if (t_mins < 10)
   {
      minute_txt.text = "0" + t_mins;
   }
   else
   {
      minute_txt.text = String(t_mins);
   }
   if (t_secs < 10)
   {
      second_txt.text = "0" + t_secs;
   }
   else
   {
      second_txt.text = String(t_secs);
   }
}

var mainTimer:Timer = new Timer(1000);
mainTimer.addEventListener(TimerEvent.TIMER, timerUpdate);
function timerUpdate(TimerEvent):void
{
   t_secs--;
   if (t_secs < 0 && t_mins >= 0)
   {
      t_secs = 59;
      t_mins--;
   }
   if (t_mins < 0 && t_hrs > 0)
   {
      t_mins = 59;
      t_hrs--;
   }
   if (t_hrs == 0 && t_mins == 0 && t_secs == 0)
   {
      mainTimer.stop();
      trace("time out");
   }
   updateTime();
}

start_btn.addEventListener(MouseEvent.CLICK, startWatch);
function startWatch(MouseEvent):void
{
   t_hrs = int(hour_txt.text);
   t_mins = int(minute_txt.text);
   t_secs = int(second_txt.text);

   if (t_hrs > 0 || t_mins > 0 || t_secs > 0)
   {
      mainTimer.start();
      start_btn.visible = false;
      stop_btn.visible = true;
   }
}

stop_btn.addEventListener(MouseEvent.CLICK, stopWatch);
function stopWatch(MouseEvent):void
{
   mainTimer.stop();
   stop_btn.visible = false;
   reset_btn.visible = true;
   continue_btn.visible = true;
   trace(t_hrs + ":" + t_mins + ":" + t_secs);
}

reset_btn.addEventListener(MouseEvent.CLICK, resetWatch);
function resetWatch(MouseEvent):void
{
   t_hrs = 0;
   t_mins = 0;
   t_secs = 0;

   start_btn.visible = true;
   stop_btn.visible = false;
   reset_btn.visible = false;
   continue_btn.visible = false;
   updateTime();
}

continue_btn.addEventListener(MouseEvent.CLICK, continueWatch);
function continueWatch(MouseEvent):void
{
   mainTimer.start();
   start_btn.visible = false;
   stop_btn.visible = true;
   reset_btn.visible = false;
   continue_btn.visible = false;
}