/*****************************
  * Author: Steve Hardie
  * Created:  2008-05-21
  * Description:
  *   This file contains the functions required to drag & drop an element.
  *   
  *   Usage: 	<div id="myDiv" onmousedown="dragStart(event,'myDiv')">...</div>
  *
  *	  Requires: 	ctxBrowser.js
  *					
  * CHANGE HISTORY:
  * Date       Changed By        Description
  * ---------- ----------------- -----------------------------------------------
  * 
  ******************************************************************************/

// ******* Drag & Drop Code ********
	// Check for Browser
	if (typeof(browser)=='undefined') var browser=new Browser();
  
    // Global object to hold drag information.

    var dragObj = new Object();
    dragObj.zIndex = 0;

    function dragStart(event, id) {

      var el;
      var x, y;

      // If an element id was given, find it. Otherwise use the element being
      // clicked on.
	  if (dragObj==null) dragObj = new Object();
      if (id)
        dragObj.elNode = document.getElementById(id);
      else {
        if (browser.isIE)
          dragObj.elNode = window.event.srcElement;
        if (browser.isNS)
          dragObj.elNode = event.target;

        // If this is a text node, use its parent element.

        if (dragObj.elNode.nodeType == 3)
          dragObj.elNode = dragObj.elNode.parentNode;
      }

      // Get cursor position with respect to the page.

      if (browser.isIE) {
        x = window.event.clientX + document.documentElement.scrollLeft
          + document.body.scrollLeft;
        y = window.event.clientY + document.documentElement.scrollTop
          + document.body.scrollTop;
      }
      if (browser.isNS) {
        x = event.clientX + window.scrollX;
        y = event.clientY + window.scrollY;
      }

      // Save starting positions of cursor and element.

      dragObj.cursorStartX = x;
      dragObj.cursorStartY = y;
      dragObj.elStartLeft  = parseInt(dragObj.elNode.style.left, 10);
      dragObj.elStartTop   = parseInt(dragObj.elNode.style.top,  10);

      if (isNaN(dragObj.elStartLeft)) dragObj.elStartLeft = 0;
      if (isNaN(dragObj.elStartTop))  dragObj.elStartTop  = 0;

      // Update elements z-index.

      dragObj.elNode.style.zIndex = ++dragObj.zIndex;

      // Capture mousemove and mouseup events on the page.

      if (browser.isIE) {
        document.attachEvent("onmousemove", dragGo);
        document.attachEvent("onmouseup",   dragStop);
        window.event.cancelBubble = true;
        window.event.returnValue = false;
      }
      if (browser.isNS) {
        document.addEventListener("mousemove", dragGo,   true);
        document.addEventListener("mouseup",   dragStop, true);
        event.preventDefault();
      }
    }

    function dragGo(event) {

      var x, y;

      // Get cursor position with respect to the page.

      if (browser.isIE) {
        x = window.event.clientX + document.documentElement.scrollLeft
          + document.body.scrollLeft;
        y = window.event.clientY + document.documentElement.scrollTop
          + document.body.scrollTop;
          
      }
      if (browser.isNS) {
        x = event.clientX + window.scrollX;
        y = event.clientY + window.scrollY;
      }

      // Move drag element by the same amount the cursor has moved.

      dragObj.elNode.style.left = (dragObj.elStartLeft + x - dragObj.cursorStartX) + "px";
      dragObj.elNode.style.top  = (dragObj.elStartTop  + y - dragObj.cursorStartY) + "px";

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

    function dragStop(event) {

      // Stop capturing mousemove and mouseup events.

      if (browser.isIE) {
        document.detachEvent("onmousemove", dragGo);
        document.detachEvent("onmouseup",   dragStop);
      }
      if (browser.isNS) {
        document.removeEventListener("mousemove", dragGo,   true);
        document.removeEventListener("mouseup",   dragStop, true);
      }
    }