function resetColors(elt) {
	elt.removeClass('red');
	elt.removeClass('orange');
	elt.removeClass('yellow');
	elt.removeClass('green');
	elt.removeClass('blue');
	elt.removeClass('purple');
	elt.removeClass('grey');
}

// Interface Object
var Interface = {
	width: 0,
	height: 0,
	
	min_height: 400,
	outer_height: 0,
	
	menu: null,
	footer: null,
	contents : null,
	load_cross: null,
	
	initialize: function() {
		window.addEvent('resize', Interface.refresh);
		window.addEvent('postready', Interface.update);

		window.addEvent('unload', function() {
			Interface.contents.tween('height', 0);
		});

		Interface.update();
		
		/*
		$$('#social div').addEvent('click', function() {
			$('social').morph({
				'height': '30px',
				'background': '#444',
				'background-image': 'none'
			});
			$('widgets').morph({
				'top': '30px',
			});
		});
		*/
		Interface.toggleIndicator('loading', true, true);
		Interface.toggleIndicator('loading', false);
	},

	update: function() {
		Interface.top = $('top');
		Interface.menu = $('menu');
		Interface.contents = $('contents');
		Interface.footer = $('footer');

		Interface.outer_height = Interface.top.getSize().y;
		Interface.outer_height += Interface.menu.getSize().y;
		Interface.outer_height += Interface.footer.getSize().y;
		Interface.outer_height += 20; /* bottom margin */

		Interface.refresh();
	},

	refresh: function() {
		scrolliPhone();
	
		Interface.width = window.getSize().x;
		Interface.height = window.getSize().y;
		
		try {
			var new_height = Math.max(Interface.min_height, Interface.height - Interface.outer_height);
			
			//tween
			$('contents').tween('height', new_height);
			$('wrapper').tween('height', new_height - $('description').getSize().y);
			
			$$('#indicators>div').each(function (item) {
//				item.set('morph', { 'link': 'cancel' });
				item.setStyle('margin-left', (Interface.width - item.getSize().x)/2);
			});
		} catch(error) {};
	},
	
	toggleIndicator: function(type, visible, quick) {
//		console.log('>> visible:'+visible);
		if (quick)
			$$('#indicators #'+type).setStyles({'margin-top': (visible) ? 0 : -20});
		else
			$$('#indicators #'+type).morph({'margin-top': (visible) ? 0 : -20});
	}
};

function clearDefault(el) {
  if (el.defaultValue==el.value) el.value = ""
}

window.addEvent('load', Interface.initialize);