var dragObject = null;
var mouseOffset = null;

window.onload = function() {
	document.onmousemove = moveObject;
	
	var allImages = document.getElementsByTagName("img");
	for (var i = 0; i < allImages.length; i++) {
		allImages[i].onmousedown = dragMe;
		allImages[i].onmouseup = dropMe;
	}
	
}

function moveObject(evt) {
	var mousePos = mouseCoords(evt);
	
	if (dragObject) {
		dragObject.style.position = "absolute";
		dragObject.style.left = (mousePos.x - mouseOffset.x) + "px";
		dragObject.style.top = (mousePos.y - mouseOffset.y) + "px";
}

	}
function dragMe(evt) {
	dragObject = this;
	mouseOffset = getMouseOffset(dragObject, evt);

}

function dropMe() {
	dragObject = null;
}

function getMouseOffset(useObject, evt) {
	var coords = mouseCoords(evt);
	var offset = new Object();
	var objectLeft = 0;
	var objectTop = 0;
	
	if (useObject.offsetParent) {
	objectLeft = useObject.offsetLeft;
	objectTop = useObject.offsetTop;
	
		while (useObject = useObject.offsetParent) {
			objectLeft += useObject.offsetLeft;
			objectTop += useObject.offsetTop;
	}
	
}
	offset.x = coords.x - objectLeft;
	offset.y = coords.y - objectTop;
	
	return offset;
}

function mouseCoords(evt) {
	var coords = new Object();
	if (!evt) {
		var evt = window.event;
		}
		
	if (evt.pageX || evt.pageY) { //Firefox and crew
		coords.x = evt.pageX;  //x position of the mouse
		coords.y = evt.pageY; //Y position of the mouse
	} else if (evt.clientX || evt.clientY) { //Internet Explorer
		coords.x = evt.clientX + document.body.scrollLeft - document.body.clientLeft;
		coords.y = evt.clientY + document.body.scrollTop - document.body.clientTop;
	
	}
	writeCoords(coords);
	return coords;
	}
	
function writeCoords(coords) {
	var xPos = document.getElementById("xPos");
	var yPos = document.getElementById("yPos");
	
	if (!xPos.firstChild) {
		var xPosText = document.createTextNode("x:" + coords.x);
		xPos.appendChild(xPosText);
	} else {
		xPos.firstChild.nodeValue = "x:" + coords.x;
	}
	if (!yPos.firstChild) {
		var yPosText = document.createTextNode("y:" + coords.y);
		yPos.appendChild(yPosText);
	} else {
		yPos.firstChild.nodeValue = "y:" + coords.y;
		}
	}