/**
 * SlideBar
 * 
 * Inspired by mooSlide2 (artviper.net)
 *
 * @license		MIT-style license
 * @author		Anquetil Manuel <manu [at] chess-mind.com>
 * @copyright	Author
 */
var SlideBar = new Class({
	Implements: [Options, Events],
	
	options: {
		slideSpeed: 1000,
		resizeSpeed: 300,
		scrollSpeed: 300,
		fadeSpeed:	500,
		effects:	Fx.Transitions.linear,
		toggler:	null,
		removeOnClick: false,
		from:		'top',
		opacity:	1,
		height:		25,
		minWidth:	0,
		widthFixed: false
	},
					
	initialize:	function(content, options){
		this.content = $(content);
		this.setOptions(options);
		this.sideBar = new Element('div').inject(document.body).adopt(this.content);
		
		this.isOpen = false;
		
		if(this.options.removeOnClick){
			this.sideBar.addEvent('click',this.hide.bindWithEvent(this));
		}
		if($chk(this.toggler)) {
			this.toggler.addEvent('click',this.toggle());
		}
		if(this.options.from != 'top' && this.options.from != 'bottom') {
			this.options.from = 'top';
		}
		
		this.sideBar.setStyles({
			'position':'absolute',
			'height':this.options.height+'px',
			'opacity':'1',
			'display':'none',
			'z-index':'-1'
		});
		this.content.setStyles({
			'position':'relative',
			'height':this.options.height+'px',
			'display':'block',
			'left':'0'
		});
		
		this.slideEffect = new Fx.Morph(this.sideBar, {
			duration: this.options.slideSpeed,
			transition: this.options.effects
		});
		this.fadeEffect = new Fx.Morph(this.sideBar, {
			duration: this.options.fadeSpeed,
			transition: Fx.Transitions.linear
		});
		this.resizeEffect = new Fx.Morph(this.sideBar, {
			duration: this.options.resizeSpeed,
			transition: Fx.Transitions.linear
		});
		this.scrollEffect = new Fx.Morph(this.content, {
			duration: this.options.scrollSpeed,
			transition: Fx.Transitions.linear
		});

		var resizeFunc = this.resize.bind(this);
		var scrollFunc = this.scroll.bind(this);
		window.addEvents({
			'resize': resizeFunc,
			'scroll': scrollFunc
		});
	},
	
	hide: function() {
		this.fadeEffect.start({
			'opacity': [1, 0]
		});
		(function() {
			this.sideBar.setStyle('display', 'none');
			this.fireEvent('onHide');
			this.isOpen = false;			
		}.bind(this)).delay(this.options.fadeSpeed);
	},

	show: function(){
		if (!this.isOpen) {
			var posFrom = -this.options.height*2;
			var posTo = 0;
			if(this.options.from == 'bottom') {
				var borderTop = this.sideBar.getStyle('border-top').toInt();
				var borderBottom = this.sideBar.getStyle('border-bottom').toInt();
				posTo = 0;
				posFrom = -(this.options.height+borderTop+borderBottom);
			}
			
			if(this.options.from == 'bottom') {
				this.sideBar.setStyle('bottom',posFrom);
			} else {
				this.sideBar.setStyle('top',posFrom);
			}
		
			this.sideBar.setStyles({
				'position': 'absolute',
				'display':'block',
				'left': '0',
				'opacity': this.options.opacity,
				'display': 'block',
				'z-index': '10',
				'height': this.options.height + 'px',
				'width': '100%' //ie
			});
			
			if(this.options.from == 'top') {
				this.slideEffect.start({
					'top': [posFrom, posTo]
				});				
			} else {
				this.slideEffect.start({
					'bottom': [posFrom, posTo]
				});
			}

			if(!this.options.widthFixed) {
				this.sideBar.setStyle('position','fixed');				
			}
			this.isOpen = true;
			this.resize();
		}
	},
	
	toggle: function(){
		if(!this.isOpen) {
			this.show();
		} else {
			this.hide();
		}
	},
	
	resize: function() {
		if(this.isOpen) {
			if (this.options.widthFixed) {
				this.sideBar.setStyle('width', this.options.minWidth + 'px');
			} else {
				var borderLeft = this.sideBar.getStyle('border-left').toInt();
				var borderRight = this.sideBar.getStyle('border-right').toInt();
				
				if ($chk(this.width)) {
					this.widthBefore = this.width;
				}
				this.width = window.getSize().x - (borderLeft + borderRight + (Browser.Engine.webkit ? (17) : 0));
				if (this.width < this.options.minWidth) {
					this.width = this.options.minWidth;
				}
				if (!$chk(this.widthBefore)) {
					this.sideBar.setStyle('width', this.width + 'px');
				} else {
					this.resizeEffect.start({
						'width': [this.widthBefore, this.width]
					});
				}
			}
			this.scroll();
		}
	},
	
	scroll: function() {
		if (this.options.widthFixed) {
			return;
		}
		
		this.scrollEffect.cancel();
		this.leftBefore = this.left;
		this.left = -window.getScroll().x;
		this.scrollEffect.start({
			'left': [this.leftBefore, this.left]
		});
	}
	
});