$(document).ready(function() {

	//Speed of the slideshow
	var speed = 7500;
	var teller = $("#excerpt > div").size();
	$('#mask-excerpt').data('teller', teller);
	$('#mask-excerpt').data('even', 0);
	$('#mask-excerpt').data('tellerstand', 1); 
	
	$('#mask-excerpt').data('y', $("#excerpt .item").height());
	$('#mask-excerpt2').data('y', $("#excerpt2 .item2").height());
	$('#mask-excerpt3').data('y', $("#excerpt3 .item3").height());
	$("#excerpt").scrollTop($("#excerpt .item").height());
	$("#excerpt2").scrollTop($("#excerpt2 .item2").height());
	$("#excerpt3").scrollTop($("#excerpt3 .item3").height());



	//You have to specify width and height in #slider CSS properties
	//After that, the following script will set the width and height accordingly
	$('#mask-gallery, #gallery li').width($('#slider').width());	
	$('#gallery').width($('#slider').width() * $('#gallery li').length);
	$('#mask-gallery, #gallery li').height($('#slider').height());
	
	//Assign a timer, so it will run periodically
	var run = setInterval('newsscoller(0)', speed);	
	
	$('#gallery li:first').addClass('selected');

	//Pause the slidershow with clearInterval
	$('#btn-pause').click(function () {
		clearInterval(run);
		return false;
	});

	//Continue the slideshow with setInterval
	$('#btn-play').click(function () {
		run = setInterval('newsscoller(0)', speed);	
		return false;
	});
	
	//Next Slide by calling the function
	$('#btn-next').click(function () {
		newsscoller(0);	
		return false;
	});	

	//Previous slide by passing prev=1
	$('#btn-prev').click(function () {
		newsscoller(1);	
		return false;
	});	
	
	//Mouse over, pause it, on mouse out, resume the slider show
	/*$('#slider').hover(
	
		function() {
			clearInterval(run);
		}, 
		function() {
			run = setInterval('newsscoller(0)', speed);	
		}
	); 	
	*/
});


function newsscoller(prev) {
	var tellerstatus = $('#mask-excerpt').data('tellerstand');

	//Get the current selected item (with selected class), if none was found, get the first item
	var current_image = $('#gallery li.selected').length ? $('#gallery li.selected') : $('#gallery li:first');
	//var current_excerpt = $('#excerpt li.selected').length ? $('#excerpt li.selected') : $('#excerpt li:first');

	//if prev is set to 1 (previous item)
	if (prev) {
		
		//Get previous sibling
		var next_image = (current_image.prev().length) ? current_image.prev() : $('#gallery li:last');
		//var next_excerpt = (current_excerpt.prev().length) ? current_excerpt.prev() : $('#excerpt li:last');
		tellerstatus = tellerstatus - 1;
	//if prev is set to 0 (next item)
	} else {
		tellerstatus = tellerstatus + 1;
		//Get next sibling
		var next_image = (current_image.next().length) ? current_image.next() : $('#gallery li:first');
		//var next_excerpt = (current_excerpt.next().length) ? current_excerpt.next() : $('#excerpt li:first');
		//var next_excerptoff = next_excerpt.offset();
		//var next_excerptofftop = next_excerptoff.top;
		
		
	}

	//clear the selected class
	$('#excerpt li, #gallery li').removeClass('selected');
	
	//reassign the selected class to current items
	next_image.addClass('selected');
	//next_excerpt.addClass('selected');

	//Scroll the items
	
	
	

	if (tellerstatus > 4){tellerstatus = 1;};
	if (tellerstatus < 1){tellerstatus = 4;};
	$('#mask-excerpt').data('tellerstand', tellerstatus);
	
	if (tellerstatus == 1){
		$("#button1").css({ backgroundColor: '#fff', color: '#007ac1'});
		$("#button2").css({ backgroundColor: '#c6c7c8', color: '#fff'});
		$("#button3").css({ backgroundColor: '#c6c7c8', color: '#fff'});
		$("#button4").css({ backgroundColor: '#c6c7c8', color: '#fff'});
	};
	if (tellerstatus == 2){
		$("#button2").css({ backgroundColor: '#fff', color: '#007ac1'});
		$("#button1").css({ backgroundColor: '#c6c7c8', color: '#fff'});
		$("#button3").css({ backgroundColor: '#c6c7c8', color: '#fff'});
		$("#button4").css({ backgroundColor: '#c6c7c8', color: '#fff'});
	};
	if (tellerstatus == 3){
		$("#button3").css({ backgroundColor: '#fff', color: '#007ac1'});
		$("#button2").css({ backgroundColor: '#c6c7c8', color: '#fff'});
		$("#button1").css({ backgroundColor: '#c6c7c8', color: '#fff'});
		$("#button4").css({ backgroundColor: '#c6c7c8', color: '#fff'});
	};
	if (tellerstatus == 4){
		$("#button4").css({ backgroundColor: '#fff', color: '#007ac1'});
		$("#button2").css({ backgroundColor: '#c6c7c8', color: '#fff'});
		$("#button3").css({ backgroundColor: '#c6c7c8', color: '#fff'});
		$("#button1").css({ backgroundColor: '#c6c7c8', color: '#fff'});
	};
	
	$('#mask-excerpt').fadeOut('slow');
	$('#mask-excerpt2').fadeOut('slow');
	$('#mask-excerpt3').fadeOut('slow');
	$('#mask-gallery').scrollTo(next_image, 2000, { easing:'swing',onAfter:function(){
		var even = $('#mask-excerpt').data('even');
		if (even%2 == 0){
			$("#mask-excerpt").css({ top: 90, left: 340 });
			$("#mask-excerpt2").css({ top: 210, left: 600 });
			$("#mask-excerpt3").css({ top: 290, left: 100 });
		} else {
			$("#mask-excerpt").css({ top: 100, left: 50 });
			$("#mask-excerpt2").css({ top: 170, left: 370 });
			$("#mask-excerpt3").css({ top: 300, left: 720 });
		}
		even++;
		$('#mask-excerpt').data('even', even);
					$('#mask-excerpt').fadeIn(250, function() {
					    var y = $('#mask-excerpt').data('y'); 
						$("#excerpt").scrollTop(y);
						var teller = $('#mask-excerpt').data('teller'); 
						var temp = $("#excerpt .item").height();
						var scrollY = $("#excerpt").scrollTop(); 
						
						if ( (scrollY+temp) >= (teller * temp)){
							$("#excerpt").scrollTop($("#excerpt .item").height());
						} else {
							$("#excerpt").scrollTop(scrollY+temp); 	
						}

						var scrollY = $("#excerpt").scrollTop();
						$('#mask-excerpt').data('y', scrollY);
					  });
					$('#mask-excerpt2').fadeIn(250, function() {
					    var y = $('#mask-excerpt2').data('y'); 
						$("#excerpt2").scrollTop(y);
						var teller = $('#mask-excerpt').data('teller'); 
						var temp = $("#excerpt2 .item2").height();
						var scrollY = $("#excerpt2").scrollTop(); 

						if ( (scrollY+temp) >= (teller * temp)){
							$("#excerpt2").scrollTop($("#excerpt2 .item2").height());
						} else {
							$("#excerpt2").scrollTop(scrollY+temp); 	
						}

						var scrollY = $("#excerpt2").scrollTop();
						$('#mask-excerpt2').data('y', scrollY);
					  });
					$('#mask-excerpt3').fadeIn(250, function() {
					    var y = $('#mask-excerpt3').data('y'); 
						$("#excerpt3").scrollTop(y);
						var teller = $('#mask-excerpt').data('teller'); 
						var temp = $("#excerpt3 .item3").height();
						var scrollY = $("#excerpt3").scrollTop(); 

						if ( (scrollY+temp) >= (teller * temp)){
							$("#excerpt3").scrollTop($("#excerpt3 .item3").height());
						} else {
							$("#excerpt3").scrollTop(scrollY+temp); 	
						}

						var scrollY = $("#excerpt3").scrollTop();
						$('#mask-excerpt3').data('y', scrollY);
					  });
	 		}});		
						
	
}