// first define the atomic animation effects

function animate_slide_in(slide_id, left_offset, replay_button) {
    // slide over slide
	jQuery('#slide-' + slide_id).animate({
		left : left_offset
	}, 1500, 'easeOutSine', function() {
		//
		jQuery('#slide-' + slide_id + ' .side').animate({
			width : '270px'
		}, 1000, 'easeOutSine', function() {
			jQuery('#slide-' + slide_id + ' .side .slide-content').animate({
				'opacity' : 1
			}, 500, 'easeOutSine', function() {
				
			});
		});

		jQuery('#slide-' + slide_id + ' .side').css('overflow', 'visible');
	});

	jQuery('#slide-' + (slide_id - 1) + ' .side .slide-content').animate({
		'opacity' : 0 
	});

	jQuery('#slide-' + slide_id).css('overflow', 'visible');

	// expand panel

	// reveal text
}

var animation_script = [
    {
         at_time: 1, // 0.001 seconds
         animation: function () {
			jQuery('#slide-1 .side .slide-content').animate({
				'opacity' : 1
			}, 500, 'easeOutSine', function() {
				
			});
		 }
    },
    {
         at_time: 8 * 1000, // 11 seconds
         animation: function () {
			 animate_slide_in('2', 52, false);
		 }
	},
    {
         at_time: 16 * 1000, // 32 seconds
         animation: function () {
			 animate_slide_in('3', 92, false);
		 }
	},
    {
         at_time: 24 * 1000, // 32 seconds
         animation: function () {
			 animate_slide_in('4', 144, false);
		 }
	},
	{
		at_time: 32 * 1000,
		animation: function() {
			jQuery('#slideshow div#slide-4 div.side a.replay').animate({ 'opacity' : 1 });
			//animate_replay();
		}
	}
];

var current_time = 0,
	current_slide_num = -1;

function animate_next() {
    current_slide_num = (current_slide_num < animation_script.length - 1) ? (current_slide_num + 1) : 0;
	
	var next = animation_script[current_slide_num],
		time_between = 0;

	if(typeof next !== 'undefined') {
        time_between = next.at_time - current_time;
		setTimeout(function () {
			current_time = next.at_time;
			next.animation();

			if((current_slide_num < animation_script.length - 1)) {
				animate_next();
			}
		}, time_between);
	}
}

var slides_config = [
	{
		left : 0
	},
	{
		left : 835
	},
	{
		left : 880
	},
	{
		left : 938
	}
];

function animate_replay() {
	for(var i = 0; i < slides_config.length; i++) {
		jQuery('#slide-' + (i + 1)).animate({
			left : slides_config[i].left
		}, 1500, 'easeOutSine', function() {
			jQuery('#slide-2 .side,#slide-3 .side,#slide-4 .side').css('width', '100px');
			current_time = 0;
			animate_next();
		});

		jQuery('#slide-4 .side .slide-content,#slideshow div#slide-4 div.side a.replay').animate({
			'opacity' : 0 
		});
	}
}

function animate_initialize() {
	// show loader until first image is done downloading
	//var first_image = new Image(),
	//	first_image_source = jQuery('#slide-1').css('background-image');

	//first_image.src = first_image_source.substring(4, first_image_source.length - 1);

	//jQuery(first_image).bind('load', function() {
		jQuery('#slide-1').css({ 'left' : '0px' });
		jQuery('#slide-2').css({ 'left' : slides_config[1].left + 'px' });
		jQuery('#slide-3').css({ 'left' : slides_config[2].left + 'px' });
		jQuery('#slide-4').css({ 'left' : slides_config[3].left + 'px' });

		jQuery('#slide-2 .side,#slide-3 .side,#slide-4 .side').css('width', '100px');
		jQuery('.slide .side .slide-content,#slideshow div#slide-4 div.side a.replay').css({ 'opacity' : 0 });
		jQuery('.slide').css({ 'display' : 'block' });
	//});

	jQuery('#slideshow div#slide-4 div.side a.replay').bind('click', function() {
		animate_replay();
	});
}

jQuery(document).ready(function($) {
	animate_initialize();
	animate_next();
});