// JavaScript Document - Méthodes de Drag

//***********************************************************************************************************//
//***********************************************************************************************************//
//***********************************************************************************************************//
//**********  METHODES PERMETTANT DE RENDRE DEPLACABLE LES ELEMENTS QUI ONT LA CLASSE "drag" EN STYLE *******//
//***********************************************************************************************************//
//***********************************************************************************************************//
//***********************************************************************************************************//

  var classMove = "drag";
  var myObjectClick = null;
  var movable = false;
  var positionXAtClick = null;
  var positionYAtClick = null;
  var positionXMyobjectClick = null;
  var positionYMyobjectClick = null;

  //Fonction permettant d'initialiser les listeners
  function init_drag(){
    //On commence par affecter une fonction à chaque évènement de la souris
    if(window.attachEvent){
      document.onmousedown = start;
      document.onmousemove = drag;
      document.onmouseup = drop;
    }
    else{
      document.addEventListener("mousedown",start, false);
      document.addEventListener("mousemove",drag, false);
      document.addEventListener("mouseup",drop, false);
    }
  }

  //Fonction permettant de récupèrer l'objet sur lequel on a clické, et l'on récupère sa classe
  function start(e){
    //On initialise l'évènement s'il n'a aps été créé ( sous ie )
    if(!e){
      e = window.event;
    }
    //Détection de l'élément sur lequel on a clické
    monElement = (e.target)? e.target:e.srcElement;

    if(monElement){
      //On appel la fonction permettant de récupèrer la classe de l'objet et assigner les variables
      getClassDrag(monElement);
      if(myObjectClick){
        positionXAtClick = e.clientX;
        positionYAtClick = e.clientY;
        positionXMyobjectClick = parseInt(myObjectClick.offsetLeft);
        positionYMyobjectClick = parseInt(myObjectClick.offsetTop);
        return false;
      }
    }
  }

  function drag(e){
    //On initialise l'évènement s'il n'a aps été créé ( sous ie )
    if(!e){
      e = window.event;
    }

    //Si l'objet est déplaçable et qu'il existe
    if(movable && myObjectClick){
      myObjectClick.style.position = "absolute" ;
      //On récupère la position de la souris par rapport à l'objet
      myObjectClick.style.left = e.clientX + ( positionXMyobjectClick - positionXAtClick ) + "px";
      myObjectClick.style.top = e.clientY + ( positionYMyobjectClick - positionYAtClick ) + "px";
      return false;
    }
  }

  function drop(){
    myObjectClick = null;
    movable = false;
    positionXAtClick = null;
    positionYAtClick = null;
    positionXMyobjectClick = null;
    positionYMyobjectClick = null;
  }

  function getClassDrag(myObject){
    with(myObject){
      var x = className;
      listeClass = x.split(" ");
      //On parcours le tableau pour voir si l'objet est déplaçable
      for(var i = 0 ; i < listeClass.length ; i++){
        if(listeClass[i] == classMove){
          movable = true;
          myObjectClick = myObject;
        }
      }
    }
  }
  //window.onload = init_drag;