jQuery.fn.jhThumbSlide = function(options) {
	
	var settings = jQuery.extend({
		width: 403, 
		height: 56, 
		margin: 3, 
		speed: 800							 
	}, options);
	
	var thumbUL = this;
	var thumbULCont = this.parent();
	
	thumbUL
	 .addClass("jhThumbSlide")
	 .wrap('<div id="jhThumbSlide-viewer"></div>')
	 .wrap('<div id="jhThumbSlide-prev"><a href="#" title="vorige">vorige</a></div><div id="jhThumbSlide-viewport"></div><div id="jhThumbSlide-next"><a href="#" title="volgende">volgende</a></div>');
	 
	
	var totalImgs = thumbUL.children().length;
	var totalImgWidth = (totalImgs-1)*settings.margin;
	var vpWidth = settings.width - ((settings.margin*2)+40);
	
	$("#jhThumbSlide-viewer").css("opacity", 0);
	var vThumbSlide = setInterval(function() {
		var bImgLoaded = true;
		var strImgArr = "." + thumbUL.attr("class") + " img";
		var images = $(strImgArr);
		
		
		for (var i = 0; i < images.length; i++) {
			var img = images[i];
			if (img.complete == false)
			bImgLoaded = false;
		}
		
		if (bImgLoaded) {			
			images.each(function(i){				
				totalImgWidth += $(images[i]).attr("width");	
			});	
			
			$(".jhThumbSlide").css({		
				height: settings.height +"px",
				width: totalImgWidth+"px"
			});
			
			$(".jhThumbSlide li").css({		
				"margin-right": settings.margin +"px"		
			});
			
			$("#jhThumbSlide-viewer").css({
				width: settings.width +"px",
				height: settings.height +"px"
			});	
			
			$("#jhThumbSlide-viewport").css({
				width: vpWidth +"px",
				height: settings.height +"px"
			});
			
			$("#jhThumbSlide-prev, #jhThumbSlide-next, #jhThumbSlide-prev a, #jhThumbSlide-next a").css({
				height: settings.height +"px"				  
			});
			
			setButtonStatus(totalImgWidth, vpWidth);
			
			$("#jhThumbSlide-prev")
				.css({
					"border-right": settings.margin +"px solid #ffffff"				  
				})				
				.click(function(e){	
					if(!animating){			
						var lft = parseInt($(".jhThumbSlide").css("left"));			
						lft = lNonVis(lft, vpWidth, settings.margin);			
						scrollThumbs(lft, settings.speed);
						setButtonStatus(totalImgWidth, vpWidth, lft);
					}
					e.preventDefault();
				});			
			
			$("#jhThumbSlide-next")
				.css({
					"border-left": settings.margin +"px solid #ffffff"
				})
				.click(function(e){
					var lft = parseInt($(".jhThumbSlide").css("left"));	
					
					if(!animating && !((lft*-1)+vpWidth == totalImgWidth)){							
						lft = rNonVis(lft, vpWidth, settings.margin, totalImgWidth);			
						scrollThumbs(lft, settings.speed);
						setButtonStatus(totalImgWidth, vpWidth, lft);
					}
					e.preventDefault();
				});
			
			clearInterval(vThumbSlide);
			
			$("#jhThumbSlide-viewer").animate({
				opacity: 1				
			},1000);
			$("#jhThumbSlide-viewer img").animate({
				opacity: 0.7				
			},1000)
		}
	}, 500);
	
 };
 
 var animating = false;
 
 function scrollThumbs(pos, speed){
	 animating=true;
	 pos = pos+"px"
	 $(".jhThumbSlide").animate({
		left: pos				  
	}, speed,"swing",function(){
		animating = false;
	});	
 }
 
function rNonVis(lft, vp, mrgn, totW){
	var leftPos = 0;
	var lWdth = 0;
	$(".jhThumbSlide img").each(function(i){										 
		lWdth += $(this).attr("width") + mrgn;
		if(lWdth > (lft*-1) + vp + mrgn){			
			lWdth -= $(this).attr("width") + mrgn;
			leftPos = lWdth*-1;
			if((leftPos*-1)+vp > totW){
				leftPos = (totW-vp)*-1;				
			}			
			return false;
		}		
	});	
	return leftPos;
}
 	
function lNonVis(lft, vp, mrgn){
	var leftPos = 0;
	var lWdth = 0;	
	$(".jhThumbSlide img").each(function(i){										 
		lWdth += $(this).attr("width") + mrgn;		
		if(lWdth >= lft*-1){			
			leftPos = (lWdth-vp)*-1 + mrgn;
			if(leftPos>0){
				leftPos=0;				
			}
			return false;
		}		
	});	
	return leftPos;
}
 
 
function setButtonStatus(totW, vp, lft){
	lft = lft || 0;
	if(totW <= vp || lft==0){
		$("#jhThumbSlide-prev").addClass("jhThumbSlide-disabled");
	}else{
		$("#jhThumbSlide-prev").removeClass("jhThumbSlide-disabled");
	}
	
	if(totW <= vp || lft == (totW-vp)*-1){
		$("#jhThumbSlide-next").addClass("jhThumbSlide-disabled");
	}else{
		$("#jhThumbSlide-next").removeClass("jhThumbSlide-disabled");
	}
}
 
 
 
 
 
 
 
 
 
 
 
 
 
 