יצירת מונה זמן שסופר לאחור באמצעות AS3

סקריפט קצר לבניית countdown timer בפלאש באמצעות ActionScript 3

מונה זמן שסופר לאחור הוא אחד הפיצ'רים שמתישהו, כאשר אתה מפתח ווידג'ט, אתה מגיע אליהם. ומה לעשות, צריך לפתח אותו. אין בעיה למצוא מונה זמן שכותב לתוך איזה אובייקט שתקעת לתוך ה-staging, אבל קשה למצוא class פשוט של ממש שמטפל בעניין. הנה class שאני משתמש בו בכל פעם שאני צריך ספירה לאחור:


package {
	import flash.text.*;
	import flash.display.*;
	import flash.events.*;
	import flash.utils.*;

	public class TimerManager {
		
		private var finalDate:Number;
		private var result:String;
		
		/**
		*	cousntructor
		*	@param timestamp type Number 
		*/
		
		public function timerManager(timestamp:Number) {

			this.finalDate = timestamp*1000; 
			var timer:Timer = new Timer(1000);
			timer.addEventListener(TimerEvent.TIMER, this.updateTime);
			timer.start();
		}
		
		/**
		* callback for timerevent - runs every second.
		*	@param e type TimerEvent
		*/		
		
		private function updateTime(e:TimerEvent):void {
			this.result = calculateTime();
		}
		
		/**
		* calculate current date and the remaining time
		*	@return string of the result
		*/	
		
		private function calculateTime():String {
			var now:Date = new Date();
			var remainTime:Number = this.finalDate - now.getTime();
			if (remainTime >0) {
				return timerManager.millisecondsToDate(remainTime);
			}
			else {
				return 'Error';
			}
		}
		
		/**
		* take the remaining number of miiliseconds and convert it to human form
		*	@param remainTime type Number
		*	@return string of the result
		*/	
		
		private function millisecondsToDate(remainTime:Number):String {	
			var secs:Number = Math.floor(remainTime/1000);
			var mins:Number = Math.floor(secs/60);
			var hours:Number = Math.floor(mins/60);
			var days:Number = Math.floor(hours/24);
	
			var secsText:String = (secs%60).toString();
			var minsText:String = (mins%60).toString();
			var hoursText:String = (hours%24).toString();
			var daysText:String = days.toString();
	
			if (secsText.length < 2) {secsText = "0" + secsText;}
			if (minsText.length < 2) {minsText = "0" + minsText;}
			if (hoursText.length < 2) {hoursText = "0" + hoursText;}
			if (daysText.length < 2) {daysText = "0" + daysText;}
				
			return daysText+" : "+hoursText+" : "+minsText+" : "+secsText;	
		}	

		/**
		* getter of the result
		*	@return string of the result
		*/	
		
		public function getResult() {
			return this.result;
		}
	}
}

ה-class הזה הוא פשוט מאד, ה-constructor שלו מקבל timestamp (בשניות) של תאריך היעד והוא כבר מבצע את כל החישובים. מתודת getResult מחזירה לנו מחרוזת טקסט שבה יש ספירה לאחור של היעד.

אנו כמובן יכולים לשנות את ה-class כרצוננו על מנת שגם יכתוב את הטקסט ל-stage:


package {
	import flash.text.*;
	import flash.display.*;
	import flash.events.*;
	import flash.utils.*;

	public class timerManager {
		
		private var finalDate:Number;
		private var result:String;
		private var dateText:Object;
		
		/**
		*	cousntructor
		*	@param timestamp type Number 
		*   @param dateText type Object
		*/
		
		public function timerManager(timestamp:Number,dateText:Object) {
			this.dateText = dateText;
			this.finalDate = timestamp; 
			var timer:Timer = new Timer(1000);
			timer.addEventListener(TimerEvent.TIMER, this.updateTime);
			timer.start();
		}
		
		/**
		* callback for timerevent - runs every second and write result
		*	@param e type TimerEvent
		*/		
		
		private function updateTime(e:TimerEvent):void {
			var result = calculateTime();
			this.dateText.htmlText = result;
		}
		
		/**
		* calculate current date and the remaining time
		*	@return string of the result
		*/	
		
		private function calculateTime():String {
			var now:Date = new Date();
			var remainTime:Number = this.finalDate - now.getTime();
			if (remainTime >0) {
				return this.millisecondsToDate(remainTime);
			}
			else {
				return 'Error';
			}
		}
		
		/**
		* take the remaining number of miiliseconds and convert it to human form
		*	@param remainTime type Number
		*	@return string of the result
		*/	
		
		private function millisecondsToDate(remainTime:Number):String {	
			var secs:Number = Math.floor(remainTime/1000);
			var mins:Number = Math.floor(secs/60);
			var hours:Number = Math.floor(mins/60);
			var days:Number = Math.floor(hours/24);
	
			var secsText:String = (secs%60).toString();
			var minsText:String = (mins%60).toString();
			var hoursText:String = (hours%24).toString();
			var daysText:String = days.toString();
	
			if (secsText.length < 2) {secsText = "0" + secsText;}
			if (minsText.length < 2) {minsText = "0" + minsText;}
			if (hoursText.length < 2) {hoursText = "0" + hoursText;}
			if (daysText.length < 2) {daysText = "0" + daysText;}
				
			return daysText+" : "+hoursText+" : "+minsText+" : "+secsText;	
		}	
	}
}

וה-fla יראה כך:


var m_myTextField:TextField = new TextField();
var future = SOME_TIME_STAMP

var _timerManager:timerManager = new timerManager(future, m_myTextField);
this.addChild(m_myTextField);

והנה הדוגמא החיה:

הדגמת פלאש.

יש לזכור שה-timestamp שאני שולח אמור להיות timestamp בשניות, בעוד AS3 עובד במילישניות.

פוסטים נוספים שכדאי לקרוא

ממנטו עם גמל אין לי מושג למה אני עושה דברים
יסודות בתכנות

מה זה stateful ו-stateless

מה זה סטייט? למה אנחנו צריכים לדעת מה זה ואיך רואים את זה ממש בעיניים.

בינה מלאכותית

hooks של LLMים שעורכים קוד

הסבר על הוקים: הפעלה אוטומטית של פקודות שקיימת בכל האייג׳נטים שעורכים קוד (כלומר קורסור, קלוד קוד, קודקס וחבריהם) שיכולה מאד לסייע בפיתוח.

בינה מלאכותית

שימוש ב-Plan Mode באופן חכם

כך נמנעי את קריאות השבר של "מה האייג'נט עשה?!" שיטת Plan mode: שיטה קריטית לעבודה יעילה, המייצרת תוכנית עבודה מפורטת (DoD) עוד לפני כתיבת שורת קוד אחת.

פתרונות ומאמרים על פיתוח אינטרנט

גישת Least Privilege

גישה לכתיבת קוד מאובטח שכדאי מאד להכיר – במיוחד בעידן הבינה המלאכותית

גלילה לראש העמוד