theElement = 0;
fullHeight = 0;
chosenElementHeight = 0;

var doSlider = function() {
	
	$$('.faqquestion').each(function(el1){
		el1.addEvent('mouseover', doHover);
		el1.addEvent('mouseleave', doLeave);
		el1.addEvent('click', doFocus);
		if (chosenElement != el1.getFirst('span').getFirst('a').get('id')) {
			el1.getNext('div').setStyle('height',0);
			el1.getFirst('span').addClass('normal');
		} else {
			chosenElementHeight = el1.getNext('div').getSize().y+10;
			el1.getNext('div').setStyle('height',chosenElementHeight);
			theElement = el1;
			//el1.getFirst('span').removeClass('normal');
			el1.getFirst('span').addClass('selected');
			
			isIE6 = /msie|MSIE 6/.test(navigator.userAgent);
			if (isIE6 != true) {
				var myFx = new Fx.Scroll(window).toElement(el1);
			} else {
				//This needs looking at as IE6 still won't find the right place.... it's always out by the height of the textual content on the page
				var myFx = new Fx.Scroll(window).start(0,el1.getPosition().y+260);
			}
		}
	});	
	
	baseSize = $('maincontainer').getSize().y-150-chosenElementHeight;
	$('content_right').getFirst('span').setStyle('bottom', 'auto');
	$('content_right').getFirst('span').setStyle('top', baseSize+chosenElementHeight);
	
	
	
	baseSizeMainBg = $('container').getSize().y - 365-chosenElementHeight;
	$('maincontainerbg').setStyle('bottom', 'auto');
	$('maincontainerbg').setStyle('top', baseSizeMainBg+chosenElementHeight);
	
	baseSizeConatiner = $('maincontainer').getSize().y-chosenElementHeight;
	$('maincontainer').setStyle('height',baseSizeConatiner+chosenElementHeight);
	
}

var doHover = function() {
	if (theElement != this) {
		this.getFirst('span').removeClass('normal');
		this.getFirst('span').addClass('normalover');	
		if (theElement != 0) {
			theElement.getFirst('span').removeClass('selected');
			theElement.getFirst('span').addClass('selectedover');	
		}
	} else {
		this.getFirst('span').removeClass('selected');
		this.getFirst('span').addClass('selectedover');			
	}
}

var doLeave = function() {
	if (theElement != this) {
		this.getFirst('span').removeClass('normalover');
		this.getFirst('span').addClass('normal');
		if (theElement != 0) {
			theElement.getFirst('span').removeClass('selectedover');
			theElement.getFirst('span').addClass('selected');	
		}		
	} else {
		this.getFirst('span').removeClass('selectedover');
		this.getFirst('span').addClass('selected');			
	}
}


var doFocus = function() {
	if (theElement != this) {
		
		//oldHeight = fullHeight;
		
		if (theElement != 0) {
			theElement.getNext('div').get('morph',{onComplete:function(){

			}}).start({'height':0});
			theElement.getFirst('span').removeClass('selectedover');
			theElement.getFirst('span').removeClass('selected');
			theElement.getFirst('span').removeClass('normalover');
			theElement.getFirst('span').addClass('normal');
		}
		
		theElement = this;
		
		fullHeight = 0;
		theElement.getNext('div').getChildren().each(function(el) {
			fullHeight += el.getSize().y+8;
		});
		fullHeight += 10;
		theElement.getNext('div').get('morph',{onComplete:function(){

		}}).start({'height':fullHeight});

		
		$('content_right').getFirst('span').get('tween').start('top',baseSize + fullHeight);	
		$('maincontainerbg').get('tween').start('top',baseSizeMainBg + fullHeight);	
		$('maincontainer').get('tween').start('height',baseSizeConatiner+ fullHeight);
		
		this.getFirst('span').removeClass('normalover');
		this.getFirst('span').removeClass('normal');
		this.getFirst('span').addClass('selected');
		
	} else {
		this.getNext('div').get('morph',{onComplete:function(){
															 
		}}).start({'height':0});
		
		this.getFirst('span').removeClass('selectedover');
		this.getFirst('span').removeClass('selected');
		this.getFirst('span').addClass('normal');
		
		theElement = 0;
		fullHeight = 0;
		
		$('content_right').getFirst('span').get('tween').start('top',baseSize);
		$('maincontainerbg').get('tween').start('top',baseSizeMainBg);
		$('maincontainer').get('tween').start('height',baseSizeConatiner);
	}
}


window.addEvent('domready', doSlider);