/*	Sliditron 2000
	By Matt Lantz
	http://mlantz.ca

	A simple yet clean and working jQuery gallery plugin - so to speak
	It's simple enough. Just make sure you dont delete this little blurb of my junk! 
	This little guy works for holding your slides and shifting them along. Now originally 
	I got some of this from another persons gallery plug-in, but they didnt info for me to 
	give credit. So anyway, this one has the basic features of a slider gallery accept that 
	it has a pager at the bottom indicating what slide your on. I think its a very nice 
	addition to the galler. Other than that it can be transformed however you want!
*/

$(document).ready(function(){
  
  var currentPosition = 0;
  var slideWidth = 600;
  var speed = 700;
  var slides = $('.slide');
  var numberOfSlides = slides.length;
	
  	// Remove the scrollbar in JS
  	$('#slidesContainer').css('overflow', 'hidden');

  	// Wrap all .slides with #slideInner div
  	slides
    .wrapAll('<div id="slideInner"></div>')
    // Float left to display horizontally, readjust .slides width
	.css({
      'float' : 'left',
      'width' : slideWidth
    });

  	// Set #slideInner width equal to total width of all slides
  	$('#slideInner').css('width', slideWidth * numberOfSlides);
	  
	//Ok folks now its time for what I call pagination! those little dots!
	for( p = 0; p <= numberOfSlides-1; p++){
	$('#pagination').append('<div style="width: 25px; height: 25px; background: url(images/grey_dot.png) no-repeat; margin: 0 2px; float: left;" class="paged" id="'+p+'" onmouseover="this.style.cursor=\'pointer\'"></div>');
	}
	
	//make sure that first dot is highlighted right away!
	if($("#slideInner").css('margin-left','0')){ $("#0").css('background','url(images/blue_dot.png) no-repeat'); }
	
	// Set up the function and actions of the gallery! 
	
	if(numberOfSlides > 1){
  	$('#slideshow')
		.prepend('<span class="control" id="leftControl">Clicking moves left</span>')
		.append('<span class="control" id="rightControl">Clicking moves right</span>');
	manageControls(currentPosition);
	
	}
	//Time to bind some controls and get it working!
	$('.control').bind('click',function(){
		if($(this).attr('id')=='rightControl'){ currentPosition++; moveIt(currentPosition);}else{ currentPosition--; moveIt(currentPosition); }
		if($(this).attr('id')=='rightControl'){ colchng(currentPosition); }else{ colchng(currentPosition); }
		manageControls(currentPosition);
	});
	
	//Bind those little dots, cant forget them	
	$('.paged').bind('click', function(){
		var d = $(this).attr('id');
		currentPosition = d;
		moveIt(d);
		colchng(currentPosition)
	});
	
	//Just the manage controls function
	function manageControls(position){
		if(position==0){ $('#leftControl').hide() } else{ $('#leftControl').show() }
    	if(position==numberOfSlides-1){ $('#rightControl').hide() } else{ $('#rightControl').show() }
  	}	
	
	//Some moving action for those dots and arrows
	function moveIt(p){
	$('#slideInner').animate({'margin-left' : slideWidth * -p }, 700);
	currentPosition === p;
	manageControls(p);
	}
	
	});
	
	//changing those little dots
	function colchng(p){
	$('.paged').css('background', 'url(images/grey_dot.png) no-repeat');
	$('#'+p+'').css('background', 'url(images/blue_dot.png) no-repeat');
	}