jQuery(document).ready(
		function() {
			var slideInterval = 15000;	// milliseconds

			var slideCSSWidth = (jQuery('#slideshow').css("width")) ? jQuery(
					'#slideshow').css("width") : "0px";

			var slideWidth = slideCSSWidth.replace(/px/g, "");

			var slides = jQuery('.slide');
			var numberOfSlides = slides.length;

			var duration = 300;
			var menuItems = [];
			var timer;
			var timerIsOn = 1;

			jQuery('#main-navigation li.home').mouseover(function() {
				jQuery('#main-navigation li.begin').addClass('hover');
			}).mouseout(function() {
				jQuery('#main-navigation li.begin').removeClass('hover');
			});
			jQuery('#main-navigation li').mousedown(function() {
				jQuery(this).addClass('active-pseudo');
			}).mouseup(function() {
				jQuery(this).removeClass('active-pseudo');
			});
			jQuery('#main-navigation li.home').mousedown(function() {
				jQuery('#main-navigation li.begin').addClass('active-pseudo');
			}).mouseup(
					function() {
						jQuery('#main-navigation li.begin').removeClass(
								'active-pseudo');
					});

			jQuery("#pageBg-outside #main-navigation li").each(
					function() {
						if (!jQuery(this).hasClass("divider-bg")
								&& !jQuery(this).hasClass("begin")
								&& !jQuery(this).hasClass("end")) {
							menuItems.push(jQuery(this));
						}
					});

			// Remove scrollbar in JS
			jQuery('#slidesContainer').css('overflow', 'hidden');

			// Wrap all .slides with #slideInner div
			slides
			// .wrapAll('<div id="slideInner" class="clearfix"></div>')
			// Float left to display horizontally, readjust .slides width
			.css({
				'float' : 'left',
				'width' : slideWidth,
				'display' : 'none'
			});
			jQuery('#slideInner .slide:first').css({
				'display' : 'block'
			});

			// Set #slideInner width equal to total width of all slides
			jQuery('#slideInner').css('width', slideWidth * numberOfSlides);

			// Insert controls in the DOM
			jQuery('#slideshow').prepend(
					'<span class="control" id="leftControl"></span>').append(
					'<span class="control" id="rightControl"></span>');
			jQuery('#leftControl').bind('click', stopSlideRight);
			jQuery('#rightControl').bind('click', stopSlideLeft);

			timer = window.setTimeout(function() {autoSlide();}, slideInterval);

			function stopTimer() {
				timerIsOn = 0;
				window.clearTimeout(timer);
			}

			function autoSlide() {
				slideLeft(true);
				if (timerIsOn) {
					timer = window.setTimeout(function() {autoSlide();}, slideInterval);
				}
			}

			function stopSlideLeft() {
				if (timerIsOn) {
					stopTimer();
				}
				slideLeft();
			}

			function slideLeft(isAuto) {
				jQuery('#slideInner .slide:first + .slide').css({
					'display' : 'block'
				});
				jQuery('#slideInner').animate({
					'marginLeft' : -slideWidth
				}, {
					duration : duration,
					queue : false,
					complete : function() {
						var first = jQuery('#slideInner .slide:first');
						jQuery('#slideInner').append(first);
						jQuery('#slideInner').css({
							'marginLeft' : 0
						});
						jQuery('#slideInner .slide:last').css({
							'display' : 'none'
						});
						jQuery('#slideInner .slide:first').css({
							'display' : 'block'
						});
					}
				});
				
				// as definded in /layout/default/tracking/script_http.xhtml
				if(!isAuto) doTrack();
			}

			function stopSlideRight() {
				if (timerIsOn) {
					stopTimer();
				}
				var last = jQuery('#slideInner .slide:last');
				last.css({
					'display' : 'block'
				});
				jQuery('#slideInner').prepend(last);
				jQuery('#slideInner').css({
					'marginLeft' : -slideWidth
				});
				jQuery('#slideInner').animate({
					'marginLeft' : 0
				}, {
					duration : duration,
					queue : false,
					complete : function() {
						jQuery('#slideInner .slide:first + .slide').css({
							'display' : 'none'
						});
					}
				});
				
				// as definded in /layout/default/tracking/script_http.xhtml
				doTrack();
			}

		});

/*
 * This method adds or removes a specific css class from an element.
 */
function toggleClass(element, css) {
	if (jQuery("#main-navigation ." + element).hasClass(css)) {
		jQuery("#main-navigation ." + element).removeClass(css);
	} else {
		jQuery("#main-navigation ." + element).addClass(css);
	}
}

