// modified for marsha balaeva site 26-10-2010 RW
// see line 184

(function($j){


	Core = {
		carouselContainer: "#CustomCarousel",
		mainImageContainer: "#MainImage",
		mainImageWidth: "620",
		mainImageHeight: "440",
		zIndexLow: "1",
		zIndexHigh: "100",
		slideShowWait: "30",
		delay: "8",
		totalImages: null,
		newImageIndex: null,
		imageLoadCount: 0,
		
		carouselSettings: {
			auto: 2,
			wrap: 'circular',
			scroll: 1,
			animation: 1800,
			easing: 'linear'
		},
		
		onReady: function(){
			var self = this;
			self.initCarousel();
			self.qAndLoadImages();
			self.startSlideShow();
			//pause slide show on hover
			self.pauseSlideShow();
		},
		
		initCarousel: function(){
			var self = this;
			//set up carousel
			jQuery(self.carouselContainer).jcarousel({
				auto: self.carouselSettings.auto,
				wrap: self.carouselSettings.wrap,
				scroll: self.carouselSettings.scroll,
				animation: self.carouselSettings.animation,
				easing: self.carouselSettings.easing,
				initCallback: self.customCarouselCallBack
			});
			
		},
		
		qAndLoadImages: function(){
			var self =this;
			var newImageArr = new Array();
			$j('img', self.carouselContainer).each(function(index){
				
				if(index > 0){
					var imageToLoad = $j(this).parent().attr('href');
					newImageArr.push(imageToLoad);
				}
				
				self.totalImages = index;
				
			});
			
			self.loadNewImage();
		},
		
		loadNewImage: function(){
			var self = this;
			var img = new Image();
			if(self.imageLoadCount !== self.totalImages){
				var imgSrc = $j('a', self.carouselContainer).eq(parseInt(self.imageLoadCount)+1).attr('href');
				$j(img).load(function(){
					$j(this).hide();
					$j(this).css({'position':'absolute', 'top':'0', 'left':'0'});
					$j(self.mainImageContainer).append(this);
					self.imageLoadCount ++;
					self.loadNewImage();
				}).attr('src',imgSrc)
				.attr('width', self.mainImageWidth)
				.attr('height', self.mainImageHeight);
			}
			
		},
		
		startSlideShow: function(newImage){
			var self = this;
			var newImageIndex = newImage || 0;
			$j('img', self.mainImageContainer).each(function(index){
				if($j(this).attr('src') === newImage){
					//set next image in slideshow
					newImageIndex = index;
					self.newImageIndex = newImageIndex;
				}
			});
			
			self.startDelay();
		
		},
		
		
		startDelay: function(){
			var self = this;
			function loadImage(){

				if(self.newImageIndex-1 === self.totalImages) self.newImageIndex = 0;

				//set the zindex of new image in slideshow and fade in
				$j('img', self.mainImageContainer).eq(self.newImageIndex-1).fadeOut()
				$j('img', self.mainImageContainer).eq(self.newImageIndex).css({'z-index':self.zIndexHigh}).fadeIn(800);

				self.newImageIndex += 1;
				self.startDelay();
			}
			
				clearTimeout(self.delay);
				self.delay = setTimeout(loadImage, self.slideShowWait*200);
		},
		
		pauseSlideShow: function(){
			var self = this;
			
			$j(self.mainImageContainer).hover(function(evt){
				
				
				var myTarget = $j(evt.target);
				if(myTarget.is('img')){
					clearTimeout(self.delay);
				}
				
			},function(evt){
					var myTarget = $j(evt.target);
					if(myTarget.is('img')){
						self.startDelay();
					}
				
			});
			
		},
		
		customCarouselCallBack: function(carousel){
			
			// Pause autoscrolling if the user moves with the cursor over the clip.
			carousel.clip.hover(function() {
					clearTimeout(Core.delay);
					carousel.stopAuto();
	        
	    }, function() {
	        carousel.startAuto();
					Core.startDelay();
	    });
	
			//capture the click of the carousel items
			carousel.clip.click(function(evt){
				var clickTarget = $j(evt.target).parent();
				var imageToLoad = clickTarget.attr('href');
				//pause auto scrolling
				 carousel.stopAuto();
				
				//load large image
				Core.loadLargeImage(carousel, imageToLoad);
				
				//stop default action
				return false;
				
			});
			
			//external controls
			if($j('.jcarousel-control').length){
				$j('.jcarousel-control a').bind('click', function() {
					carousel.scroll(jQuery.jcarousel.intval($j(this).text()));
		      	return false;
		    });
			}
		},
		
		loadLargeImage: function(carousel, imageToLoad, onLoad){
			var self = this;
			var imageLoaded = false;
			var initLoad = onLoad || false;
			if(!initLoad){
				//check if image is currently in the dom
				$j('img', self.mainImageContainer).each(function(index){
					$j(this).fadeOut(function(){
						$j(this).css({'z-index': self.zIndexLow});						
					})
				
					//if image is in the dom then set it to the front and fade it in
					if($j(this).attr('src') === imageToLoad){
						$j(this).css({'z-index': self.zIndexHigh});
						$j(this).fadeIn();
						imageLoaded = true;
						self.startSlideShow(imageToLoad);
					}
				})
			}
			//if its not available in the dom, do an ajax call to load and then fade in.
			if(!imageLoaded){
				self.loadNewImage(imageToLoad);
			}
			
		}
		
	};

	$j().ready(function(){
		Core.onReady();
	});

})(jQuery);