var screenshotScroller = {

	// Vars
	cycle: true,
	cycleDelay: 6000,
	cycleManualClickDelay: 15000,
	
	// Layout initially
	prepare: function(cycle) {
		$('#screen img').each(function (i, img) {
			if (i > 0) $(img).css({
				'display': 'none',
				'z-index': i
			});
		});
		$('#screen').data('screenshotIndex', 0);
		if (cycle) screenshotScroller.cycleWithDelay(screenshotScroller.cycleDelay);
	},
	
	// Omnidirectianlly cycle through screenshots
	cycleScreenshots: function() {
		var screen = $('#screen');
		var currentIndex = screen.data('screenshotIndex');
		screenshotScroller.cycleWithDelay(screenshotScroller.cycleDelay);
		screenshotScroller.showScreenshot((currentIndex+1) % screen.children().length, true);
	},
	
	manuallyShowScreenshot: function(index) {
				
		// Stop cycle timeout and start again in 10 seconds
		var screen = $('#screen');
		screenshotScroller.cycleWithDelay(screenshotScroller.cycleManualClickDelay);
		
		// Show
		return screenshotScroller.showScreenshot(index, false); // Respect index positions, left or right
			
	},
	
	cycleWithDelay: function(delay) {
		var screen = $('#screen');
		clearTimeout(screen.data('cycleTimeout'));
		screen.data('cycleTimeout', setTimeout(screenshotScroller.cycleScreenshots, delay));
	},
	
	// Show a screenshot
	showScreenshot: function(index, omnidirectional) {

		// Get
		var screen = $('#screen');
		var currentIndex = screen.data('screenshotIndex');
		if (currentIndex == index) return false;
		var animating = screen.data('screenshotAnimating');
		if (animating) return false;
		
		// Start
		var width = screen.width();
		var current = $($('#screen img').get(currentIndex));
		var next = $($('#screen img').get(index));
		
		// Position
		var directionRight = index > currentIndex || omnidirectional;
		if (directionRight) {
			// Right
			current.css({'left': '0px', 'display': 'block'});
			next.css({'left': width+'px', 'display': 'block'});
			screen.get(0).scrollLeft = 0;
		} else {
			// Left
			current.css({'left': width+'px', 'display': 'block'});
			next.css({'left': '0px', 'display': 'block'});
			screen.get(0).scrollLeft = width;
		}
		
		// Animate
		screen.data('screenshotAnimating', true);
		screen.animate({ 'scrollLeft': (directionRight ? width : 0)}, 300, 'swing', function() {
			current.css('display', 'none');
			screen.data('screenshotAnimating', false);
		});

		// Finish
		$('#screen').data('screenshotIndex', index)
		return false;
		
	}

};