// JavaScript Document
var mySlide;
var trigger;
var hasOverflow=false;
var isVisible=false;
var options
/* DomReady Event fires when all Elements are ready, but not images. */
window.addEvent('domready', function() {

	var pulldownElement=$('banner_pulldown');
	trigger=$E('div.trigger', 'banner_pulldown');
	options=$E('div.options', 'banner_pulldown');
	var links=$ES('a', 'banner_pulldown');
	
	//remove the height:0 of al the options

	options.removeProperty("style");

	
	mySlide = new Fx.Slide(options);
	mySlide.hide();
	
	
	trigger.addEvent('click', function(e){
		e = new Event(e);
		
		changeVisible();
		//mySlide.toggle();
		e.stop();
	});
	
	//set a scrollbar if its lager then 12
	var optionList=options.getChildren();
	if(optionList.length>12){
		/*options.setStyles({
		   overflow: 'auto',
		   height: 288
		});*/
		hasOverflow=true;
	}


});
function changeVisible(){
	if(mySlide.wrapper.offsetHeight == 0){
		isVisible=true;
		mySlide.show();
	}else{
		isVisible=false;
		mySlide.hide();
		//alert('close');
	}
	
	if(hasOverflow){
		if(isVisible){
			options.setStyles({
			   overflow: 'auto',
			   height: 288
			});
		}else{
			options.removeProperty("style");
		}
	}
}

function setSelected(value){
	trigger.setHTML(value);
	changeVisible();
}

//document.addEvent("mousedown", checkThenHide.bind(this));
 
function checkThenHide(ev) {
    ev = new Event(ev); //ev.target is not crossbrowers make a new Event..
    // Click has been made out my div object, ignore it
    if (ev.target.id != 'banner_pulldown' && ev.target.getParent().id != 'banner_pulldown'){
		changeVisible();
		//mySlide.hide();
	}
}