var current = {

        "h": -1,

        "m1": -1,

        "m2": -1,

        "s1": -1,

        "s2": -1

    }



	var d1_current = -1;

	var d2_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 paths = {

        "singles": 'images/Single',

        "doubles": 'images/Double'

    }

    

    

    function flip(upperId, lowerId, changeNumber, pathUpper, pathLower){

        var upperBackId = upperId+"Back";

        $(upperId)

            .attr('src', $(upperBackId).attr('src'))

            .height("64px")

            .css({"visibility": "visible", 'display': 'block' });

        

        $(upperBackId).attr('src', pathUpper + parseInt(changeNumber) + ".png");

        

        $(lowerId)

            .attr('src', pathLower + parseInt(changeNumber) + ".png")

            .height('0px')

            .css({"visibility": "visible", 'display': 'block'});

        

        $(upperId).animate({'height': 0}, { 'duration': 200, defaultEasing: 'easeinoutsine', 'complete': function(){

            $(lowerId).animate({'height': 64}, { 'duration': 200, defaultEasing: 'easeinoutsine', 'complete': function(){

                $(lowerId + "Back").attr('src', $(lowerId).attr('src') );

                $(lowerId).add(upperId).css({"visibility": "hidden",

                                             "display": 'inline-block' }).height('0');

            } } )

        } })

    }



    

    function tick(){

        

        var now = new Date(),

            pathSingle = paths.singles,

            pathDouble = paths.doubles;

         

			var ziel = new Date(2012,12,07,00,00,0,0); //finishing time in this format (year, month, day, hours, minutes, seconds, ms)

			timeleft = ziel.getTime() - now.getTime();

			daysleft = Math.floor(timeleft/86400000);

			timeleft = Math.floor(timeleft%86400000);

			hoursleft = Math.floor(timeleft/3600000);

			timeleft = Math.floor(timeleft%3600000);

			minutesleft = Math.floor(timeleft/60000);

			timeleft = Math.floor(timeleft%60000);

			secondsleft = Math.floor(timeleft/1000);



			d1 = Math.floor(daysleft/10);

			d2 = Math.floor(daysleft%10);

			h1 = Math.floor(hoursleft/10);

			h2 = hoursleft

			m1 = Math.floor(minutesleft/10);

			m2 = Math.floor(minutesleft%10);

			s1 = Math.floor(secondsleft/10);

			s2 = Math.floor(secondsleft%10);



/*		console.log(now); */

         

        if( h2 != h2_current){

            flip('#hoursUp', '#hoursDown', h2, pathSingle + '/Up/', pathSingle + '/Down/');

            h2_current = h2;

        }

        

        if( m2 != m2_current){

            flip('#minutesUpRight', '#minutesDownRight', m2, pathDouble + '/Up/Right/', pathDouble + '/Down/Right/');

            m2_current = m2;

            

            flip('#minutesUpLeft', '#minutesDownLeft', m1, pathDouble + '/Up/Left/', pathDouble + '/Down/Left/');

            m1_current = m1;

        }

        

         if (s2 != s2_current){

            flip('#secondsUpRight', '#secondsDownRight', s2, pathDouble + '/Up/Right/', pathDouble + '/Down/Right/');

            s2_current = s2;

            

            flip('#secondsUpLeft', '#secondsDownLeft', s1, pathDouble + '/Up/Left/', pathDouble + '/Down/Left/');

            s1_current = s1;

        }



    }

    



    function retroClock(){

        tick();

        setInterval('tick()', 1000);

    }

    



    $(function(){

        retroClock();

    })