jQuery(document).ready(function() {
	// Speed of the slideshow
	var speed = 4000;

	// You have to specify width and height in #slider CSS properties
	// After that, the following script will set the width and height accordingly
	jQuery('#mask-slider, #gallery-slider li').width(jQuery('#slider').width());
	jQuery('#gallery-slider').width(jQuery('#slider').width() * jQuery('#gallery-slider li').length);
	jQuery('#mask-slider, #gallery-slider li').height(jQuery('#slider').height());

	// Assign a timer, so it will run periodically
	var run = setInterval('sliderscroller(0)', speed);

	jQuery('#gallery-slider li:first').addClass('selected');

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

	// Continue the slideshow with setInterval
	jQuery('#btn-play').click(function () {
		run = setInterval('sliderscroller(0)', speed);
		return false;
	});

	// Next Slide by calling the function
	jQuery('#btn-next').click(function () {
		sliderscroller(0);
		return false;
	});

	// Previous slide by passing prev=1
	jQuery('#btn-prev').click(function () {
		sliderscroller(1);
		return false;
	});

	// Mouse over, pause it, on mouse out, resume the slider show
	jQuery('#slider').hover(
		function() {
			clearInterval(run);
		},
		function() {
			run = setInterval('sliderscroller(0)', speed);
		}
	);
});

function sliderscroller(prev) {
	// Get the current selected item (with selected class), if none was found, get the first item
	var current_image = jQuery('#gallery-slider li.selected').length ? jQuery('#gallery-slider li.selected') : jQuery('#gallery-slider 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() : jQuery('#gallery-slider li:last');
	} else {
		// Get next sibling
		var next_image = (current_image.next().length) ? current_image.next() : jQuery('#gallery-slider li:first');
	}
	// clear the selected class
	jQuery('#gallery-slider li').removeClass('selected');
	// reassign the selected class to current items
	next_image.addClass('selected');
	// Scroll the items
	jQuery('#mask-slider').scrollTo(next_image, 800);
}