//initial time
var d1_current = -1;
var d2_current = -1;
var h_current = -1;
var h1_current = -1;
var h2_current = -1;
var m1_current = -1;
var m2_current = -1;
var s1_current = -1;
var s2_current= -1;
var time_interval = dateFuture - dateNow;


function flip(upperId, lowerId, changeNumber, pathUpper, pathLower){
	var upperBackId = upperId+"Back";
	$(upperId)
		.attr('src', $(upperBackId).attr('src'))
		.height("70px")
		.css({"visibility": "visible", 'display': 'inline-block' });
	
	$(upperBackId).attr('src', pathUpper + parseInt(changeNumber) + ".png");
	
	$(lowerId)
		.attr('src', pathLower + parseInt(changeNumber) + ".png")
		.height('0px')
		.css({"visibility": "visible", 'display': 'inline-block'});
	
	$(upperId).animate({'height': 0}, { 'duration': 200, defaultEasing: 'easeinout', 'complete': function(){
		$(lowerId).animate({'height': 70}, { 'duration': 200, defaultEasing: 'easeinout', 'complete': function(){
			var lowerBackId = lowerId + "Back";
			$(lowerBackId).attr('src', $(lowerId).attr('src') );
			$(lowerId).add(upperId).css({"visibility": "hidden",
										 "display": 'inline-block' }).height('0');
		} } )
	} })
}


function retroClock(){

	time_interval -= 1000;
	delta = time_interval;
	if(delta < 0){
		return false;
	} else{
		days=0;h=0;mins=0;secs=0;
		
        delta = Math.floor(delta/1000);

		days=Math.floor(delta/86400);
		delta=delta%86400;
		d1 = days / 10;
		d2 = days % 10;

		h=Math.floor(delta/3600);
		delta=delta%3600;
		h1 = h / 10;
		h2 = h % 10;

		mins=Math.floor(delta/60);
		delta=delta%60;
		m1 = mins / 10;
		m2 = mins % 10;

		secs=Math.floor(delta);//seconds
		s1 = secs / 10;
		s2 = secs % 10;
	}

	//change pads

	if( d2 != d2_current){
		flip('#daysUpRight', '#daysDownRight', d2, 'images/clock/white/up/right/', 'images/clock/white/down/right/');
		d2_current = d2;

		flip('#daysUpLeft', '#daysDownLeft', d1, 'images/clock/white/up/left/', 'images/clock/white/down/left/');
		d1_current = d1;
	}

	if( h2 != h2_current){
		flip('#hoursUpRight', '#hoursDownRight', h2, 'images/clock/white/up/right/', 'images/clock/white/down/right/');
		h2_current = h2;

		flip('#hoursUpLeft', '#hoursDownLeft', h1, 'images/clock/white/up/left/', 'images/clock/white/down/left/');
		h1_current = h1;
	}

	if( m2 != m2_current){
		flip('#minutesUpRight', '#minutesDownRight', m2, 'images/clock/white/up/right/', 'images/clock/white/down/right/');
		m2_current = m2;

		flip('#minutesUpLeft', '#minutesDownLeft', m1, 'images/clock/white/up/left/', 'images/clock/white/down/left/');
		m1_current = m1;
	}

	if (s2 != s2_current){
		flip('#secondsUpRight', '#secondsDownRight', s2, 'images/clock/white/up/right/', 'images/clock/white/down/right/');
		s2_current = s2;

		flip('#secondsUpLeft', '#secondsDownLeft', s1, 'images/clock/white/up/left/', 'images/clock/white/down/left/');
		s1_current = s1;
	}

}

$(function(){
	setInterval('retroClock()', 1000);
});