var PulldownPanel = new Class({	
	initialize: function(container, options){
		this.options = options;
		this.theContainer=$(container);
		this.panels=this.theContainer.getElements('div.pdp');
		this.numberOfPanes=this.panels.length;
		
		this.morphPosition = new Fx.Morph($('discover'), {
										   duration: parseInt(this.options['duration'])*0.5,
										   transition: Fx.Transitions.Back.easeInOut
										   //transition: this.options['transition']
											});
		this.morphPosition.set({left: '-10px'});
		
		var i=0;
		for(i;i<this.numberOfPanes;i++) {
			this.panels[i].options = this.options;
			//this.panels[i].set('-webkit-box-shadow', '0px 0px 0px #000');
			
			this.panels[i].addEvent('mouseenter', this.expand.pass(i, this));
			//this.panels[i].addEvent('mouseleave', this.contract.pass(i, this));
		}
	},
	expand: function(thisel) {
		
		var thewidth;
		var i=0;		
		var message="";
		this.morphPosition.pause();
		
		for(i;i<this.numberOfPanes;i++) {
			if(thisel == i) {
				this.morphPosition.start({left: [((i*184)-10)+"px"]});
			}
		}
	
		//alert(message);
		return false;
	},
	contract: function(thisel) {
		var message="";
		if(this.panels[thisel].offsetHeight > 50) {
			//this.panels[thisel].start('', '');
			return false;
		}
	}
	
});

window.addEvent("domready", function() {
	
	var PulldownPanelArea = new PulldownPanel('pulldowncontainer', {
	  duration: 600, // howlong should the transition last?
	  //transition: Fx.Transitions.Sine.easeOut, // Type of transition
	  transition: Fx.Transitions.Bounce.easeOut, // Type of transition
	  //transition: Fx.Transitions.Elastic.easeOut, // Type of transition
	  
	  //transition: Fx.Transitions.Sine.easeInOut, // Type of transition
	  //transition: Fx.Transitions.Quart.easeOut, // Type of transition
	  //transition: Fx.Transitions.Linear, // Type of transition
	  opendepth: 'auto', 
	  delay:10
	});
	
	
	
});