Drag and Drop

// modified from: http://www.quirksmode.org/js/dragdrop.html
var MAX_Z_INDEX=1;
function addEventSimple(obj,evt,fn) {
    if (obj.addEventListener)
        obj.addEventListener(evt,fn,false);
    else if (obj.attachEvent)
        obj.attachEvent('on'+evt,fn);
}
function removeEventSimple(obj,evt,fn) {
    if (obj.removeEventListener)
        obj.removeEventListener(evt,fn,false);
    else if (obj.detachEvent)
        obj.detachEvent('on'+evt,fn);
}
dragDrop = {
    initialMouseX: undefined,
    initialMouseY: undefined,
    startX: undefined,
    startY: undefined,
    draggedObject: undefined,
    initElement: function (element) {
        if (typeof element == 'string')
            element = document.getElementById(element);
        element.onmousedown = dragDrop.startDragMouse;
    //-------
    if (element.style.zIndex)
    {
        thisIndex=element.style.zIndex;
        if (thisIndex > MAX_Z_INDEX)
            MAX_Z_INDEX=thisIndex;
    }
    //-------
    },
    startDragMouse: function (e) {
        dragDrop.startDrag(this);
        var evt = e || window.event;
        dragDrop.initialMouseX = evt.clientX;
        dragDrop.initialMouseY = evt.clientY;
        addEventSimple(document,'mousemove',dragDrop.dragMouse);
        addEventSimple(document,'mouseup',dragDrop.releaseElement);
        return false;
    },
    startDrag: function (obj) {
        if (dragDrop.draggedObject)
            dragDrop.releaseElement();
        dragDrop.startX = obj.offsetLeft;
        dragDrop.startY = obj.offsetTop;
        dragDrop.draggedObject = obj;
        obj.className += ' dragged';
        dragDrop.draggedObject.style.zIndex=MAX_Z_INDEX+1;
        MAX_Z_INDEX=MAX_Z_INDEX+1;
    },
    dragMouse: function (e) {
        var evt = e || window.event;
        var dX = evt.clientX - dragDrop.initialMouseX;
        var dY = evt.clientY - dragDrop.initialMouseY;
        dragDrop.setPosition(dX,dY);
        return false;
    },
    setPosition: function (dx,dy) {
        dragDrop.draggedObject.style.left = dragDrop.startX + dx + 'px';
        dragDrop.draggedObject.style.top = dragDrop.startY + dy + 'px';
    },
    releaseElement: function() {
        removeEventSimple(document,'mousemove',dragDrop.dragMouse);
        removeEventSimple(document,'mouseup',dragDrop.releaseElement);
        dragDrop.draggedObject.className = dragDrop.draggedObject.className.replace(/dragged/,'');
        dragDrop.draggedObject = null;
    }
}

/*
Modified from: http://elouai.com/javascript-drag-and-drop.php
*/
var ie=document.all;
var nn6=document.getElementById&&!document.all;
var isdrag=false;
var x,y;
var tx=0;
var ty=0;
var draggedObj;
function dragMouse(e)
{
  var evt = e || window.event;      
  if (isdrag)
  {  
    draggedObj.style.left =''+(tx + evt.clientX - x)+'px';
    draggedObj.style.top  =''+(ty + evt.clientY - y)+'px';
    return false;
  }
}
function selectmouse(e)
{
   var evt = e || window.event;     
  var fobj       = evt.target;
  var topelement = "HTML";
  while (fobj.tagName != topelement && fobj.className != "dragme")
    fobj = fobj.parentElement;
  if (fobj.className=="dragme")
  {
    isdrag = true;
    draggedObj = fobj;
    tx=0;
    ty=0;
    if(draggedObj.style.left)
        tx = parseInt(draggedObj.style.left);
    if(draggedObj.style.top)
        ty = parseInt(draggedObj.style.top);
    x = evt.clientX;
    y = evt.clientY;         
    document.onmousemove=dragMouse;
    return false;
  }
}
function drop()
{
    isdrag=false;
    draggedObj=null;
}
function initDND()
{
    document.onmousedown=selectmouse;
    document.onmouseup=drop;
}