var SlideBar = Class.create();
SlideBar.extend({
	options:[],
	sideBarSlide:function (key, fromHeight, toHeight, fromWidth, toWidth){
		var td = this;
		var opt = this.options[key];
		var myEffects = new Fx.Morph(opt.cid, {duration: opt.slideDuration, transition: Fx.Transitions.linear});
	
		myEffects.start({
		'height': [fromHeight, toHeight],
		'width': [fromWidth, toWidth]
		})
	},
	sideBarOpacity:function(key, from, to){
		var td = this;
		var opt = this.options[key];
		var myEffects = new Fx.Morph(opt.cid, {duration: opt.opacityDuration, transition: Fx.Transitions.linear});
		myEffects.start({
		'opacity': [from, to]
		});
	},
	extendContract:function(key){
		var opt = this.options[key];
		var handle = $(opt.kid).getFirst();
		if(opt.isExtended == 0){
			this.sideBarSlide(key, 1, opt.height, 1, opt.width);
			this.sideBarOpacity(key, 0, 1);
			opt.isExtended = 1;
//			handle.src = handle.src.replace(/(\.[^.]+)$/, '-active$1');
		}
		else{
			this.sideBarSlide(key,opt.height, 1, opt.width, 1);
			this.sideBarOpacity(key,1, 0);
			opt.isExtended = 0;
//			handle.src = handle.src.replace(/-active(\.[^.]+)$/, '$1');
		}

	},
	init:function(options){
		var td = this;
		td.options.push(options);
		var length = td.options.length;
		$(options.kid).addEvent('click', function(){
			td.extendContract(length-1);
		});
	},
	start:function(){
		SlideBar.init({
			id:'toolBar',
			cid:'toolBarContents',
			kid:'toolBarTab',
			isExtended:0,
			height:300,
			width:100,
			slideDuration:300,
			opacityDuration:300
		});
		SlideBar.init({
			id:'toolBar',
			cid:'myMP3Player',
			kid:'mpController',
			isExtended:0,
			height:180,
			width:286,
			slideDuration:300,
			opacityDuration:300
		})
	}
})