// JScript File
var globDrag = false;
var globResize = false;

// a clicked Element
var globClickedElem;

// an element to resize
var globResizeElem;

// rember the Y-Coord for resizing
var globResizeHeight = 0;

// the ContainerManager-Class
var globCtrMgr = null; 

/**
  * Cursor functions (Drag, Move, Default)
  */
function setDragCursor( e ) { 
  e.style.cursor='move'; 
} 

function setHandCursor( e ) { 
  e.style.cursor='hand'; 
} 

function setResizeCursor( e ) { 
  e.style.cursor='n-resize'; 
} 

function setDefaultCursor( e ) { 
 e.style.cursor='default'; 
  

} 
/**
  *  the Dragable-Element (an Array on the left)
  */
function Dragger(nodeParent)
{
    this.Parent = nodeParent;
    this.startPos = 0;
    this.endPos   = 0;
    this.posDiff  = 0;
    this.OverElement = null;

    this.Element = CreateMoveLayer(nodeParent);

    this.show = function( posTop )
    {
        this.Element.style.top = posTop + "px";
        this.startPos = posTop;
        this.Element.style.visibility = 'visible';
    }

    this.hide = function()
    {
        this.posDiff = this.startPos - this.endPos;
        this.Element.style.visibility = 'hidden';
    }

    this.setPos = function( posTop )
    {
        this.endPos = posTop;
        this.Element.style.top = posTop + "px";
    }

    this.getDirection = function()
    {
        return ( this.posDiff < 0 ) ? -1 : 1;
    }

}


/**
  *  ManagerClass for Containers
  */
function ContainerBoxMgr(nodeParent)
{
    this.boxArray = new Array();
    this.Parent   = nodeParent;
    this.dragger  = new Dragger( nodeParent );
    
    this.add = function ( container )
    {
        this.boxArray[ this.boxArray.length ] = container;
        container.No = this.boxArray.length;
    }

    this.getByElement = function( element )
    {
        var i = 0;
        while (this.boxArray[i++].Element != element ){};

        return this.boxArray[--i];
    }


    
    this.moveSubElements = function( element )
    {
        var i = 0;
        var current;
        var foundElement = this.dragger.OverElement;
        
        var diffY = 0;

        globCtrMgr.dragger.hide();
        
        if( foundElement == null )
			return;

        var dir      = this.dragger.getDirection();
        
        if (dir == -1 )
			this.Parent.insertBefore(element.Element, foundElement.Element.nextSibling );
		else
			this.Parent.insertBefore(element.Element, foundElement.Element); 
		
    }

}

/**
  *  the Container-Class
  */
function ContainerBox(nodeParent, id, theElem, existing)
{
    this.ID      = id;
    this.No      = 0;
    this.Parent  = nodeParent;
    this.Element = theElem;
    
    if( !existing )
		this.Parent.appendChild( theElem );
    this.Child   = ( isMSIE5() ) ? this.Element.firstChild : this.Element.childNodes[0];
    
    this.Resizer = this.Element.getElementsByTagName('IMG')[1];
        
    this.startY  = 0;
    
    if( globCtrMgr == null )
      globCtrMgr = new ContainerBoxMgr( nodeParent );

    globCtrMgr.add( this );

    this.Child.onmousedown = function(e)
    {

        globClickedElem = globCtrMgr.getByElement( this.parentNode );

        var Click_Y = GetY(e);

        globCtrMgr.dragger.show( Click_Y - 10 );

        globDrag  = true;

        return false;
    }
    
    this.Resizer.onmousedown = function(e)
    {
	
		globResizeElem = this.parentNode.parentNode.parentNode.previousSibling.firstChild.firstChild;
		globResizeHeight =  GetY(e);
		
		globCtrMgr.dragger.show( globResizeHeight - 25 );
		
		globResize = true;
		
		return false;
		
    }

    this.Element.onmouseover = function(e)
    {

    	if( globDrag )
    	{
        	globCtrMgr.dragger.OverElement = globCtrMgr.getByElement( this );
        	
        }
    }
    

}

document.onmousemove = mmove;
document.onmouseup = mup;


function CreateMoveLayer( nodeParent, id )
{
    var s ="";

    s += "<img src='images/Dart.gif'>";

    var newSpan = document.createElement('div');
	newSpan.setAttribute('id', id );
	newSpan.style.position = 'absolute';
	newSpan.style.left = 0;
	newSpan.style.zIndex = 100;
	newSpan.style.height = '40px';
	newSpan.style.width  = '40px';
	newSpan.style.visibility = 'hidden';


	newSpan.innerHTML = s;

	nodeParent.appendChild( newSpan );

	return newSpan;
}


/**
  *  the Mouse is moving
  */
function mmove(e)
{
   // Bewegung der Maus:
   if (globDrag)
   {

	 var newY = GetY(e);

	 globCtrMgr.dragger.setPos( newY - 10  );
	 return;
   }
   
   if(globResize)
   {	
		globCtrMgr.dragger.setPos( GetY(e) - 25  );		
   }
   
   

}

/**
  *  MouseButton is going up
  */
function mup(e)
{

    globDrag = false;
    globResize = false;
    
    // prepae for dropping to new position
    if (globClickedElem)
    {

		globCtrMgr.moveSubElements(globClickedElem);

		globClickedElem = null;
		return;
    }
    
	// prepare for resizing the a box
	if( globResizeElem )
	{
		var newY = GetY(e);
		var diffY = globResizeHeight - newY;
		globCtrMgr.dragger.hide();
		
		globResizeElem.style.height = (globResizeElem.offsetHeight - diffY) + 'px';
		globResizeElem = null;
		
	}

}

function GetY(e)
{

    if (isN6())
        return e.pageY;

    if (isMSIE5())
    {
		
		return event.clientY - 40 + document.getElementById('box').scrollTop;

    }

}

function isN6()
{
   var s = navigator.userAgent;
   return (s.lastIndexOf("Gecko") > -1 );
}


function isMSIE5()
{
   var s = navigator.userAgent;
   return ((s.lastIndexOf("MSIE 5") > -1 || s.lastIndexOf("MSIE 6") > -1) && s.lastIndexOf("Opera") == -1);

}