var capax;
var capay;

function Navegador() {


  var ua, s, i;

  this.isIE    = false;
  this.isNS    = false;
  this.version = null;

  ua = navigator.userAgent;

  s = "MSIE";
  if ((i = ua.indexOf(s)) >= 0) {
    this.isIE = true;
    this.version = parseFloat(ua.substr(i + s.length));
    return;
  }


  // Treat any other "Gecko" browser as NS 6.1.

  s = "Gecko";
  if ((i = ua.indexOf(s)) >= 0) {
    this.isNS = true;
    this.version = 6.1;
    return;
  }
}



//nuevo objeto global

var dragObject = new Object();
var navegador = new Navegador();
dragObject.zIndex = 0;



function iniciArrastrar(event){
  
  
  	//Depenent del navegador ... lo següent...
  	if(navegador.isNS)
	{
		dragObject.elNode = event.target;
		dragObject.elNode = dragObject.elNode.parentNode;
	}
	
	if(navegador.isIE)
	{
		dragObject.elNode = window.event.srcElement;	
		dragObject.elNode = dragObject.elNode.parentNode;
	}



	//conseguir posició curor respecte a la pàgina.
	if(navegador.isNS)
	{  
		capax = event.clientX + window.scrollX;
		capay = event.clientY + window.scrollY;
	}	
	
	if(navegador.isIE)
	{
		capax =	window.event.clientX + document.documentElement.scrollLeft + 		document.body.scrollLeft;
		capay = window.event.clientY + document.documentElement.scrollTop + document.body.scrollTop;
	}	

	//Es guarda la posició de l'element a moure i la del cursor.
	dragObject.cursorStartX = capax;
	dragObject.cursorStartY = capay;

	dragObject.elStartLeft = parseInt(dragObject.elNode.style.left, 10);
	dragObject.elStartTop   = parseInt(dragObject.elNode.style.top,  10);
	
	//Ara s'actualiza el z-index
	dragObject.elNode.style.zIndex = ++dragObject.zIndex;


	//Es configura la captura els events mousemove i mouseup.
	if(navegador.isNS)
	{
		document.addEventListener("mousemove", dragGo,   true);
   	document.addEventListener("mouseup",   dragStop, true);
   	event.preventDefault();
	}
	
	if(navegador.isIE)
	{
		document.attachEvent("onmousemove", dragGo);
		document.attachEvent("onmouseup", dragStop);	
		window.event.cancelBubble = true;
		window.event.returnValue = false;
	
	}
}

function dragGo(event){

	var x, y;
	//S'agafa posició cursor respecte a la pàgina.
	if(navegador.isNS)
	{
		x = event.clientX + window.scrollX;
		y = event.clientY + window.scrollY;
	}
	
	if(navegador.isIE)
	{
		x= window.event.clientX + document.documentElement.scrollLeft + document.body.scrollLeft;
		y= window.event.clientY + document.documentElement.scrollTop + document.body.scrollTop;
	}

	//Es mou l'element a la mateixa posició que el cursor
	dragObject.elNode.style.left = (dragObject.elStartLeft + x - dragObject.cursorStartX) + "px";
	dragObject.elNode.style.top  = (dragObject.elStartTop  + y - dragObject.cursorStartY) + "px";

	if(navegador.isNS)
	{
		event.preventDefault();
	}
	if(navegador.IE)
	{
		window.event.cancelBubble = true;
		window.event.returnValue = false;
	}
}

function dragStop(event){

	//Es para l'arrosegament quan es para d'apretar el ratoí
	if(navegador.isNS)
	{
		document.removeEventListener("mousemove", dragGo, true);
		document.removeEventListener("mouseup", dragStop,true);
	}
	
	if(navegador.isIE)
	{
		document.detachEvent("onmousemove", dragGo);
   	document.detachEvent("onmouseup",   dragStop);
	}
}