//
// jquery.showcase.js
//

(function($){
	// Common Valiables
	var _self, timer;
	var settings = {};
	var current = 0, next = 1, len = 0;
	var imagePool, menuPool, attrPool = [];
	var BASE_ZINDEX = 100;
	
	// Settings
	var defaults = {
		imagesClassName: "images",
		menusClassName: "menus",
		activeMenuClassName: "active",
		autoslide: true,
		duration: 5000
	};
	
	//
	// Functions
	//
	
	// Start Slide Timer
	var startTimer = function(){
		//console.log("Start timer");
		timer = setTimeout(function(){
			try{
				update();
			}catch(e){
				//console.log(e);
				stopTimer();
			}
		}, settings.duration);
	};
	// Stop Slide Timer
	var stopTimer = function(){
		//console.log("Stop timer");
		clearTimeout(timer);
	};
	// Regular Interval Update
	var update = function(){
		//console.log("update "+current+" -> "+next);
		swapImages();
		removeTrigger();
		toggleTrigger(next, 500);
		moveImage();
	};
	// Use Autoslide
	var startAutoslide = function(){
		//console.log("start autoslide");
		settings.autoslide = true;
		startTimer();
	};
	// Stop Autoslide
	var stopAutoslide = function(){
		//console.log("stop autoslide");
		settings.autoslide = false;
		stopTimer();
	};
	// Swap z-index of Images
	var swapImages = function(){
		
		// All Images Down to Bottom
		imagePool.each(function(){
			$(this).css("zIndex", BASE_ZINDEX-2)
				.css("left", 0)
				.find("img")
				.css("margin-left", 0);
		});
		
		// Current Image Raise to Top
		var currentImage = imagePool.get(current);
		$(currentImage).css("zIndex", BASE_ZINDEX);
		
		// Next Image Raise to Second
		var nextImage = imagePool.get(next);
		$(nextImage).css("zIndex", BASE_ZINDEX-1);
	};
	// Slide Animation Execute
	var moveImage = function(){
		$(imagePool.get(current)).animate({ 
			left: "-1020px"
		}, 1000, "easeInCubic", function(){
			onAnimationFinish();
		}).find("img").animate({
			"margin-left": "510px"
		}, 1000, "easeInCubic");
	};
	// Slide Animation Callback
	var onAnimationFinish = function(){
		// Count Up
		current = next++;
		
		// Counter Reset
		if(next>=len) { next=0; }
		
		// Update Recurse
		setTrigger();
		if(settings.autoslide) { startTimer(); }
	};
	// Set Trigger with Menus
	var setTrigger = function(){
		menuPool.each(function(){
			$(this).click(function(){
				onTriggerClick(this);
			}).addClass(settings.activeMenuClassName)
			.fadeTo(0, uniteAlphaTarget(1));
		});
	};
	// Remove Trigger with Menus
	var removeTrigger = function(){
		menuPool.each(function(){
			$(this).unbind("click")
				.removeClass(settings.activeMenuClassName)
				.fadeTo(0, uniteAlphaTarget(0.4));
		});
	};
	var uniteAlphaTarget = function(a){
		if(navigator.userAgent.indexOf("MSIE")!==-1){
			var ver = navigator.userAgent.match(/MSIE (\d+)/);
			if(ver&&ver[1]<9){
				a = a*0.5;
			}
		}
		return a;
	};
	// Click Menus Callback
	var onTriggerClick = function(element){
		
		// Do Nothing If Same Image
		var clicked = menuPool.index(element);
		if(current===clicked) { return; }
		
		// Change Counter
		next = clicked;
		
		if(!settings.autoslide) { startAutoslide(); }//Watch out for the timer to increase!
		stopTimer();
		update();
	};
	// Trigger Animation Execute
	var toggleTrigger = function(num, duration){
		if(num===undefined) { num=0; }
		if(duration===undefined) { duration=0; }
		menuPool.each(function(){
			var me = menuPool.index(this);
			var src = $(this).find("img").attr("src");
			if(me===num){
				$(this).find("img").attr("src", src.replace(/_off./, "_on."));
				
			} else {
				$(this).find("img").attr("src", src.replace(/_on./, "_off."));
			}
		});
	};
	
	//
	// Public Methods
	//
	var methods = {
		init : function(options){
			
			//console.log("Initializing");
			settings = $.extend(defaults, options||{});
			
			// Find Images and Menus
			imagePool = _self.find("."+settings.imagesClassName+" li");
			menuPool = _self.find("."+settings.menusClassName+" li");
			
			imagePool.each(function(){
				$(this).css("overflow", "hidden")
					.find("a")
					//.css("position", "absolute")
					.css("display", "block")
					.css("left", 0)
					.css("top", 0);
			});
			
			// Initializing Triggers
			menuPool.each(function(){
				$(this).css("overflow", "hidden")
				.css("cursor", "pointer");
				attrPool.push($(this).width());
			});
			toggleTrigger();
			setTrigger();
			
			// Get Showcase Count
			var a = imagePool.size();
			var b = menuPool.size();
			len = (a<=b) ?a :b;
			
			swapImages();
			
			// Loading effects
			_self.find("."+settings.imagesClassName).fadeOut(0);
			_self.append(
				$('<img/>').attr("src", "img/com/loading.gif")
					.addClass("loading")
					.css("position", "absolute")
					.css("left", "50%")
					.css("top", "130px")
					.css("margin-left", "-12px")
			);
			
			$(window).load(function(){
				_self.find('.loading').fadeOut(500);
				_self.find("."+settings.imagesClassName).fadeIn(500, function(){
					startTimer();
				});
			});
		},
		startAutoslide: function(){
			startAutoslide();
		},
		stopAutoslide: function(){
			stopAutoslide();
		}
	};

	//
	// Constructor
	//
	$.fn.showcase = function( method ) {
		_self = $(this);
			
		// Method calling logic
		if ( methods[method] ) {
			return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
		} else if ( typeof method === 'object' || ! method ) {
			return methods.init.apply( this, arguments );
		} else {
			$.error( 'Method ' +  method + ' does not exist on jQuery.showcase' );
		}
		return this;
	};
})(jQuery);