/*************CHANGE!!!! for strict validation*******************/
//<![CDATA[
 
 
 
//sets the indexes for stopping
	var indexes=document.createElement('div');
	indexes.style.position="absolute";
	indexes.style.top="220px";/*************CHANGE!!!!*******************/
	indexes.style.left="10px";
	indexes.setAttribute("id","indexes");
	
	var mspans=new Array();
	
 
 
var outCP=0;//i use this variable for the autoscrolling feauture,you dont have to change it 
var outnOS=0;//shame as above
 
//when document is ready the function declared is excecuted
jQuery(document).ready(function($){
var currentPosition = 0;//the current position of the slider
  var slideWidth = 475;//the width we have set in the css.We could get it back programaticaly if we want to,instead of just typing it,but sometimes it takes some time until all elements are positioned
			//if not,remember to set it everytime you use it.
  var slides = $('.slide');//the slides are all divs of class slide
  var numberOfSlides = slides.length;//how many slides we got
	outnOS=numberOfSlides;//just for autoscroller
	
	//we fix the indexes area
	/*
		
	for(var i=0;i<numberOfSlides;i++)
	{
		var separator="&nbsp;";
		if(i==0)
			separator="";
		mspans[i]=document.createElement('span');
		mspans[i].setAttribute("class","index");
		var myA=document.createElement('a');
		myA.setAttribute("href","javascript:stopAndScroll("+i+");void(0);");
		myA.innerHTML=(i+1);
		//myA.style.verticalAlign="center";
		//myA.style.marginBottom="50%";
		mspans[i].appendChild(myA);
		
		mspans[i].style.backgroundImage="url(\'images/black.png\')";
		//IE fix
		var tspan=document.createElement('span');
		tspan.innerHTML=separator;
		//indexes.appendChild(tspan);
		//indexes.appendChild(mspans[i]);
	}
	*/
	//indexes.style.zIndex="10000";
	//document.getElementById('slideshow').appendChild(indexes);
	//mspans[outCP].style.backgroundImage="url(\'images/red.png\')";/*************CHANGE!!!!*******************/
 
  // remove scrollbar (slides are next to each other)
  $('#slidesContainer').css('overflow', 'hidden');//we set overflow hidden so we can hide the hiden slides 
 
  // Wrap all .slides with #slideInner div
	//that means we insert an HTML structure around the slides
  slides
    .wrapAll('<div id="slideInner"></div>')
    // float left to display horizontally, and we readjust .slides width=slideWidth
	.css({
      'float' : 'left',
      'width' : slideWidth
    });
	
  // Set #slideInner width equal to total width of all slides
  $('#slideInner').css('width', slideWidth * numberOfSlides);
 
 
//////controls/////////////
  // Insert right-left arrow in the DOM
  //$('#slideshow')
    //.prepend('<span class="control" id="leftControl">Clicking moves left</span>')
    //.append('<span class="control" id="rightControl">Clicking moves right</span>');
  //We should hide the left arrow control on first load
 
  // create event listeners for .controls clicks
//these controls will be used for the autoscrolles also
  $('.controlLeft')
    .bind('click', function(){
    // determine new position
	currentPosition = currentPosition-1;
	if (currentPosition < 0)
		currentPosition = outnOS-1;
		
    outCP=currentPosition;
    $('#slideInner').animate({
      'marginLeft' : slideWidth*(-currentPosition)
    });
	updateStuff();
  });
 
  $('.controlRight')
    .bind('click', function(){
    // determine new position
	currentPosition = currentPosition+1;
	if (currentPosition >= outnOS)
		currentPosition = 0;
		
    outCP=currentPosition;
    $('#slideInner').animate({
      'marginLeft' : slideWidth*(-currentPosition)
    });
	updateStuff();
  });
  
  $('.controlPause').bind('click', function() {
	autoScroll();
  });

	//autoscrolling
	updateStuff();
	autoScroll();

	function updateStuff() {
		$('.current-slide').html('<a href="'+slides.eq(outCP).find('a').attr('href')+'">'+slides.eq(outCP).find('h2').text()+'</a>');
		$('#slideshow-counter').html((outCP+1) + ' / ' + outnOS);
	}
 
	
});
var tim;
var into=false;

 

function stopAndScroll(to)//moves the slider to the given place (to)
{
	$$$ = jQuery;
	stoper=true;//stops the scrollit;
	if (autoscrollable);
		autoScroll();
	if(outCP==to)
		return;//we are on the right place
	else if(outCP>to)//we have to scroll left
	{
		for(var i=outCP;i>to;i--)
			$$$(".controlLeft").click();
		
	}
	else if(outCP<to)//we have to scroll right
	{
		for(var i=outCP;i<to;i++)
			$$$(".controlRight").click();
		
	}
		outCP=to;
}
 
function autoScroll() {
	$$$ = jQuery;
	if (to != null) {
		clearTimeout(to);
	}
	if (tim != null) {
		clearTimeout(tim);
	}

	if (autoscrollable) {
		autoscrollable = false;
		$$$('.controlPause').css('opacity', '0.5');
	}
	else {
		autoscrollable = true;
		$$$('.controlPause').css('opacity', '1');	
		scrollIt();
	}
	
}

function scrollIt()//autoscrolls the slider
{
	//alert('for(var i='+(outCP+1)+';i>0;i--) $(".controlRight").click()');
	to = setTimeout('jQuery(".controlRight").click()',3500)
	tim=setTimeout('scrollIt()',8000);
}
	
var autoscrollable=false;
var to = null;
var tim = null;
 
/*************CHANGE!!!! for strict validation*******************/
//]]>