var isShowingInfo = false;
var currentImage  = -1;
var zIndex;
var totalImages;

function fadeInfo(show) {
	var opacity;
	
	if (show === true) {
		opacity = 1;
	} else {
		opacity = 0;
	}
	
	$('project-info').tween('opacity', opacity);
}

function showImageByOrder(pos, snap) {
	if (pos >= totalImages) {
		document.location = 'http://manualcreative.com' + $('right').get('href');
	}
	
	currentImage = pos;
	
	zIndex = zIndex + 1;
	
	var image = $(document.body).getElements('ul li')[pos];
	
	if (snap === true) {
		image.setStyle('opacity', 1);
	} else {
		image.setStyle('opacity', 0);
		image.tween('opacity', 1);
	}
	
	image.setStyle('z-index', zIndex);
}

window.addEvent('domready', function() {
	var body     = $(document.body);
	var projects = body.getElements('ul li');
	totalImages  = projects.length;
	zIndex       = totalImages;
	
	showImageByOrder(0, true);
	
	body.getElement('ul').addClass('stack');
	body.getElements('ul li').each(function (el, i) {
		el.setStyle('z-index', totalImages - i);
		el.setStyle('cursor', 'pointer');
		el.addEvent('click', function (e) {
			showImageByOrder(currentImage + 1, false);
			
			e = new Event(e);
			e.stop();
		});
	});
	
	body.getElement('h3').setStyle('cursor', 'pointer');
	body.getElement('h3').addEvents({
		'mouseover' : function() {
			if (isShowingInfo === false) {
				fadeInfo(true);
			}
		},
		'mouseout' : function() {
			if (isShowingInfo === false) {
				fadeInfo(false);
			}
		},
		'click' : function(e) {
			if (isShowingInfo === true) {
				isShowingInfo = false;
				fadeInfo(false);
			} else {
				isShowingInfo = true;
				fadeInfo(true);
			}
			
			e = new Event(e);
			e.stop();
		}
	});
	$('project-info').setStyle('opacity', 0);
	$('project-info').addClass('overlay');
});