var ScrollSlider = Class.create({
	
	current: 0,
	count: 0,
	
	initialize: function(){
		
		if( !$('toolbar') ){
			this.create_slider();
		}
		
	},
	
	create_slider: function(){
		
		$("slider").className = "scrollslider-active";
		
		var nav = new Element('div',{'id':'slidernav'});
		var items = new Element('div',{'id':'slideritems'});
		
		new Element.insert('slider', {top:nav} );
		
		index = 0;
		$$('#slider .container').each( function(item){ 

			  if( item.next('.element') ){
					
					item.hide();
					
					var title = new Element('a',{'href':'javascript:;','rel':index}).update(item.down('.title').innerHTML);
					
					Event.observe(title,'click',this.move.bindAsEventListener(this));
					
					$('slidernav').insert(title);
					
					var element = item.next('.element');
					
					element.id = 'item_'+index;
					
					items.insert(element);
					
					//element.hide();
					++this.count;
					++index;
				}
		
		}, this);
		
		$('slider').insert(items);
		
		$$("#slidernav a")[0].addClassName('selected');
		
	},
	
	move: function(event){
		
		c = Event.element(event).rel;
		
		$$("#slidernav a").each(function(a){a.removeClassName('selected');});
		
		$(Event.element(event)).addClassName('selected');
		
		if( c > this.current ){
			var n = c-this.current;
			var m = Math.abs(this.current-c)*0.2;
			var x = '-' + (n * 1000);
		}else if( c < this.current ){
			var n = this.current-c;
			var m = Math.abs(c-this.current)*0.2;
			var x = (n * 1000);
		}
		
		//alert(n+'|'+m+'|'+x);
		
    new Effect.Move('slideritems',{ x: x, y: 0, duration: m, transition: Effect.Transitions.sinoidal });
		
		this.current = c;
		
		//alert(this.current);
		
	}

});

document.observe('dom:loaded',function(event){ var ss = new ScrollSlider() });