/*
   Description: Drag a div
   uses:        fbto.js
   usage:       call dragStart() at onMousedown
*/
var browser 		= new Browser();

// Global object to hold drag information.
var dragObj 		= new Object();
dragObj.zIndex 		= 0;

var maxLeft 		= 0; // de breedte van het menuframe is de uiterste grens van het draggen naar links
var maxRight 		= 0; // de breedte van het middenframe min breedt popup is de uiterste grens van het draggen naar rechts
var leftFrameWidth 	= 0; // de breedte van het linkerframe
var rightFrameWidth = 0; // de breedte van het middenframe

function dragStart (event, id) {
	// If an element id was given, find it. Else use the clicked element
	if (id) {
		dragObj.elNode = document.getElementById(id);
	} else {
		if (browser.isIE) {
			dragObj.elNode = window.event.srcElement;
		} else if (browser.isNS) {
			dragObj.elNode = event.target;
		}
		
		// If this is a text node, use its parent element.
		if (dragObj.elNode.nodeType == 3) {
			dragObj.elNode = dragObj.elNode.parentNode;
		}
	}
	
	// Save starting positions of cursor and element.
	var pos = getXY(event);
	dragObj.cursorStartX = pos.x;
	dragObj.cursorStartY = pos.y;
	dragObj.elStartLeft  = 0;
	dragObj.elStartTop   = 0;
	if (dragObj.elNode != null) {
		dragObj.elStartLeft  = parseInt(dragObj.elNode.style.left);
		dragObj.elStartTop   = parseInt(dragObj.elNode.style.top);
	}
	
	// Update element's z-index.
	dragObj.elNode.style.zIndex = ++dragObj.zIndex;
	
	if (browser.isIE) {
		leftFrameWidth = parent.document.getElementById("menuFrame").width;
		rightFrameWidth = parent.document.getElementById("mainFrame").width;
	} else {
		leftFrameWidth = parent.menuFrame.innerWidth;
		rightFrameWidth = parent.mainFrame.innerWidth
	}
	
	// set maxRight is mainframe -/- breedte popup -/- 30 marge
	// maxright bepaalt zo de linker positie.
	maxRight = rightFrameWidth - dragObj.elNode.clientWidth - 30;
	if (maxRight < 0) maxRight = 0;
	
	// Capture mousemove / mouseup events on the page.
	if (browser.isIE) {
		document.attachEvent("onmousemove", dragGo);
		document.attachEvent("onmouseup",   dragStop);
		window.event.cancelBubble = true;
		window.event.returnValue = false;
	} else if (browser.isNS) {
		document.addEventListener("mousemove", dragGo,   true);
		document.addEventListener("mouseup",   dragStop, true);
		event.preventDefault();
	}
}

function dragGo (event) {
	// Move drag element by the same amount the cursor has moved.
	var pos = getXY(event);
	
	// bepaal leftPos
	var leftPos = dragObj.elStartLeft + pos.x - dragObj.cursorStartX;
	if (leftPos < 0) leftPos = 0;
	if (leftPos > maxRight) leftPos = maxRight;
	dragObj.elNode.style.left = leftPos + "px";

	// bepaal topPos
	var topPos = dragObj.elStartTop  + pos.y - dragObj.cursorStartY;
	if (topPos < 0) topPos = 0;
	dragObj.elNode.style.top = topPos + "px";

	if (browser.isIE) {
		window.event.cancelBubble = true;
		window.event.returnValue = false;
	} else if (browser.isNS) {
		event.preventDefault();
	}
}

function dragStop (event) {
	// Clear the drag element
	dragObj.elNode = null;
	
	// Stop capturing mouse events.
	if (browser.isIE) {
		document.detachEvent("onmousemove", dragGo);
		document.detachEvent("onmouseup",   dragStop);
	} else if (browser.isNS) {
		document.removeEventListener("mousemove", dragGo,   true);
		document.removeEventListener("mouseup",   dragStop, true);
	}
}