var slide, slidingContent, children, totalWidth, maxHeight, slideOverlayLeft, slideOverlayRight, slideOverlayArrowLeft, slideOverlayArrowRight, timer, scrollSpeed;

function slideMove() {
	var x = slidingContent.css("left");
	x = x.replace("px", "") * 1;
	if(x < -totalWidth) x += totalWidth;
	if(x > 0) x -= totalWidth;
	x += scrollSpeed;
	slidingContent.css({"left" : (x + "px")});
}

$(document).ready(function() {
	scrollSpeed = 1;
	slide = $(".slide");
	slidingContent = $(".sliding-content");
	if(slide.length > 0 && slidingContent.length > 0) {
		children = slidingContent.children("li.sliding-element");
		totalWidth = 0;
		maxHeight = 0;
		children.each(function() {
			totalWidth+=this.offsetWidth;
			if(this.offsetHeight>maxHeight) maxHeight=this.offsetHeight;
		});
		children.clone().appendTo(slidingContent);
		slide.css({"height" : (maxHeight + "px")});
		slidingContent.css({"position" : "absolute", "left": "0px", "top": "0px", "width" : ((totalWidth * 2) + "px")});
		slide.append('<div class="slide-overlay-left"></div>');
		slide.append('<div class="slide-overlay-right"></div>');
		slideOverlayLeft = $(".slide-overlay-left");
		slideOverlayRight = $(".slide-overlay-right");
		slideOverlayLeft.append('<div class="slide-overlay-arrow-left"></div>');
		slideOverlayRight.append('<div class="slide-overlay-arrow-right"></div>');
		slideOverlayArrowLeft = $(".slide-overlay-arrow-left");
		slideOverlayArrowRight = $(".slide-overlay-arrow-right");
		slideOverlayLeft.css({"position" : "absolute", "top" : "7px", "left" : "0px", "width" : "50px", "height" : (slide.get(0).offsetHeight + "px")});
		slideOverlayRight.css({"position" : "absolute", "top" : "7px", "right" : "0px", "width" : "50px", "height" : (slide.get(0).offsetHeight + "px")});
		slideOverlayArrowLeft.css({"display" : "none", "height" : (slide.get(0).offsetHeight + "px")});
		slideOverlayArrowRight.css({"display" : "none", "height" : (slide.get(0).offsetHeight + "px")});
		timer = null;

		slide.hover(function() {
			if (scrollSpeed == 1) scrollSpeed = 0;
		}, function() {
			scrollSpeed = 1;
		});

		slideOverlayLeft.hover(function() {
			slideOverlayArrowLeft.css("display", "block");
			scrollSpeed = -3;
		},
		function() {
			slideOverlayArrowLeft.css("display", "none");
			scrollSpeed = 1;
		});

		slideOverlayRight.hover(function() {
			slideOverlayArrowRight.css("display", "block");
			scrollSpeed = 3;
		},
		function() {
			slideOverlayArrowRight.css("display", "none");
			scrollSpeed = 1;
		});

		slideOverlayRight.hover(function() {slideOverlayArrowRight.css("display", "block")}, function() {slideOverlayArrowRight.css("display", "none")});

		if(timer==null) timer=setInterval("slideMove()", 10);
	}
});