// JavaScript Document

var SelectBox = new Class({				  
	duration: 200,
	initialize: function (form, target) {
		this.target = $(target);
		this.build($(form));
		this.browser = this.getBrowserInfo(); 
		
		this.launcher.addEvent('click', function (e) {
			var height, effects;
			
			this.container.addClass('active');
			this.container.setStyle('z-index', 1000);
			
			height = this.list.getStyle('height').toInt();
			this.list.setStyle('visibility', 'visible');
			this.list.setStyle('bottom', (-height) + 'px');
						
			effects = new Fx.Styles(this.list, {duration: this.duration, transition: Fx.Transitions.sineOut});
			
			if (this.browser == 'Internet Explorer') {
				effects.start({
					'bottom': 0
				});
			} else {
				this.list.setStyle('opacity', '0');
				effects.start({
					'bottom': 0,
					'opacity': [0, 1]
				});
			}

			$ES('html').addEvent('click', function(e) {
				var effects, height;
				
				$ES('html').removeEvents('click');

				height = this.list.getStyle('height').toInt();
				effects = new Fx.Styles(this.list, {duration: this.duration, transition: Fx.Transitions.sineIn, onComplete: function () { 
					this.container.setStyle('z-index', 0);
				}.bind(this)});
				
				if (this.browser == 'Internet Explorer') {
					effects.start({
						'bottom': -height
					});
				} else {
					effects.start({
						'bottom': -height,
						'opacity': [1, 0]
					});
				}

				this.container.removeClass('active');
			}.bind(this));

			Window.stopEvent(e);
		}.bind(this));
	},
	
	build: function (form) {
		var i, o, a, li, lis, ul, container, listContainer, list, launcher, top, left, width;
		
		lis = new Array();
		o = form.getElement('select').options;
		
		container = new Element('div').setProperty('id', 'SB_container');
		listContainer = new Element('div').setProperty('id', 'SB_listContainer');
		list = new Element('div').setProperty('id', 'SB_list');
		list.setStyle('visibility', 'hidden');
		ul = new Element('ul');
	
		launcher = new Element('p').setProperty('id','SB_launcher');
		launcher.appendText(o[0].text);
		
		for (i = 1; i < o.length; i++) {
			li = new Element('li');
			a = new Element('a').appendText(o[i].text);
			a.setProperty('href', o[i].value);
			li.adopt(a);
			ul.adopt(li);
		}
		
		list.adopt(ul);
		listContainer.adopt(list);
		container.adopt(listContainer);
		container.adopt(launcher);
		this.target.adopt(container);
		
		top = form.getStyle('top').toInt();
		right = form.getStyle('right').toInt();
		width = listContainer.getStyle('width').toInt();
		
		container.setStyle('top', (top + 32) + 'px');
		container.setStyle('right', (right + width) + 'px');		
			
		form.remove();
		
		this.launcher = launcher;
		this.container = container;
		this.list = list;
	},
	
	getBrowserInfo: function () {
		var detect = navigator.userAgent.toLowerCase();
		
		function checkIt(string) {
			place = detect.indexOf(string) + 1;
			thestring = string;
			return place;
		}
		
		if (checkIt('konqueror')) {
			browser = "Konqueror";
		}
		else if (checkIt('safari')) browser 	= "Safari"
		else if (checkIt('omniweb')) browser 	= "OmniWeb"
		else if (checkIt('opera')) browser 		= "Opera"
		else if (checkIt('webtv')) browser 		= "WebTV";
		else if (checkIt('icab')) browser 		= "iCab"
		else if (checkIt('msie')) browser 		= "Internet Explorer"
		else if (!checkIt('compatible')) {
			browser = "Netscape Navigator"
		}
		else browser = "An unknown browser";
		
		return browser;
	}
});

window.onDomReady(function () {
	var selectBox = new SelectBox('otherSites', 'footerContainer');
});