// ----------------------------------------------------------------------------------------------------
// SCROLL COMPOSER : @author michael.piera - Idianet - version 1.1
// ----------------------------------------------------------------------------------------------------

// -----------------------------------------------------------------------------------	
// -----------------------------------------------------------------------------------
// BARRES DE DEFILEMENTS (version light)
// -----------------------------------------------------------------------------------
// -----------------------------------------------------------------------------------	
(function ($) {
	$.fn.scrollComposer = function (params) {
		
		// ---		
		// PARAMETRES PAR DEFAUT
		// ---		
		
		params = $.extend({					   
			width		: null,
			height		: null,
			maxWidth	: null,
			maxHeight	: null,			
			horizontal	: true,
			vertical	: true,
			scrollToPos	: null,
			scrollSpeed	: 1,
			traceSpeed	: 150		
		}, params);

		// ---
		// CREATION DES BARRES DE DEFILEMENT
		// ---			

		var scrollInterval;			
		var box = $(this);
		box.init = false;
		
		if (box.hasClass($.prefix+'scroller-box') === false) {	
			box.init = true;
			box.addClass($.prefix+'scroller-box');			
			// si la largeur de la boite est renseignée
			if (params.width) {
				if (params.width == 'auto')						box.width = 'auto';
				else if	((params.width+'').indexOf('%') > 0) 	box.width = params.width;
				else											box.width = parseInt(params.width, 10) + 'px';	
				$(box).css('width', box.width);
			} else box.width = null;
			// si la hauteur de la boite est renseignée			
			if (params.height) {
				if (params.height == 'auto')					box.height = 'auto';
				else if	((params.height+'').indexOf('%') > 0) 	box.height = params.height;
				else											box.height = parseInt(params.height, 10) + 'px';	
				$(box).css('height', box.height);
			} else box.height = null;
			// si la hauteur max de la boite est renseignée	
			if (params.maxHeight) {
				if (params.maxHeight < this.height()) {
					box.height = params.maxHeight;
					$(box).css('height', box.height);
				}
			}
			// si la largeur max de la boite est renseignée	
			if (params.maxWidth) {
				if (params.maxWidth < this.width()) {
					box.width = params.maxWidth;
					$(box).css('width', box.width);
				}
			}			
			// création de la boite de contenu
			$(box).wrapInner(
			'<div class="'+$.prefix+'scroller-container">'+
				'<div class="'+$.prefix+'scroller-content"></div>'+
			'</div>'
			);	
			// création de la barre de défilement vertical
			$(box).append(
			'<div class="'+$.prefix+'scroller-vBar">'+
				'<span class="bar-up"></span>'+
				'<span class="bar-trace">'+
					'<span class="bar-cursor"></span>'+
				'</span>'+
				'<span class="bar-down"></span>'+
			'</div>'
			);		
		}
		// initialiation des paramêtres
		box.scrollSpeed = params.scrollSpeed;
		box.traceSpeed 	= params.traceSpeed;		
		box.vertical 	= params.vertical;
		//box.userBar 	= $.getUserScrollbarWidth();			
		box.userBar		= 22;
		// initialisation des sélecteurs	
		box.container	= box.find('.'+$.prefix+'scroller-container:first');
		box.vBar		= box.find('.'+$.prefix+'scroller-vBar:last');
		box.hBar		= box.find('.'+$.prefix+'scroller-hBar:last');
		box.grip		= box.find('.'+$.prefix+'scroller-grip:last');
		box.content 	= box.container.find('.'+$.prefix+'scroller-content:first');		
		box.barUp 		= box.vBar.find('.bar-up');
		box.barDown 	= box.vBar.find('.bar-down');
		box.vTrace 		= box.vBar.find('.bar-trace');		
		box.vCursor		= box.vBar.find('.bar-cursor');	
		// initialisation du statut des barres
		box.vScroll = false;
		box.hScroll = false;
		box.hBar.hide();
		box.vBar.hide();
		box.grip.hide();		
		// uniquement au moment de l'initialisation
		if (box.init) {
			// pour le focus et la gestion des actions clavier
			box.container.attr('tabindex',0);
			// cas particlier => le client a changé la taille des barres de défilement
			if (box.vBar.width() < box.userBar) {
				box.vBar.css('width', box.userBar + 'px');
			}
		}

		// ---
		// PARAMETRAGE BOITE DE DEFILEMENT VERTICALE
		// ---		
		if (box.vertical && box.vScroll === false && box.container.height() > 0 && box.container.height() < box.content.height()) {
			// activation de la barre
			box.vBar.show();			
			box.vScroll = true;
			// Hauteur de la barre | curseur => hauteur minimum : 6px
			box.containerHeight	= box.container.height();
			box.contentHeight 	= box.content.height();			
			box.traceHeight 	= Math.round(box.containerHeight - box.barUp.height() - box.barDown.height() - 2);				
			box.vRatio 			= (box.traceHeight / box.contentHeight);			
			box.cursorHeight 	= Math.max(Math.round(box.containerHeight * box.vRatio),6);
			// injection des styles
			box.vBar.css('height', box.containerHeight + 'px');
			box.vTrace.css('height', box.traceHeight + 'px');
			box.vCursor.css('height', box.cursorHeight + 'px');
			box.content.css('marginRight', '5px');
		} else {
			box.content.css('marginRight', '');	
		}

		// ---
		// MAJ DE LA POSITION DU SCROLL
		// ---	
		// nouvelle position courrante
		if (params.scrollToPos)	{
			if (params.scrollToPos != 'stable')
			box.container.scrollTop(params.scrollToPos);
		}
		// sinon position courrante = 0
		else					box.container.scrollTop(0);

		// ---
		// MAJ DE LA POSITION DES CURSEURS
		// ---	
		var updateDragBar = function(box) {
			if (box.vScroll) box.vCursor.css('top', Math.min(Math.round(box.container.scrollTop() * box.vRatio), box.traceHeight - box.cursorHeight) + 'px');
		};
		box.container.scroll(function(event) {
			if (!box.hasClass('rdc-select-one-box-content')) $('.rdc-select-one-box').remove();
			updateDragBar(box);
		});	
		updateDragBar(box);
		
		// ---
		// ACTIONS SUR LES TRACES
		// ---	
		// vertical
		box.vTrace.unbind().bind('mousedown', function(event) {
			var mousePos = (event.pageY - box.vTrace.offset().top);
			if (mousePos > (box.cursorHeight + parseInt(box.vCursor.css('top'), 10))) {
				var newScroll = (box.container.scrollTop()+(box.scrollSpeed*box.traceSpeed));
				box.container.scrollTop(newScroll); 
			} else if (mousePos < parseInt(box.vCursor.css('top'), 10)) {
				var newScroll = (box.container.scrollTop()-(box.scrollSpeed*box.traceSpeed));
				box.container.scrollTop(newScroll); 
			}
			return false;
		});

		// ---
		// ACTIONS SUR LES BOUTONS DE SCROLLING
		// ---		
		// Bouton => barUp
		box.barUp
		.bind('mouseover',	function() { $('span', this).addClass('hover'); 											})
		.bind('mouseout',	function() { $('span', this).removeClass(); stopScrollMove();								})
		.bind('mousedown',	function() { $('span', this).addClass('active'); startScrollMoveUp(box); return false;		})
		.bind('mouseup',	function() { $('span', this).removeClass('active'); stopScrollMove(); return false;			});	
		// Bouton => barDown
		box.barDown	
		.bind('mouseover', 	function() { $('span', this).addClass('hover'); 											})
		.bind('mouseout',	function() { $('span', this).removeClass(); stopScrollMove();								})
		.bind('mousedown',	function() { $('span', this).addClass('active'); startScrollMoveDown(box); return false; 	})
		.bind('mouseup',	function() { $('span', this).removeClass('active'); stopScrollMove(); return false;			});			

		// ---
		// MAJ DE LA POSITION DU CONTENU DE LA BOITE EN OVERFLOW:AUTO
		// ---	
		var startScrollMoveDown = function(box) {
			scrollInterval = setInterval( function() { 
				var newScroll = (box.container.scrollTop()+box.scrollSpeed);
				box.container.scrollTop(newScroll); 
			},20);
		};		
		var startScrollMoveUp = function(box) { 
			scrollInterval = setInterval( function() { 
				var newScroll = (box.container.scrollTop()-box.scrollSpeed);
				box.container.scrollTop(newScroll); 
			},20); 
		};
		var stopScrollMove = function() { 
			clearInterval(scrollInterval);
			scrollInterval = false;
		};

		// ---
		// DRAG CURSEURS
		// ---		
		// curseur vertical
		box.vCursor
		.bind('mouseover',	function() { $('span:first', this).addClass('hover'); 	})
		.bind('mouseout',	function() { $('span:first', this).removeClass(); 		})
		.draggable({ 
			addClasses	: false,
			axis		: 'y',
			containment : 'parent',
			start : function(event, ui) {
				$('span:first', this).addClass('active');
			},
			drag : function(event, ui) {
				box.container.scrollTop(Math.round(ui.position.top / box.vRatio));
			},	
			stop : function(event, ui) {
				$('span:first', this).removeClass('active');
			}
		});		
	};
})(jQuery);

// -----------------------------------------------------------------------------------	
// -----------------------------------------------------------------------------------
// CALCUL DE LA LARGEURS DES SCROLLBAR DU NAVIGATEUR CLIENT
// -----------------------------------------------------------------------------------
// -----------------------------------------------------------------------------------	
(function($) {
	var userScrollbarWidth = 0;
	$.getUserScrollbarWidth = function(){
		if (!userScrollbarWidth) {
			if ($.browser.msie) {
				var test1 	= $('<textarea cols="10" rows="2"></textarea>').css({ position: 'absolute', top: -1000, left: -1000 }).appendTo('body');
				var test2 	= $('<textarea cols="10" rows="2" style="overflow: hidden;"></textarea>').css({ position: 'absolute', top: -1000, left: -1000 }).appendTo('body');
				userScrollbarWidth	= test1.width() - test2.width();
				test1.add(test2).remove();
			} else {
				var test = $('<div />')
				.css({ width: 100, height: 100, overflow: 'auto', position: 'absolute', top: -1000, left: -1000 })
				.prependTo('body').append('<div />').find('div')
				.css({ width: '100%', height: 200 });
				userScrollbarWidth = 100 - test.width();
				test.parent().remove();
			}
		}
		return userScrollbarWidth;
	};
})(jQuery);