How to create a clock using Flash CS3 and PHP - first part

[Flep]

Hi everyone, actionscripters and not'
After we have seen how to comunicate with Flash CS3 and PHP, i would like to introduce this tutorial’s first part which will show you how to create a clock using Flash CS3 and PHP.
Why PHP'
To make a good job, we will want to get the universal time in seconds from the server. The Date class of Actionscript 3.0 is not enough as it returns the date and time from the user's pc so you can not rely on it. Each users could have a different date and time. Instead we want that any international users connected view the date and time from the server.

So, let's start'

I create a FLA and save it as 'server_time.fla', into which I have a dynamic text field named 'format_txt'.
I create a Document Class, an AS file saved as 'Orario.as', implemented the following way:

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.*;
	import flash.ui.ContextMenu;
	import flash.ui.ContextMenuItem;
	
	public class Orario extends MovieClip
	{
		private var days_array:Array;
		private var months_array:Array;
		
		private var serverTime:Number;
		
		public function Orario()
		{
			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;
			server_txt.text=serverTime.toString();
			
			initTime();
		}
		
		private function initTime():void
		{
			var server_milliseconds:Number=serverTime*1000;
			
			data_txt.text=server_milliseconds.toString();
			info_txt.visible=true;
			
			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();
			
			format_txt.visible=true;
			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;
		}
	}
}

The result:

Let's analyse the code:

Properties
two arrays inside which I assign the days and months (in Italian in this example)
private var days_array:Array;
private var months_array:Array;
a numerical variable inside which I insert the universal time in seconds received from the PHP script
private var serverTime:Number;

Methods
init();
I initialise the Arrays
days_array=new Array('Sunday','Monday','Tuesday','Wednesday','Thu rsday','Friday','Saturday');
months_array=newArray('JANUARY','FEBRUARY','MARCH' ,'APRIL','MAY','JUNE','JULY','AUGUST','SEPTEMBER', 'OCTOBER','NOVEMBER','DECEMBER');I call the method callServer()
callServer();

callServer();
I request a new url creating an instance of the URLRequest class
var richiesta:URLRequest=new URLRequest();
I assign to the url property of URLRequest, the url of the PHP file
richiesta.url='http://www.flepstudio.org/gettime.php';
I create an instance of the URLLoader class
var loader:URLLoader=new URLLoader();
I add the needed listeners calling the function addListeners and call the PHP script
addListeners(loader);
try
{
loader.load(richiesta);
}
catch (error:Error)
{
trace('Unable to load requested document.');
}

addListeners();
I add a listener to the event COMPLETE, so that when the PHP will have return a value, the function completato() will be called
d.addEventListener(Event.COMPLETE,completato);

completato();
I create an instance of the Loader class to retrace who has dispatched the event
var loader:URLLoader=URLLoader(e.target);
I create a URLVariables variable to hold the values returned by the PHP and assign them to the variable serverTime
var vars:URLVariables=new URLVariables(loader.data);
serverTime=vars.time;

initTime();
I create a variable into which I insert the server's value in seconds multiplied by 1000 to get the milliseconds
var server_milliseconds:Number=serverTime*1000;
I create a Date variable to which I pass the value in milliseconds
var real_date:Date=new Date(server_milliseconds);
I create a variable to which I pass the value of the current hours using GetHours of Date
var hours:int=real_date.getHours();
I create a variable to which I pass the value of the current minutes using getMinutes of Date
var minutes:int=real_date.getMinutes();
I create a variable to which I pass the value of the current seconds using getSeconds of Date
var seconds:int=real_date.getSeconds();
I create a variable to which I pass the value of days_array with an index equal to the days numbers less 1 as the arrays start from zero
var day_of_the_week:String=days_array[real_date.getDay()-1];
I create a variable to which I pass the date of the day using the getDate of Date
var day:int=real_date.getDate();
I create a variable to which I pass the value of months_array with an index equal to the months numbers
var month:String=months_array[real_date.getMonth()];
I create a variable to which I pass the value of the current year using getFullYear of Date
var year:int=real_date.getFullYear();
now, I have to check if the values of the hours, minutes and seconds are smaller then 10. If they are, I will add a zero before their value so to format the time as, for example, 09:07:08 instead of having 9:8:7. I create a string variable to which I assign the respective value. I then check if the value is smaller then 10 and add a zero before their value if necessary
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();
finally I can assign the values to my text field on stage (format_txt) connecting strings and numbers
format_txt.text=hours_str+':'+minutes_str+':'+seco nds_str+'\n'+day_of_the_week+' '+day+' '+month+'\n'+year;

This is the PHP script used:

PHP Code:

<'php
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
header("Cache-Control: no-store, no-cache, must-revalidate");
header("Cache-Control: post-check=0, pre-check=0", false);
header("Pragma: no-cache");
echo "time=" . time();
'> 


Source files: