function HourAnimation(){
	var FPS = 6;
	var canvas;
	var canvaID;
	var context2D;
	var getTimeFromServer = false;
	var BACKGROUND_IMAGE_PATH = "./Images/bg.jpg";
	var HOUR_HAND_IMAGE_PATH = "./Images/Heure.png";
	var MINUTE_HAND_IMAGE_PATH = "./Images/Minute.png";
	var SECOND_HAND_IMAGE_PATH = "./Images/Seconde.png";
	
	var CANDRAN_CENTER = {x:208,y:45};
	var HOUR_HAND_CENTER_ROTATION = {x:2 ,y:17};
	var MINUTE_HAND_CENTER_ROTATION = {x:2 ,y:26};
	var SECONDE_HAND_CENTER_ROTATION = {x:1 ,y:28};
	
	var initialRotations ={m:0,h:0,s:0};
	
	var minimumAnimationTime =1.2;

	var timeDiffernce=0;
	var timeGeted = false;
	var playComplexAnim = true;
    /* timeFromeServer difine if we load dynamicly the time from the server.
	*/	
	this.Initialize = function (timeFromeServer) {
		canvaID = "hourCanva";
		getTimeFromServer = timeFromeServer;
		var bg=new Image();       
		bg.src=BACKGROUND_IMAGE_PATH;        
		bg.onload=function(){ 
			jc.start(canvaID,FPS);        
			jc.image(bg,0,0); 
			jc.start(canvaID);
			drawPerfectTime();
		}
		if(BrowserDetect.browser == "Firefox" && parseInt(BrowserDetect.version) < 4){
				playComplexAnim = false;
		}

	};
	this.deactiveComplexAnim = function (){
		playComplexAnim = false;
	};
	function drawPerfectTime(){
		var t = new Date();
		
		t.setHours(10, 8, 38, 0);
		rotateS = t.getSeconds()*360/60;
		rotateM = t.getMinutes()*360/60;
		rotateH = t.getHours()*360/12;
		initialRotations.m = rotateM;
		initialRotations.s = rotateS;
		initialRotations.h = rotateH;

		var minuteImge=new Image();       
		minuteImge.src=MINUTE_HAND_IMAGE_PATH;        
		minuteImge.onload=function(){ 
			jc.image(minuteImge,CANDRAN_CENTER.x-MINUTE_HAND_CENTER_ROTATION.x,CANDRAN_CENTER.y-MINUTE_HAND_CENTER_ROTATION.y).id('mHand');   
			jc('#mHand').rotate(rotateM,CANDRAN_CENTER.x,CANDRAN_CENTER.y);			
			jc.start(canvaID);
			var hourImge=new Image();       
			hourImge.src=HOUR_HAND_IMAGE_PATH;  
      
			hourImge.onload=function(){ 
				jc.image(hourImge,CANDRAN_CENTER.x-HOUR_HAND_CENTER_ROTATION.x,CANDRAN_CENTER.y-HOUR_HAND_CENTER_ROTATION.y).id('hHand'); 
				jc('#hHand').rotate(rotateH,CANDRAN_CENTER.x,CANDRAN_CENTER.y);
				jc.start(canvaID);
	
				var secondeImge=new Image();       
				secondeImge.src=SECOND_HAND_IMAGE_PATH;        
				secondeImge.onload=function(){ 
					jc.image(secondeImge,CANDRAN_CENTER.x-SECONDE_HAND_CENTER_ROTATION.x,CANDRAN_CENTER.y-SECONDE_HAND_CENTER_ROTATION.y).id('sHand');        
					jc('#sHand').rotate(rotateS,CANDRAN_CENTER.x,CANDRAN_CENTER.y);			
					jc.start(canvaID);
					startAnimation()
				}
			}
		}
	}
	var timeBeforAnim =2000;
	var timer;
	function startAnimation(){
		updateServerLoacleTimeDiff();
		timer=setInterval(animateToServerTime,timeBeforAnim);
	};
	var BrowserDetect = {
		init: function () {
			this.browser = this.searchString(this.dataBrowser) || "An unknown browser";
			this.version = this.searchVersion(navigator.userAgent)
				|| this.searchVersion(navigator.appVersion)
				|| "an unknown version";
			this.OS = this.searchString(this.dataOS) || "an unknown OS";
		},
		searchString: function (data) {
			for (var i=0;i<data.length;i++)	{
				var dataString = data[i].string;
				var dataProp = data[i].prop;
				this.versionSearchString = data[i].versionSearch || data[i].identity;
				if (dataString) {
					if (dataString.indexOf(data[i].subString) != -1)
						return data[i].identity;
				}
				else if (dataProp)
					return data[i].identity;
			}
		},
		searchVersion: function (dataString) {
			var index = dataString.indexOf(this.versionSearchString);
			if (index == -1) return;
			return parseFloat(dataString.substring(index+this.versionSearchString.length+1));
		},
		dataBrowser: [
			{
				string: navigator.userAgent,
				subString: "Chrome",
				identity: "Chrome"
			},
			{ 	string: navigator.userAgent,
				subString: "OmniWeb",
				versionSearch: "OmniWeb/",
				identity: "OmniWeb"
			},
			{
				string: navigator.vendor,
				subString: "Apple",
				identity: "Safari",
				versionSearch: "Version"
			},
			{
				prop: window.opera,
				identity: "Opera",
				versionSearch: "Version"
			},
			{
				string: navigator.vendor,
				subString: "iCab",
				identity: "iCab"
			},
			{
				string: navigator.vendor,
				subString: "KDE",
				identity: "Konqueror"
			},
			{
				string: navigator.userAgent,
				subString: "Firefox",
				identity: "Firefox"
			},
			{
				string: navigator.vendor,
				subString: "Camino",
				identity: "Camino"
			},
			{		// for newer Netscapes (6+)
				string: navigator.userAgent,
				subString: "Netscape",
				identity: "Netscape"
			},
			{
				string: navigator.userAgent,
				subString: "MSIE",
				identity: "Explorer",
				versionSearch: "MSIE"
			},
			{
				string: navigator.userAgent,
				subString: "Gecko",
				identity: "Mozilla",
				versionSearch: "rv"
			},
			{ 		// for older Netscapes (4-)
				string: navigator.userAgent,
				subString: "Mozilla",
				identity: "Netscape",
				versionSearch: "Mozilla"
			}
		],
		dataOS : [
			{
				string: navigator.platform,
				subString: "Win",
				identity: "Windows"
			},
			{
				string: navigator.platform,
				subString: "Mac",
				identity: "Mac"
			},
			{
				   string: navigator.userAgent,
				   subString: "iPhone",
				   identity: "iPhone/iPod"
			},
			{
				string: navigator.platform,
				subString: "Linux",
				identity: "Linux"
			}
		]

	};
	BrowserDetect.init();
	function animateToServerTime(){
			clearInterval(timer);
			var initialHours = 10;
			var t = new Date();
			//t.setHours(14,30,55);//Debug
    		var tMod = new Date(t.getTime()+timeDiffernce);
			t = tMod;
			var hours =  t.getHours()%12 ;
			var minutes = t.getMinutes();
			var seconds = t.getSeconds()+(t.getMilliseconds()/1000);

			var directionMultiplier	;
			var directionDiff 						= hours - initialHours;
			directionDiff							= directionDiff > 0 ? directionDiff - 12 : directionDiff;
			directionMultiplier						= 6 + directionDiff < 0 ? 1 : -1;
			
			var targetHourRotation ;
			var targetMinuteRotation 	;
			var roundTheClock			;
			//Counter Clockwise
			if (directionMultiplier == -1) {
				roundTheClock			= Math.abs(initialHours - hours);
				if (roundTheClock > 6) {
					roundTheClock = Math.abs(roundTheClock - 12);
				}
				targetHourRotation		= -360 + ( 360 / 12 ) * ( hours +   (( 1 / 60 ) * minutes) );
				var deltaH 				= initialRotations.h-360;
				targetHourRotation		-= deltaH;
				targetMinuteRotation 	= -roundTheClock * 360 + ( 360 / 60 ) * ( minutes );
				var deltaM 				= initialRotations.m-360;
				targetMinuteRotation	-= deltaM;
				
			//Clockwise
			} else {
				targetHourRotation		= ( 360 / 12 ) * ( hours +   (( 1 / 60 ) * minutes) );
				
				if (targetHourRotation > initialRotations.h + 180) {
					targetHourRotation -= 360;
				}
				roundTheClock			= Math.abs(initialHours - hours);
				if (roundTheClock > 6) {
					roundTheClock = Math.abs(roundTheClock - 12);
				}
				var deltaH 				= initialRotations.h-360;
				targetHourRotation		+= deltaH*-1;
				targetMinuteRotation 	= roundTheClock * 360 + ( 360 / 60 ) * ( minutes);
				var deltaM 				= initialRotations.m-360;
				targetMinuteRotation	+= deltaM*-1;
			}
			
			var aniTime = minimumAnimationTime + (Math.abs(targetMinuteRotation) / 360 * 0.2);
			aniTime = aniTime*1000;
			var rotationFinalSeconde = ( 360 / 60 ) * (seconds + aniTime/1000);
			var sercondeDelta =  rotationFinalSeconde > initialRotations.s ? rotationFinalSeconde-initialRotations.s : 360 +( rotationFinalSeconde-initialRotations.s) ;
			if(playComplexAnim){
				jc('#sHand').rotate(sercondeDelta,CANDRAN_CENTER.x,CANDRAN_CENTER.y,aniTime,{type:'inOut', fn:'circ'} );			
				jc('#mHand').rotate(targetMinuteRotation,CANDRAN_CENTER.x,CANDRAN_CENTER.y,aniTime,{type:'inOut', fn:'circ'} );			
				jc('#hHand').rotate(targetHourRotation,CANDRAN_CENTER.x,CANDRAN_CENTER.y,aniTime,{type:'inOut', fn:'circ'},launchTimeAnimation );	
			}else{
				jc('#sHand').rotate(sercondeDelta,CANDRAN_CENTER.x,CANDRAN_CENTER.y,aniTime);			
				jc('#mHand').rotate(targetMinuteRotation,CANDRAN_CENTER.x,CANDRAN_CENTER.y,aniTime );			
				jc('#hHand').rotate(targetHourRotation,CANDRAN_CENTER.x,CANDRAN_CENTER.y,aniTime,launchTimeAnimation );	

			}
		
			jc.start(canvaID);
	}
	function launchTimeAnimation(){
		setInterval(tic,1000/FPS);
	}	
	function scriptLoaded(){
		var serverVars = serverResponse.split("&");
		var serverTimeString =serverVars[0];

		var serverTime=serverTimeString.replace("utc=","")*1000;
		var utcDate = new Date(serverTime); 
		var date = new Date(); 
		var gmtHours = -date.getTimezoneOffset()/60;
		date.setUTCDate(utcDate.getDate()); 
		date.setUTCHours(utcDate.getHours()+gmtHours); 
		date.setUTCMonth(utcDate.getMonth()); 
		date.setUTCMinutes(utcDate.getMinutes()); 
		date.setUTCSeconds(utcDate.getSeconds()); 
		date.setUTCMilliseconds(utcDate.getMilliseconds()); 
		timeDiffernce = serverTime - localTime;
		timeGeted = true;
	}
	function tic(){
		var t = new Date();
		if(getTimeFromServer){
			//t.setHours(14,30,55);//Debug
			updateServerLoacleTimeDiff();
			var tMod = new Date(t.getTime()+timeDiffernce);
			t = tMod;
		}
		
		rotateS = ((t.getSeconds()+(t.getMilliseconds()/1000))*360/60);
		rotateM = t.getMinutes()*360/60;
		rotateH = t.getHours()*360/12+ t.getMinutes()*(360/12)/60;
		jc('#mHand').transform(1,0,0,1,0,0,true);
		jc('#mHand').rotate(rotateM,CANDRAN_CENTER.x,CANDRAN_CENTER.y);		
		jc('#hHand').transform(1,0,0,1,0,0,true);
		jc('#hHand').rotate(rotateH,CANDRAN_CENTER.x,CANDRAN_CENTER.y);
		jc('#sHand').transform(1,0,0,1,0,0,true);
		jc('#sHand').rotate(rotateS,CANDRAN_CENTER.x,CANDRAN_CENTER.y);	
		jc.start(canvaID);
		
	}
	var localTime;
	function updateServerLoacleTimeDiff(){
		added =0;
		if(!getTimeFromServer){
			timeDiffernce=0;
			return;
		}
		if(timeGeted){
			updateFromServer++;
			if(updateFromServer>=1500){
				timeGeted = false;
			}
		}else{
			updateFromServer =0;
			try
			{
				localTime = new Date().getTime();
				var headID = document.getElementsByTagName("head")[0]; 
				var newScript = document.createElement('script');
				newScript.type = 'text/javascript';
				newScript.onload=scriptLoaded;
				newScript.src = "http://www.omegawatches.com/getTimesJS.php?r=" + Math.random() ;
				headID.appendChild(newScript);
			}catch(err){
				console.log("error" +err);
				timeDiffernce=0;
				timeGeted = true;
			}
		}
	}
};