//scroller
var Cyb = Cyb || {};

Cyb.scrollingDiv = function(params){

	var self = {},
	$scrollBar = {},
	$scrollThumb = {},
	$scrollHandler = {},
	$container = {},
	$scrollPane = $(params.scrollPaneId),
	scrollHeight = 0,
	visibleHeight = 0,
	coef = 1;
	
	var scrollBarCss = {position: 'absolute',background:"url(/images/bg_scroll.jpg) repeat-y -2px 0",width: 20,height:$scrollPane.height(),right:0,top:0};
	var scrollThumbCss = {background:'#0096D5',width:4,height:'100%',float:'left',marginLeft:6};
	var scrollHandlerCss = {position:'absolute',height:50,width:20};

	var _init = function(params) {
		scrollBarCss = params.scrollBarCss || scrollBarCss;
		scrollThumbCss = (params.scrollThumbCss) || scrollThumbCss;
		scrollHandlerCss = (params.scrollHandlerCss) || scrollHandlerCss;

		$container = _wrapScrollerElements();
		$scrollBar = $container.find('#scrollerContenu');
		$scrollThumb = $scrollBar.find('#scrollThumb');
		$scrollHandler = $scrollBar.find('#scrollHandler');
		_setStyles(params);
		self.refreshState();
	};
	
	var _wrapScrollerElements = function(){
		var $container = $('<div class="container_scroll" />').css({width:$scrollPane.css('width'),height:$scrollPane.css('height'),position:'relative'});
		$scrollPane.wrap($container);
		$scrollPane.css({paddingRight:scrollBarCss.width,width:'auto',overflow:'hidden'});
		var $scrollerElement = $('<div id="scrollerContenu" style=""><div id="scrollHandler"><div id="scrollThumb"></div></div></div>');
		$scrollPane.parent().append($scrollerElement);
		return $scrollPane.parent();
	};
	var _setStyles = function(params){
			
			$scrollBar.css(scrollBarCss);
			
			$scrollThumb.css(scrollThumbCss);
			
			$scrollHandler.css(scrollHandlerCss);
		
	};
	
	self.refreshState = function(){
		scrollHeight = $scrollPane.attr("scrollHeight");
		visibleHeight =  $scrollPane.height();
		coef = ( scrollHeight / visibleHeight);		
		if(coef > 1)
		{

			$scrollHandler.height($scrollBar.height() / coef);
			$scrollBar.show();
			var coords = $scrollHandler.position();
			var cible =  (coords.top )* coef;
			$scrollPane.scrollTop(Math.round(cible));
			_startScrolling();
		}
		else
			$scrollBar.hide();
	};
	
	self.setHeight = function(newHeight){
		$container.css({height:newHeight});
		$scrollBar.css({height:newHeight});
		$scrollPane.css({height:newHeight});
		
	};
	
	var _isIpad = function(){
		var isiPad = navigator.userAgent.match(/iPad/i) != null;
		return isiPad;
	};
	var _isIphone = function(){
		var isiPhone = navigator.userAgent.match(/iPhone/i) != null;
		return isiPhone;
	};
	
	var _swipeMove = function(a,e){
		_handleMouseWheel(e.originalEvent,e.delta[0].lastY/50);
	};
	var _handleMouseWheel = function(event, delta){
					
					event.preventDefault();
					var coords = $scrollHandler.position();
					var nbpage = scrollHeight / visibleHeight;
					var coefThumb = ($scrollBar.height() ) / (nbpage*2);
					var dy = Math.max(0,Math.min(coords.top +(- delta * coefThumb),($scrollBar.height() - $scrollHandler.height())) );
					$scrollHandler.css({top:dy});
					var cible =  dy * coef;
					$scrollPane.scrollTop(Math.round(cible));
				};
	var _startScrolling = function(){

		$scrollHandler.draggable({
			cursor: 'pointer',
			axis :'y',
			containment:'parent',
			drag : function(e,ui)
				{
				var coords = $scrollHandler.position();
				var cible =  (coords.top )* coef;
				$scrollPane.scrollTop(Math.round(cible));
				}
			});
		$scrollPane.unbind('mousewheel');
		$scrollPane.mousewheel(_handleMouseWheel);
		if(_isIpad() || _isIphone()){
			$scrollPane.unbind('swipemove');
			$scrollPane.bind('swipemove',_swipeMove);
		}
	};
	
	_init(params);

	return self;
}