window.addEvent('domready', function() {
		Fx.Scroll = new Class({
	
		Extends: Fx,
	
		options: {
			offset: {'x': 0, 'y': 0},
			wheelStops: true
		},
	
		initialize: function(element, options){
			this.element = this.subject = $(element);
			this.parent(options);
			var cancel = this.cancel.bind(this, false);
	
			if ($type(this.element) != 'element') this.element = $(this.element.getDocument().body);
	
			var stopper = this.element;
	
			if (this.options.wheelStops){
				this.addEvent('start', function(){
					stopper.addEvent('mousewheel', cancel);
				}, true);
				this.addEvent('complete', function(){
					stopper.removeEvent('mousewheel', cancel);
				}, true);
			}
		},
	
		set: function(){
			var now = Array.flatten(arguments);
			this.element.scrollTo(now[0], now[1]);
		},
	
		compute: function(from, to, delta){
			var now = [];
			var x = 2;
			x.times(function(i){
				now.push(Fx.compute(from[i], to[i], delta));
			});
			return now;
		},
	
		start: function(x, y){
			if (!this.check(arguments.callee, x, y)) return this;
			var offsetSize = this.element.getSize(), scrollSize = this.element.getScrollSize();
			var scroll = this.element.getScroll(), values = {x: x, y: y};
			for (var z in values){
				var max = scrollSize[z] - offsetSize[z];
				if ($chk(values[z])) values[z] = ($type(values[z]) == 'number') ? values[z].limit(0, max) : max;
				else values[z] = scroll[z];
				values[z] += this.options.offset[z];
			}
			return this.parent([scroll.x, scroll.y], [values.x, values.y]);
		},
	
		toTop: function(){
			return this.start(false, 0);
		},
	
		toLeft: function(){
			return this.start(0, false);
		},
	
		toRight: function(){
			return this.start('right', false);
		},
	
		toBottom: function(){
			return this.start(false, 'bottom');
		},
	
		toElement: function(el){
			var position = $(el).getPosition(this.element);
			return this.start(position.x, position.y);
		}
	
	});

	
	Fx.Scroll2 = new Class({
	  
		 'Extends': Fx.Scroll,
	  
		 'styleString': Element.getComputedStyle,
		 'styleNumber': function(element, style) {
			 return this.styleString(element, style).toInt() || 0;
		 },
		 'borderBox': function(element) {
			 return this.styleString(element, '-moz-box-sizing') == 'border-box';
		 },
		 'topBorder': function(element) {
			 return this.styleNumber(element, 'border-top-width');
		 },
		'leftBorder': function(element) {
			 return this.styleNumber(element, 'border-left-width');
		 },
		 'isBody': function(element) {
			 return (/^(?:body|html)$/i).test(element.tagName);
		 }, 
		 'toElement': function(el) {
			 var offset   = {x: 0, y: 0};
			 var element  = $(el);
			
			 if (this.isBody(element)) {
				 return offset;
			 }
			 var scroll = element.getScrolls();
				   
			 while (element && !this.isBody(element)){
				 offset.x += element.offsetLeft;
				 offset.y += element.offsetTop;
				
				 if (Browser.Engine.gecko){
					 if (!this.borderBox(element)){
						 offset.x += this.leftBorder(element);
						 offset.y += this.topBorder(element);
					 }
					 var parent = element.parentNode;
					 if (parent && this.styleString(parent, 'overflow') != 'visible'){
						 offset.x += this.leftBorder(parent);
						 offset.y += this.topBorder(parent);
					 }
				 } else if (Browser.Engine.trident || Browser.Engine.webkit){
					 offset.x += this.leftBorder(element);
					 offset.y += this.topBorder(element);
				 }
	  
				 element = element.offsetParent;
				 if (Browser.Engine.trident) {
					 while (element && !element.currentStyle.hasLayout) {
						 element = element.offsetParent;
					 }
				 }
			 }
			 if (Browser.Engine.gecko && !this.borderBox(element)){
				 offset.x -= this.leftBorder(element);
				 offset.y -= this.topBorder(element);
			 }
			
			 var relative = this.element;
			 var relativePosition = (relative && (relative = $(relative))) ? relative.getPosition() : {x: 0, y: 0};
			 var position = {x: offset.x - scroll.x, y: offset.y - scroll.y};
			
			 return this.start(position.x - relativePosition.x, position.y - relativePosition.y);
		 }
	 });
	
	
	
	function scrollerWidget () {
		var scroller_wrapper = $('scroller_wrapper');
		if(!scroller_wrapper) {return false}
		
        var scroller_wrapper_inner = $('scroller_wrapper_inner');
		var scroller_wrapper_ul = scroller_wrapper.getElement('ul');
		var scroller_lis = scroller_wrapper_ul.getElementsByTagName('li');
		var scroller_wrapper_width = scroller_lis.length * 100;
		scroller_wrapper_ul.style.width = scroller_wrapper_width + 1 + 'px'; 
		
		var scrollerFx = new Fx.Scroll2(scroller_wrapper_inner, 
			{
				
				wheelStops: false,
				duration: 500,
				transition: Fx.Transitions.Quad.easeInOut,
				onStart: function () {
					
				},
				onComplete: function () {
					
				}
				
			}
		)
		scrollerFx.set(0,0);
		
		
		
		
		scroller_wrapper.addEvent('mousemove',function (e) {
				e = new Event(e).stop();
				var mouse_x = e.page.x-scroller_wrapper.getPosition().x;
				
				if(mouse_x>10) {
				scrollerFx.start(mouse_x/605*(scroller_wrapper_width-16),0);
				} else {
					scrollerFx.start(0,0);
				}
				
			}
		);
		
	}
	
	
	
	 
	
	
	
	
	scrollerWidget ();
	
});