var NN4 = false;
 var IE4 = false;
 var IE5 = false;
 var topIndex = 0;
 var dragapproved=false;
 var z,x,y;

// get the browsers version and type
var agent = navigator.userAgent;
var browser_ver = parseInt(navigator.appVersion);
var browser_type = navigator.appName;

// check the browser type and assign to applicable var if version greater/equal to 4
if (browser_ver >= 4 ) {
   if (browser_type == "Netscape")
	{
	  NN4 = true;
	}
	else if (browser_type == "Microsoft Internet Explorer")
	{
		var msie = agent.indexOf ("MSIE ");
		if (parseInt(agent.substring (msie+5, agent.indexOf (".", msie ))) >= 5)
		{
			IE5 = true;
		}
		else
		{
			IE4 = true;
		}
	}
} 

var selectedElem = null;    //holds reference to a selected object
var offsetX, offsetY;       //hold click location relative to object

if (IE5)
{
	document.onmousedown=drags;
	document.onmouseup=new Function("dragapproved=false");
}

// ** START FUNCTIONS IE 4+/Netscape 4+ **
// Determines which element has been selected
function whichObject(evt) {
 if (NN4) {
    var clickPosX = evt.pageX;
    var clickPosY = evt.pageY;
    var testElem;
    for (var k = document.layers.length-1; k >=0; k--) {
        testElem = document.layers[k];
        if ((clickPosX > testElem.left) && (clickPosX < testElem.left +
           testElem.clip.width) && (clickPosY > testElem.top) &&
           (clickPosY < testElem.top + testElem.clip.height)) {
              selectedElem = testElem;
              return;
        }
    }
  } else {
    var imgElem = window.event.srcElement;
    selectedElem = imgElem.parentElement.style;
    return;
  }
  selectedElem = 0;
  return;
}

// Determines the mouse cursor position relative to element
function selectIt(evt) {
    whichObject(evt);
    if (selectedElem) { 
        topIndex += selectedElem.zIndex;
	selectedElem.zIndex = topIndex + 1;
        if (NN4) {
           offsetX = evt.pageX - selectedElem.left;
           offsetY = evt.pageY - selectedElem.top;
	   return false;
        } else {
           offsetX = window.event.offsetX;
           offsetY = window.event.offsetY;
        }
    }
}

// Positions the dragging element
function dragIt(evt) {
    if (selectedElem) {
       if (NN4) {
          selectedElem.left = evt.pageX - offsetX;
          selectedElem.top = evt.pageY - offsetY;
       } else {
          selectedElem.pixelLeft = window.event.clientX - offsetX;
          selectedElem.pixelTop = window.event.clientY - offsetY;
          return false
       }
    }
}

// Releases the element
function dropIt(evt) { 
   if (selectedElem) {
      selectedElem.zIndex = topIndex + 1;
      selectedElem = null;
   }
}
// ** END FUNCTIONS IE 4+/Netscape 4+ **

// ** FUNCTIONS FOR IE 5+ **
function move()
{
	if (event.button==1&&dragapproved)
	{
		z.style.pixelLeft=temp1+event.clientX-x;
		z.style.pixelTop=temp2+event.clientY-y;
		return false;
	}
}
function drags()
{
	if (!document.all) { return; }
	if (event.srcElement.className=="drag")
	{
		dragapproved=true;
		z=event.srcElement;
		temp1=z.style.pixelLeft;
		temp2=z.style.pixelTop;
		x=event.clientX;
		y=event.clientY;
		document.onmousemove=move;
	}
}
// ** END FUNCTIONS IE 5+ ** 

// Captures and handles the events
function eventHandling()
{
	if (NN4)
	{
    		document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE | Event.MOUSEUP);
    }
    if (NN4 || IE4)
	{
    	document.onmousedown = selectIt;
        document.onmousemove = dragIt;
        document.onmouseup = dropIt;
    }
}