/**
    * Setup initial event handlers
    */
    document.onmousemove = getMouseXY;
    document.oncontextmenu = contextMenuEventHandler;  

    /**
    * Context menu handler
    */
    overContextMenu = false;

    function contextMenuEventHandler()
    {
        return false;
    }

    /**
    * Init some vars
    */
    mousePosX = 0;
    mousePosY = 0;

    layer = '';

    origX = 0;
    origY = 0;

    origLayerX = 0;
    origLayerY = 0;
    
    origWidth  = 0;
    origHeight = 0;
	
	minWidth = 10;
	minHeight = 10;

    resize = false;

    /**
    * Sets mouseX and mouseY coords
    */
    function getMouseXY(e)
    {
        if (document.all) {
    	    mousePosX = event.clientX; + document.body.scrollLeft;
	        mousePosY = event.clientY; + document.body.scrollTop;
        } else {
	        mousePosX = e.pageX;
    	    mousePosY = e.pageY;
        }

    }

    /**
    * Layer drag functions
    *
    * startLayerDrag() - Initiates and sets up the drag
    * endLayerDrag()   - Cleans up after a drag
    * onLayerDrag()    - Fired when the mouse moves, updating the position of the layer
    */
    function startLayerDrag(layerID)
    {
        layer = document.getElementById(layerID);

        origX = mousePosX;
        origY = mousePosY;

        origLayerX = Math.abs(layer.style.left.substring(0, layer.style.left.length - 2));
        origLayerY = Math.abs(layer.style.top.substring(0, layer.style.top.length - 2));

        document.onmousemove = (resize == true ? onResize : onLayerDrag);
    }

    function endLayerDrag()
    {
        layer = '';
        origX = 0;
        origY = 0;

        document.onmousemove = getMouseXY;
    }
    
    function onLayerDrag(e)
    {
        getMouseXY(e);
        diffX = mousePosX - origX;
        diffY = mousePosY - origY;

        layer.style.left = origLayerX + diffX + 'px';
        layer.style.top  = origLayerY + diffY + 'px';
    }

    /**
    * Layer resize functions
    *
    * startResize() - Initiates and sets up the resize
    * endResize()   - Cleans up after a resize
    * onResize()    - Fired when the mouse moves, updating the size of the layer
    */
    function startResize(layerID)
    {
        layer = document.getElementById(layerID);

        origX = mousePosX;
        origY = mousePosY;

        origWidth  = Math.abs(layer.style.width.substring(0, layer.style.width.length - 2));
        origHeight = Math.abs(layer.style.height.substring(0, layer.style.height.length - 2));

        resize = true;
    }

    function endResize()
    {
        layer = '';
        origX = 0;
        origY = 0;

        resize = false;
        document.onmousemove = getMouseXY;
    }
    
    function onResize(e)
    {
        getMouseXY(e);
        diffX = mousePosX - origX;
        diffY = mousePosY - origY;

		if (origWidth + diffX <= minWidth) {
			layer.style.width  = minWidth + 'px';
		} else {
        	layer.style.width  = origWidth + diffX + 'px';
		}
		
		if (origHeight + diffY <= minHeight) {
			layer.style.height = minHeight + 'px';
		} else {
	       	layer.style.height = origHeight + diffY + 'px';
		}
    }