$.fn.moveScroller = function (optn) {
	
	var obj = $(this[0]).data('scroller');
	
	if (obj){
		
		return obj;
		
	}else{
			
		this.each (function (i, elem) {

			var defaults = {
				$layer:$(this),
				scrollSteps:25,
				overOpacity: .9,
				outOpacity: .5
			};
				
			var config 	= $.extend(defaults, optn) ;	
						
			var scroller  = new $.scroller (config);
			$(elem).data('scroller', scroller);
			
		});
	}
	
	return this;
}



$.scroller = function (config) {
	
	this.config = config;
	
	this.$layer = config.$layer;
	
	this.intervalID = null;
	
	this.so = 0;
	
	this.__construct = function () {
		
		$top =
			$( '<div>' )
				.addClass( 'scoll-top' )
				.fadeTo(0, config.outOpacity)
				.hover(
					this.onButtonOver,
					this.onButtonOut
				).click ( this.onTopClick );
				
		var marginBottom = 0;
		if (this.$layer.find('.bottom-text').length > 0){
			marginBottom = 
				this
				.$layer
				.find('.bottom-text')
				.height();
		}

		var marginBottom = 0;
		if (this.$layer.parent().find('.bottom-text').length > 0){
			marginBottom = 
				this
				.$layer
				.parent()
				.find('.bottom-text')
				.height();
		}
		
		$bottom =
			$ ( '<div>' )
				.addClass( 'scoll-bottom' )
				.css('margin-bottom', marginBottom+'px')
				.fadeTo(0, config.outOpacity)
				.hover(
					this.onButtonOver,
					this.onButtonOut
				).click ( this.onBottomClick );
		
		
		config
			.$thumb = 
				$ ( '<div>' )
					.addClass('scroll-thumb')
					.css('display', 'none')
					.fadeTo(0,0);
					
		
		$scrollSpace = $('<div>').addClass('scroll-pace');
		
		
		this
			.$layer
			.css({
				'height': this.$layer.height() - 45 +"px",
				'padding-top':'15px', 
				'padding-bottom':'25px'
				});
		
		
		
		
		this
			.$layer
			.parent()
			.append($top, $bottom, config.$thumb );
					
		
		this
			.$layer
			.hover(
				this.onLayerOver,
				this.onLayerOut
			)
			.scroll( this.onScroll )
			.mousewheel( this.onMouseWeel );
		
			
	}
	
	
	
	this.onLayerOver = function (e) {
		
		config
			.$layer
			.parent()
			.find('.scoll-top, .scoll-bottom')
			.stop()
			.fadeTo(1000, config.overOpacity);
			
		config
			.$thumb
			.css('display','block')
			.stop()
			.fadeTo(1000,1);
		
	}
	
	
	this.onLayerOut = function (e) {
		
		config
			.$layer
			.parent()
			.find('.scoll-top, .scoll-bottom')
			.stop()
			.fadeTo(1000,config.outOpacity);

		config
			.$thumb
			.stop()
			.fadeTo(1000,0, function () {
				$(this).css('display','block')	
			});	
	
	}
	
	
	
	this.onBottomClick = function (e) {
		var offSet = config.$layer.scrollTop();
		config
			.$layer
			.scrollTop( offSet + (config.scrollSteps*2) );
	}
	
	
	this.onTopClick = function (e) {
		var offSet = config.$layer.scrollTop();
		
		config
			.$layer
			.scrollTop( offSet - (config.scrollSteps*2) );		
		
	}
	
	this.onButtonOver = function (e) {
		$(this)
			.stop()
			.fadeTo(1000,config.overOpacity);
	}
	
	this.onButtonOut = function (e) {
		$(this)
			.stop()
			.fadeTo(1000,config.outOpacity);		
	}
	
	
	this.onMouseWeel = function (e, delta) {
		e.preventDefault();
		var offSet = config.$layer.scrollTop();
		
		if (delta < 0) {
			config.$layer.scrollTop(offSet + (config.scrollSteps * Math.abs(delta)) );
		}else{
			config.$layer.scrollTop(offSet - (config.scrollSteps * Math.abs(delta)) );			
		}
		
	}
	
	
	
	this.onScroll = function (e) {
		var offSet 		= config.$layer.scrollTop();
		var innerHeight = config.$layer[0].scrollHeight - config.$layer.innerHeight();
		
		var p_scroll = (offSet * 100) / innerHeight;
		
		var c_height = config.$layer.innerHeight() - config.$thumb.height();
		var top = (c_height * p_scroll) / 100;
		 
		config.$thumb.css('top', top);
	}
	
	
	
	
	this.__construct();
}