/**
 * Dependency : WBHelper ( WBHelper.js )
 * Perform simple effects like scrolling and showing/hiding loading
 */

var WBAnimation = new Class( {
		Implements : Options,
		scroller: null,
		loader: null,
		loader_state: false,
		sliders: {},
		slider : null , // used for scrollbar
		scrollbar : null ,
		scrollbarHandler : null,
		options : {
			elements : {
				scroller : { id : ''},
				loader : { tag : 'div' , 'class' : ''},
				scrollbar : { tag : 'div'},
				scrollbarHandler : { tag : 'div'}
			}
		},
		initialize: function( options ){
			if(options)
				this.setOptions( options );
			
		},
		scrollTo: function(id, callbackfn){
			if (!this.scroller) 
				return;
			if (callbackfn) {
				fn = callbackfn.pass(id);
				this.scroller.onComplete = fn;
			}
			else 
				this.scroller.onComplete = function(){
				};
			
			this.scroller.toElement(id);
			
		},
		getProperty : function( element , name ){
			return this.options.elements[element][name] ? this.options.elements[element][name] : '';
		},
		render : function(){
			el = this.getProperty( 'scroller', 'id');
			if( $type(el) == 'string')
				el = $(el);
			if(el)	
				this.scroller = new Fx.Scroll( el, { wait: true, duration: 200 });
			
			if( this.getProperty( 'loader', 'element' ) != '' ) {
				el = this.getProperty( 'loader', 'element' );
			} else if( this.getProperty( 'loader', 'id' ) != '' ) {
				el = this.getProperty( 'loader', 'id' );
				el = $(el);
			} else if( this.getProperty( 'loader', 'tag' ) != '' ) {
				el = WBHelper.createElement( this.options.elements.loader );
			 	el.inject( document.body, 'top' );
			}
			
			if( el )	
				this.loader = el;
		},
		renderScrollbar : function( container , position ){
			// scrollbar 
				switch ($type( container )) {
					case 'element':
						scrollCon = container;
					break;
					case 'string' :
						scrollCon = $( container );		
					break;
					default:
						scrollCon = null ;
					break;	
				}
				
				if( scrollCon ){
					elSBar = WBHelper.createElement(this.options.elements.scrollbar) ;
					if (elSBar){
						elSBHandler = WBHelper.createElement(this.options.elements.scrollbarHandler) ;
						if( elSBHandler ){
							this.scrollbar = elSBar.inject( scrollCon , position );
							this.scrollbarHandler = elSBHandler.inject( this.scrollbar ,'top' );
							elSBHandler = null ;
						}
						elSBar = null ;
					}
					scrollCon = null ;
				}
		},
		// add created slider to collection
		appendSlider: function(sliderId, sliderName){
			this.sliders[sliderName] = new Fx.Slide( sliderId );
		},
		// check  wether the slider is set up 
		isSet: function(sliderId){
			if (this.sliders[sliderId] && typeof(this.sliders[sliderId]) == 'object') 
				return true;
			else 
				return false;
		},
		// toggle a slider ( dynamicly open/close)
		toggleSlider: function(sliderId){
			if (this.isSet(sliderId)) {
				this.sliders[sliderId].toggle();
				return true;
			}
			else {
				return false;
			}
		},
		clear: function(){
			this.sliders = {};
		},
		// shortcut for runnnig effects
		trigger: function(sliderId, cmd){
			if (this.isSet(sliderId)) {
				switch (cmd) {
					case 'show':
						this.sliders[sliderId].show();
						break;
					case 'hide':
						this.sliders[sliderId].hide();
						break;
					case 'slideIn':
						this.sliders[sliderId].slideIn();
						break;
					case 'slideOut':
						this.sliders[sliderId].slideOut();
						break;
					case 'toggle':
						this.sliders[sliderId].toggle();
						break;
				}
			}
		},
		showLoader: function( elem ){
			if( this.loader_state == true)
				return ;
			if( $type(elem) == 'element')
				e = elem ;
			else
				e = $(elem);
			if(e){
				var loader_parent = this.loader.getParent();
				var coord = e.getCoordinates();
				this.loader.setStyles( {
				'width': coord.width,
				'height': coord.height,
				'top': ( e == loader_parent ? 0 : coord.top ) + e.getScroll().y,
				'left': ( e == loader_parent ? 0 : coord.left ) + e.getScroll().x,
				'opacity': 0.5
			} );
			this.loader_state = true;
			}
		},
		hideLoader: function(){
			if (this.loader_state == true ){
				this.loader.setStyles( {
				'width': 0,
				'height': 0,
				'top': -100,
				'left': -100,
				'opacity': 0
			} );
			this.loader_state = false;
			}
		},
		setScrollbar : function( container, content ){
			steps = Math.abs(content.getSize().y - container.getSize().y);
			var height = container.getSize().y - 1;
			this.scrollbar.tween( 'height', [0,height] );
			this.scrollbar.setStyle( 'height' , height );
			this.slider = new Slider( this.scrollbar, this.scrollbarHandler, {	
				steps: steps,
				wheel : true,
				mode: 'vertical',
				onChange: function( step ) {
					container.scrollTo( 0, step );	
				}
			} ).set(0);			
			slider = this.slider ;

			// Scroll the content element when the mousewheel is used within the 
			// content or the scrollbar element.
			content.addEvent('mousewheel', function(e){	
				e = new Event(e).stop();
				var step = slider.step - e.wheel * 10;	
				slider.set(step);					
			});			
			this.scrollbar.addEvent('mousewheel', function(e){	
				e = new Event(e).stop();
				var step = slider.step - e.wheel * 10;	
				slider.set(step);					
			});
			
	}
});