// written by dannyboyyy
var introduction, portfolio, original_text, btn;

Fx.implement({options: {
	duration: 1250,
	transition: 'expo:in:out'
}});

Element.implement({
	fadeAndAfterwards: function(callback) {
		var self = this;
		this.set('tween', {
			onComplete: function(){
				callback();
				self.set('tween', {onComplete: $empty});
			}
		});
		this.fade('out');
	}
});

window.addEvent('domready', initializeToggler);

function initializeToggler() {
	btn = $('show-work');
	introduction = $$('div.introduction')[0];
	portfolio = $$('div.portfolio')[0];
	portfolio.set('opacity', 0);
	
	original_text = btn.get('text');
}

function toggleThat() {
	if (introduction.getStyle('display') != 'none') {
		// portfolio in
		btn.fade('out');
		introduction.fadeAndAfterwards(function(){
			introduction.setStyle('display', 'none');
			portfolio.setStyle('display', 'block');
			portfolio.fade('in');
			btn.set('text', 'Go back');
			btn.fade('in');
		});
	} else {
		// introduction in
		btn.fade('out');
		portfolio.fadeAndAfterwards(function(){
			portfolio.setStyle('display', 'none');
			introduction.setStyle('display', 'block');
			introduction.fade('in');
			btn.set('text', original_text);
			btn.fade('in');
		});
	}
}