window.addEvent('domready', function() {
  
  linkListener = new LinkListener('a.pop_link');
  
  menuSlide = new MenuSlide('menu', 'slides', 'loading', {
  	onClick: linkListener.hideInfo.bind(linkListener)
  });
  
});

var LinkListener = new Class ({
	/** Create the link listeners and store them in a global array. **/
	Implements: Chain,
	infoPanePopped: false,
	initialize: function(links){
		
		this.popLinks = $$(links);
		
		/** From each of the elements passed back, create an event and store the event listener in a global array.
			Take each of the pop divs that are associated with this, and make the opacity 0. **/
		
		this.popLinks.each(
							function(popLink,popNum,popLinks){
								popLink.addEvent('click',this.popInfo.bind(this));
								this.prime(popLink);
							},
							this
						);
						
		this.popBack = new Asset.image("/public/css/slide_menu/images/popup_box.png");
		
	},
	popInfo: function(event){
		event.stop();
		/** Check to see if something is already popped. **/
		if(this.infoPanePopped){
			/** Check to make sure that the user didn't click the same link. **/
			newPane = $(event.target.rel);
			
			if(newPane.getProperty('class') != 'info_pane'){
				/** Hide what is popped. **/
				this.chain(
							function(){ 
										this.infoPane.get('tween', {
																	property: 'opacity', 
																	onComplete: function(){this.callChain();}.bind(this)
																	}
																	).start(1,0);
									  },
							function(){ 
										this.infoPane.setProperty('class','more_info'); 
										this.infoPane = newPane;
										this.infoPane.setProperty('class','info_pane');
										this.callChain(); 
									  },
							function(){ 
									  
									  this.infoPane.get('tween', {
																 property: 'opacity' 
																 }).start(0,1);
									  }
						);
				
				this.callChain();
			}
			else{
				/** This info_pane is already being displayed. Do nothing. **/
				return;
			}
		}
		else{	
			this.infoPanePopped = true;
			this.infoPane = $(event.target.rel).setProperty('class','info_pane');
			this.infoPane.get('tween', {
										property: 'opacity' 
								  		}).start(0,1);
								  		
		}
	},
	hideInfo: function(event){
		
		event = new Event(event).stop();
		if(this.infoPanePopped){
			this.infoPane.get('tween', {
										property: 'opacity' 
										}
							 ).start(1,0);
			this.infoPanePopped = false;
			this.infoPane.setProperty('class','more_info');		
		}
		
	},
	prime: function(popLink){
		$(popLink.get("rel")).fade("hide");
	}
});