/*
Inicialitzacio js inicial
Requereix: 
	Javascript: mootools.js (1.1)
				mootools-more.js (1.1)
			
*/
var slider1 = {};
var stepIntervalId1;

//Construeix una barra de scroll amb javascript
// @param content id del element a scrollable
// @param scrollbar id del element que contindra la barra de scroll
// @param handle id del element que contindra el element controlador de scroll
// @param horizontal true o false Scroll horizontal o vertical
// @param ignoreMouse
function makeScrollbar1(content,scrollbar,handle,horizontal,ignoreMouse){
				
	//Eliminem els possibles overflows del element scrollable
	content.style.overflow='hidden';
	//Mostrem la barra de scroll
	scrollbar.getParent().setStyle("display", "block");
				
	var steps = (horizontal?(content.getSize().scrollSize.x - content.getSize().size.x):(content.getSize().scrollSize.y - content.getSize().size.y))
	
	slider1 = new Slider(scrollbar, handle, {	
			steps: steps,
			mode: (horizontal?'horizontal':'vertical'),
			onChange: function(step){
				var x = (horizontal?step:0);
				var y = (horizontal?0:step);
				content.scrollTo(x,y);
				changeSlide1(this);				
			}
		}).set(0);
			
	if( !(ignoreMouse) ){
		// Scroll the content element when the mousewheel is used within the 
		// content or the scrollbar element.
		$$(content, scrollbar).addEvent('mousewheel', function(e){	
			e = new Event(e).stop();
			var step = slider1.step - e.wheel * 50;	
			slider1.set(step);					
		});
	}
	// Stops the handle dragging process when the mouse leaves the document body.
	$(document.body).addEvent('mouseleave',function(){slider1.drag.stop()});

	
	$(document.body).addEvent('mouseup',function(e) {
											if (stepIntervalId1) {
												clearInterval(stepIntervalId1);
												stepIntervalId1 = false;
											}
										});
	
	//Afegim els controladors dreta i esquerra	
	$('handleLeft1').addEvent('mousedown', function(e){
											e = new Event(e).stop();
											stepLeft1();
											stepIntervalId1 = setInterval(stepLeft1, 400);											
										});
											
	$('handleLeft1').addEvent('mouseup', function(e){
											e = new Event(e).stop();
											clearInterval(stepIntervalId1);
											stepIntervalId1 = false;
										});
		
	$('handleRight1').addEvent('mousedown', function(e){
											e = new Event(e).stop();
											stepRight1();
											stepIntervalId1 = setInterval(stepRight1, 400);
										});
		
	$('handleRight1').addEvent('mouseup', function(e){
											e = new Event(e).stop();
											clearInterval(stepIntervalId1);
											stepIntervalId1 = false;
										});
	
}


function changeSlide1(slider1) {
	//Canviem la icona depenent si arribem al tope dreta o esquerra
	//Si no posem aquesta validacio pot canviar al fletxa per un NaN
	

	if (!isNaN(slider1.step)) {
		
		if (slider1.step <= 0) {
			//Si estem al tope esquerra
			currentImg = $('handleLeft1').getAttribute('src');
			if (currentImg.indexOf('FW_fletxaLeftTope.') < 0) {
				currentImg = currentImg.replace(/FW_fletxaLeft./, 'FW_fletxaLeftTope.'); 
				$('handleLeft1').setAttribute('src', currentImg);
				$('handleLeft1').setAttribute('style','cursor:default');
				
			}
			currentImg = $('handleRight1').getAttribute('src');		
			if (!(currentImg.indexOf('FW_fletxaRight.') >= 0)) {
				currentImg = currentImg.replace(/FW_fletxaRightTope./, 'FW_fletxaRight.');
				$('handleRight1').setAttribute('src', currentImg);
				$('handleRight1').setAttribute('style','cursor:hand');
			}
		}else if (slider1.step >= slider1.options.steps) {
			//Si estem al tope dreta
			currentImg = $('handleRight1').getAttribute('src');
			if (currentImg.indexOf('FW_fletxaRightTope.') < 0) {		
				currentImg = currentImg.replace(/FW_fletxaRight./, 'FW_fletxaRightTope.'); 
				$('handleRight1').setAttribute('src', currentImg);
				$('handleRight1').setAttribute('style','cursor:default');
			}
		}else {
			//Si estem pel mig comprovem que les icones son les correctes
			currentImg = $('handleRight1').getAttribute('src');		
			if (!(currentImg.indexOf('FW_fletxaRight.') >= 0)) {
				currentImg = currentImg.replace(/FW_fletxaRightTope./, 'FW_fletxaRight.');
				$('handleRight1').setAttribute('src', currentImg);
				$('handleRight1').setAttribute('style','cursor:hand');
			}
			currentImg = $('handleLeft1').getAttribute('src');		
			if (!(currentImg.indexOf('FW_fletxaLeft.') >= 0)) {
				currentImg = currentImg.replace(/FW_fletxaLeftTope./, 'FW_fletxaLeft.');
				$('handleLeft1').setAttribute('src', currentImg);
				$('handleLeft1').setAttribute('style','cursor:hand');
			}
		}
	}
}


function stepLeft1() {
	var step = 0;
	if (slider1.step) {
		step = slider1.step;
	}
	step = step - 100;
	slider1.set(step);	
}

function stepRight1() {
	var step = 0;
	if (slider1.step) {
		step = slider1.step;
	}
	step = step + 100;
	slider1.set(step);	
}

//Inicialitzacio de la pagina
window.addEvent('domready', function(){				
				makeScrollbar1( $('FW_scrollH1'), $('scrollbar1'), $('handle1'), true, false );
			});