document.observe('dom:loaded', function () {
	if (/iPhone/.test(navigator.userAgent)) { return; }
	
	if (document.getElementById('portfolio')) {
		$('portfolio').insert({
			after: new Element('section', { id: 'portfolio_right' })
		});
	}
	
	$('about', 'sixteen', 'manorclinic', 'weaponsgrade', 'threeforagirl').each(function (el) {
		$('portfolio_right').insert(el);
	});

	var elements = $$('article').invoke('wrap', 'div', { style: 'overflow:hidden;width:100%' }),
		design_elements = $$('article.design').invoke('up').invoke('addClassName', 'design'),
		build_elements = $$('article.build').invoke('up').invoke('addClassName', 'build'),
		navigation = $$('*[role=navigation] a[href]');
	
	elements.each(function (el) {
		el.writeAttribute('data-height', el.measure('margin-box-height'));
	});
	
	Event.observe(window, 'load', function () {
		elements.each(function (el) {
			el.writeAttribute('data-height', el.measure('margin-box-height'));
		});
	});
	
	var irrelevant = function (element) {
		element.morph('opacity:0.5', { duration: 0.5 });
		return new S2.FX.SlideUp(element, { duration: 0.9, transition: S2.FX.Transitions.easeInOutCubic }).play();
	}
	
	var important = function (element) {
		element.morph('opacity:1', { duration: 1.5 });
		return new S2.FX.SlideDown(element, {
			duration: 0.9,
			transition: S2.FX.Transitions.easeInOutCubic,
			after: function () {
				element.setStyle('overflow:hidden');
			}
		}).play();
	}
	
	navigation.invoke('observe', 'click', function (event) {
		event.stop();
		
		navigation.invoke('removeClassName', 'active');
		this.addClassName('active');
		
		if (this.id === 'design') {
			elements.each(function (el) {
				if (el.visible() && !el.hasClassName('design')) {
					irrelevant(el);
				}
			});
			
			design_elements.each(function (el) {
				if (!el.visible()) {
					important(el);
				}
			});
		} else if (this.id === 'build') {
			elements.each(function (el) {
				if (el.visible() && !el.hasClassName('build')) {
					irrelevant(el);
				}
			});
			
			build_elements.each(function (el) {
				if (!el.visible()) {
					important(el);
				}
			});
		} else {
			elements.each(function (el) {
				if (!el.visible()) {
					important(el);
				}
			});
		}
	});
});

Cufon.replace('article h1')('article h2')('article h2 + p')('article h3');