// Loaded on header
	// chage next 2 functions to CSS
	function mOut(el) {
		// check posXY
		//el.style.display = "block";
		//el.style.visibility = "visible";
		el.style.opacity = "0.1";
		//$('el').gx({'opacity': 0.1}, 200, 'Linear');
		//$('el').fadeIn('1000');
		//el.onmouseover = "mOver(this);"; // put again the event back
	}

	function mOver(el) {
		//el.style.display = "block";
		//el.style.visibility = "hidden";
		el.style.opacity = "0.4";
		//$('el').gx({'opacity': 0.5}, 200, 'Linear');
		//$('el').fadeOut('1000');
		//el.onmouseover = ""; // remove one event to prevent bubbling
	}

	itemsPage = 5; // TODO retrieve total themes number

	function overShadow ( id, offSetX, maxLong) { // this function is just arranging dimesions of existing shadows
	
		for ( c = 1; c < itemsPage; c++ ) {

			this_obj = id + "_id" + c;
			var obj = document.getElementById( this_obj );
			if ( obj == false ) break;
			// get position and dimensions
			var posX = obj.offsetLeft;
			var posY = obj.offsetTop;
			var w = obj.clientWidth;
			var h = obj.clientHeight;
			
			while ( obj.offsetParent ) {
				posX=posX+obj.offsetParent.offsetLeft;
				posY=posY+obj.offsetParent.offsetTop;
				if(obj==document.getElementsByTagName('body')[0]){ break }
				else{ obj=obj.offsetParent; }
			}
	
			//alert ( c + "Found at :" + " X" + posX + " Y" + posY + " W" + w + " H" + h);
	
			// Shadowing
		
			//alert ( id + "_wrapper" + c )
			
			var divstyle = document.getElementById ( id + "_wrapper" + c );
			divstyle.style.left		= offSetX + posX + "px";
			divstyle.style.top		= posY + "px";
			if (w - 5 > maxLong ) w = maxLong;
			divstyle.style.width	= w - 5 + "px";
			divstyle.style.height	= h - 5 + "px";
			
		}
	}


	
	/*
	try {
	  document.execCommand("BackgroundImageCache", false, true);
	} catch(err) {}
	*/

	
	function openbox(url, name) {
	
		// Vars
		whereY = window.scrollY;
		
		var box = document.getElementById('box'); 
		document.getElementById('filter').style.display='block';
		
		var title = document.getElementById('boxtitle');
		title.innerHTML = name;
		
		var content = document.getElementById('boxcontent');
		content.style.padding="0";
		content.innerHTML = "<img src=" + url + " />";
		
		// set place to display
		box.style.top = whereY + "px";
		// display
		box.style.display='block';	
	}
	
	function closebox() {
		document.getElementById('box').style.display='none';
		document.getElementById('filter').style.display='none';
	}
	
	
	function changeTitle ( title, uri) {
		var txt = prompt ('Choose a new title for this theme!', title );
		
		if (txt != null ) { // did not press cancel
			if ( txt != title ) {
				pageRefresh();
			}
		}
		
	}
	
	function cancel( num ) {
		pageRefresh();
		//descObj = document.getElementById ( 'description_id' + num );
		//document.getElementById('description_id' + num ).innerHTML = content;
	}

	function edit(el, num) {

		//alert (num);
		
		// get content and empty to fill it with another content description box
		descObj = document.getElementById ( 'description_id' + num );
		old_description = descObj.innerHTML;
		old_description.trim();
		//old_description = addslashes(old_description);
		
		//alert (old_description);
		
		//alert (old_description);
		// Change background
		descObj.innerHTML = '<td class="rowPadding" width=200 name="description" align="left" valign="top" colspan="2"><hr size="1" width="588" color="#BCBBCD"><br><br><hr size="1" width="588" color="#BCBBCD"></td>';
		
		// over last element display input
		parent = document.getElementById ( 'description_wrapper' + num );
		var descriptionBoxHeight = $j("#subThemes").height();

		//alert (descObj.fontSize);
		
		var dynamicInputSize = Math.round ( ( ( descriptionBoxHeight ) / 2 ) - 10 );
		parent.innerHTML = '<form method="POST" action="?go=my_panel&action=my_created_themes"><span style="position: relative; left: 14px; top: 15px; color: #000000; opacity: 1.0;"><input id="new_description' + num + '" type=text size=' + dynamicInputSize + '><button type="submit">ok</button></span></form><span style="cursor: pointer; position: absolute; top: 0px; right: 30px; color: #ffffff; background-color: #000000; border-width: 5px; padding: 0px;" onclick="javascript: cancel( ' + num + ' );">Cancel!</span>';
		//el.setAttribute ("onclick", "");
	}
	
	
	
	// Extra functions ----------------------------------
	
	function addslashes(str) {
		str=str.replace(/\\/g,'\\\\');
		str=str.replace(/\'/g,'\\\'');
		str=str.replace(/\"/g,'\\"');
		str=str.replace(/\0/g,'\\0');
		return str;
	}
	
	function stripslashes(str) {
		str=str.replace(/\\'/g,'\'');
		str=str.replace(/\\"/g,'"');
		str=str.replace(/\\0/g,'\0');
		str=str.replace(/\\\\/g,'\\');
		return str;
	}
	
	function pageRefresh() {
		window.location = window.location.href;
	}