/**************************************************************************************************
*Registered MouseDown handlers on all dragable elements.   They do not capture events but they get the 
*event as it bubbles up the document tree.  So that the upper most dragable element is the one that
*gets moved.  I do this by getting the currentTraget property. IE does not have this property - I still need to 
*fix this.
*
*
*Oct. 31, 2009 - I can now drag relatively position elements as well.
*Dec. 5, 2009  - I can now drag elements that have no id tag.
*Dec. 5, 2009  - I register the click handler on all element nodes 
*			   - The handler will not capture events but will catch them when they bubble up the document tree.
*			   - So if the event occurs on a node that is not draggable but there is a parent node that is
*			   - we will be able to hit it.	
*
*Note: Current Dragging elements will not work in IE - this is because there is no way to get the 
*		currenttarget = see Page: 414 of the JavaScript book.
**************************************************************************************************/

var goldenrod
if (!goldenrod) goldenrod = {}






//Create a namespace - same as: var goldenrod.Drag = {}.  This is an Object 
//We proceed to define the properties and methods of the goldenrod.Drag object.



goldenrod.Drag = new Object;


goldenrod.Drag.state = false; //false indicates dragging is off, true will indicate that draggng is on
goldenrod.Drag.clipState = false; //false indicates clip dragging is iff, true indicates clip dragging is on.

goldenrod.Drag.table = undefined;			//Holds the node for our table
goldenrod.Drag.border = "3px double black"	//Border style for all drag-able element
goldenrod.Drag.drag_border = "3px double green" //Border style for the element that is being moved.

goldenrod.Drag.table_style_position = "fixed"
goldenrod.Drag.table_style_bottom = "7.5pt"
goldenrod.Drag.table_style_left = "112.5pt"
goldenrod.Drag.table_style_bordercollapse = "collapse"

goldenrod.Drag.cell_style_width = "56.25pt"
goldenrod.Drag.cell_style_height = "14pt"
goldenrod.Drag.cell_style_bordersize = "3px"
goldenrod.Drag.cell_style_borderstyle = "double"
goldenrod.Drag.cell_style_bordercolor = "red"
goldenrod.Drag.cell_style_fontsize = "10pt"
goldenrod.Drag.cell_style_textalign = "center"


goldenrod.Drag.mouseDownElt; //Save the value of which element we moused down over.
goldenrod.Drag.mouseDownX;
goldenrod.Drag.mouseDownY;
//goldenrod.Drag.OrigX; goldenrod.Drag.OrigY; goldenrod.Drag.OrigW; goldenrod.Drag.OrigH; 
goldenrod.Drag.origBox = new goldenrod.Dom.Rectangle(0,0,10,10);
goldenrod.Drag.auto = goldenrod.Dom.auto
goldenrod.Drag.origclipBox = new goldenrod.Dom.Rectangle(goldenrod.Dom.auto, goldenrod.Dom.auto, goldenrod.Dom.auto, goldenrod.Dom.auto);
goldenrod.Drag.clipBox =  new goldenrod.Dom.Rectangle(goldenrod.Dom.auto, goldenrod.Dom.auto, goldenrod.Dom.auto, goldenrod.Dom.auto);
goldenrod.Drag.OrigO;




goldenrod.Drag.minH = 18.75;		//This is initialized as a point value
goldenrod.Drag.minW = 18.75;		//This is initialized as a point value
goldenrod.Drag.opacityRatio = 4;


/****************************************************************************************
*goldenrod.Drag.nodeData: is an Object the defines a structure for saving information on each draag-able
*				node.
*
*We save the node Object, the id tag and the border: width, style and color for right, top, 
*left, and bottom
*
*****************************************************************************************/
goldenrod.Drag.nodeData = function(n, id, o, r_w, r_s, r_c, t_w, t_s, t_c, l_w, l_s, l_c, b_w, b_s, b_c) {

	this.node = n;
	this.id = id;
	this.opacity = o;
	this.r_w = r_w; this.r_s = r_s; this.r_c = r_c;
	this.t_w = t_w; this.t_s = t_s; this.t_c = t_c;
	this.l_w = l_w; this.l_s = l_s; this.l_c = l_c;
	this.b_w = b_w; this.b_s = b_s; this.b_c = b_c;
}

/****************************************************************************************
*goldenrod.Drag.absoluteElts: An array of nodeData Objects, that holds information on all the 
*absolutely positioned elements that are drag-able. 
*****************************************************************************************/
goldenrod.Drag.absoluteElts = new Array();	//Holds an array of information on all drag-able elements.

goldenrod.Drag.makeTable = function() {
	//Create table
	var datatable = document.createElement("table"); 
	var cell = new Array();
	var i;
	var viewportWidth = goldenrod.Dom.getViewportWidth();
	
	datatable.className = "b_mysilver drag_table";
	//12-3-2009 datatable.style.position = goldenrod.Drag.table_style_position;
	//12-3-2009 datatable.style.bottom = goldenrod.Drag.table_style_bottom;
	
	//Calculate position for centering the data table.
	//var b = document.getElementsByTagName('body')
	i = Math.round( ( viewportWidth - ( ((goldenrod.Dom.getPixel(goldenrod.Drag.cell_style_width) + 3) * 6) + 3  ) ) / 2 );
	datatable.style.left =  i + "px";
	//12-3-2009 datatable.style.borderCollapse = goldenrod.Drag.table_style_bordercollapse;
	
	datatable.id = "data_table"
	
	//Create two rows and append them to our table
	var row_1 = document.createElement("tr");
	var row_2 = document.createElement("tr");
	datatable.appendChild(row_1); datatable.appendChild(row_2);
	
	//alert("goldenrod.Drag.cell_style_width" + goldenrod.Drag.cell_style_width);
	//Create twelve cells and set their inline style properties
	for(i=0; i<12; i++) {
		cell[i] = document.createElement("td");
		//12-3-2009 cell[i].style.width = goldenrod.Drag.cell_style_width;
		//12-3-2009 cell[i].style.height = goldenrod.Drag.cell_style_height;
		//12-3-2009 cell[i].style.borderSize = goldenrod.Drag.cell_style_bordersize;
		//12-3-2009 cell[i].style.borderStyle = goldenrod.Drag.cell_style_borderstyle;
		//12-3-2009 cell[i].style.borderColor = goldenrod.Drag.cell_style_bordercolor;
		//12-3-2009 cell[i].style.fontSize = goldenrod.Drag.cell_style_fontsize;
		//12-3-2009 cell[i].style.textAlign = goldenrod.Drag.cell_style_textalign;
		cell[i].className = "drag_cell"
	}
	
	
		
	//Append cells for first row
	row_1.appendChild(cell[0]); row_1.appendChild(cell[1]); row_1.appendChild(cell[2]); 
	row_1.appendChild(cell[3]); row_1.appendChild(cell[4]); row_1.appendChild(cell[5]);	
	
	//Append cells for second row
	row_2.appendChild(cell[6]); row_2.appendChild(cell[7]); row_2.appendChild(cell[8]); 
	row_2.appendChild(cell[9]); row_2.appendChild(cell[10]); row_2.appendChild(cell[11]); 

	
	cell[0].innerHTML="id-value";
	 
	if(goldenrod.Drag.clipState)
		cell[1].innerHTML="Top"; 
	else
		cell[1].innerHTML="Left";
	 
	if(goldenrod.Drag.clipState)
		cell[2].innerHTML="Right"; 
	else
		cell[2].innerHTML="Top"; 
	
	if(goldenrod.Drag.clipState)
		cell[3].innerHTML="Bottom"; 
	else
		cell[3].innerHTML="Width"; 
	
	if(goldenrod.Drag.clipState)
		cell[4].innerHTML="Left"; 
	else
		cell[4].innerHTML="Height"; 
	
	cell[5].innerHTML="Opacity"; 
	
	cell[6].id = "id"
	cell[7].id = "left"; cell[8].id = "top"; cell[9].id = "width"; cell[10].id = "height"; 
	cell[11].id = "opacity";
	
	document.body.appendChild(datatable); 
	goldenrod.Drag.table = document.getElementById("data_table");
}
	
goldenrod.Drag.unmakeTable = function() {
	if(!goldenrod.Drag.table) {
		goldenrod.myAlert("Attempting to remove a table that does not exist");
		return false;
	}
	else {
		document.body.removeChild(goldenrod.Drag.table);
		goldenrod.Drag.table = undefined;
		return true;
	}
}

goldenrod.Drag.writeData = function() {

	var elt;
	var style = goldenrod.Dom.getStyle(goldenrod.Drag.mouseDownElt);	//We always get the computed style.

	elt = document.getElementById("id");
	elt.innerHTML = goldenrod.Drag.mouseDownElt.id
	if(elt.innerHTML == "")
		elt.innerHTML = "undefined"
	if(goldenrod.Drag.clipState)
		elt.innerHTML += " - clip";
	elt.innerHTML += "<br>" + goldenrod.Drag.mouseDownElt.tagName

	elt = document.getElementById("left");
	if(goldenrod.Drag.clipState)
		elt.innerHTML = goldenrod.Drag.clipBox.Top + " pt";
	else
		elt.innerHTML = goldenrod.Dom.getPoint(style.left) + "pt";

	elt = document.getElementById("top");
	if(goldenrod.Drag.clipState)
		elt.innerHTML = goldenrod.Drag.clipBox.Right + " pt";
	else
		elt.innerHTML = goldenrod.Dom.getPoint(style.top) + " pt";

	elt = document.getElementById("width");
	if(goldenrod.Drag.clipState)
		elt.innerHTML = goldenrod.Drag.clipBox.Bottom + " pt";
	else
		elt.innerHTML = goldenrod.Dom.getPoint(style.width) + " pt";

	elt = document.getElementById("height");
	if(goldenrod.Drag.clipState)
		elt.innerHTML = goldenrod.Drag.clipBox.Left + " pt";
	else
		elt.innerHTML = goldenrod.Dom.getPoint(style.height) + " pt";

	elt = document.getElementById("opacity");

	elt.innerHTML = goldenrod.Dom.getStyleOpacity(style);
}

/****************************************************************************************
*goldenrod.Drag.Install-  This function will install the click handler on all element nodes in the doucment tree
*			except the document nose and the body node.
*****************************************************************************************/
goldenrod.Drag.Install = function() {
	
	function install(elt) {
		if( elt.nodeType == 1 ) {
			if( elt != document.body )
				goldenrod.Dom.set_handler("click", elt, goldenrod.Drag.ClickHandler, false);
			var children = elt.childNodes;
			for(var i=0; i<children.length; i++) {
				install(children[i]);
			}
		}
	}
	if(!goldenrod.Dom.IsIE) install(document.body);
	return;	
}
	
goldenrod.Drag.Uninstall = function() {
	function uninstall(elt) {
		if( elt.nodeType == 1 ) {
			if( (elt != document.body) && elt.removeEventListener )
				elt.removeEventListener("click", goldenrod.Drag.ClickHandler, false);
			var children = elt.childNodes;
			for(var i=0; i<children.length; i++) {
				uninstall(children[i]);
			}
		}
	}
	if(!goldenrod.Dom.IsIE) uninstall(document.body);
	return;	
}
		
/****************************************************************************************
*goldenrod.Drag.ClickHandler -  This is our mouse conrol click handler. It is registered on the document node and 
*set for capture.
*
*Note: A click event follows a mouse up event. It is not triggered when the user presses the mouse button
*down, but is when the user releases the mouse button. The button property of this event is irrelevant
*
*Question: If the click event is a Control Click event on an absolutely positioned element 
*then I wonder if we should not allow the event to propagate?  We will see.
*****************************************************************************************/
goldenrod.Drag.ClickHandler = function(e) {
	if(goldenrod.Dom.IsIE) return true;	//Currently dragging does not work in IE
	var t, i, j;


	// IE does pass a copy of it's global event object to the event handler so we do not really need to check 
	//	if e is undefined or not. It will always be defined because we are using addEventListener or attachEvent
	if (e === undefined) {
		e = window.event; myAlert("goldenrod.Drag.ClickHandler: e is not defined.")
	}
	else 
		goldenrod.myAlert("goldenrod.Drag.ClickHandler: \n e is defined.");

	goldenrod.Dom.set_shiftkeyState(e);


	//if( (e.type != "click") || ( (goldenrod.Dom.shiftkeyState != 2) && (goldenrod.Dom.shiftkeyState != 6) ) ) {
	if( (e.type != "click") || !( goldenrod.Dom.shiftkeyState & 2 ) ) {
	
		goldenrod.myAlert("goldenrod.Drag.ClickHandler: \nThis is a click event but the control or" +  
			" control/alt key was not depressed");
		//If the control key was not depressed and we are not Dragging - return true and let links work.
		//If the control key was not depressed and we are dragging do not let links work so stop propagation and return false.
		if(goldenrod.Drag.state) {
			goldenrod.Dom.propagationHandler(e); return false} else return true;
		}


	/****************************************************************************************
	*We are in a Ctrl Click Event 
	*****************************************************************************************/
	//goldenrod.myAlert("goldenrod.Drag.ClickHandler: \nThis is a control click event and the drag state is " + goldenrod.Drag.state + " .");
	//alert("goldenrod.Drag.ClickHandler: \nThis is a control click event and the drag state is " + goldenrod.Drag.state + " .");

	/****************************************************************************************
	*If the goldenrod.Drag state is true no matter where this event occurs, we stop propagation,
	*remove the table and restore the original borders to all drag-able elements and return.
	*****************************************************************************************/
	if(goldenrod.Drag.state) {

		goldenrod.Dom.propagationHandler(e);
		goldenrod.Drag.unmakeTable(); 
		
		
		for(i=0; i<goldenrod.Drag.absoluteElts.length ; i++) {
			j = goldenrod.Drag.absoluteElts[i];
			t=j.node;
			t.style.borderRightWidth = j.r_w;
			t.style.borderRightStyle = j.r_s;
			t.style.borderRightColor = j.r_c;
			t.style.borderTopWidth = j.t_w;
			t.style.borderTopStyle = j.t_s;
			t.style.borderTopColor = j.t_c;
			t.style.borderLeftWidth = j.l_w;
			t.style.borderLeftStyle = j.l_s;
			t.style.borderLeftColor = j.l_c;
			t.style.borderBottomWidth = j.b_w;
			t.style.borderBottomStyle = j.b_s;
			t.style.borderBottomColor = j.b_c;
			if(t.removeEventListener)
				t.removeEventListener( "mousedown", goldenrod.Drag.MouseDownHandler, false);
			else
				document.detachEvent("onmousedown", goldenrod.Drag.MouseDownHandler);
		}
			
		goldenrod.Drag.state = false;
		goldenrod.Drag.clipState = false;
		goldenrod.Drag.absoluteElts.length = 0;
		return false;
	}

	/****************************************************************************************
	*goldenrod.Drag State is false so we get the "target" of this ctrl-click event; the node on which the event 
	*occurred to see if it is an absolutely position node with an id tag.
	*
	*****************************************************************************************/
	var targetnode = goldenrod.Dom.getcurrentTarget(e);

	if(!targetnode)
		return false;

	if(targetnode.nodeType != 1) {goldenrod.myAlert("goldenrod.Drag.ClickHandler: This is not an Element Node"); return;}

	/****************************************************************************************
	*Now we know that the target node is an element node!!
	*****************************************************************************************/

	var style = goldenrod.Dom.getStyle(targetnode);

	if(style === undefined)
		return false;


	if( (style.position != "absolute") &&  (style.position != "relative") ) {
		goldenrod.myAlert("goldenrod.Drag.ClickHandler: \nThis is not an absolutely or" +  
			" relatively positioned node with id =" + targetnode.id);  
			return false;
	}

	/****************************************************************************************
	*We are ready to process the absolutely or relatively positioned node.
	*
	*We must stop propagation and then 
	*we write the table data fields at the bottom of the screen
	*
	*We find all sister Element nodes that are absolutely positioned and have "id" tag defined.
	*We save the current border settings and set new borders
	*
	*****************************************************************************************/

	else {
		goldenrod.myAlert("goldenrod.Drag.ClickHandler: \n We are ready to process the " +
				"absolutely or relatively positioned node");

		goldenrod.Dom.propagationHandler(e);


		//We circle through all siblings of the target node starting at the target node iself
		goldenrod.Drag.mouseDownElt = targetnode;

		t = targetnode;
		i=0;
		j = goldenrod.Dom.getStyleOpacity(style);

		//We know that t is OK
		do {
			goldenrod.Drag.absoluteElts[i] = new goldenrod.Drag.nodeData(
				t, 
				t.id,
				j, 
				style.borderRightWidth,
				style.borderRightStyle,
				style.borderRightColor,
				style.borderTopWidth,
				style.borderTopStyle,
				style.borderTopColor,
				style.borderLeftWidth,
				style.borderLeftStyle,
				style.borderLeftColor,
				style.borderBottomWidth,
				style.borderBottomStyle,
				style.borderBottomColor );
				
				
				
			if(i==0) {
				t.style.border = goldenrod.Drag.drag_border;
			}
			else {
				t.style.border = goldenrod.Drag.border;
			}
				
		
			do {
		
				do { //Get next circular Sibling that is an Element
					t=t.nextSibling; 
					if(t == null) t=targetnode.parentNode.firstChild; 
				} while (t.nodeType !=1)
				style  = goldenrod.Dom.getStyle(t); 
				if(style === undefined) 
					return; 
				j = goldenrod.Dom.getStyleOpacity(style);
			} while((style.position != "absolute") &&  (style.position != "relative"))
		
			i++;
		} while (t != targetnode)



		goldenrod.Drag.state = true; 
		if(goldenrod.Dom.shiftkeyState & 4) {
			goldenrod.Drag.clipState = true;
			//Save Current Element Clip Box we assume clip box values are in points "pt"
			goldenrod.Dom.getStyleClip(style, goldenrod.Drag.clipBox);
		}
		goldenrod.Drag.makeTable(); 
		goldenrod.Drag.writeData();   //Make our table

		//Set mousedown handler on all dragable elts.
		for(i=0; i<goldenrod.Drag.absoluteElts.length ; i++) {
			j = goldenrod.Drag.absoluteElts[i].node;
			goldenrod.Dom.set_handler("mousedown", j, goldenrod.Drag.MouseDownHandler, false); 
		}

		return false;
	}  
};



/************************************************************************************************************
*goldenrod.Drag.MouseDownHandler: This is our mouse down handler. It is registered on the document node by the 
*ClickHandler and set for capture.
*
*We never want to follow any links - when we are using the "drag" facility to arrange elements, because once we
*follow a link - when we return all changes are lost.
*
*First: we test if the goldenrod.Drag state is true (we should never find a drag state of false) - if not then we return and let everything happen as usual.
*
*Second: We test if this is a left button down event and no Ctr Atl Shift or Mets key was depressed. - if not we
*return and let everything happen as usual.
*
*Third: Then we test if the target has an id tag - if not we return an let everything happen as usual.
*
*Fourth: We determine if the target is one of the relevant elements by searching the array of relevant nodes. 
*	- if not we return and let everything happen as usual.  
*
*Fifth: We stop propagation of this mousedown event and prevent any default action. We save the location of the
*target and report this location in our data-table. We alter the border of the target. We install mousemove and 
*mouseup handlers for this target. These handlers must capture mouse events, (movement and up) and stop 
*propagation and prevent default action. The upmouse handler will restore the border and remove the 
*mousemove hanlder and also remove itself (the up handler) 
************************************************************************************************************/
goldenrod.Drag.MouseDownHandler = function(e) {

	var style, targetnode, elt;
	var m, pattern = /auto|[0-9]+|-[0-9]+/g;	//Find the string "auto" or any number of digits or a minus sign
											//	followed by any number of digits.


	var i, n, returnvalue = true;
	if (goldenrod.Drag.state == false) return true;

	if (e === undefined) {
		e = window.event; goldenrod.myAlert("goldenrod.Drag.MouseDownHandler: \n e is not defined.")
	}
	else goldenrod.myAlert("goldenrod.Drag.MouseDownHandler: \n e is defined.");


	goldenrod.myAlert("goldenrod.Drag.MouseDownHandler: \n e.button = " + e.button);

	goldenrod.myAlert("e.CtrlKey = " + e.ctrlKey + "\n" + 
		"e.AltKey = " + e.atlKey + "\n" + 
		"e.ShiftKey = " + e.shiftKey + "\n" + 
		"e.MetaKey = " + e.metaKey + "\n");
	if(e.button != goldenrod.Dom.leftButton || e.ctrlKey == true || e.metaKey == true) {
		goldenrod.myAlert("goldenrod.Drag.MouseDownHandler: \n We are bailing out.")
		return returnvalue;
	}
	
	
	/****************************************************************
	We are in a left button mouse down, shift mouse down or alt mouse down	
	*****************************************************************/
	targetnode = goldenrod.Dom.getcurrentTarget(e);

	goldenrod.myAlert("goldenrod.Drag.MouseDownHandler: \n The value of targetnode is: " + targetnode + "."); 
	if(!targetnode) {
		return returnvalue;
	}

	if(targetnode.nodeType != 1) {
		goldenrod.myAlert("goldenrod.Drag.MouseDownHandler: This is not an Element Node"); 
		return returnvalue;
	}


	for (i=0; i<goldenrod.Drag.absoluteElts.length; i++) {
		if(goldenrod.Drag.absoluteElts[i].node == targetnode) break;
	}
	if(i==goldenrod.Drag.absoluteElts.length) {
		goldenrod.myAlert("goldenrod.Drag.MouseDownHandler: The target is not in the drag-able list"); 
		return returnvalue;
	}
	
	goldenrod.Dom.propagationHandler(e);
	goldenrod.Drag.mouseDownElt.style.border = goldenrod.Drag.border;  //Re-set last mousedown element to ordinary drag border

	goldenrod.Drag.mouseDownElt = targetnode;	//Get new mouse down element


	goldenrod.Drag.mouseDownX = e.clientX; goldenrod.Drag.mouseDownY = e.clientY;
	style = goldenrod.Dom.getStyle(targetnode);

	//Save Current Element Box
	goldenrod.Drag.origBox.Left = goldenrod.Dom.getPoint(style.left);
	if( isNaN(goldenrod.Drag.origBox.Left) )
		goldenrod.Drag.origBox.Left = goldenrod.Dom.toPoint(goldenrod.Drag.mouseDownElt.offsetLeft); 

	goldenrod.Drag.origBox.Top = goldenrod.Dom.getPoint(style.top);
	if( isNaN(goldenrod.Drag.origBox.Top) )
		goldenrod.Drag.origBox.Top = goldenrod.Dom.toPoint(goldenrod.Drag.mouseDownElt.offsetTop);

	goldenrod.Drag.origBox.Width  = goldenrod.Dom.getPoint(style.width);
	if( isNaN(goldenrod.Drag.origBox.Width) )
		goldenrod.Drag.origBox.Width = goldenrod.Dom.toPoint(goldenrod.Drag.mouseDownElt.offsetWidth); 

	goldenrod.Drag.origBox.Height = goldenrod.Dom.getPoint(style.height);
	if( isNaN(goldenrod.Drag.origBox.Height) )
		goldenrod.Drag.origBox.Height = goldenrod.Dom.toPoint(goldenrod.Drag.mouseDownElt.offsetHeight);

	//Save Current Element Opacity
	goldenrod.Drag.OrigO = goldenrod.Dom.getStyleOpacity(style);
	//alert("goldenrod.Drag.OrigX = " + goldenrod.Drag.OrigX +".")



	//Save Current Element Clip Box we assume clip box values are in pixels "pt"
	goldenrod.Dom.getStyleClip(style, goldenrod.Drag.origclipBox);
	goldenrod.Drag.clipBox.copy(goldenrod.Drag.origclipBox);

	targetnode.style.border = goldenrod.Drag.drag_border;

	goldenrod.Dom.set_shiftkeyState(e);


	goldenrod.Drag.writeData();


	goldenrod.Dom.set_handler("mouseup", document, goldenrod.Drag.MouseUpHandler);
	goldenrod.Dom.set_handler("mousemove", document, goldenrod.Drag.MouseMoveHandler);

	return returnvalue;
}

/************************************************************************************************************
*goldenrod.Drag.MouseUpHandler: This is our mouse up handler. It is registered on the document node by the 
*ClickHandler and set for capture.
*
*First: we test if the goldenrod.Drag state is true (we should never find a drag state of false) - if not then we return and let everything happen as usual.
*
*Second: We test if this is a left button down event and no Ctr Atl Shift or Mets key was depressed. - if not we
*return and let everything happen as usual.
*
*Third: Then we test if the target has an id tag - if not we return an let everything happen as usual.
*
*Fourth: We determine if the target is one of the relevant elements by searching the array of relevant nodes. 
*	- if not we return and let everything happen as usual.  
*
*Fifth: We stop propagation of this mousedown event and prevent any default action. We save the location of the
*target and report this location in our data-table. We alter the border of the target. We install mousemove and 
*mouseup handlers for this target. These handlers must capture mouse events, (movement and up) and stop 
*propagation and prevent default action. The upmouse handler will restore the border and remove the 
*mousemove hanlder and also remove itself (the up handler) 
************************************************************************************************************/
goldenrod.Drag.MouseUpHandler = function(e) {

	var targetnode, elt;

	if (e === undefined) {e = window.event; myAlert("goldenrod.Drag.MouseUpHandler: \n e is not defined.")}
	else goldenrod.myAlert("goldenrod.Drag.MouseUpHandler: \n e is defined.");

	goldenrod.Dom.propagationHandler(e);



	if(document.removeEventListener) {
		document.removeEventListener( "mouseup", goldenrod.Drag.MouseUpHandler, true);
		document.removeEventListener( "mousemove", goldenrod.Drag.MouseMoveHandler, true)
	}
	else {
		document.detachEvent("onmouseup", goldenrod.Drag.MouseUpHandler);
		document.releaseCapture();
		document.detachEvent("onmousemove", goldenrod.Drag.MouseMoveHandler);
	}
		

	return false;
}

/************************************************************************************************************
*goldenrod.Drag._MouseMoveHandler: This is our mouse move handler. It is registered on the document node by the 
*MouseDownHandler and set for capture.
*
************************************************************************************************************/
goldenrod.Drag.MouseMoveHandler = function(e) {

	//goldenrod.myAlert("goldenrod.Drag.MouseMoveHandler: style.left", goldenrod.Drag.mouseDownElt.style.left);

	var dx,dy, i, returnvalue = false;
	if (goldenrod.Drag.state == false) return returnvalue;

	goldenrod.Dom.propagationHandler(e);

	dx = goldenrod.Dom.toPoint(e.clientX - goldenrod.Drag.mouseDownX);
	dy = goldenrod.Dom.toPoint(e.clientY - goldenrod.Drag.mouseDownY);

	switch (goldenrod.Dom.shiftkeyState) {

		case goldenrod.Dom.NoKey: {
			if(!goldenrod.Drag.clipState) {
				goldenrod.Drag.mouseDownElt.style.left = (dx + goldenrod.Drag.origBox.Left) + "pt";
				goldenrod.Drag.mouseDownElt.style.top = (dy + goldenrod.Drag.origBox.Top) + "pt";
			}
			else {
				goldenrod.Drag.clipBox.Left = (dx + goldenrod.Drag.origclipBox.Left);
				goldenrod.Drag.clipBox.Right = (dx + goldenrod.Drag.origclipBox.Right);
				goldenrod.Drag.clipBox.Top = (dy + goldenrod.Drag.origclipBox.Top);
				goldenrod.Drag.clipBox.Bottom = (dy + goldenrod.Drag.origclipBox.Bottom);
				goldenrod.Drag.clipBox.adjustWH();
				goldenrod.Dom.setStyleClip(goldenrod.Drag.mouseDownElt, goldenrod.Drag.clipBox);	
			}
			break;
		}
	
		case goldenrod.Dom.Shift: {
			if(!goldenrod.Drag.clipState) {
				goldenrod.Drag.mouseDownElt.style.width = Math.max((dx + goldenrod.Drag.origBox.Width), goldenrod.Drag.minW) + "pt";
				goldenrod.Drag.mouseDownElt.style.height = 
					Math.max( (dy + goldenrod.Drag.origBox.Height), goldenrod.Drag.minH) + "pt";
			}
			else {
				goldenrod.Drag.clipBox.Width = Math.abs(dx + goldenrod.Drag.origclipBox.Width);
				goldenrod.Drag.clipBox.Height = Math.abs(dy + goldenrod.Drag.origclipBox.Height);
				if(isNaN(goldenrod.Drag.clipBox.Height) ) alert("Height is Nan");
				goldenrod.Drag.clipBox.adjustRB();
				if(isNaN(goldenrod.Drag.clipBox.Bottom) ) alert("Bottom is Nan");
		
				goldenrod.Dom.setStyleClip(goldenrod.Drag.mouseDownElt, goldenrod.Drag.clipBox);	
			}
			break;
		}
	
		case goldenrod.Dom.Alt: {
			if(!goldenrod.Drag.clipState) {
				i = Math.min( Math.abs(Math.round(dx/goldenrod.Drag.opacityRatio) + goldenrod.Drag.OrigO), 100);
				goldenrod.Dom.setStyleOpacity(goldenrod.Drag.mouseDownElt, i );
			}
			break;
		}
	
		case (goldenrod.Dom.Shift | goldenrod.Dom.Alt): {
	
			break;
		}
	}

	goldenrod.Drag.writeData();

	return returnvalue;
}