//*****************************************************************************
// Do not remove this notice.
//
// Copyright 2001 by Mike Hall.
// See http://www.brainjar.com for terms of use.
//*****************************************************************************

// Determine browser and version.

function Browser() {

	var ua, s, i;
	
	this.isIE    = false;
	this.isNS    = false;
	this.version = null;
	
	ua = navigator.userAgent;
	
	s = "MSIE";
	if ((i = ua.indexOf(s)) >= 0) {
		this.isIE = true;
		this.version = parseFloat(ua.substr(i + s.length));
		return;
	}
	
	s = "Netscape6/";
	if ((i = ua.indexOf(s)) >= 0) {
		this.isNS = true;
		this.version = parseFloat(ua.substr(i + s.length));
		return;
	}
	
	// Treat any other "Gecko" browser as NS 6.1.
	
	s = "Gecko";
	if ((i = ua.indexOf(s)) >= 0) {
		this.isNS = true;
		this.version = 6.1;
		return;
	}

	s = "Opera";
        if ((i = ua.indexOf(s)) >= 0) {
                this.isIE = true;
                this.version = 6.1;
                return;
        }
}

var browser = new Browser();

// Global object to hold drag information.

var dragObj = new Object();
//dragObj.zIndex = 0;

// GET SNAPSHOT OF MOUSE POSITION VERSUS
// DRAG OBJECT AT START OF DRAG
var i_x_left, i_x_right, i_y_top, i_top_bottom;

function dragStart(event, id) {

	var el;
	var x, y;

	// If an element id was given, find it. Otherwise use the element being
	// clicked on.

	if (id) {
		dragObj.elNode = document.getElementById(id);
	} else {
		if (browser.isIE) {
			dragObj.elNode = window.event.srcElement;
		}
		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;
	}

	// Get cursor position with respect to the page.

	if (browser.isIE) {
		x = window.event.clientX + document.documentElement.scrollLeft + document.body.scrollLeft;
		y = window.event.clientY + document.documentElement.scrollTop + document.body.scrollTop;
	}
	if (browser.isNS) {
		x = event.clientX + window.scrollX;
		y = event.clientY + window.scrollY;
	}

	// Save starting positions of cursor and element.

	dragObj.cursorStartX = x;
	dragObj.cursorStartY = y;
	dragObj.elStartLeft  = parseInt(dragObj.elNode.style.left, 10);
	dragObj.elStartTop   = parseInt(dragObj.elNode.style.top,  10);

	if (isNaN(dragObj.elStartLeft)) dragObj.elStartLeft = 0;
	if (isNaN(dragObj.elStartTop))  dragObj.elStartTop  = 0;

	// GET GHOST LINE POSITION INFO

	var a_drag_position = findPos(dragObj.elNode);
        var i_drag_left_line = a_drag_position[0];
        var i_drag_right_line = a_drag_position[0] + dragObj.elNode.offsetWidth;
        var i_drag_top_line = a_drag_position[1];
        var i_drag_bottom_line = a_drag_position[1] + dragObj.elNode.offsetHeight;

	i_x_left = x - i_drag_left_line;
	i_x_right = i_drag_right_line - x;
	i_y_top = y - i_drag_top_line;
	i_y_bottom = i_drag_bottom_line - y;

	// Update element's z-index.

//	dragObj.elNode.style.zIndex = ++dragObj.zIndex;

	// Capture mousemove and mouseup events on the page.

	if (browser.isIE) {
		document.attachEvent("onmousemove", dragGo);
		document.attachEvent("onmouseup",   dragStop);
		window.event.cancelBubble = true;
		window.event.returnValue = false;
	}
	if (browser.isNS) {
		document.addEventListener("mousemove", dragGo,   true);
		document.addEventListener("mouseup",   dragStop, true);
		event.preventDefault();
	}
}

function dragGo(event) {

	var x, y;

	var a_div_position = findPos(document.getElementById('div_main'));
	var i_left_line = a_div_position[0];
	var i_right_line = a_div_position[0] + document.getElementById('div_main').offsetWidth;
	var i_top_line = a_div_position[1];
	var i_bottom_line = a_div_position[1] + document.getElementById('div_main').offsetHeight;

	var a_drag_position = findPos(dragObj.elNode);
        var i_drag_left_line = a_drag_position[0];
        var i_drag_right_line = a_drag_position[0] + dragObj.elNode.offsetWidth;
	var i_drag_top_line = a_drag_position[1];
	var i_drag_bottom_line = a_drag_position[1] + dragObj.elNode.offsetHeight;

	var i_drag_width = dragObj.elNode.offsetWidth;
	var i_drag_height = dragObj.elNode.offsetHeight;

	var s_div_info = "i_left===" + i_drag_left_line + ":" + i_left_line + "<br>";
        s_div_info += "i_right===" + i_drag_right_line + ":" + i_right_line + "<br>";
        s_div_info += "i_top===" + i_drag_top_line + ":" + i_top_line + "<br>";
        s_div_info += "i_bottom===" + i_drag_bottom_line + ":" + i_bottom_line + "<br>";

	// Get cursor position with respect to the page.

	if (browser.isIE) {
		x = window.event.clientX + document.documentElement.scrollLeft + document.body.scrollLeft;
		y = window.event.clientY + document.documentElement.scrollTop + document.body.scrollTop;
	}
	if (browser.isNS) {
		x = event.clientX + window.scrollX;
		y = event.clientY + window.scrollY;
	}

	s_div_info += "x===" + x + "<br>";
	s_div_info += "y===" + y + "<br>";
//	document.getElementById("div_info").innerHTML = s_div_info;

	var i_left_ghost = i_left_line + i_x_left;
	var i_right_ghost = i_right_line - i_x_right;
	var i_top_ghost = i_top_line + i_y_top;
	var i_bottom_ghost = i_bottom_line - i_y_bottom;

	if (x <= i_left_ghost ||
		x >= i_right_ghost) {
		if (x <= i_left_ghost) {
			dragObj.elNode.style.left = i_left_line;
		}
		if (x >= i_right_ghost) {
			dragObj.elNode.style.left = i_right_line - dragObj.elNode.offsetWidth;
		}
	} else {
		dragObj.elNode.style.left = (dragObj.elStartLeft + x - dragObj.cursorStartX) + "px";
	}
	if (y <= i_top_ghost ||
		y >= i_bottom_ghost) {
		if (y <= i_top_ghost) {
			dragObj.elNode.style.top = i_top_line;
		}
		if (y >= i_bottom_ghost) {
			dragObj.elNode.style.top = i_bottom_line - dragObj.elNode.offsetHeight;
		}
	} else {
		dragObj.elNode.style.top  = (dragObj.elStartTop  + y - dragObj.cursorStartY) + "px";
	}
	if (browser.isIE) {
		window.event.cancelBubble = true;
		window.event.returnValue = false;
	}
	if (browser.isNS) {
		event.preventDefault();
	}
}

function dragStop(event) {

	// Stop capturing mousemove and mouseup events.	
	if (browser.isIE) {
		document.detachEvent("onmousemove", dragGo);
		document.detachEvent("onmouseup",   dragStop);
	}
	if (browser.isNS) {
		document.removeEventListener("mousemove", dragGo,   true);
		document.removeEventListener("mouseup",   dragStop, true);
	}
	var a_div_position = findPos(document.getElementById('div_main'));
	var a_drag_position = findPos(dragObj.elNode);
	i_glue_top = a_drag_position[1] - a_div_position[1];
	i_glue_left = a_drag_position[0] - a_div_position[0];
	alertDragPosition();
}

/////////////////////////////
// GET POSITION
//
/////////////////////////////

findPos = function(obj) {
        var curleft = curtop = 0;
        if (obj.offsetParent) {
                curleft = obj.offsetLeft
                curtop = obj.offsetTop
                while (obj = obj.offsetParent) {
                        curleft += obj.offsetLeft
                        curtop += obj.offsetTop
                }
        }
        return [curleft,curtop];
}

/////////////////////////////
/////////////////////////////