/********************************************************************************
 * This file is a part of the software:
 *
 *	enugene_builder 0.9.8.3-beta  (c) Copyright 2007-2009 by Bogdan Vojska
 *	package: enugene_builder 0.9.8.3-beta
 *
 *	developed for Joomla! 1.5
 *	
 *	www.bogdan-vojska.eu
 *	enugene@bogdan-vojska.eu
 *
 * LICENCE:
 *	Permission is hereby granted, free of charge, to any person obtaining a
 *	copy of this software using it subject to the following conditions:
 *	
 *	The enuGene software version 0.9.1-beta is for free use to any webdesigner or other 
 *	creative working people using it as part of a web site, controling a web 
 *	site's menus. The web site may be as well commercial as private. For realizing 
 *	this usage the software may be copied and distributed free of charge.
 *	
 *	The programs code is not free for any changing without another special license 
 *	or agreement with the above noticed developer. The program or its parts are not 
 *	free for any kind of commercial or noncommercial reselling, or anykind of use as 
 *	codepart inside other programs without a otherwise expressly by the developer 
 *	agreed licence.
 *
 *	The above copyright notice and this permission notice shall be included
 *	in all copies or substantial portions of the Software.
 *
 *	THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
 *	OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 
 *	FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
 *	IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, 
 *	DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, 
 *	ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
 *	DEALINGS IN THE SOFTWARE.
 *
 * NOTICE:
 *	
 *	There is no guaratee for any compatibility to browsers below the IE 5.5 age. 
 *	Targeted browsers are full W3C standard compatible browsers.
*/

// Globals
var _mgen_usertype = '';

var spacer = '   ';
var mgen_loadMenusTimeout = null;

////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////

/**
* the mouse ruler class
*/
function clsMgenRuler () {
	this.drag = {
		posX : 0,
		posY : 0,
		startX : 0,
		startY : 0,
		mm_event : null,
		object : null
	};
	
	/**
	* The event handler for mouse position registration. If set, the mouse 
	* sensitive info element starts working. (Set by Builder form)
	* @return void
	*/
	this.startMouseMoveHandler = function () {
		switch (enugene.globals.mgen_showCursorPosition) {
		case 'no' :
			document.onmousemove = '';
			break;
		case 'administrator' :
			if (enugene.startup.usertype.toLowerCase().search( 'admin' ) != -1) {
				this.infoFrame.create();
				document.onmousemove = this.get_mousePosition;
			}
			break;
		case 'all' :
			this.infoFrame.create();
			document.onmousemove = this.get_mousePosition;
			break;
		default :
			document.onmousemove = '';
		}
	};
	
	/**
	* - Calculates the mouse cursor position and writes it to the info container.
	* - Calls the menu details infos and writes them to the info container.
	* - Feeds the cursor position coordinates to the ruler .
	* @return void
	*/
	this.get_mousePosition = function (mm_event) {
		var innerHTML = '';
		var me = enugene.tools.ruler;
		var objCursorInfoFrame = enugene.DOM.util.getObject('mousePos_frame');
		if (!objCursorInfoFrame) return;
	
		me.drag.mm_event = mm_event;
		me.drag.posX = document.all ? window.event.clientX + document.documentElement.scrollLeft : mm_event.pageX;
		me.drag.posY = document.all ? window.event.clientY + document.documentElement.scrollTop : mm_event.pageY;
		
		if (me.drag.object) {
		    me.drag.object.style.left = (me.drag.posX - me.drag.startX) + "px";
	    	me.drag.object.style.top = (me.drag.posY - me.drag.startY) + "px";
	    }
	
		// set ruler position
		me.ruler.set_position( me );
		
		// display the cursor position in the infoFrame
		objCursorInfoFrame.style.textAlign = 'left';
		innerHTML += '<div style="background-color:#aaa;font-size:12px;padding:0px 3px 0px 3px;margin-bottom:3px;">' + me.drag.posX + ',' + me.drag.posY + '</div>';
		innerHTML += me.infoFrame.displayExtended( objCursorInfoFrame );
		objCursorInfoFrame.innerHTML = innerHTML;
	};
	
	this.ruler = {
		// Interface for controlling the ruler actions and state
		parent : '',
		objRulerH : '',
		objRulerV : '',
		objRulerC : '',
		state: 'hold',
		originX : 0,
		originY : 0,
		dX : 0,
		dY : 0,
		
		activate : function () {
			if (this.parent.infoFrame.objCursorInfoFrame.ruler_display === true) {
				this.parent.infoFrame.objCursorInfoFrame.ruler_display = false;
				img = enugene.globals.imagePath_default + 'inactiveRulerSymbol.png';
				this.remove( );
			} else {
				this.parent.infoFrame.objCursorInfoFrame.ruler_display = true;
				img = enugene.globals.imagePath_default + 'activeRulerSymbol.png';
				this.create( );
			}
		},
		
		/**
		* Switches the ruler actcion state
		* @return void
		*/ 
		clickRuler : function () {
			var me = enugene.tools.ruler.ruler;
			var objElem = enugene.DOM.util.getObject('originRuler_center');
			if (this.state == 'move') {
				this.state = 'hold';
				me.state = 'hold';
			} else {
				this.state = 'move';
				me.state = 'move';
			}
		},
	
		move : function () {
			this.objRulerH.style.width = document.body.offsetWidth + 'px';
			this.objRulerH.style.top = this.originY + 'px';
			this.objRulerV.style.left = this.originX + 'px';
			this.objRulerC.style.left = this.originX - 20 + 'px';
			this.objRulerC.style.top = this.originY - 20 + 'px';
		},
		
		/**
		* Calculates the ruler absolute and relative positions 
		* and displays the relative position values.
		*/
		set_position : function () {
			if (this.parent.infoFrame.objCursorInfoFrame.ruler_display) {
				this.dX = this.parent.drag.posX - this.originX;
				this.dY = this.parent.drag.posY - this.originY;
				if (this.state == 'move') {
					this.originX = this.parent.drag.posX;
					this.originY = this.parent.drag.posY;
					this.move();
				}
				// display relative distance beside the ruler center
				if (this.objRulerC) {
					this.objRulerC.childNodes[0].innerHTML = this.dX + ',' + this.dY;
				}
			}
		},

		/**
		* Remove the ruler cross elements from display
		*/
		remove : function () {
			var objElem = enugene.DOM.util.getObject('originRuler_horizontal');
			if (!objElem) return;
			document.body.removeChild(objElem);
			objElem = enugene.DOM.util.getObject('originRuler_vertical');
			document.body.removeChild(objElem);
			objElem = enugene.DOM.util.getObject('originRuler_center');
			document.body.removeChild(objElem);
		},

		/**
		* Create and append the ruler elements to the DOM
		*/
		create : function () {
			this.originX = document.body.offsetWidth / 2;
			this.originY = screen.height / 2;
			var newObj = document.createElement('div');
			newObj.id = 'originRuler_vertical';
			newObj.style.width = '1px';
			newObj.style.height = document.body.offsetHeight + 'px';
			newObj.style.borderLeft = '1px solid #000';
			newObj.style.position = 'absolute';
			newObj.style.zIndex = '100';
			newObj.style.top = '0px';
			newObj.style.left = this.originX + 'px';
			document.body.appendChild(newObj);
			this.objRulerV = newObj;
			
			newObj = document.createElement('div');
			newObj.id = 'originRuler_horizontal';
			newObj.style.height = '1px';
			newObj.style.width = document.body.offsetWidth + 'px';
			newObj.style.borderTop = '1px solid #000';
			newObj.style.position = 'absolute';
			newObj.style.zIndex = '100';
			newObj.style.left = '0px';
			newObj.style.top = this.originY + 'px';
			document.body.appendChild(newObj);
			this.objRulerH = newObj;
			
			newObj = document.createElement('div');
			newObj.id = 'originRuler_center';
			newObj.style.height = '40px';
			newObj.style.width = '40px';
			newObj.style.border = '1px solid #000';
			newObj.style.position = 'absolute';
			newObj.style.zIndex = '100';
			newObj.style.left = this.originX - 20 + 'px';
			newObj.style.top = this.originY - 20 + 'px';
			newObj.state = 'hold';
			this.state = 'hold';
		
			if (enugene.DOM.util.isIe()) {
				newObj.onclick = new Function("return enugene.tools.ruler.ruler.clickRuler()");
			} else {
				newObj.onclick = enugene.tools.ruler.ruler.clickRuler;
			}
		
			newObj.style.backgroundImage = 'url(' + enugene.globals.imagePath_default + 'white_transparent.png' + ')';
			document.body.appendChild(newObj);
			this.objRulerC = enugene.DOM.util.getObject('originRuler_center');
			
			newObj = document.createElement('span');
			newObj.id = 'ruler_statusDisplay';
			newObj.style.fontSize = '12px';
			newObj.style.clear = 'left';
			newObj.style.position = 'relative';
			newObj.style.whiteSpace = 'nowrap';
			newObj.style.left = '45px';
			newObj.style.width = '20px';
			newObj.style.paddingLeft = '5px';
			newObj.style.paddingRight = '5px';
			newObj.style.backgroundColor = 'rgb(255,255,255)';
			this.objRulerC.appendChild(newObj);
		}
	}
	
	this.infoFrame = {
		/**
		* objCursorInfoFrame: Is the DOM object ref to the info frame.
		* it gets additional params:
		* - .ruler_display
		* - .displayIds
		*/
		parent : '',
		objCursorInfoFrame : '',
		posX : 0,
		posY : 0,
		
		/**
		* Is associated to the objects mousedown eventhandler.
		* Notice: mouse move management is controlled by ruler.get_mousePosition()
		* @param string
		*/
		activate : function (obj) {
			var me = enugene.tools.ruler.infoFrame;
			me.parent.drag.object = obj;
			me.parent.drag.startX = me.parent.drag.posX - me.parent.drag.object.offsetLeft;
			me.parent.drag.startY = me.parent.drag.posY - me.parent.drag.object.offsetTop;
		},
		
		/**
		* Is associated to the objects mouseup eventhandler.
		* Notice: mouse move management is controlled by ruler.get_mousePosition()
		* @param string
		*/
		deactivate : function (mm_event) {
			var me = enugene.tools.ruler.infoFrame;
			me.parent.drag.object.style.left = (me.parent.drag.posX - me.parent.drag.startX) + "px";
			me.parent.drag.object.style.top = (me.parent.drag.posY - me.parent.drag.startY) + "px";
			me.parent.drag.object = null;
		},
		
		/**
		* mouse cursor position
		*/
		addButton : function (margin, obj) {
			var strReturn = '';
			var img = enugene.globals.imagePath_default + 'addSymbol.png';
			if (margin)
				margin = 'margin:' + margin + ';';
			else
				margin = '';
			if (!obj.displayIds)
				img = enugene.globals.imagePath_default + 'addSymbol.png';
			else
				img = enugene.globals.imagePath_default + 'minusSymbol.png';
			strReturn += '<div style="' + margin + 'width:13px;height:14px;display:inline;" onclick="enugene.tools.ruler.infoFrame.displayBasic()">';
			strReturn += '<img alt="" border="0" title="" src="' + img + '" width="14px" height="14px" />';
			strReturn += '</div>';
			return strReturn;
		},
		
		/**
		* ruler activate button
		*/
		rulerButton : function (margin, obj) {
			if (!obj.displayIds) return '';
			var strReturn = '';
			var img = enugene.globals.imagePath_default + 'inactiveRulerSymbol.png';
			if (margin)
				margin = 'margin:' + margin + ';';
			else
				margin = '';
			if (!obj.ruler_display)
				img = enugene.globals.imagePath_default + 'inactiveRulerSymbol.png';
			else
				img = enugene.globals.imagePath_default + 'activeRulerSymbol.png';
			strReturn += '<div style="' + margin + 'width:13px;height:14px;display:inline;" onclick="enugene.tools.ruler.ruler.activate()">';
			strReturn += '<img alt="" border="0" title="" src="' + img + '" width="14px" height="14px" />';
			strReturn += '</div>';
			return strReturn;
		},
		
		/**
		* Set the info container to default left position
		*/
		leftButton : function () {
			var strReturn = '';
			var img = enugene.globals.imagePath_default + 'arrow_boxedGreyLeft_15px.png';
			strReturn += '<div style="width:13px;height:14px;display:inline;">';
			strReturn += '<img alt="" border="0" title="" src="' + img + '" width="14px" height="14px" />';
			strReturn += '</div>';
			return strReturn;
		},
		
		/**
		* Set the info container to right position
		*/
		rightButton : function () {
			var strReturn = '';
			var img = enugene.globals.imagePath_default + 'arrow_boxedGreyRight_15px.png';
			strReturn += '<div style="width:13px;height:14px;display:inline;">';
			strReturn += '<img alt="" border="0" title="" src="' + img + '" width="14px" height="14px" />';
			strReturn += '</div>';
			return strReturn;
		},
	
		/**
		* Switch the flag to display the menu info details
		* @return void
		*/
		displayBasic : function (mm_event) {
			var objCursorInfoFrame = enugene.DOM.util.getObject('mousePos_frame');
			var innerHTML = '<div style="background-color:#aaa;font-size:12px;padding:0 3px 0 3px;margin-bottom:3px;">' + this.parent.drag.posX + ',' + this.parent.drag.posY + '</div>';
			if (objCursorInfoFrame && objCursorInfoFrame.displayIds) {
				// close options
				objCursorInfoFrame.ruler_display = false;
				objCursorInfoFrame.displayIds = false;
				innerHTML += '<div style="clear:left;"></div>'
				innerHTML += '<div style="text-align:center;width:56px;height:16px;margin:0px auto;">';
				innerHTML += this.leftButton();
				innerHTML += this.addButton( '0px auto', objCursorInfoFrame );
				innerHTML += this.rulerButton( '0px auto', objCursorInfoFrame );
				innerHTML += this.rightButton();
				innerHTML += '</div>';
				this.parent.ruler.remove( );
			} else {
				objCursorInfoFrame.displayIds = true;
				innerHTML += this.displayExtended( objCursorInfoFrame );
			}
			objCursorInfoFrame.innerHTML = innerHTML;
		},
		
		/**
		* Writes the mouse position and menu infos to the cursor info container
		* @return string
		*/
		displayExtended : function (obj) {
		
			var innerHTML = '';
			innerHTML += '<div style="clear:left"></div>'
			innerHTML += '<div style="text-align:center;width:56px;height:16px;margin:0px auto;">';
			innerHTML += this.leftButton();
			innerHTML += this.addButton( '0px auto', obj );
			innerHTML += this.rulerButton( '0px auto', obj );
			innerHTML += this.rightButton();
			innerHTML += '</div>';
		
			var strClass = 'margin-bottom:5px;';
			
			if (obj.displayIds) {
				innerHTML += '<div style="background-color:transparent;font-size:12px;padding-left:5px;clear:left" id="mm_statusDisplay">';
				if (enugene.menus.currentItem && enugene.menus.currentItem.id) {
					innerHTML += 'Item';
					innerHTML += '<div style="padding-left:8px;">Id:' + enugene.menus.currentItem.id + '</div>';
					if (enugene.menus.currentItem.domObject) {
						innerHTML += '<div style="padding-left:8px;">width:' + enugene.menus.currentItem.domObject.offsetWidth + '</div>';
						innerHTML += '<div style="padding-left:8px;">height:' + enugene.menus.currentItem.domObject.offsetHeight + '</div>';
					}
				}
				if (enugene.menus.currentMenu && enugene.menus.currentMenu.id) {
					innerHTML += 'Menu';
					innerHTML += '<div style="padding-left:8px;">Id:&nbsp;' + enugene.menus.currentMenu.id + '</div>';
					if (enugene.menus.currentMenu.domObject) {
						innerHTML += '<div style="padding-left:8px;">width:' + enugene.menus.currentMenu.domObject.offsetWidth + '</div>';
						innerHTML += '<div style="padding-left:8px;">height:' + enugene.menus.currentMenu.domObject.offsetHeight + '</div>';
					}
				}
				if (enugene.menus.currentMenu && enugene.menus.currentMenu.menuObject.theme) {
					innerHTML += 'Theme';
					innerHTML += '<div style="padding-left:8px;">Id:&nbsp;' + enugene.menus.currentMenu.menuObject.theme + '</div>';
				}
				innerHTML += '</div>';
			}
			return innerHTML;
		},
		
		/**
		* Set the position coodinates to the cursor and menu info container object reference.
		*/
		position_infoframe : function ($position) {
			if ($position == 'left') {
				this.posX = 0;
				this.objCursorInfoFrame.style.left = this.posX + 'px';
			} else {
				this.posX = this.posX + 200;
				this.objCursorInfoFrame.style.left = this.posX + 'px';
			}
		},
	
		/**
		* Append mouse cursor info container to the document.
		*/

		create : function () {
			var newObj = document.createElement('div');
			newObj.id = 'mousePos_frame';
			newObj.style.width = '100px';
			newObj.style.height = 'auto';
			newObj.style.border= '1px solid transparent';
			newObj.style.padding= '5px';
			newObj.style.position = 'absolute';
			newObj.style.top = this.posY + 'px';
			newObj.style.left = this.posX + 'px';
			newObj.style.cursor = 'pointer';
			newObj.style.zIndex = '100';
			newObj.style.backgroundImage = 'url(' + enugene.globals.imagePath_default + 'white_transparent.png' + ')';
			newObj.displayIds = false;
			newObj.ruler_display = false;
			if (document.all) {
				newObj.onmouseup = new Function( "enugene.tools.ruler.infoFrame.deactivate()" );
				newObj.onmousedown = new Function( "enugene.tools.ruler.infoFrame.activate(this)" );
			} else {
				newObj.onmouseup = enugene.tools.ruler.infoFrame.deactivate;
				newObj.onmousedown = function () { enugene.tools.ruler.infoFrame.activate(this); };
			}
			document.body.appendChild(newObj);
			this.objCursorInfoFrame  = newObj;
		}

	}; // infoFrame
	this.infoFrame.parent = this;
	this.ruler.parent = this;
} // clsMgenRuler

////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////////  INIT  /////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////
//window.onload = mgen_enugeneload;
// init enugene instance
function mgen_enugeneload() {
	enugene.DOM = new clsEnugeneDOM(enugene.menus);
	var mgenClasses = new clsEnugeneKernel();
	enugene.DOM.properties = new mgenClasses.clsEnugeneMenuProperties(enugene.menus);
	enugene.menus.util = new mgenClasses.clsEnugeneUtil();
	enugene.menus.currentItem = new mgenClasses.objects.clsCurrentItem();
	enugene.menus.currentMenu = new mgenClasses.objects.clsCurrentMenu();
	enugene.menus.savedItem = new mgenClasses.objects.clsSavedItem();
	enugene.menus.perform = new mgenClasses.clsEnugenePerformer( enugene.menus );
	// construction
	enugene.DOM.constructor.create(document.body);
	// init ruler
	if (enugene.globals.mgen_showCursorPosition != 'no') {
		enugene.tools.ruler = new clsMgenRuler();
		enugene.tools.ruler.startMouseMoveHandler( );
	}
	// init globals
	enugene.globals.menuTimeout = null;
};

