var redSlider = new Class({
	Implements: [Events, Options],
	options: {
		/*triggerId: '',
		duration: 1000,
		durationShort: 500,
		boxId: '',
		boxIdInner: '',
		closeId: '',*/
		
		active: false,
		fadeId: 'fadeOverlay-',
		fadeClass: 'fadeOverlay',
		fadeOpacity: 0.7,
		
		duration: 1000,
		durationShort: 500,
		
		triggerId: '',
		
		boxArea: '',
		boxBaseline: '597px',
		boxTop: '27px',
		boxHeight: '570px'
	},
	initialize: function(element, options) {
		this.options.boxArea = element;
		this.setOptions(options);
		document.sliderArray.push(this.options.varId);
		this.setupElements();
		this.setupTweens();
		this.setupEvents();
	},
	
	setupElements: function() {
	
		/*--- Setup Fade Area --
		var chars = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz";
		var string_length = 8;
		for (var i=0; i<string_length; i++) {
			var rnum = Math.floor(Math.random() * chars.length);
			this.options.fadeId += chars.substring(rnum,rnum+1);
		}		
		//create div that will be used as a faded background;
		var fadedBackground = new Element('div', {id: this.options.fadeId}).inject($(document.body));
		$(this.options.fadeId).addClass(this.options.fadeClass);
		----------------------*/

	},	
	setupTweens: function() {
		this.options.fader = new Fx.Tween(this.options.fadeId, {
			property: 'opacity',
			duration: this.options.durationShort,
			transition: Fx.Transitions.Quart.easeInOut
		});
		this.options.changeHeight = new Fx.Tween(this.options.boxArea, {
			property: 'height',
			duration: this.options.duration,
			transition: Fx.Transitions.Quart.easeInOut
		});
		this.options.changeTop = new Fx.Tween(this.options.boxArea, {
			property: 'top',
			duration: this.options.duration,
			transition: Fx.Transitions.Quart.easeInOut
		});
	},
	setupEvents: function() {
		$(this.options.triggerId).addEvent('click',function(e){
			this.openBox();
		}.bindWithEvent(this));		
	},
	
	openBox: function() {
		//this.testBox();
		/*for(i = 0; i < document.sliderArray.length; i++) {

			alert(document.sliderArray[i]);
			//var test = document.sliderArray[i];
			//alert(test);
			//alert(window.test.options.triggerId);
			window[document.sliderArray[i]]
			
			
			
		}*/
		this.options.active = true;
		this.options.changeHeight.start(0,this.options.boxHeight);
		this.options.changeTop.start(this.options.boxBaseline,this.options.boxTop);		
	},
	testBox: function() {
		alert('works');
	},
	closeBox: function() {
		alert('closed '+this.options.varId);
		this.options.active = false;
	}
});