var includeCaption = true; // Turn on the "caption" feature, and write out the caption HTML
var TemplatePath   = 'images/zoom/'; // Location of the zoom and shadow images

// Init. Do not add anything below this line, unless it's something awesome.

var myWidth = 0, myHeight = 0, myScroll = 0; myScrollWidth = 0; myScrollHeight = 0;
var zoomOpen = false, preloadFrame = 1, ActiveIt = true, preloadTime = 0, imgPreload = new Image();
var preloadAnimTimer = 0;

var zoomActive = new Array(); var zoomTimer  = new Array(); 
var zoomOrigW  = new Array(); var zoomOrigH  = new Array();
var zoomOrigX  = new Array(); var zoomOrigY  = new Array();

/* Liste des images préchargé */
var ImagesListe = new Array();

var zoomID         = "ZoomBox";
var theID          = "ZoomImage";
var zoomCaption    = "ZoomCaption";
var zoomCaptionDiv = "ZoomCapDiv";

var Mouse_X; // Variable globale Position X de la Mouse
var Mouse_Y; // Variable globale Position Y de la Mouse

var zoomdiv;  
var	zoomimg;

//-----------------------------------------------------------------------------
// l'argument e n'est passé à la fonction que par les navigateur n'ayant pas
// implémenté event comme objet, IE posséde son propre objet bien connu event
//-----------------------------------------------------------------------------
function WhereMouse( e ){
  var DocRef;    // Variable pour IE uniquement

  // L'événement est passée à la fonction
  // donc tous sauf IE…
  if( e){                     // Dans ce cas on obtient directement la position dans la page
    Mouse_X = e.pageX;
    Mouse_Y = e.pageY;
  }
  else{                      // Dans ce cas on obtient la position relative à la fenêtre d'affichage
    Mouse_X = event.clientX;
    Mouse_Y = event.clientY;

    //-- Il faut traiter le CAS des DOCTYPE sous IE
    if( document.documentElement && document.documentElement.clientWidth) // Donc DOCTYPE
      DocRef = document.documentElement;   // Dans ce cas c'est documentElement qui est réfèrence
    else
      DocRef = document.body;                    // Dans ce cas c'est body qui est réfèrence

    //-- On rajoute la position liée aux ScrollBars
    Mouse_X += DocRef.scrollLeft;
    Mouse_Y += DocRef.scrollTop;
  }
}

//== INITIALISATION ================
document.onmousemove = WhereMouse;


if (navigator.userAgent.indexOf("MSIE") != -1) {
	var browserIsIE = true;
}

function InitImageEffect() {
	
	WhoZoomEable();
	PutDiv();
	
	zoomdiv = document.getElementById(zoomID);  
	zoomimg = document.getElementById(theID);
}

/* On regarde les liens qui pointe vers une image et voir si il faut les Loader */
function WhoZoomEable() {
	
	/* On va regarder si la commande existe si c'est pas le cas le navigateur est trop vieux */
	if (! document.getElementsByTagName)
		return;
	
	var LesLiens = document.getElementsByTagName("a");
	
	for (i = 0; i < LesLiens.length; i++) {
	
		if (LesLiens[i].getAttribute("href")) {
		
			if ( LesLiens[i].getAttribute("href").search(/(.*)\.(jpg|jpeg|gif|png)/gi) != -1 ) {
			
			     /* On a donc une image on va la charger sauf si on ne veut pas...*/
				if (LesLiens[i].getAttribute("rel") != "nozoom") {
				
				    ImagesListe[i] = LesLiens[i].getAttribute("href");

					LesLiens[i].setAttribute('onclick','JavaScript:ZoomIt('+i+');');

                    TheImagePreload = new Image();

                    imgPreload.src  = TheImagePreload.src = LesLiens[i].getAttribute("href");
                    LesLiens[i].setAttribute("href",'#');
				}
			}
		}
	}
}

function PutDiv() {

	// All of this junk creates the three <div>'s used to hold the closebox, image, and zoom shadow.
	
	var inBody = document.getElementsByTagName('body').item(0);
	
	/* On va faire les sales et créer une box on va écrire direcemtement le HTML */
	var ContenairImage = document.createElement('div');
	
    ContenairImage.setAttribute('id', 'ContenairImage');
	ContenairImage.style.position   = 'absolute';
    ContenairImage.style.visibility = 'hidden';
    ContenairImage.style.zIndex     = '525';
    ContenairImage.style.display     = 'none';
	ContenairImage.style.left = '456px';
	ContenairImage.style.top = '175px';
    
    ContenairImage.innerHTML = '<table onclick="Javascript:ZoomClose();" bgcolor="white" style="border:2px solid #FFB619;"><tr><th>Cliquez sur l\'image pour fermer</th></tr><tr><td id="PutImgHere"></td></tr><tr><td id="ImageAlt"></td></tr></table>';

	
	inBody.appendChild(ContenairImage, inBody.firstChild);
}

function ZoomClose(){
	
	document.getElementById("ContenairImage").style.visibility = "hidden";
	document.getElementById("ContenairImage").style.display = "none";
}

function ZoomIt(IdToLoad){
	var LesLiens = document.getElementsByTagName("a");

	if( isNaN(IdToLoad)  )
		document.getElementById('PutImgHere').innerHTML = '<img src="'+IdToLoad+'" />';
	else
		document.getElementById('PutImgHere').innerHTML = '<img src="'+ImagesListe[IdToLoad]+'" />';
		
		
    document.getElementById('ContenairImage').style.visibility = 'visible';
    document.getElementById("ContenairImage").style.display = "block";
}

/* On va charger notre Gif de loading*/
function ShowLoadingGif() {

	document.getElementById("ZoomBox").style.left = Mouse_X+'px';
	document.getElementById("ZoomBox").style.top = Mouse_Y+'px';
	document.getElementById("ZoomBox").style.visibility = "visible";	
	
	document.getElementById("ZoomBox").src = TemplatePath+'zoom-spin-4.png';
}

/* -- IS DO -- */

// ZOOM CLICK: We got a click! Should we do the zoom? Or wait for the preload to complete?
// todo?: Double check that imgPreload src = clicked src

function zoomClick(from, evt) {

	var shift = getShift(evt);

	// Check for Command / Alt key. If pressed, pass them through -- don't zoom!
	if (! evt && window.event && (window.event.metaKey || window.event.altKey)) {
		return true;
	} else if (evt && (evt.metaKey|| evt.altKey)) {
		return true;
	}

	// Get browser dimensions
	getSize();

	// If preloading still, wait, and display the spinner.
	if (ActiveIt == true) {
			
		preloadFrom = from;
		ShowLoadingGif();	

	} else {
		// Otherwise, we're loaded: do the zoom!
		zoomIn(from, shift);
	}
	
	return false;
	
}

// Zoom: Move an element in to endH endW, using zoomHost as a starting point.
// "from" is an object reference to the href that spawned the zoom.

function zoomIn(from, shift) {

	zoomimg.src = from.getAttribute("href");
	
	/* Une fois que l'on a notre zoom on casse le Loading */
	document.getElementById("TheBox").src = zoomimg.src;

	// Determine the zoom settings from where we came from, the element in the <a>.
	// If there's no element in the <a>, or we can't get the width, make stuff up

	if (from.childNodes[0].width) {
	
		startW   = from.childNodes[0].width;
		startH   = from.childNodes[0].height;
		startPos = findElementPos(from.childNodes[0]);
		
	} else {
	
		startW = 50;
		startH = 12;
		startPos = findElementPos(from);
	}

	hostX = startPos[0];
	hostY = startPos[1];

	// Make up for a scrolled containing div.
	// TODO: This HAS to move into findElementPos.
	
	if (document.getElementById('scroller')) {
		hostX = hostX - document.getElementById('scroller').scrollLeft;
	}
	
	// Determine the target zoom settings from the preloaded image object

	endW = imgPreload.width;
	endH = imgPreload.height;

	// Start! But only if we're not zooming already!

	if (zoomActive[theID] != true) {

		// Clear everything out just in case something is already open

		document.getElementById("ZoomImage").style.visibility = "hidden";
		
		/*
		if (document.getElementById("ShadowBox")) {
			document.getElementById("ShadowBox").style.visibility = "hidden";
		} else if (! browserIsIE) {
		
			// Wipe timer if shadow is fading in still
			if (fadeActive["ZoomImage"]) {
				clearInterval(fadeTimer["ZoomImage"]);
				fadeActive["ZoomImage"] = false;
				fadeTimer["ZoomImage"] = false;			
			}
			
			document.getElementById("ZoomImage").style.webkitBoxShadow = shadowSettings + '0.0)';
		}
		*/
		
		document.getElementById("ZoomClose").style.visibility = "hidden";

		// Affichage de la légende si il y a
		if (includeCaption) {
		
			document.getElementById(zoomCaptionDiv).style.visibility = "hidden";
			if (from.getAttribute('title') && includeCaption) {
				// Yes, there's a caption, set it up
				document.getElementById(zoomCaption).innerHTML = from.getAttribute('title');
			} else {
				document.getElementById(zoomCaption).innerHTML = "";
			}
		}

		// Store original position in an array for future zoomOut.

		zoomOrigW[theID] = startW;
		zoomOrigH[theID] = startH;
		zoomOrigX[theID] = hostX;
		zoomOrigY[theID] = hostY;

		// Now set the starting dimensions
		
		zoomimg.style.width  = startW + 'px';
		zoomimg.style.height = startH + 'px';
		zoomdiv.style.left   = hostX + 'px';
		zoomdiv.style.top    = hostY + 'px';

		// Show the zooming image container, make it invisible

		if (includeFade == 1) {
			setOpacity(0, zoomID);
		}
		zoomdiv.style.visibility = "visible";

		// If it's too big to fit in the window, shrink the width and height to fit (with ratio).

		sizeRatio = endW / endH;
		
		/* Position relative à la place de la souris au moment du click donc sur l'image environ*/
		/*if (endW > Mouse_X - minBorder) {
			endW = Mouse_X - minBorder;
			endH = endW / sizeRatio;
		}
		if (endH > Mouse_Y - minBorder) {
			endH = Mouse_Y - minBorder;
			endW = endH * sizeRatio;
		}*/

		/* C ICI QUE L'ON DEFINIT LA POSITION DE DEPART  */
		
		/*
		
		FAIRE UN CHECK POUR VOIR SI ON EST PLUS GRAND DE CENTER LIMAGE OU DE LA CALER AVEC UNE MARGE A GAUCHE
		
		myWidth
		myHeight
		*/
		
		if( (endW + hostX) >= myWidth )
			zoomChangeX = -(endW + hostX - myWidth);
		else
			zoomChangeX = 0;
			
		zoomChangeY = 0;
		zoomChangeW = (endW - startW);
		zoomChangeH = (endH - startH) / 2;
		
		// Shift key?
	
		if (shift) {
			tempSteps = zoomSteps * 7;
		} else {
			tempSteps = zoomSteps;
		}

		// Setup Zoom

		zoomCurrent = 0;

		// Setup Fade with Zoom, If Requested

		if (includeFade == 1) {
			fadeCurrent = 0;
			fadeAmount = (0 - 100) / tempSteps;
		} else {
			fadeAmount = 0;
		}

		// Do It!
		
		zoomTimer[theID] = setInterval("zoomElement('"+zoomID+"', '"+theID+"', "+zoomCurrent+", "+startW+", "+zoomChangeW+", "+startH+", "+zoomChangeH+", "+hostX+", "+zoomChangeX+", "+hostY+", "+zoomChangeY+", "+tempSteps+", "+includeFade+", "+fadeAmount+", 'zoomDoneIn(zoomID)')", zoomTime);		
		zoomActive[theID] = true; 
	}
}

// Zoom it back out.

function zoomOut(from, evt) {

	// Get shift key status.
	// IE events don't seem to get passed through the function, so grab it from the window.

	if (getShift(evt)) {
		tempSteps = zoomSteps * 7;
	} else {
		tempSteps = zoomSteps;
	}	

	// Check to see if something is happening/open
  
	if (zoomActive[theID] != true) {

		/* On masque l'ombre */
		/*if (document.getElementById("ShadowBox")) {
			document.getElementById("ShadowBox").style.visibility = "hidden";
		} else if (! browserIsIE) {
		
			// Wipe timer if shadow is fading in still
			if (fadeActive["ZoomImage"]) {
				clearInterval(fadeTimer["ZoomImage"]);
				fadeActive["ZoomImage"] = false;
				fadeTimer["ZoomImage"] = false;			
			}
			
			document.getElementById("ZoomImage").style.webkitBoxShadow = shadowSettings + '0.0)';			
		}*/

		/* On va masquer l'image de fermeture */
		document.getElementById("ZoomClose").style.visibility = "hidden";

		/* Et le titre si nécessaire */
		if (includeCaption && document.getElementById(zoomCaption).innerHTML != "")
			document.getElementById(zoomCaptionDiv).style.visibility = "hidden";

		// Now, figure out where we came from, to get back there

		zoomimg.width  = 0;
		zoomimg.height = 0;
		zoomimg.src    = '';
		
		zoomdiv.width            = 0;
		zoomdiv.height           = 0;
		zoomdiv.style.left       = 0;
		zoomdiv.style.top        = 0;
		zoomdiv.style.visibility = 'hidden';

	}
}

// Finished Zooming In

function zoomDoneIn(zoomdiv, theID) {

	// Note that it's open
  
	zoomOpen = true;
	zoomdiv = document.getElementById(zoomdiv);
	
	// Position and display the CAPTION, if existing
  
	/*if (includeCaption && document.getElementById(zoomCaption).innerHTML != "") {
		// setOpacity(0, zoomCaptionDiv);
		zoomcapd                  = document.getElementById(zoomCaptionDiv);
		/zoomcapd.style.top        = (parseInt(zoomdiv.style.height) - 100)+'px';
		zoomcapd.style.left       = ( parseInt(zoomdiv.style.height) * 1.5 )+'px';
		zoomcapd.style.visibility = "visible";
		// fadeElementSetup(zoomCaptionDiv, 0, 100, 5);
	} */  
	
	// Display Close Box (fade it if it's not IE)

	if (!browserIsIE) 
		setOpacity(0, "ZoomClose");
	
	document.getElementById("ZoomClose").style.visibility = "visible";
		
	if (!browserIsIE) 
		fadeElementSetup("ZoomClose", 0, 100, 5);

	// Get keypresses
	document.onkeypress = getKey;
	
}

// Finished Zooming Out

function zoomDone(zoomdiv, theID) {

	// No longer open
  
	zoomOpen = false;

	// Clear stuff out, clean up

	zoomOrigH[theID] = "";
	zoomOrigW[theID] = "";
	document.getElementById(zoomdiv).style.visibility = "hidden";
	zoomActive[theID] == false;

	// Stop getting keypresses

	document.onkeypress = null;

}

// Actually zoom the element

function zoomElement(zoomdiv, theID, zoomCurrent, zoomStartW, zoomChangeW, zoomStartH, zoomChangeH, zoomStartX, zoomChangeX, zoomStartY, zoomChangeY, zoomSteps, includeFade, fadeAmount, execWhenDone) {

	// console.log("Zooming Step #"+zoomCurrent+ " of "+zoomSteps+" (zoom " + zoomStartW + "/" + zoomChangeW + ") (zoom " + zoomStartH + "/" + zoomChangeH + ")  (zoom " + zoomStartX + "/" + zoomChangeX + ")  (zoom " + zoomStartY + "/" + zoomChangeY + ") Fade: "+fadeAmount);
    
	// Test if we're done, or if we continue

	if (zoomCurrent == (zoomSteps + 1)) {
	
		zoomActive[theID] = false;
		clearInterval(zoomTimer[theID]);

		if (execWhenDone != "") {
			eval(execWhenDone);
		}

	} else {
	
		/* ON COMMENCE A AFFICHER L'IMAGE */
	
		// Do the Fade!
	  
		if (includeFade == 1) {
			if (fadeAmount < 0) {
				setOpacity(Math.abs(zoomCurrent * fadeAmount), zoomdiv);
			} else {
				setOpacity(100 - (zoomCurrent * fadeAmount), zoomdiv);
			}
		}
	  
		// Calculate this step's difference, and move it!
		
		moveW = cubicInOut(zoomCurrent, zoomStartW, zoomChangeW, zoomSteps);
		moveH = cubicInOut(zoomCurrent, zoomStartH, zoomChangeH, zoomSteps);
		moveX = cubicInOut(zoomCurrent, zoomStartX, zoomChangeX, zoomSteps);
		moveY = cubicInOut(zoomCurrent, zoomStartY, zoomChangeY, zoomSteps);
	
		document.getElementById(zoomdiv).style.left = moveX + 'px';
		document.getElementById(zoomdiv).style.top = moveY + 'px';
		
		zoomimg.style.width  = 0;
		zoomimg.style.height = 0;

		zoomCurrent++;
		
		clearInterval(zoomTimer[theID]);
		zoomTimer[theID] = setInterval("zoomElement('"+zoomdiv+"', '"+theID+"', "+zoomCurrent+", "+zoomStartW+", "+zoomChangeW+", "+zoomStartH+", "+zoomChangeH+", "+zoomStartX+", "+zoomChangeX+", "+zoomStartY+", "+zoomChangeY+", "+zoomSteps+", "+includeFade+", "+fadeAmount+", '"+execWhenDone+"')", zoomTime);
	}
}

// Zoom Utility: Get Key Press when image is open, and act accordingly

function getKey(evt) {
	if (! evt) {
		theKey = event.keyCode;
	} else {
		theKey = evt.keyCode;
	}

	if (theKey == 27) { // ESC
		zoomOut(this, evt);
	}
}

////////////////////////////
//
// FADE Functions
//

function fadeOut(elem) {
	if (elem.id) {
		fadeElementSetup(elem.id, 100, 0, 10);
	}
}

function fadeIn(elem) {
	if (elem.id) {
		fadeElementSetup(elem.id, 0, 100, 10);	
	}
}

// Fade: Initialize the fade function

var fadeActive = new Array();
var fadeQueue  = new Array();
var fadeTimer  = new Array();
var fadeClose  = new Array();
var fadeMode   = new Array();

function fadeElementSetup(theID, fdStart, fdEnd, fdSteps, fdClose, fdMode) {

	// alert("Fading: "+theID+" Steps: "+fdSteps+" Mode: "+fdMode);

	if (fadeActive[theID] == true) {
		// Already animating, queue up this command
		fadeQueue[theID] = new Array(theID, fdStart, fdEnd, fdSteps);
	} else {
		fadeSteps = fdSteps;
		fadeCurrent = 0;
		fadeAmount = (fdStart - fdEnd) / fadeSteps;
		fadeTimer[theID] = setInterval("fadeElement('"+theID+"', '"+fadeCurrent+"', '"+fadeAmount+"', '"+fadeSteps+"')", 15);
		fadeActive[theID] = true;
		fadeMode[theID] = fdMode;
		
		if (fdClose == 1) {
			fadeClose[theID] = true;
		} else {
			fadeClose[theID] = false;
		}
	}
}

// Fade: Do the fade. This function will call itself, modifying the parameters, so
// many instances can run concurrently. Can fade using opacity, or fade using a box-shadow.

function fadeElement(theID, fadeCurrent, fadeAmount, fadeSteps) {

	if (fadeCurrent == fadeSteps) {

		// We're done, so clear.

		clearInterval(fadeTimer[theID]);
		fadeActive[theID] = false;
		fadeTimer[theID] = false;

		// Should we close it once the fade is complete?

		if (fadeClose[theID] == true) {
			document.getElementById(theID).style.visibility = "hidden";
		}

		// Hang on.. did a command queue while we were working? If so, make it happen now

		if (fadeQueue[theID] && fadeQueue[theID] != false) {
			fadeElementSetup(fadeQueue[theID][0], fadeQueue[theID][1], fadeQueue[theID][2], fadeQueue[theID][3]);
			fadeQueue[theID] = false;
		}
	} else {

		fadeCurrent++;
		
		// Now actually do the fade adjustment.
		
		/*if (fadeMode[theID] == "shadow") {

			// Do a special fade on the webkit-box-shadow of the object
		
			if (fadeAmount < 0) {
				document.getElementById(theID).style.webkitBoxShadow = shadowSettings + (Math.abs(fadeCurrent * fadeAmount)) + ')';
			} else {
				document.getElementById(theID).style.webkitBoxShadow = shadowSettings + (100 - (fadeCurrent * fadeAmount)) + ')';
			}
			
		} else {
		
			// Set the opacity depending on if we're adding or subtracting (pos or neg)
			
			if (fadeAmount < 0) {
				setOpacity(Math.abs(fadeCurrent * fadeAmount), theID);
			} else {
				setOpacity(100 - (fadeCurrent * fadeAmount), theID);
			}
		}*/

		// Keep going, and send myself the updated variables
		clearInterval(fadeTimer[theID]);
		fadeTimer[theID] = setInterval("fadeElement('"+theID+"', '"+fadeCurrent+"', '"+fadeAmount+"', '"+fadeSteps+"')", 15);
	}
}

////////////////////////////
//
// UTILITY functions
//

// Utility: Set the opacity, compatible with a number of browsers. Value from 0 to 100.

function setOpacity(opacity, theID) {

	var object = document.getElementById(theID).style;

	// If it's 100, set it to 99 for Firefox.

	if (navigator.userAgent.indexOf("Firefox") != -1) {
		if (opacity == 100) { opacity = 99.9999; } // This is majorly awkward
	}

	// Multi-browser opacity setting

	object.filter = "alpha(opacity=" + opacity + ")"; // IE/Win
	object.opacity = (opacity / 100);                 // Safari 1.2, Firefox+Mozilla

}

// Utility: Math functions for animation calucations - From http://www.robertpenner.com/easing/
//
// t = time, b = begin, c = change, d = duration
// time = current frame, begin is fixed, change is basically finish - begin, duration is fixed (frames),

function linear(t, b, c, d)
{
	return c*t/d + b;
}

function sineInOut(t, b, c, d)
{
	return -c/2 * (Math.cos(Math.PI*t/d) - 1) + b;
}

function cubicIn(t, b, c, d) {
	return c*(t/=d)*t*t + b;
}

function cubicOut(t, b, c, d) {
	return c*((t=t/d-1)*t*t + 1) + b;
}

function cubicInOut(t, b, c, d)
{
	if ((t/=d/2) < 1) return c/2*t*t*t + b;
	return c/2*((t-=2)*t*t + 2) + b;
}

function bounceOut(t, b, c, d)
{
	if ((t/=d) < (1/2.75)){
		return c*(7.5625*t*t) + b;
	} else if (t < (2/2.75)){
		return c*(7.5625*(t-=(1.5/2.75))*t + .75) + b;
	} else if (t < (2.5/2.75)){
		return c*(7.5625*(t-=(2.25/2.75))*t + .9375) + b;
	} else {
		return c*(7.5625*(t-=(2.625/2.75))*t + .984375) + b;
	}
}


// Utility: Get the size of the window, and set myWidth and myHeight
// Credit to quirksmode.org

function getSize() {

	// Window Size

	if (self.innerHeight) { // Everyone but IE
		myWidth = window.innerWidth;
		myHeight = window.innerHeight;
		myScroll = window.pageYOffset;
	} else if (document.documentElement && document.documentElement.clientHeight) { // IE6 Strict
		myWidth = document.documentElement.clientWidth;
		myHeight = document.documentElement.clientHeight;
		myScroll = document.documentElement.scrollTop;
	} else if (document.body) { // Other IE, such as IE7
		myWidth = document.body.clientWidth;
		myHeight = document.body.clientHeight;
		myScroll = document.body.scrollTop;
	}

	// Page size w/offscreen areas

	if (window.innerHeight && window.scrollMaxY) {	
		myScrollWidth = document.body.scrollWidth;
		myScrollHeight = window.innerHeight + window.scrollMaxY;
	} else if (document.body.scrollHeight > document.body.offsetHeight) { // All but Explorer Mac
		myScrollWidth = document.body.scrollWidth;
		myScrollHeight = document.body.scrollHeight;
	} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
		myScrollWidth = document.body.offsetWidth;
		myScrollHeight = document.body.offsetHeight;
	}
}

// Utility: Get Shift Key Status
// IE events don't seem to get passed through the function, so grab it from the window.

function getShift(evt) {
	var shift = false;
	if (! evt && window.event) {
		shift = window.event.shiftKey;
	} else if (evt) {
		shift = evt.shiftKey;
		if (shift) evt.stopPropagation(); // Prevents Firefox from doing shifty things
	}
	return shift;
}

// Utility: Find the Y position of an element on a page. Return Y and X as an array

function findElementPos(elemFind)
{
	var elemX = 0;
	var elemY = 0;
	do {
		elemX += elemFind.offsetLeft;
		elemY += elemFind.offsetTop;
	} while ( elemFind = elemFind.offsetParent )

	return Array(elemX, elemY);
}