//////////////////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////////////////
//last update - 04/10/08
// version 1.0.8
/////////////////////
/*
	Floating elements namespace
*/
var Float = {}
	
Float.arr = new Array(); 
Float.objectIDsArr = new Array(); 

Float.screenX = 0;
Float.screenY = 0;
Float.isScreenCalced = false;
Float.browser = navigator.appName.indexOf("Microsoft") !== -1 ? 'ie' : 'ff';

///////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////////////////////////
/***
	Floating Element object
***/
Float.element = function(element, dragElement)
{
	
	/**  Calculating screen width + height **/
	if (!Float.isScreenCalced)
		Float.Functions.calcScreen();
	/******************************************/	
	
	/**  The Object **/
	this.id = Float.arr.length; 
	
	
	var _o = null;
	var dragObj = null;
	/////////// checking the element and the dragElement parameter ////////////////
	if (typeof(element) === 'string')
		_o = document.getElementById(element);
	else if (typeof(element) === 'object')
		_o = element;
	if (typeof(dragElement) === 'string')
		dragObj = document.getElementById(dragElement);
	else if (typeof(dragElement) === 'object')
		dragObj = element;
		
	/////////// verifying that the div isn't already a floating div ////////////////
	if(Float.objectIDsArr[_o.id] != null)	
		return;
	
	if (_o === null)
	{
		/////////// creating a div ////////////////
		this.divId = "floater_" + this.id;
		_o = document.createElement('div');
		_o.setAttribute('id',this.divId);	
		_o.style.display = "none";
		document.body.appendChild(_o); //attaching the div to the body
		/////////// setting NEW div STYLE ////////////////
		_o.style.top = 50 + (this.id*2);
		_o.style.left = 50;
		_o.style.width = "140px";
		_o.style.border = "1px solid green";
		_o.style.height = "100px";
		_o.style.background = "#eec451";
		
		/////////// creating the div's drag zone ////////////////
		dragObj = document.createElement('div');
		dragObj.setAttribute('id',this.divId + "_dragDiv");	
		dragObj.style.width = "100%";
		dragObj.style.height = "20px";
		dragObj.style.background = "#eeeeee";
		dragObj.style.cursor = "move";
		_o.appendChild(dragObj);
		
		/////////// setting this div HTML ////////////////
		_o.innerHTML += "floating div id " + this.divId;
		//////////
		
		/////////// displaying the div ////////////////
		_o.style.display = "block";
		
	}
	else if (dragObj === null)
	{
		this.divId = _o.id;
		
		/////////// creating the div's drag zone ////////////////
		dragObj = document.createElement('div');
		dragObj.setAttribute('id',this.divId + "_dragDiv");	
		dragObj.style.width = "100%";
		dragObj.style.height = "20px";
		dragObj.style.background = "#eeeeee";
		
		/////////// appending the drag element as the first child of the "floating" div ////////////////
		var childs = new Array();
		var child = _o.childNodes[0];
		while (typeof(child) !== 'undefined')
		{
			childs.push(child);
			_o.removeChild(child);
			child = _o.childNodes[0];
		}
		_o.appendChild(dragObj);
		for (var i=0;i<childs.length;i++)
		{
			_o.appendChild(childs[i]);
		}
	}
	
	/////////// adding a mouse move style to the drag element ////////////////
	dragObj.style.cursor = "move";
	
	/////////// creating a referrence to the div and the dragDiv within the object////////////////
	this.obj = _o;
	this.obj.dragObject = dragObj;
	this.obj.isFloatDisabled = false;
	this.dragObj = dragObj;
	
	
	
	/////////// setting div style ////////////////
	_o.style.position = "absolute";
	
	/// primary z-index ///
	this.obj.style.zIndex = 1000 + this.id;
	
	/////////// Event handlers ////////////////
	this.obj.isMouseDown = false;
	this.eventListeners();
	
	/////////// insertting the object to arrays ////////////////
	Float.arr.push(this);
	Float.objectIDsArr[this.divId] = 1;
}

Float.element.prototype.eventListeners = function()
{
	/**
		Element onmouedown
	**/
	this.obj.onmousedown = function(event4FF)
	{
		/////////// Saving the current div ////////////////
		Float.currFloatDiv = this;
		
		/////////// Setting Z-index ////////////////
		Float.Functions.changeZIndex(this);
		
		/////////// checking the event object ////////////////
		var e = event4FF || event; 	// FF/IE
		var eventTarget = null;
		if (Float.browser === 'ie')
			eventTarget = e.srcElement
		else //ff
			eventTarget = e.target;
			
		/////////// Starting the drag only if the click is on the drag div ////////////////
		if (eventTarget.id === this.dragObject.id)
		{
			/////////// Saving mouse current position ////////////////
			Float.currentCursorX = e.clientX;
			Float.currentCursorY = e.clientY;
			
			/////////// Creating an event listener ////////////////
			if (document.addEventListener)  //FF
				document.addEventListener('mousemove', Float.documentMouseMoveHandler, true);
			else if (document.attachEvent)
				document.attachEvent('onmousemove', Float.documentMouseMoveHandler);
			
			//document.getElementById('log').innerHTML += "down startX: "+this.cursorX+"  startY: "+this.cursorY+" <br/>";
			//document.getElementById('log').innerHTML += "down startX: "+this.offsetLeft+"  startY: "+this.offsetTop+" <br/>";
			
			/////////// Canceling the seleciton ////////////////
			if (Float.browser === 'ff')
				return false;
			else
				document.selection.empty();
			
		}
	}
	
	
	/**
		DOCUMENT onmouseup
	**/
	document.onmouseup = function(event4FF)
	{
		var e = event4FF || event; 	// FF/IE
		/////////// removing the document.onmousemove event listener  ////////////////
		if (document.removeEventListener)
			document.removeEventListener('mousemove', Float.documentMouseMoveHandler,true);
		else if (document.detachEvent)
			document.detachEvent('onmousemove', Float.documentMouseMoveHandler);
	}

}


///////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////////////////////////
/***
	Drag parameters and methods
***/
Float.currentCursorX = 0;
Float.currentCursorY = 0;
Float.isMouseDown = false;
Float.currFloatDiv = null;

Float.documentMouseMoveHandler = function(event4FF)
{
	var e = event4FF || event; 	// FF/IE
	
	var moveByX = e.clientX - Float.currentCursorX;
	var moveByY = e.clientY - Float.currentCursorY;
		
	/////////// Calculating next element position in the page ////////////////
	var futureLeftXPos = Float.currFloatDiv.offsetLeft + moveByX;
	var futureRightXPos = Float.currFloatDiv.offsetLeft + Float.currFloatDiv.offsetWidth + moveByX;
	var futureTopYPos = Float.currFloatDiv.offsetTop + moveByY;
	var futureBottomYPos = Float.currFloatDiv.offsetTop + Float.currFloatDiv.offsetHeight + moveByY;
	
	if ((futureRightXPos <= Float.screenX && futureLeftXPos>=0) && (futureBottomYPos <= Float.screenY && futureTopYPos>=0))
	{
		Float.currentCursorX = e.clientX;
		Float.currentCursorY = e.clientY;
		Float.currFloatDiv.style.left = Float.currFloatDiv.offsetLeft + moveByX + "px";
		Float.currFloatDiv.style.top = Float.currFloatDiv.offsetTop + moveByY + "px";
		//document.getElementById('log').innerHTML += "current x: "+e.clientX+"   y: "+e.clientY+" <br/>";
		//document.getElementById('log').innerHTML += "move x: "+moveByX+"   y: "+moveByY+" <br/>";
		//document.getElementById('log').innerHTML += "down startX: "+this.offsetLeft+"  startY: "+this.offsetTop+" <br/>";
	}	
	
}

///////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////////////////////////
/***
	Useful functions
***/
Float.Functions = {
		
	zIndexArr : new Array(),
	
	changeZIndex : function(element)
	{
		/* 
			parameter check
		*/
		if (!element)
			return;
		else if (typeof(element) === 'string')
			element = document.getElementById(element);
		else if (typeof(element) === 'object')
			element = element;
		else
			return;
			
		
		/////////// Finding free index  ////////////////
		var freeIndex = 5000;
		while (typeof(Float.Functions.zIndexArr[freeIndex]) !== 'undefined')
		{
			if (Float.Functions.zIndexArr[freeIndex] === element)
			{
				Float.Functions.zIndexArr[freeIndex] = null;
				break;	
			}
			freeIndex--;	
		}
		
		/////////// lowering all the elements z-index by 1 ////////////////
		while (freeIndex < 5000)
		{
			var changedElement = Float.Functions.zIndexArr[freeIndex+1] ;	
			changedElement.style.zIndex = freeIndex
			Float.Functions.zIndexArr[freeIndex] = 	changedElement;	
			freeIndex++;
		}
		
		element.style.zIndex = 5000;
		Float.Functions.zIndexArr[5000] = element;	
	},
	
	calcScreen : function()
	{
		var frameWidth,frameHeight;
		if (self.innerHeight) // all except Explorer
		{
			Float.screenX = self.innerWidth;
			Float.screenY = self.innerHeight;
		}
		else if (document.documentElement && document.documentElement.clientHeight) // Explorer 6 Strict Mode
		{
			Float.screenX = document.documentElement.clientWidth;
			Float.screenY = document.documentElement.clientHeight;
		}
		else if (document.body) // other Explorers
		{
			Float.screenX = document.body.clientWidth;
			Float.screenY = document.body.clientHeight;
		} 
	}
}