var offsetYInsertDiv = 2; // Y offset for the little arrow indicating where the node should be inserted.
if(!document.all)
	offsetYInsertDiv = offsetYInsertDiv - 7; 	// No IE

var arrParent = false;
var arrMoveCont = false;
var arrMoveCounter = -1;
var arrTarget = false;
var arrNextSibling = false;
var leftPosArrangableNodes = false;
var widthArrangableNodes = false;
var nodePositionsY = new Array();
var nodeHeights = new Array();
var arrInsertDiv = false;
var insertAsFirstNode = false;
var arrNodesDestination = false;

function cancelEvent()
{
	return false;
}

function getTopPos(inputObj)
{
	
  var returnValue = inputObj.offsetTop;
  while((inputObj = inputObj.offsetParent) != null){
	returnValue += inputObj.offsetTop;
  }
  return returnValue;
}

function getLeftPos(inputObj)
{
  var returnValue = inputObj.offsetLeft;
  while((inputObj = inputObj.offsetParent) != null)
	returnValue += inputObj.offsetLeft;
  return returnValue;
}
	
function clearMovableDiv()
{
	if(arrMoveCont.getElementsByTagName('LI').length > 0)
	{
		if(arrNextSibling)
			arrParent.insertBefore(arrTarget,arrNextSibling);
		else
			arrParent.appendChild(arrTarget);			
	}
}

function initMoveNode(e)
{
	clearMovableDiv();
	if(document.all)
		e = event;
	arrMoveCounter = 0;
	arrTarget = this;
	if(this.nextSibling)
		arrNextSibling = this.nextSibling;
	else
		arrNextSibling = false;
	timerMoveNode();
	arrMoveCont.parentNode.style.left = e.clientX + 'px';
	arrMoveCont.parentNode.style.top = e.clientY + 'px';
	return false;
}
function timerMoveNode()
{
	if(arrMoveCounter >= 0 && arrMoveCounter < 10){
		arrMoveCounter = arrMoveCounter + 1;
		setTimeout('timerMoveNode()', 20);
	}
	if(arrMoveCounter >= 10){
		arrMoveCont.appendChild(arrTarget);
	}
}
	
function arrangeNodeMove(e)
{
	if(document.all)e = event;
	if(arrMoveCounter < 10)return;
	if(document.all && arrMoveCounter >= 10 && e.button != 1 && navigator.userAgent.indexOf('Opera') == -1){
		arrangeNodeStopMove();
	}
	
	arrMoveCont.parentNode.style.left = e.clientX + 'px';
	arrMoveCont.parentNode.style.top = e.clientY + 'px';	
	
	var tmpY = e.clientY;
	arrInsertDiv.style.display='none';
	arrNodesDestination = false;
	

	if(e.clientX<leftPosArrangableNodes || e.clientX>leftPosArrangableNodes + widthArrangableNodes)return; 
		
	var subs = arrParent.getElementsByTagName('LI');
	for(var no = 0;no<subs.length;no++){
		var topPos =getTopPos(subs[no]);
		var tmpHeight = subs[no].offsetHeight;
		
		if(no == 0){
			if(tmpY <= topPos && tmpY >= topPos - 5){
				arrInsertDiv.style.top = (topPos + offsetYInsertDiv) + 'px';
				arrInsertDiv.style.display = 'block';				
				arrNodesDestination = subs[no];	
				insertAsFirstNode = true;
				return;
			}				
		}
		
		if(tmpY >= topPos && tmpY <= (topPos + tmpHeight)){
			arrInsertDiv.style.top = (topPos + tmpHeight + offsetYInsertDiv) + 'px';
			arrInsertDiv.style.display = 'block';				
			arrNodesDestination = subs[no];
			insertAsFirstNode = false;
			return;
		}				
	}
}


function arrangeNodeStopMove()
{
	arrMoveCounter = -1; 
	arrInsertDiv.style.display='none';

	
	if(arrNodesDestination)
	{
		var subs = arrParent.getElementsByTagName('LI');
		if(arrNodesDestination == subs[0] && insertAsFirstNode)
			arrParent.insertBefore(arrTarget,arrNodesDestination);
		else
		{
			if(arrNodesDestination.nextSibling)
				arrParent.insertBefore(arrTarget,arrNodesDestination.nextSibling);
			else
				arrParent.appendChild(arrTarget);
		}
	}		
	arrNodesDestination = false;
	clearMovableDiv();
}

function HTMLEncode(wText)
{
	if(typeof(wText) != "string")
	wText = wText.toString();
	wText = wText.replace(/&/g, "&amp;");
	wText = wText.replace(/"/g, "&quot;");
	wText = wText.replace(/</g, "&lt;");
	wText = wText.replace(/>/g, "&gt;");
	wText = wText.replace(/'/g, "&#146;");
	return wText;
};

function saveArrangableNodes()
{
	var nodes = arrParent.getElementsByClassName('nodes');
	var string = "";
	for(var no = 0; no < nodes.length; no++)
	{
		if (string.length > 0)
			string = string + '||';
		string = string + nodes[no].id;
		
		var myVar = document["myNodes"]["input" + nodes[no].id];
		myVar.value = nodes[no].innerHTML; // Récupère le contenu du <LI class="nodes">
	}
	document.myNodes.orderElements.value = string;
}

function initArrangableNodes()
{	

	arrParent = document.getElementById('arrangableNodes');
	arrMoveCont = document.getElementById('movableNode').getElementsByTagName('UL')[0];
	arrInsertDiv = document.getElementById('arrDestInditcator');
	
	leftPosArrangableNodes = getLeftPos(arrParent);
	arrInsertDiv.style.left = leftPosArrangableNodes - 5 + 'px';
	widthArrangableNodes = arrParent.offsetWidth;
	
	var subs = arrParent.getElementsByTagName('LI');
	var subs2 = arrParent.getElementsByTagName('TD');
	

			document.onmousedown = function (event)
				{
						event = event || window.event;
						var target = event.target || event.srcElement;
						  
						var type;
						type = target.tagName;
						//alert ('je suis ' +type);
						if (type == "DIV")
						{
							for(var no = 0; no < subs.length; no++)
								
							{
									subs[no].onmousedown = initMoveNode;
									subs[no].onselectstart = cancelEvent;
							}
							//alert("je suis un div");
							document.documentElement.onmouseup = arrangeNodeStopMove;
							document.documentElement.onmousemove = arrangeNodeMove;
							document.documentElement.onselectstart = cancelEvent;
							
						}
						
						else if (type == "TD")
						{
							event2 = event || window.event;
							var target2 = event2.target || event2.srcElement;
							  
							var type2;
							type2 = target2.tagName;
							
							if (type2 == "TD")
							{
								for(var no = 0; no < subs.length; no++)
									
								{
										subs[no].onmousedown = '';
								}
							document.documentElement.onmouseup = arrangeNodeStopMove;
							document.documentElement.onmousemove = arrangeNodeMove;
							document.documentElement.onselectstart = cancelEvent;
							}
						}
				};
}

window.onload = initArrangableNodes;