var count = 1;
var el, x, r1, r2;

window.onload = init;
window.onunload = gc;

function init() {
	el = document.getElementById('controller');
	r1 = document.getElementById('reference1');
	r2 = document.getElementById('reference2');

	wgAddEvent(r1,'mouseover',showController);
	wgAddEvent(r1,'mouseout',hideController);
	wgAddEvent(r2,'mouseover',showController);
	wgAddEvent(r2,'mouseout',hideController);
	wgAddEvent(el,'mouseout',hideController2);
	
	
	r2.style.backgroundImage = 'url(/imgs/'+thePage+'_3.jpg)';
	r2.style.backgroundImage = 'url(/imgs/'+thePage+'_2.jpg)';

	//alert(document.compatMode)
}

function gc() {
	el = null;
	r1 = null;
	r2 = null;
	x = null;
}


function changeImage(obj,n,e){
	transitionImage(n,e);
	resetController();
 	addClassName(obj,'current');
 }

function test() {
	return false;
}

function transitionImage(n,e) {
	r1.style.backgroundImage = 'url(/imgs/'+e+'_'+n+'.jpg)';
}

function wgAddEvent(obj,ev,fct){
	extEv='on'+ev;
	if(window.addEventListener){
		obj.addEventListener(ev, fct, false);
	}else if (window.attachEvent){
		obj.attachEvent(extEv, fct);
	}
}



function showController(){
//	cLoc = (el.style.bottom != '') ? parseInt(el.style.bottom): -1;
	if (el.offsetTop > 360) {
		x = el.offsetHeight;
		if (el.style.bottom != '0px') {
			slidein();
		}
	}
}

function hideController(e){
	if (!e) var e = window.event;
	
	if (e.relatedTarget) relTarg = e.relatedTarget;
	else if (e.toElement) relTarg = e.toElement;
		
	if(relTarg && relTarg.id != 'controller'  && relTarg.tagName != 'SPAN'){
		ch =  el.offsetHeight;
		x = -10;
		slideout();
	}
}

function hideController2(e){
	if (!e) var e = window.event;

	if (e.relatedTarget) relTarg = e.relatedTarget;
	else if (e.toElement) relTarg = e.toElement;

	if(relTarg && relTarg.id != 'reference1' && relTarg.id != 'reference2' && relTarg.tagName != 'SPAN' && relTarg.id != 'controller'){
		ch =  el.offsetHeight;
		x = -10;
		slideout();
	}
}

function resetController(){
	btns = el.getElementsByTagName('span');
	for(i=0;i<btns.length;i++) {
		removeClassName(btns[i],'current');
	}
}


function slidein() {
	x = Math.floor(x/1.5);
	el.style.bottom = (0-x)+'px';
	if ( x > 0 ) {		
		setTimeout('slidein()',50);
	}else{
		el.style.bottom = '0px';
	}
}

function slideout() {
	x = Math.floor(x*1.5);
	if (x>(-82) && x < 1) { 
		el.style.bottom = x+'px';
		//document.getElementsByTagName('h2')[0].innerHTML += " "+x;
		setTimeout('slideout()',50);
	}
}

function addClassName(obj,newClassName){
	if(obj.className==''){
		CLname=newClassName;
	}else{
		CLname=obj.className+' '+newClassName;
	}
	obj.className=CLname
}

function removeClassName(obj,ClassName){
	var vRegX=new RegExp('\s*' +ClassName+ '*\\b');
	obj.className=obj.className.replace(vRegX, '');
}