var s1; // slider
var TimerSlider;
var positionSourisX = false;
var positionSourisY = false;
var sensZoom = 'in';
function sliderUp() {
	window.clearTimeout(TimerSlider);
	pas = (s1.range.end-s1.range.start)/10;
	s1.setValue(s1.value-pas);
	TimerSlider=setTimeout("sliderUp()",2);
}	
function sliderDown() {
	window.clearTimeout(TimerSlider);
	pas = (s1.range.end-s1.range.start)/10;
	s1.setValue(s1.value+pas);
	TimerSlider=setTimeout("sliderDown()",2);
}

function zoomer(value) {
	// recuperation de l'offset de l'image (top et left)
	offsetImgVue = $('imgVue').positionedOffset();
	//alert(offsetImgVue[0]+' '+offsetImgVue[1]);	
	if (positionSourisX && positionSourisY) {
		positionACentrerX = positionSourisX;
		positionACentrerY = positionSourisY;
	} else {
		positionACentrerX = parseInt($('vue').getWidth()/2); // la position à centrer est le centre de la fenetre (div vue)
		positionACentrerY = parseInt($('vue').getHeight()/2);
	}	
	// recuparation de l'ancienne largeur/hauteur de l'image
	$imgOldWidth = $('imgVue').getWidth();
	$imgOldHeight = $('imgVue').getHeight();

	// transformation de l'image
	$('imgVue').style.margin = '0px'; // le décalage va être géré avec top et left, donc on supprime les marges
	$('imgVue').style.width = value+"px"; // modification de la largeur
	$('imgVue').style.height = '';
	//console.log(value);
	ratioX = $('imgVue').getWidth()/$imgOldWidth;
	ratioY = $('imgVue').getHeight()/$imgOldHeight;
	//alert(ratioX);

	// Decalage de l'image
	$('imgVue').style.left = Math.round(positionACentrerX - (( positionACentrerX - offsetImgVue[0]) * ratioX)) +'px';
	$('imgVue').style.top = Math.round(positionACentrerY - (( positionACentrerY - offsetImgVue[1]) * ratioY)) +'px';
	
	positionSourisX = false;
	positionSourisY = false;

}
// sur l'evenement windows load (apres chargement des images)
Event.observe(window, 'load', function() {
	// image deplaçable	
	new Draggable('imgVue', {starteffect:null, endeffect:null});//function (e) {e.stop();}
	//$('imgVue').style.cursor='move';
	// slider

	// creation du slider
	s1 = new Control.Slider('scrollBar','slider', {range: $R($('imgVue').getWidth(), imageOriginalWidth)});
	
	// sur le deplacement du slider
	s1.options.onSlide = function(value){
		zoomer(value);
	};
	// sur le change du slider (click sans deplacement)
	s1.options.onChange = function(value){
		zoomer(value);
	};	
	// click sur up
	Event.observe('b_listeUp', 'mousedown', function() {
		sliderUp();
	});	
	Event.observe('b_listeUp', 'mouseup', function() {
		window.clearTimeout(TimerSlider);
	});	
	Event.observe('b_listeUp', 'mouseout', function() {
		window.clearTimeout(TimerSlider);
	});	
	// click sur down
	Event.observe('b_listeDown', 'mousedown', function() {
		sliderDown();
	});	
	Event.observe('b_listeDown', 'mouseup', function() {
		window.clearTimeout(TimerSlider);
	});	
	Event.observe('b_listeDown', 'mouseout', function() {
		window.clearTimeout(TimerSlider);
	});		
	// gestion du click sur l'image
	/*Event.observe('imgVue', 'click', function(e) {
		positionSourisX = Event.pointerX(e);
		positionSourisY = Event.pointerY(e);
		pas = (s1.range.end-s1.range.start)/4;
		if (sensZoom == 'in') {
			s1.setValue(s1.value+pas);
			if (s1.value >= s1.range.end) sensZoom = 'out';
		} else {
			s1.setValue(s1.value-pas);	
			if (s1.value <= s1.range.start) sensZoom = 'in';
		}
	});
	*/
	// gestion du double click sur l'image
	Event.observe('imgVue', 'dblclick', function(e) {
		positionSourisX = Event.pointerX(e);
		positionSourisY = Event.pointerY(e);
		if (sensZoom == 'in') {
			s1.setValue(s1.range.end);
			sensZoom = 'out';
		} else {
			s1.setValue(s1.range.start);	
			sensZoom = 'in';
		}
	});	
	
	// gestion de la molette souris
	function handleScrollGallery(e) {
		//alert(Event.wheel(e));
		positionSourisX = Event.pointerX(e);
		positionSourisY = Event.pointerY(e);
		pas = (s1.range.end-s1.range.start)/10;
		s1.setValue(s1.value+Event.wheel(e)*pas);
	}
	Event.observe($('shootbox'), "mousewheel", handleScrollGallery, false);
	Event.observe($('shootbox'), "DOMMouseScroll", handleScrollGallery, false); // Firefox


}); // fin window load

/*
 * Orginal: http://adomas.org/javascript-mouse-wheel/
 * prototype extension by "Frank Monnerjahn" <themonnie@gmail.com> 
 */
Object.extend(Event, {
	wheel:function (event){
		var delta = 0;
		if (!event) event = window.event;
		if (event.wheelDelta) {
			delta = event.wheelDelta/120; 
			if (window.opera) delta = -delta;
		} else if (event.detail) { delta = -event.detail/3;	}
		return Math.round(delta); //Safari Round
	}
});

