This is the second part of this
tutorial .
We can say that most of the work has been done in the preceding article: How to create a clock ? first part where we saw how to format the universal time passed by the PHP script.
Today, we will see how to increase the time taken from the server so to obtain a digital clock complete of the date. Follow me?
Following the logic, what would you think if we would increase the date returned by the server of one unit per second using the Timer Class?
Let?s open the Orario.as and at line 63, instead of calling the function initTime() only once, we will call it more times using a Timer.
So let?s renamed the call initTime as callInitTime().
At this point I create a new function called, as you could guess, callInitTime,
Code:
private function callInitTime():void
{
var timer:Timer=new Timer(1000,0);
timer.addEventListener(TimerEvent.TIMER,initTime);
timer.start();
}
now, we are calling the function initTime, once per second using the Timer.
We only have to increase the value of the variable serverTime of one unit each time, the following way:
The value of serverTime (returned by the server) will be increased of one second, as it would happen in a clock.
The new Orario.as would be as follow:
Code:
package
{
import flash.display.MovieClip;
import flash.text.TextField;
import flash.net.URLLoader;
import flash.net.URLRequest;
import flash.net.URLVariables;
import flash.net.navigateToURL;
import flash.utils.Timer;
import flash.events.*;
public class Orario2 extends MovieClip
{
private var days_array:Array;
private var months_array:Array;
private var serverTime:Number;
public function Orario2()
{
init();
}
private function init():void
{
days_array=new Array('Sunday','Monday','Tuesday','Wednesday','Thursday',
'Friday','Saturday');
months_array=new Array('JANUARY','FEBRUARY','MARCH','APRIL',
'MAY','JUNE','JULY','AUGUST','SEPTEMBER','OCTOBER',
'NOVEMBER','DECEMBER');
callServer();
}
private function callServer():void
{
var richiesta:URLRequest=new URLRequest();
richiesta.url='http://www.flepstudio.org/gettime.php';
var loader:URLLoader=new URLLoader();
addListeners(loader);
try
{
loader.load(richiesta);
}
catch (error:Error)
{
trace('Unable to load requested document.');
}
}
private function addListeners(d:IEventDispatcher):void
{
d.addEventListener(Event.COMPLETE,completato);
}
private function completato(e:Event):void
{
var loader:URLLoader=URLLoader(e.target);
var vars:URLVariables=new URLVariables(loader.data);
serverTime=vars.time;
callInitTime();
}
private function callInitTime():void
{
var timer:Timer=new Timer(1000,0);
timer.addEventListener(TimerEvent.TIMER,initTime);
timer.start();
}
private function initTime(t:TimerEvent):void
{
var server_milliseconds:Number=serverTime*1000;
var real_date:Date=new Date(server_milliseconds);
var hours:int=real_date.getHours();
var minutes:int=real_date.getMinutes();
var seconds:int=real_date.getSeconds();
var day_of_the_week:String=days_array[real_date.getDay()];
var day:int=real_date.getDate();
var month:String=months_array[real_date.getMonth()];
var year:int=real_date.getFullYear();
var hours_str:String=hours.toString();
if(hours<10)
hours_str='0'+hours.toString();
var minutes_str:String=minutes.toString();
if(minutes<10)
minutes_str='0'+minutes.toString();
var seconds_str:String=seconds.toString();
if(seconds<10)
seconds_str='0'+seconds.toString();
format_txt.text=hours_str+':'+minutes_str+':'+seconds_str+'\n'+
day_of_the_week+' '+day+' '+month+'\n'+year;
serverTime++;
}
}
}
Here is the result:
The next step will be to add the choice of time zone to our clock.