var effects = new Array(); var info = new Array();
var sizes = new Array(1, 0.717, 0.513, 0.368, 0.264, 0.189);
var cur = '';
var width = 140;
var height = 280;
var motion = false; var next = ''; var timer = ''; var bw = ''; var bh = '';

function select(app) {
	if(cur == app) return false;
	
	if(motion == true) {
		next = app;
		return false;
	} else {
		motion = true;	
	}
	
	var phone = key(apps, app);
	// size the phones
	for(i = 0; i < apps.length; i++) {
		var offset = Math.abs(i - phone);
		var a = apps[i];
		var size = sizes[offset];
		
		
		info[a].set({'opacity': 0, 'height': (height + 10)});
		$(a + '_dock').style.color = '#9c9c9c';
		
		if(a == app) {
			$(app + '_dock').style.color = '#fff';
			effects[a].start({ 'width': (size * width) }).addEvent('onComplete', function() {
				info[cur].start({'opacity': 1, 'height': height, 'visibility': 'normal'}).addEvent('onComplete', function() {
					motion = '';
					if(next != '') {
						setTimeout(function() { select(next); next = ''; }, 20);
					}
				});
			});
		} else {
			effects[a].start({ 'width': (size * width) });
			
		}
	}
	
	cur = app;
}

function calcSize() {
	// figure out how tall we can go
	if (typeof window.innerWidth != 'undefined') {
		bw = window.innerWidth,
		bh = window.innerHeight
	} else if (typeof document.documentElement != 'undefined' && typeof document.documentElement.clientWidth != 'undefined' && document.documentElement.clientWidth != 0) {
		bw = document.documentElement.clientWidth,
		bh = document.documentElement.clientHeight
	} else {
		bw = document.getElementsByTagName('body')[0].clientWidth,
		bh = document.getElementsByTagName('body')[0].clientHeight
	}
	
	var temph = Math.round(bh - 350);
	if(temph > 220) height = temph;
	if(temph > 450) height = 450;
	width = Math.round(height * 200 / 394);
	
	// if we are too wide than recalc
	if(((width * .75) * 6) > (bw - 140)) {
		var tempw = Math.round(((bw - 140) / 6) / .75);
		if(tempw > 145) {
			width = tempw;
		} else {
			width = 145;
		}
		if(tempw > 260) width = 260;
		height = Math.round(width * 394 / 200);
	}
	
	$('junk').style.height = (height + 50) + 'px';
	$('phones').style.height = (height + 100) + 'px';
	
	// and fix the phones
	if(cur != '') var phone = key(apps, cur);
	
	for(i = 0; i < apps.length; i++) {
		if(cur != '') {
			var offset = Math.abs(i - phone);
			var size = sizes[offset];
		} else {
			var size = .61;
		}
		var a = apps[i];
		effects[a].set({ 'width': (size * width) });
		info[a].set({ 'height': (size * height) });
	}
}

window.addEvent('domready', function() {
	for(i = 0; i < apps.length; i++) {
		var app = apps[i];
		effects[app] = new Fx.Morph(app + '_phone', { transition: Fx.Transitions.Sine.easeInOut });
		info[app] = new Fx.Morph(app + '_info', { transition: Fx.Transitions.Sine.easeInOut });
		
		$(app + '_info').setStyles({'opacity': 0, 'visibility': 'hidden'});
	}
	
	calcSize();
	$('phones').style.display = 'block';
	
	// this is a hack to get IE7 to reflow the document and make everything fit on first load
	var body = document.getElementsByTagName( "body" )[0];
	body.style.borderLeft = '1px solid transparent';
	setTimeout(function() {
		body.style.borderLeft = '0px solid transparent';
	}, 10);
});

window.addEvent('load', function() { if($('charity')) { setTimeout(function() { $('charity').morph({top: 0}); $('digg').morph({top: 0}); }, 1000); } });
window.addEvent('resize', function() { calcSize(); });

function key(array, value) {
	for(i = 0; i < array.length; i++) {
		if(array[i] == value) return i;
	}
}