/*

	2009.07.05
	SlideView Component
	developled by Robin at ELFVision and PageTalks
	used mainly in the WUSESKY Project
	
	Visit Robin's:
	http://www.elfvision.com/
	http://pagetalks.com/
	
	and See our Project
	http://www.wusesky.com/

*/
(function($) {
$.iSlideView = {
	build: function(user_options) {
		var defaults = {
			thumbPrefix: "thumb_",
			frame: {
				isExist: true,
				color: "#365563"
			},
			slideBy : 3,
			speed: 150,
			easeOut: "swing",
			easeIn: "swing",
			easeThumb: "swing"
		};
		return $(this).each(function() {
			var options = $.extend(defaults, user_options);
			
			var x =$(this);
			var list  = x.find(".slideView");
			var links = list.find("a");
			var images = list.find("img");
			
			links.click(function() {
				return false;
			});
			
			if(options.frame.isExist) {//Insert a frame
				var xW = x.width();
				var xH = x.height();
				$("<div class='slideFrame' />").appendTo(x).css({
					width: xW-2,
					height: xH-2,
					border: "1px solid "+ options.frame.color,
					position: "absolute",
					top: 0,
					left: 0,
					zIndex: 4
				});
			}
			
			//Insert thumb list, arrows, captions
			x.prepend("<span class='desc'></span><div class='slidebar'><span class='arrowL arrow'><</span><div class='wrap'><ul class='thumbList'></ul></div><span class='arrowR arrow'>></span></div>");
			
			var slidebar = x.find("div.slidebar");
			var thumbList = x.find(".thumbList");
			var thumbCon = x.find("div.wrap");
			
			slidebar.fadeTo("fast",0.8);
			
			$.each(images,function(index,img){
				thumbList.append("<li>"+
					"<a href='#' id='"+ (index+1) +"'><img src='"+getThumbName(img.src,options.thumbPrefix)+"' alt='"+img.alt+"' /></a></li>");
			});
			
			
			var arrow = x.find(".arrow");
			var back = x.find(".arrowL");
			var next = x.find(".arrowR");
			
			
			
			var li = thumbList.find("li");
			var liW = li.width();
			var totalW = li.length * liW;
			
			thumbList.css("width",totalW).hover(function() {
				slidebar.fadeTo("fast",1);
			},
			function() {
				slidebar.fadeTo("fast",0.8);
			});
	
			var desc = x.find(".desc");
			desc.text(images.eq(0).attr("alt")).fadeTo("fast",0.8).hover(function() {
				$(this).fadeTo("fast",1);
			},function() {
				$(this).fadeTo("fast",0.8);
			});
			
			var xTotalH = li.length * xH;
			list.css("height",xTotalH);
						
			var Pointer = 0;
			var total = li.length;
			back.fadeTo("fast",0.5);
			next.click(function() { if( total - Pointer >= options.slideBy ) {
				var offsetL =  parseInt(thumbList.css("left")) - liW * options.slideBy;
				thumbList.animate({
					left: offsetL + "px"
				},options.speed,options.easeThumb,function() {
					
					
					desc.text(images.eq(Pointer).attr("alt"));
					var offsetT = - (xH * Pointer);
					
					list.animate({
						top: offsetT
					},options.speed,options.easein);
				});
				Pointer+=options.slideBy;
				$("#ind").text(Pointer);
				
				back.fadeTo("fast",1);
				if( total - Pointer < options.slideBy )// when slide to the end
						next.fadeTo("fast",0.5);
			}
			});
			
			back.click(function() { if(Pointer!=0) {
			
				var offsetL =  parseInt(thumbList.css("left")) + liW * options.slideBy;
				thumbList.animate({
					left: offsetL + "px"
				},options.speed,options.easeThumb,function() {
					desc.text(images.eq(Pointer).attr("alt"));
					var offsetT = - (xH * Pointer);
					list.animate({
						top: offsetT
					},options.speed,options.easeOut);
					
				});
				Pointer-=options.slideBy;
				$("#ind").text(Pointer);
				
				next.fadeTo("fast",1);
				if(Pointer==0)//when slide back to the start
					back.fadeTo("fast",0.5);
			} 
			});
			
			
			var tLink = thumbList.find("a");
			var isBusy = false;
			tLink.each(function(index) {
				if( index != Pointer) {
				$(this).hover(function(event) { 
					var id = this.id-1;
					var offsetT = - ( xH * id );
					desc.text(images.eq(id).attr("alt"));
					if(isBusy) {
						list.stop();
					}
					isBusy = true;
					list.animate({
							top: offsetT
						},options.speed,options.easeIn,function() {
							isBusy = false;
						});
				},function(event) { 
					var offsetT = - (xH * Pointer);
					desc.text(images.eq(Pointer).attr("alt"));
					if(isBusy) {
						list.stop();
					}
					isBusy = true;
					list.animate({
							top: offsetT
						},options.speed,options.easeOut,function() {
							isBusy = false;
						}); 
				});
				}
				
			});
			
			
			
		});
	}
}

$.fn.slideView = $.iSlideView.build;

//Helping functions

function getThumbName(n,prefix) {
	var arr = n.split("/");
	var tl = n.length;
	var w = arr[arr.length-1].length;
	return n.substr(0,tl-w-1)+"/"+prefix+arr[arr.length-1];
}

function focusTo(pointer,list,height,speed,desc,text) {
	//alert(pointer);
	var id = pointer - 1;
	var offsetT = - (height * id);
	list.animate({
		top: offsetT
	},speed);
	desc.text(text);
}
})(jQuery);