$(document).ready(function() {
						   
	
	//window that "crops" slider
	slideview = $("#gallery");
	bigimages = $(".dispimg");
	
	//div that holds slides on absolute pos
	slidecontain = $("#contain");
	slidecontain_imgs = $("#contain img");
	
	//ids of left / right buttons
	bleft = $("#gal_left");
	bright = $("#gal_right");
	
	//div containing cycling large images

	
	//speed of the slides moving
	duration = 500;
	
	
	// DONT GO BEYOND THIS POINT!
	// nasty monsters lurk, be warned!!!
	
	
	// calculate width for image slider 
	numImages = slidecontain_imgs.size();
	imgWidth = slidecontain_imgs.width();
	fullWidth = numImages * imgWidth;
	
	// set width for image slider
	slidecontain.width(fullWidth);
	
	
	//calculate the endpoint (left position) (relative to the width of the view area)
	viewWidth = slideview.width();
	finalval = fullWidth - viewWidth;
	finalWidth = finalval * 2;
	finalLeft = finalval - finalWidth;
	
	//onclick functions for left and right
	
	var slideC=0;
	var last=$('.dispimg img').length-1;
	bleft.click(function(){
		if(slideC==0)slideC=last; else slideC--;	
		if(slideC==0) { gogo=0; } else { gogo="-"+(slideC * imgWidth); }	
		slidecontain.animate({left: gogo},{queue: false, duration:duration});
		return false;
	});

	bright.click(function(){
	
		if(slideC==last)slideC=0; else slideC++;
		if(slideC==0) { gogo=0; } else { gogo="-"+(slideC * imgWidth);}
		slidecontain.animate({left: gogo},{queue: false, duration:duration});
		return false;
	});
	
	slidecontain.children('img').click(function(){
			var index = slidecontain.children('img').index(this);
			bigimages.children().fadeOut().eq(index).fadeIn();
			imgtitle(index);	
			return false;
	});
	
	function imgtitle(index) {
		index++;
		$('#imgtitle').text("Dress " + index);
	}
	imgtitle(0);

	
	
});