// JavaScript Document
var dragObject  = null;
var mouseOffset = null;
var dragContainer = null;

function zoomImg()
{
	if(document.getElementById('imagezoom').style.display != "block")
	{
		document.getElementById('imagezoom').style.display = "block";
		document.getElementById('imagestandard').style.display = "none";
		document.getElementById('imgz').src = "img/picto_zoom_moins.png";
		enableDrag(document.getElementById('imgMainImageZoom').width,document.getElementById('imgMainImageZoom').height);
		
	}
	else
	{
		document.getElementById('imagezoom').style.display = "none";
		document.getElementById('imagestandard').style.display = "block";
		document.getElementById('imgz').src = "img/picto_zoom.png";  
	}
		
	
}

function changeimage(limage,lepath)
{
  var pathancien,pathnouveau;
  var pathancienz,pathnouveauz;
  var lim;
  //PARTIE IMAGETTE
  pathnouveau = document.getElementById(limage).src;
  pathancien = document.getElementById('imagestandardimg').src;
  document.getElementById('imagestandardimg').src = pathnouveau;
  document.getElementById(limage).src = pathancien;
  
  //PARTIE ZOOM
  lim = limage+"z";
  pathnouveauz = document.getElementById(lim).src;
  pathancienz = document.getElementById('imgMainImageZoom').src;
  document.getElementById('imgMainImageZoom').src = pathnouveauz;
  document.getElementById(lim).src = pathancienz;
  
  //REMISE A L'ETAT INITIAL
  document.getElementById('imagezoom').style.display = "none";
  document.getElementById('imagestandard').style.display = "block";
  document.getElementById('imgz').src = lepath + "btn-zoom.gif";
  
  
  
}

function changeimage2(limage,lepath)
{
  var pathancien,pathnouveau;
  var pathancienz,pathnouveauz;
  var lim;
  //PARTIE IMAGETTE
  pathnouveau = document.getElementById(limage).src;
  pathancien = document.getElementById('imagestandardimg').src;
  document.getElementById('imagestandardimg').src = pathnouveau;
  document.getElementById(limage).src = pathancien;
  
  //PARTIE ZOOM
  lim = limage+"z";
  pathnouveauz = document.getElementById(lim).src;
  pathancienz = document.getElementById('imgMainImageZoom').src;
  document.getElementById('imgMainImageZoom').src = pathnouveauz;
  document.getElementById(lim).src = pathancienz;
  
  //REMISE A L'ETAT INITIAL
  document.getElementById('imagezoom').style.display = "none";
  document.getElementById('imagestandard').style.display = "block";
  document.getElementById('imgz').src = "img/picto_zoom.png";
  
  
  
}	





//Drag Image Start
function enableDrag (imgWidth, imgHeight)
{
          var dragItem = null;
          var dragCont = null;
          var contW, contH = 0;
          var top, left;
          document.onmousemove = mouseMove;
          document.onmouseup   = mouseUp;

          dragCont = document.getElementById('dvMainImageZoom');
          makeContainer(dragCont);

          dragItem = document.getElementById('imgMainImageZoom');
          makeDraggable(dragItem);
          dragItem.style.position = 'absolute';

          dragItem.style.height = imgHeight + 'px'; dragItem.style.width = imgWidth + 'px';

          dragItem.style.top = 0; dragItem.style.left = 0;
          dragItem.top = 0; dragItem.left = 0;
	
          top = -((parseInt(dragItem.style.height)/2) - (parseInt(dragCont.style.height)/2));
          left = -((parseInt(dragItem.style.width)/2) - (parseInt(dragCont.style.width)/2));

          dragItem.style.top = top +'px';
          dragItem.style.left = left+'px';

          dragItem.top = dragItem.style.top;
          dragItem.left = dragItem.style.left;

          dragItem.alt = "Cliquez et déplacez l'image";

}

function makeContainer(item){
	dragContainer = item;
	dragContainer.style.position = 'relative';
	dragContainer.style.overflow = 'hidden';
}

function makeDraggable(item){
	if(!item) return;
	try {item.style.cursor = 'pointer';} catch (e) {} //cursor property breaks IE5.5
	item.onmousedown = function(ev){		
		dragObject  = this;
		dragObject.style.position = 'absolute';
		mouseOffset = getMouseOffset(this, ev);
		return false;
	}
}


function mouseMove(ev){
	ev           = ev || window.event;
	var mousePos = mouseCoords(ev);
	var targWidth, targHeight, targPos;
	var browseWidth, browseHeight;

	browseWidth		=	getCanvasWidth();
	browseHeight	=	getCanvasHeight();

	if(dragObject){	
		if (dragContainer) {
			targWidth  = parseInt(dragContainer.offsetWidth);
			targHeight = parseInt(dragContainer.offsetHeight);
			if (((mousePos.y - mouseOffset.y) < 0) && ((mousePos.y - mouseOffset.y + dragObject.height) > (targHeight)))	{dragObject.style.top	= (mousePos.y - mouseOffset.y) + 'px';}
			if (((mousePos.x - mouseOffset.x) < 0) && ((mousePos.x - mouseOffset.x + dragObject.width) > (targWidth)))	{dragObject.style.left	= (mousePos.x - mouseOffset.x) + 'px';}
		} else {
			dragObject = null;
		}
		return false;
	}
}

function mouseCoords(ev){
	if(ev.pageX || ev.pageY){
		return {x:ev.pageX, y:ev.pageY};
	}
	return {
		x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,
		y:ev.clientY + document.body.scrollTop  - document.body.clientTop
	};
}

function mouseUp(){
		dragObject = null;
}

function getCanvasWidth() { 
   return document.body.offsetWidth || window.innerWidth; 
} 

function getCanvasHeight() { 
   return document.body.offsetHeight || window.innerHeight; 
} 

function getMouseOffset(target, ev){
	ev = ev || window.event;

	var docPos    = getPosition(target);
	var mousePos  = mouseCoords(ev);

	return {x:mousePos.x - docPos.x, y:mousePos.y - docPos.y};
}


function getPosition(obj){
	var left = 0;
	var top = 0;

	//if (document.getElementById('pnlProductPopUpInfo')) { document.getElementById('pnlProductPopUpInfo').style.position = 'absolute'; }	
	
	if (obj.offsetParent) {

		left += obj.offsetLeft ;
		top += obj.offsetTop;		
		
		while (obj = obj.offsetParent) {
			if (parseInt(obj.style.left)) {
				if (!obj.id == 'pnlProductPopUpInfo') {
					left -= parseInt(obj.style.left);
					top -= parseInt(obj.style.top);
				}
			}
		}
	}
	return {x:left, y:top};
}