var dragObj = null;
var offset = null;
var mousePos = null;

Number.prototype.NaN0=function(){return isNaN(this)?0:this;}

function getPosition(e){
	var left = 0;
	var top  = 0;
	
	if (e != null) {
		left = parseInt(e.style.left.substr(0, e.style.left.length - 2));
		top = parseInt(e.style.top.substr(0, e.style.top.length - 2));
	}
	/*
	while (e.offsetParent){
		left += e.offsetLeft + (e.currentStyle?(parseInt(e.currentStyle.borderLeftWidth)).NaN0():0);
		top  += e.offsetTop  + (e.currentStyle?(parseInt(e.currentStyle.borderTopWidth)).NaN0():0);
		e     = e.offsetParent;
	}


	left += e.offsetLeft + (e.currentStyle?(parseInt(e.currentStyle.borderLeftWidth)).NaN0():0);
	top  += e.offsetTop + (e.currentStyle?(parseInt(e.currentStyle.borderTopWidth)).NaN0():0);
	*/
	
	return {x:left, y:top};

}

function mouseCoords(ev){
	ev = ev || window.event;
	if(ev.pageX || ev.pageY){
		return {x:ev.pageX, y:ev.pageY};
	}
	return {
		x:ev.clientX, // + document.body.scrollLeft - document.body.clientLeft,
		y:ev.clientY  // + document.body.scrollTop  - document.body.clientTop
	};
}

function getMouseOffset(target, ev){
	ev = ev || window.event;

	var docPos    = getPosition(target);
	var mousePos  = mouseCoords(ev);
	return {x:mousePos.x - docPos.x, y:mousePos.y - docPos.y};
}



function mouseMove(ev){
	ev = ev || window.event;

	mousePos = mouseCoords(ev);
	if (dragObj != null)
	{		
		dragObj.style.left = mousePos.x - offset.x + 'px';
		dragObj.style.top = mousePos.y - offset.y + 'px';
	}
}

function mouseUp(ev){
	ev = ev || window.event;
	
	dragObj = null;
}

function mouseDown(ev){
	ev = ev || window.event;
	dragObj = ev.target || ev.srcElement;	
	
	if (dragObj.className == 'drag')
	{		
		offset = getMouseOffset(dragObj, ev);		
	}
	else if (dragObj.parentNode.className == 'drag')
	{
		dragObj = dragObj.parentNode;
		offset = getMouseOffset(dragObj, ev);		
	}
	else
	{
		dragObj = null;
	}
}

document.onmousemove = mouseMove;
document.onmousedown = mouseDown;
document.onmouseup   = mouseUp;