/*
Script: slidebox.js

Author: Andrew Hite - Impulse Development

*/

var Slidebox = new Class({
	Implements: [Options],
	
	options: {
		triggerClass: '.slidebox-trigger',
		contentClass: '.slidebox-content'
	},
	
	initialize: function(element, options){
		this.setOptions(options);
		
		this.containerElement = element;
		
		this.triggerElement = this.containerElement.getElement(this.options.triggerClass);
		this.contentElement = this.containerElement.getElement(this.options.contentClass);
		
		this.triggerHeight = this.triggerElement.getHeight() - 12;
		this.contentHeight = this.contentElement.getHeight();
				
		this.triggerElement.set('morph', { duration: 'short' });
		this.contentElement.set('morph', { duration: 'short' });
		
		this.containerElement.setStyles({
			position: 'relative'
		});
		
		this.triggerElement.setStyles({
			position: 'absolute',
			zIndex: 9999
		});
		
		this.contentElement.setStyles({
			height: this.triggerHeight,
			opacity: 0,
			position: 'absolute',
			top: 0,
			zIndex: 999
		});
		
		this.triggerElement.addEvent('click', this.open.bind(this));
		this.contentElement.addEvent('mouseleave', this.close.bind(this));
	},
	
	toggle: function(){
		if(this.open == true){
			this.close();
		} else {
			this.open();
		}
	},
	
	open: function(){
		this._showContent();
		this._moveTriggerUp();
		
		this.open = true;
	},
	
	close: function(){
		this._hideContent();
		this._moveTriggerDown();
		
		this.open = false;
	},
	
	_hideContent: function(){		
		this.contentElement.morph({
			height: this.triggerHeight,
			opacity: 0,
			top: 0
		});
	},
	
	_showContent: function(){		
		this.contentElement.morph({
			height: this.contentHeight,
			top: -(this.contentHeight - this.triggerHeight),
			opacity: 1
		});
	},
	
	_moveTriggerUp: function(){
		this.triggerElement.addClass('slidebox-trigger-open');
		
		this.triggerElement.morph({
			top: -(this.contentHeight)
		});
	},
	
	_moveTriggerDown: function(){
		this.triggerElement.removeClass('slidebox-trigger-open');
		
		this.triggerElement.morph({
			top: 0
		});
	}
});

window.addEvent('domready', function() {
	$$('.slidebox').each(function(element){
		new Slidebox(element);	
	});
});