/**
 * catch-image.js
 */
var c = 0;
$(function() {
	
	var CATCH_IMAGE_WIDTH = 981;
	var catchImageTotal   = catchImages.length;
	var progressWidth     = Math.ceil(CATCH_IMAGE_WIDTH / catchImageTotal);
	var imageCounter      = 0;
	var animationCounter  = 0;
	
	var wrapperObj = $('div#wrapper');
	wrapperObj.bind('PRELOAD_COMPLETE.CATCH_IMAGES', function(){
		

		
	});
	wrapperObj.bind('PRELOAD_PROGRESS.CATCH_IMAGES', function(){
		
		imageCounter ++;
		var targetWidth = parseInt(progressWidth * imageCounter);
		$('div#catch-image-progress-bar').stop(true, true).animate({width: targetWidth}, 300, 'easeInOutQuint', function(){

			if(++ animationCounter >= catchImageTotal) {
				
				$(this).parent('div#catch-image-progress-wrapper').animate({'opacity': 0}, 1000, 'easeInOutQuint', function(){
					
					// Catch Images
					var catchImageWrapper = $('h1#catch-image-header');
					var logoWrapper       = $('div#finite-logo');
					var resumeLinkWrapper = $('div#catch-resume-link-wrapper');
					catchImageWrapper.css('width', (CATCH_IMAGE_WIDTH * catchImageTotal) + 'px');
					var html = '';
					for(var i = 0; i < catchImageTotal; i ++) {
						html += '<div class="catch-image-element"><img src="'+ catchImages[i] +'" width="981" height="242" alt="header image '+ i +'" title="" /></div>';
					}
					catchImageWrapper.append(html);
					$('div.catch-image-element').eq(0).css('opacity', 0);
					
					$('div.catch-image-element').eq(0).animate({opacity: 1}, 1000, 'easeInOutQuint', function(){
						$(this).css('filter', 'none');
						
						// Resume
						if(IE) {
							//resumeLinkWrapper.css('bottom', '-25px');
							//resumeLinkWrapper.css('display', 'block');
							//resumeLinkWrapper.animate({bottom: 0}, 500, 'easeInOutQuint');
							resumeLinkWrapper.css({'opacity': 0, display: 'block'});
							resumeLinkWrapper.delay(500).animate({opacity: 1.0}, 500, 'easeInOutQuint', function(){
								$(this).css('filter', 'none');
							});
						} else {
							resumeLinkWrapper.css('opacity', 0);
							resumeLinkWrapper.css('display', 'block');
							resumeLinkWrapper.delay(500).animate({opacity: 1.0}, 500, 'easeInOutQuint', function(){
								$(this).css('filter', 'none');
							});
						}
						
						// Paginator
						$('div#catch-image').horizontalSlideWithPaginator({
							imageHolderId : 'catch-image-header',
							imageChildClass : 'catch-image-element',
							paginatorId : 'catch-image-paginator',
							height : 242,
							speed : 1000,
							easing : 'easeInOutQuint',
							auto : true,
							autoSpeed: 10000
						});
						
					});
					
				});
			}
		});
	});
	wrapperObj.preload({images:catchImages, namespace:'CATCH_IMAGES'});

});