/*
 * Description: Add dynamics to page.
 * Author:      Draggable layers adapted from codelifter.com
 *              Animated layers  René Uittenbogaard
 */

var ddState = {};
var maxZIndex = 1;
var animatedDiv = null;

function zoomIn(refElementName)
{
	if (!animatedDiv) {
		animatedDiv    = document.createElement("div");
		animatedDiv.id = 'animated';
	}
	var refElement = document.getElementById(refElementName);
	if (refElement === null || refElement === undefined) {
		return;
	}
	document.body.appendChild(animatedDiv);
	maxZIndex += 1;
	animatedDiv.style.position = 'absolute';
	animatedDiv.innerHTML      = 'hello';
	animatedDiv.style.top      = refElement.offsetTop + 'px';
	animatedDiv.style.left     = refElement.offsetLeft + 'px';
	animatedDiv.style.height   = refElement.offsetHeight + 'px';
	animatedDiv.style.width    = refElement.style.width;
	animatedDiv.style.border   = '2px solid red';
	animatedDiv.style.zIndex   = maxZIndex;
}

function dumpPositions()
{
	var draggables = document.getElementsByClassName('draggable');
	for (var d in draggables) {
		var draggable = draggables[d];
		if (draggable.offsetLeft && draggable.offsetTop) {
			console.log(draggable.id + ':' +
						'top: ' + draggable.offsetTop + 'px; ' +
						'left: ' + draggable.offsetLeft + 'px;');
		}
	}
}

function isDraggable(element)
{
	return element.className.match(new RegExp('(\\s|^)draggable(\\s|$)'));
}

function ddMouseDown(e)
{
	var hotElement = ddState.isIE ? event.srcElement : e.target;
	while (!isDraggable(hotElement) && hotElement.tagName.toLowerCase() != "html") {
		hotElement = ddState.isIE ? hotElement.parentElement : hotElement.parentNode;
	}
	if (isDraggable(hotElement) && ddState.ddDiv)
	{
		maxZIndex                 += 1;
		ddState.ddDiv.style.zIndex = maxZIndex;
		ddState.mouseStartX  = ddState.isIE ? event.clientX : e.clientX;
		ddState.mouseStartY  = ddState.isIE ? event.clientY : e.clientY;
		ddState.divStartX    = parseInt(ddState.ddDiv.style.left, 10);
		ddState.divStartY    = parseInt(ddState.ddDiv.style.top, 10);
		ddState.ddDragging   = true;
		document.onmousemove = ddMove;
	}
}

function ddMouseUp()
{
	ddState.ddDragging = false;
};

function ddMove(e)
{
	if (!ddState.ddDragging) return;
	ddState.ddDiv.style.left = ddState.divStartX - ddState.mouseStartX +
		(ddState.isIE ? event.clientX : e.clientX) + 'px';
	ddState.ddDiv.style.top  = ddState.divStartY - ddState.mouseStartY +
		(ddState.isIE ? event.clientY : e.clientY) + 'px';
	return false;
}

function ddEntry(divName)
{
	if (divName === null) {
		ddState.ddInside = false;
		return;
	}
	ddState.ddDiv    = document.getElementById(divName);
	ddState.ddInside = true;
	if (!ddState.isN4) return;

	// NS4 only
	ddState.ddDiv.captureEvents(Event.MOUSEDOWN | Event.MOUSEUP);
	ddState.ddDiv.onmousedown = function (e)
	{
		ddState.ddDiv.captureEvents(Event.MOUSEMOVE);
		ddState.ddDiv.ddEventX = e.x;
		ddState.ddDiv.ddEventY = e.y;
	}
	ddState.ddDiv.onmousemove = function (e)
	{
		if (ddState.ddDiv) {
			ddState.ddDiv.moveBy(e.x - ddState.ddDiv.ddEventX, e.y - ddState.ddDiv.ddEventY);
			return false;
		}
	}
	ddState.ddDiv.onmouseup = function ()
	{
		ddState.ddDiv.releaseEvents(Event.MOUSEMOVE);
	}
}

function ddInit()
{
	ddState.isIE   = document.all;
	ddState.isNN   = !document.all && document.getElementById;
	ddState.isN4   = document.layers;
	ddState.ddDiv  = null;
	maxZIndex      = 1;
	document.onmousedown = ddMouseDown;
	document.onmouseup   = ddMouseUp;
}

ddInit();

// vim: set tabstop=4 shiftwidth=4:

