var Veo = {
	windowX: 0,
	windowY: 0,
	currentWindow: 0,
	currentPreview: 0,
	previewImages: null,
	noPreview: 0,
	periodicPreview: null
}

window.addEvent('domready', function() {
	updateWindowDimentions();
	
	$$('.veoNavigate').addEvent('click', function(e) {
		e.stop();
		navigateWindow(e.target.get('rel'));
	});
	
	Veo.previewImages = $$('.websitePreview');
	Veo.noPreview = Veo.previewImages.length;
	changePreview(true);
	Veo.periodicPreview = changePreview.periodical(3000, false);
	
	$('previewNext').addEvent('click', function() {
		$clear(Veo.periodicPreview);
		changePreview(false);
		Veo.periodicPreview = changePreview.periodical(3000, false);
	});
	
	$('previewBack').addEvent('click', function() {
		$clear(Veo.periodicPreview);
		backPreview();
		Veo.periodicPreview = changePreview.periodical(3000, false);
	});
});

window.addEvent('resize', function() {
	updateWindowDimentions();
});

var backPreview = function() {
	Veo.previewImages[Veo.currentPreview].tween('opacity', 0.0)

	Veo.currentPreview--;
	
	if(Veo.currentPreview == -1)
		Veo.currentPreview = Veo.noPreview-1;

	Veo.previewImages[Veo.currentPreview].tween('opacity', 0.0, 1.0);
};

var changePreview = function(first) {
	if(!first)
		Veo.previewImages[Veo.currentPreview].tween('opacity', 0.0)

	Veo.currentPreview++;
	
	if(Veo.currentPreview == Veo.noPreview)
		Veo.currentPreview = 0;

	Veo.previewImages[Veo.currentPreview].tween('opacity', 0.0, 1.0);
};

var updateWindowDimentions = function() {
	var windowSize = window.getSize();
	Veo.windowX = windowSize.x;
	Veo.windowY = windowSize.y;
	
	$$('.window').setStyle('width', Veo.windowX + 'px');
}

var navigateWindow = function(screenID) {
	var marginLeft = screenID * Veo.windowX;
	$('slider').tween('margin-left', '-' + marginLeft + 'px');
}