Fx.Slide = Class.create();

Fx.Slide.prototype = Object.extend(new Fx.Base(), {

	initialize: function(el, options){
		
		this.element = $(el);
		
		this.element.setStyle( {
			
				'margin': 0
			
			}
		
		);
		
		this.wrapper = this.element.up();
		
		this.wrapper.setStyle( {

				'overflow' : 'hidden'
				
			}
			
		);
		
		this.setOptions({'mode': 'vertical'}, options);
		
		this.now = [];
		
		// this.parent(this.options);
		
	},

	setNow: function(){
		for (var i = 0; i < 2; i++) this.now[i] = this.compute(this.from[i], this.to[i]);
	},

	vertical: function(){
		this.margin = 'top';
		this.layout = 'height';
		this.offset = this.element.offsetHeight;
		return [parseInt(this.element.getStyle('margin-top')), parseInt(this.wrapper.getStyle('height'))];
	},

	horizontal: function(){
		this.margin = 'left';
		this.layout = 'width';
		this.offset = this.element.offsetWidth;
		return [parseInt(this.element.getStyle('margin-left')), parseInt(this.wrapper.getStyle('width'))];
	},

	/*
	Property: slideIn
		slides the elements in view horizontally or vertically, depending on the mode parameter or options.mode.
	*/

	slideIn: function(mode){
		return this._start(this[mode || this.options.mode](), [0, this.offset]);
	},

	/*
	Property: slideOut
		slides the elements out of the view horizontally or vertically, depending on the mode parameter or options.mode.
	*/

	slideOut: function(mode){
		return this._start(this[mode || this.options.mode](), [-this.offset, 0]);
	},

	/*
	Property: hide
		Hides the element without a transition.
	*/

	hide: function(mode){
		this[mode || this.options.mode]();
		return this.set([-this.offset, 0]);
	},

	/*
	Property: show
		Shows the element without a transition.
	*/

	show: function(mode){
		this[mode || this.options.mode]();
		return this.set([0, this.offset]);
	},

	/*
	Property: toggle
		Slides in or Out the element, depending on its state
	*/

	toggle: function(mode){
		if (this.wrapper.offsetHeight == 0 || this.wrapper.offsetWidth == 0) return this.slideIn(mode);
		else return this.slideOut(mode);
	},

	increase: function(){
		
		this.element.setStyle( {
				
				marginTop : this.now[0]+this.options.unit
			
			}
			
		);
		
		this.wrapper.setStyle( {
			
				height : this.now[1]+this.options.unit
			
			}
		
		);
	
	}

});