if (typeof contextPath == "undefined") {
	alert("WARNING: contextPath variable is not defined!");
}




function JSTitleBar(portletLabel, pageLabel, contextPath, menuTitle){
	//this.template = TitlebarTemplate;
	this.menuBtnIdSuffix = "menuBtn";
	this.titlebarIdSuffix = "titlebar";
	this.viewRightMenuSuffix = "viewRightMenu";
	this.topbarIdSuffix = "topbar";
	this.portletIdSuffix = "portlet";
	this.titlebar = null;
	this.menuBtn = null;
	this.leftmenu = null;
	this.mainmenu = null;
	this.portletLabel = "";
	this.viewRightMenuItem = null;
	this.tmpElement = null;
	this.contextPath = contextPath;
	this.submenus = new JSHashMap();
	this.parentMenuOptions = new JSHashMap();
	this.menutimer = null;
	this.menusShown = new Array();

	var iframeHack = document.getElementById(portletLabel+"_frame");

//	this.psManageResourcesPath = contextPath + "/portlets/ps/core/manage";
		
	function exists(src,menuTitle) {
	  if (!this.titlebar){
   		this.addTitlebar(src,menuTitle);
  	}
 	}
 	this.exists= exists;
		
	function create(args){
		this.portletLabel = portletLabel;
		this.pageLabel = pageLabel;
		var psManageResourcesPath = ComponentConfig.getPsManageResourcesPath();
		this.btnSrcOff = psManageResourcesPath + "/images/ps-menu-icon-off.gif";
		this.btnSrcHover = psManageResourcesPath + "/images/ps-menu-icon-hover.gif";
		this.btnSrcClickUp = psManageResourcesPath + "/images/ps-menu-icon-active-up.gif";
		this.btnSrcClickDown = psManageResourcesPath + "/images/ps-menu-icon-active-down.gif";
		this.hasDragbar = false;
		this.menus = new Array();
		
		// adding titlebar
		this.titlebarId = this.portletLabel + "_" + this.titlebarIdSuffix;
		
		this.menuOpen = false;
		var constr = this;
					
		this.dragbar = document.getElementById(this.titlebarId+"_drag");
		this.titlebar = document.getElementById(this.titlebarId);
		this.barMenuBtn = this.titlebar.getElementsByTagName("IMG")[0];
		hide(this.barMenuBtn);	//hide icon by default
		
		this.mainmenu = createElement("ul", this.portletLabel+"_mainmenu", "ps_menu", ""); //document.getElementById(this.portletLabel+"_mainmenu");
		this.mainmenu.onmouseout = function(e){constr.documentMouseover(e);}
		this.mainmenu.onmouseover = function(e){if (constr.menutimer) {clearTimeout(constr.menutimer);}}
		this.menuDiv = document.getElementById(this.portletLabel+"_mainmenu");
		//this.mainmenu = this.titlebar.getElementsByTagName("UL")[0]; //titleBarUL1;
		//this.menuDiv = this.titlebar.getElementsByTagName("UL")[0]; //titleBarUL2;

//document.body.appendChild(titlebar.mainmenu);	//gives error in ie


//		var constr = this;
		//this.barMenuBtn.onmouseover = function(){if (constr.dragbarExists && !mouseButtonDown) {show(document.getElementById(constr.titlebarId+"_drag"));if (!constr.menuOpen) {constr.barMenuBtn.src=constr.btnSrcHover;}}};
//		attachEvent(document,"click",function(e){constr.documentClick(e);});
		//attachEvent(document,"mouseover",function(e){constr.documentMouseover(e);});
//		this.barMenuBtn.onclick = function(){constr.openMainMenu();return false};
		
		if (Global.isDefined(this.dragbar)) {
			this.hasDragbar = true;
			this.dragbar.onmouseover = function(){show(document.getElementById(constr.titlebarId+"_drag"));};
			this.dragbar.onmousedown = function(){mouseButtonDown = true;constr.hideMenus(false);};
			this.dragbar.onmouseup = function(){mouseButtonDown = false;hide(document.getElementById(constr.titlebarId+"_drag"));};
			this.dragbar.onmouseout = function(){if (!mouseButtonDown && !constr.menuOpen) {hide(document.getElementById(constr.titlebarId+"_drag"));constr.barMenuBtn.src=constr.btnSrcOff;}};
			
			registerWindow(pageLabel, this.titlebarId+"_drag", this.portletLabel, "true");
			
			//configure titlebar			
			
			//this.barMenuBtn.onmouseover = function(){if (!mouseButtonDown) {show(document.getElementById(constr.titlebarId+"_drag"));if (!constr.menuOpen) {constr.barMenuBtn.src=constr.btnSrcHover;}}};
			show(this.barMenuBtn);	//show the icon
		}
		this.barMenuBtn.onmouseover = function(){if (constr.menutimer) {clearTimeout(constr.menutimer);}constr.showDragbar()};
	}
	//this.addTitlebar = addTitlebar;

	this.create = create;


	function updateMenuOption(optionName, href, onOptionClick, iconSrc, className, menuItem, titlebar) {
		//var menuItem = this.submenus.get(optionId);	//document.getElementById(optionId);
		if (Global.isDefined(menuItem)) {
			var newMenuItem = createMenuOption(optionName, href, onOptionClick, iconSrc, className, menuItem.id, titlebar);
			menuItem.parentNode.replaceChild(newMenuItem, menuItem);
			menuItem = newMenuItem;
		}
		return menuItem;
	}
	function createMenuOption(optionName, href, onOptionClick, iconSrc, className, optionId, titlebar) {
		var menuItem = createElement("li", optionId, className, "");

		var menuItemValue = createElement("span", "", "", optionName);
		if (Global.isDefined(href)) {
			menuItemValue = createAnchor("", href, "", optionName);
			if (Global.isDefined(onOptionClick)) {
				var func = new Function(onOptionClick);
				attachEvent(menuItemValue,"click",func);
			}
		} else if (Global.isDefined(onOptionClick)) {
            var func = new Function(onOptionClick);
            attachEvent(menuItem,"click",func);
		}
		if (Global.isDefined(iconSrc)) {
			if (iconSrc.indexOf("/") != 0) {
				iconSrc =  ComponentConfig.getPsManageResourcesPath() + "/images/" + iconSrc;
			}
			var menuItemIcon = createImage("", "", iconSrc, "left");
			menuItemIcon.setAttribute("alt", optionName);
			menuItem.appendChild(menuItemIcon);
		}
		
		menuItem.appendChild(menuItemValue);
		menuItem.onmouseover = function(){setHoverClass(menuItem, "hover");};
		menuItem.onmouseout = function(){unSetHoverClass(menuItem, "hover");};
		return menuItem;
	}
	function createParentMenuOption(optionName, id, iconSrc, position, parentItemId) {
		var optionId = this.getMenuOptionId(id);	//this.titlebarId+"_menuoption_"+id;
		var menuId = this.titlebarId+"_menu_"+id;
		var menu = this.mainmenu;		
		var constr = this;

		var submenu = this.submenus.get(id);	//document.getElementById(optionId);
		if (!Global.isDefined(submenu)) {	// if parent menu option does not exist yet
			//create parent menu option with its submenu
			if (Global.isDefined(parentItemId)) {
				menu = this.submenus.get(parentItemId);	//this.menus[parentItemId];
				if (!Global.isDefined(menu)) {
					createParentMenuOption(parentItemId, parentItemId);
					menu = this.submenus.get(parentItemId);	//this.menus[parentItemId];
				}
			}
			var menuItem = createMenuOption(optionName, null, null, iconSrc, "parent", optionId, this);
			addOptionOnPosition(menu, menuItem, position);

			submenu = createElement("ul", menuId, "ps_menu", "");	//this.menuDiv.cloneNode(false);
			
			attachEvent(menuItem,"mouseover",function(){setHoverClass(menuItem, "hover"); constr.showSubmenu(id, menuItem);});

			menuItem.onmouseout = function(){constr.hideSubmenu(submenu);};
			submenu.onmouseover = function(){constr.showSubmenu(id, menuItem);if (constr.menutimer) {clearTimeout(constr.menutimer);} setHoverClass(menuItem, "hover");};
			submenu.onmouseout = function(e){constr.documentMouseover(e);};
			this.submenus.put(id, submenu);
			this.parentMenuOptions.put(optionId, menuItem);
		} else {	// parent menu option already exists
			// update the option
			var parentMenuOption = this.parentMenuOptions.get(optionId);	//document.getElementById(optionId);
			var menuItem = updateMenuOption(optionName, null, null, iconSrc, "parent", parentMenuOption, this);
			attachEvent(menuItem,"mouseover",function(){ setHoverClass(menuItem, "hover"); constr.hideOtherSubmenus(this.id); constr.showSubmenu(id, menuItem);});
		}
		this.hideSubmenu(submenu);
	}
	this.createParentMenuOption = createParentMenuOption;

	function addOptionOnPosition(menu, menuOption, position) {
		if (Global.isDefined(position) && (position > 0) && (menu.childNodes.length > 0)) {
			if (menu.childNodes[0].className == "title") {
				position++;
			}
			
			if (menu.childNodes.length >= position) {
				var insertBefore = menu.childNodes[position-1];
				menu.insertBefore(menuOption, insertBefore);
			} else {
				menu.appendChild(menuOption);
			}
		} else {
			menu.appendChild(menuOption);
		}
	}

	function addMenuTitle(menuTitle) {
		if (menuTitle == "") {
			menuTitle = " ";
		}
		var menuItem = createElement("li", "", "title", menuTitle);
		addOptionOnPosition(this.mainmenu, menuItem, 1)
		/*
		if (this.mainmenu.childNodes.length > 0) {
			this.mainmenu.insertBefore(menuItem, this.mainmenu.childNodes[0]);
		} else {
			this.mainmenu.appendChild(menuItem);
		}
		*/
	}
	this.addMenuTitle = addMenuTitle;
	
	function addMenuItem(title, href, onclick, iconSrc, position, parentItemId){
		var viewId = this.portletLabel + "_" + this.viewRightMenuSuffix;
		var id = "";
		var className = "";

		var menu = this.mainmenu;
		if (Global.isDefined(parentItemId)) {
			var menu = this.submenus.get(parentItemId);	//this.menus[parentItemId];
			if (!Global.isDefined(menu)) {
				this.createParentMenuOption(parentItemId, parentItemId);
				menu = this.submenus.get(parentItemId);	//this.menus[parentItemId];
			}
		}

		var menuOption = createMenuOption(title, href, onclick, iconSrc, null, null, this);
		
		if (!Global.isDefined(parentItemId)) {
			var constr = this;
			attachEvent(menuOption,"mouseover",function(){constr.hideOtherSubmenus("");});
		}
		addOptionOnPosition(menu, menuOption, position);
		
		// configure the ps icon when there are 1 or more menu items
		var constr = this;
		attachEvent(document,"click",function(e){constr.documentClick(e);});
		this.barMenuBtn.onclick = function(){
				if(document.readyState && document.readyState!="complete") return false;
				if (constr.menuOpen) {constr.hideMenus(false);} else { constr.openMainMenu();}
				return false;
		};
		show(this.barMenuBtn);	//show the ps icon
	}
	this.addMenuItem = addMenuItem;
	
	function hideMenu(titlebar) {
		hide(titlebar.mainmenu);
		titlebar.barMenuBtn.style.zIndex = 95;
	}
	function showMenu(titlebar) {
		new Effect.FadeTo(titlebar.mainmenu, 1, 100, 1, {});
		document.body.appendChild(titlebar.mainmenu);
		show(titlebar.mainmenu);

		// increase css property z-index so that it is on top of this menu
		titlebar.barMenuBtn.style.zIndex = 4110;

		var html = document.body.parentNode;
		var htmlHeight = html.clientHeight;
		var bodyWidth = document.body.offsetWidth;
		var bodyHeight = document.body.offsetHeight;

		var marginRight = 3;	// margin on right side for menuBtn
		var menuWidth = titlebar.mainmenu.offsetWidth;
		var menuHeight = titlebar.mainmenu.offsetHeight;
		var menuTitleHeight = titlebar.mainmenu.childNodes[0].offsetHeight;

		var titlebarBtnTop = getRealOffsetTop(titlebar.barMenuBtn) - html.scrollTop;
		var titlebarBtnLeft = getRealOffsetLeft(titlebar.barMenuBtn);
		var titlebarBtnHeight = titlebar.barMenuBtn.offsetHeight;
		var titlebarBtnWidth = titlebar.barMenuBtn.offsetWidth;

		var dragbarHeight = (titlebar.hasDragbar) ? titlebar.dragbar.offsetHeight : 0;
		var dragbarWidth = (titlebar.hasDragbar) ? titlebar.dragbar.offsetWidth : 0;
		var dragbarLeft = (titlebar.hasDragbar) ? getRealOffsetLeft(titlebar.dragbar) : 0;
		var dragbarTop = (titlebar.hasDragbar) ? getRealOffsetTop(titlebar.dragbar) : 0;

		var menuTitle = titlebar.mainmenu.firstChild;

		// calculate top position
		var mainmenuTop = titlebarBtnTop - (menuTitleHeight-titlebarBtnHeight)/2;
		// check if menu will be shown below bottom window border
		if (mainmenuTop + menuHeight > htmlHeight) {
			// place menu above titlebar
			
			// move menu title to bottom
			if (menuTitle.className == "title") {
				menuTitle.className = "title titleReverse";
				titlebar.mainmenu.appendChild(menuTitle);
			}
			menuTitle = titlebar.mainmenu.lastChild;

			// menu will be shown outside window: move up
			if (!titlebar.hasDragbar) {
				mainmenuTop = titlebarBtnTop - menuHeight + menuTitleHeight - (menuTitleHeight-titlebarBtnHeight)/2;

			} else {
				mainmenuTop = dragbarTop - menuHeight - html.scrollTop;
			}
				
			// switch titlebar button icon
			titlebar.barMenuBtn.src=titlebar.btnSrcClickUp;

			if (document.getBoxObjectFor == undefined) {	//if ie
				// clone titlebar button and put it in title of menu because else button will dissapear beneath menu (ie z-index 'bug')
				// can be fixed by making titlebar button also globally absolute
				if (menuTitle.getElementsByTagName("IMG").length > 0) {
					menuTitle.removeChild(menuTitle.getElementsByTagName("IMG")[0]);
				}
				var titlebarBtnClone = titlebar.barMenuBtn.cloneNode(true);
				
				menuTitle.appendChild(titlebarBtnClone);
				titlebarBtnClone.style.bottom = 0 + "px";
			}
		} else {
			// menu will be not outside window border so put menu under titlebar button
			
			// switch titlebar button icon
			titlebar.barMenuBtn.src=titlebar.btnSrcClickDown;
			
			// move menu title to top
			menuTitle = titlebar.mainmenu.lastChild;
			if (menuTitle.className == "title titleReverse") {
				menuTitle.className = "title";
				if (titlebar.mainmenu.childNodes.length > 1) {
					titlebar.mainmenu.insertBefore(menuTitle, titlebar.mainmenu.childNodes[0]);
				} else {
					titlebar.mainmenu.appendChild(menuTitle);
				}
			}
			menuTitle = titlebar.mainmenu.firstChild;

			mainmenuTop += dragbarHeight;
			
			if (document.getBoxObjectFor == undefined) {	//if ie
				// clone titlebar button and put it in title of menu because else button will dissapear beneath menu (ie z-index 'bug')
				// can be fixed by making titlebar button also globally absolute
				if (menuTitle.getElementsByTagName("IMG").length > 0) {
					menuTitle.removeChild(menuTitle.getElementsByTagName("IMG")[0]);
				}
				var titlebarBtnClone = titlebar.barMenuBtn.cloneNode(true);
				
				menuTitle.appendChild(titlebarBtnClone);
				titlebarBtnClone.style.top = 0 + "px";
			}
		}

		// set calculated tio position
		titlebar.mainmenu.style.top = mainmenuTop + html.scrollTop + "px";
		// calculate left position
		var mainmenuLeft = titlebarBtnLeft - menuWidth + titlebarBtnWidth + marginRight;
		if (titlebar.hasDragbar) {
			// set correct left position if there is a dragbar to align precisely with right side
			mainmenuLeft = dragbarLeft + dragbarWidth - menuWidth;
		} else {

		}
		// set calculated left position
		titlebar.mainmenu.style.left = mainmenuLeft + "px";

/* == == */
		if (typeof iframeHack != "undefined") {
			iframeHack.style.height = menuHeight;
			iframeHack.style.width = menuWidth;
			iframeHack.style.display = "block";
			iframeHack.style.visibility = "visible";
		}
/* == == */
		

		// TODO check left and right window border
	}

	function showSubmenu(parentMenuId, menuItem) {
		var menuItem = document.getElementById(menuItem.id);
		var menu = this.submenus.get(parentMenuId);
		var rot = getRealOffsetTop(menuItem);
		var rol = getRealOffsetLeft(menuItem);
		var submenu = document.getElementById(menu.id);
		if (!Global.isDefined(submenu)) {
			document.body.appendChild(menu);
		} else {
			menu = submenu;
		}
		
		new Effect.FadeTo(menu, 1, 100, 1, {});
		var parent = menu.parentNode;
		var ol = parent.offsetLeft;
		var ow = parent.offsetWidth;
		
		var parentMenuWidth = menuItem.offsetWidth;
		
		var bodyWidth = document.body.offsetWidth;
		show(menu);

		var menuWidth = menu.offsetWidth;
		var menuLeftPos = ol + ow;
		
		var correctionTop = 0;
		var correctionLeft = -1;
		if (document.getBoxObjectFor == undefined) {	// ie
			correctionLeft = 4;
			correctionTop = 6;
		}
		
		menu.style.left = rol + parentMenuWidth - correctionLeft + "px";

		menu.style.top = rot - correctionTop + "px";
		var menuMeasures = getObjMeasures(menu);
		var overflow = rol + parentMenuWidth - correctionLeft+menuWidth;
		if (overflow > bodyWidth) {
			menu.style.left = rol - menuWidth - correctionLeft + "px";
		}
		
		// TODO check top and bottom window border
		
		this.menusShown[this.menusShown.length] = menu;
	}
	this.showSubmenu = showSubmenu;

	function hideSubmenu(submenu) {
		var bodyMenu = document.getElementById(submenu.id);
		if (Global.isDefined(bodyMenu)) {
			// remove menu from body
			document.body.removeChild(bodyMenu);
		}
		// remove menu from array
		this.menusShown[submenu] = null;
		
		// hide menu
		//hide(submenu);
	}
	this.hideSubmenu = hideSubmenu;
	
	function hideOtherSubmenus(menuItemId) {
		var keys = this.submenus.keySet();
		for (var i=0; i<keys.length-1; i++) {
			var submenu = this.submenus.get(keys[i]);
			if (Global.isDefined(submenu.id)) {
				var optionId = this.getMenuOptionId(keys[i]);
				if (optionId != menuItemId) {
					this.hideSubmenu(submenu);
				}
			}
		}
	}
	this.hideOtherSubmenus = hideOtherSubmenus;
	
	/*
	 * Open the main ps titlebar menu
	 */
	function openMainMenu(){
		// only open menu if it has any items in it
		if (this.mainmenu.childNodes.length > 0) {
			showMenu(this);
			this.menuOpen = true;
		}
	}
	this.openMainMenu = openMainMenu;
	
	/*
	 * Hide all open menus
	 *
	 * @param fade	if true, fading out will be used to hide the menu
	 */
	function hideMenus(fade) {
		if (fade) {
			var constr = this;
			// check if mainmenu exist else rico will give error
			if (Global.isDefined(this.mainmenu)) {
				new Effect.FadeTo(this.mainmenu, 0, 1000, 20, {complete: function() {hide(constr.mainmenu)}});
			}
			for (var i=0; i<this.menusShown.length-1; i++) {
				// check if leftmenu exist else rico will give error
				if (Global.isDefined(this.menusShown[i])) {
					new Effect.FadeTo(this.menusShown[i], 0, 1000, 20, {complete: function() {constr.hideSubmenu(constr.menusShown[i])}});
				}
			}
		} else {
			hide(this.mainmenu);
			for (var i=0; i<this.menusShown.length-1; i++) {
				// check if leftmenu exist else rico will give error
				if (Global.isDefined(this.menusShown[i])) {
					this.hideSubmenu(this.menusShown[i]);
				}	
			}
		
			//hide(this.leftmenu);
		}
		this.barMenuBtn.style.zIndex = 95;
		this.barMenuBtn.src=this.btnSrcOff;
		this.menuOpen = false;
/* == == */
		if (typeof iframeHack != "undefined") {
			iframeHack.style.height = 0 + "em";
//			iframeHack.style.width = 0 + "px";
			iframeHack.style.display = "none";
			iframeHack.style.visibility = "hidden";
		}
/* == == */
		
		
	}
	this.hideMenus = hideMenus;

	/*
	 * Show the drag bar
	 */
	function showDragbar() {
		if (Global.isDefined(this.dragbar) && (!mouseButtonDown)) {
			new Effect.FadeTo(this.dragbar, 1, 100, 1, {});
			//show(document.getElementById(constr.titlebarId+"_drag"));
			show(this.dragbar);
			if (!this.menuOpen) {
				this.barMenuBtn.src=this.btnSrcHover;
			}
		}
	}
	this.showDragbar = showDragbar;

	/*
	 * Hide the drag bar
	 *
	 * @param fade	if true, fading out will be used to hide the drag bar
	 */
	function hideDragbar(fade) {
		if (fade) {
			var constr = this;
			// check if dragbar exist else rico will give error
			if (Global.isDefined(this.dragbar)) {
				new Effect.FadeTo(this.dragbar, 0, 1000, 20, {complete: function() {hide(constr.dragbar)}});
			}
		} else {
			hide(this.dragbar);
		}
	}
	this.hideDragbar = hideDragbar;

	/*
	 * Hide the whole titlebar, with menus and drag bar
	 *
	 * @param fade	if true, fading out will be used to hide the menus and drag bar
	 */
	function hideTitlebar(fade) {
		this.hideDragbar(fade);
		this.hideMenus(fade);
	}
	this.hideTitlebar = hideTitlebar;
	
	/*
	 * Executed when clicking on the page but not on titlebar items
	 */
	function documentClick(e){
		var o = getSrcElement(e);
		if ((this.titlebar == undefined) || contains(this.titlebar,o)) {
			return false;
		}
		this.hideTitlebar(false);
	}
	this.documentClick = documentClick;
	
	/*
	 * Executed on mouseover of the page but not over titlebar items
	 */
	function documentMouseover(e){
		var o = getSrcElement(e);
		if (!this.menuOpen) {
		//if ((this.titlebar == undefined) || contains(this.titlebar,o) || !this.menuOpen) {
			return false;
		}
		var constr = this;
		this.menutimer = setTimeout(function(){constr.hideTitlebar(true)}, 2000);
	}
	this.documentMouseover = documentMouseover;

	function getMenuOptionId(id) {
		var optionId = this.titlebarId+"_menuoption_"+id;
		return optionId
	}
	this.getMenuOptionId = getMenuOptionId;

	/*
	 * Attach a given function to an object executed on given event 
	 *
	 * @param o	object to set given event to
	 * @param e	name of event
	 * @param h	function to execute
	 */
	function attachEvent(o,e,h){
		if(o.attachEvent) {	//if ie
			o.attachEvent("on"+e,h);
		} else if (o.addEventListener) {	//if ff
			o.addEventListener(e,h,false);
		}
	}
	
	/*
	 * Get element where a certain event happened on
	 */
	function getSrcElement(e) {
		e = (e) ? e : window.event;
		if (!e) {
			return null;
		}
		return (e.srcElement) ? e.srcElement : e.target;
	}
	/*
	 * Check if a certain elements contains another element
	 *
	 * @param container	element to check if it contains the other element
	 * @param containee	element to check if it is the the other element
	 */
	function contains(container, containee) {
		while(containee) {
			if (container == containee) {
				return true;
			}
			containee = containee.parentNode;
		}
		return false;
	}

	/*
	 * Show given object
	 */
	function show(o){
		if (o != undefined) {
			o.style.display = "block";
		}
	}
	/*
	 * Hide given object
	 */
	function hide(o){
		if (Global.isDefined(o)) {
			o.style.display = "none";
		}
	}


/*
DHTML methods
*/

function createAnchor(id, href, className, value) {
	var a = createElement("a", id, className, value);
	a.href= href;
	return a;
}
function addAction(obj, action, handler) {
	obj[action] = function(){eval(handler)};
}

function createImage(id, className, src, align) {
	var img = createElement("img", id, className, "");
	img.src = src;
	img.border = 10;
	if (align != "") {
		img.align = align;
	}
	return img;
}

function createDiv(id, className, value) {
	return createElement("div", id, className, value);
}
function createElement(name, id, className, value) {
	var el = document.createElement(name.toUpperCase());
	if ((id != undefined) && (id != "")) {
		el.id = id;
	}
	if ((className != undefined) && (className != "")) {
		el.className = className;
	}
	if ((value != undefined) && (value != "")) {
		el.innerHTML = value;
		/* createTextNode shows encoded chars
		var elContent = document.createTextNode(value);
		el.appendChild(elContent);
		*/
	}
	return el;
}







/*
REMOVE methods below
*/


	function getLeft(o) {
		var d = document;
		var x = o.offsetLeft;
		while( o.tagName != "BODY" ) {
			if ( o.offsetParent ) {
				if ( o.tagName != "TR" ) {
					o = o.offsetParent;
					x += o.offsetLeft;
				}
			} else return x;
		}
    	return x;
	}

	function getTop(o) {
		var y = o.offsetTop;
		while( o.tagName != "BODY" ){
			if ( o.offsetParent ) {
				if ( o.tagName != "TR" ) {
					o = o.offsetParent;
					y += o.offsetTop;
				}
			} else return y;
		}
		return y;
	}

	function getChild (o,n){
	  var c = 0;
  		for(var i=0;i<o.childNodes.length;i++){
   	if(o.childNodes[i].tagName){
    if(c==n) return o.childNodes[i];
    c++;
   }
  }
  return null;
 }
 
	function tplReplace(str,id,href,onclick,src,title,drag_id){
		if(!id) id="";
		if(!href) href="";
		if(!src) src="";
		if(!onclick) onclick="";
		if(!title) title="";
		if(!drag_id) drag_id="";
		
		return str.replace("{id}",id).replace("{title}",title).replace("{imgsrc}",src).replace("{onclick}",onclick).replace("{href}",href).replace("{drag_id}",drag_id);	
	}
	
	if(arguments.length) this.create(arguments);

	function addSubMenuItem2(title,href,onclick,src,isSeparated){
		var viewId = this.portletLabel + "_" + this.viewRightMenuSuffix;
	    var viewItem = document.getElementById(viewId);
		if (!viewItem){
			this.addMenuItem("View","","",true,true);}
		var tpl = isSeparated?this.template.subMenuItemWithSeparator:this.template.subMenuItem;
		this.leftmenu.innerHTML += tplReplace(tpl,"",href,onclick,src,title);
	}
	this.addSubMenuItem2 = addSubMenuItem2;


	function showTitlebar2(){
		// adding btn
		var portletId = this.portletLabel + "_" + this.portletIdSuffix;
		this.portlet = document.getElementById(portletId);
		var menuBtnId = this.portletLabel + "_" + this.menuBtnIdSuffix;
		this.statMenuBtn  = document.getElementById(menuBtnId);
		this.setHandlers();
	}
	this.showTitlebar2 = showTitlebar2;

	function setHandlers(){
		var constr = this;
//		this.statMenuBtn.onmouseover = function(){constr.showTitleBar()};
		attachEvent(document,"click",function(e){constr.documentClick(e)});
		if (Global.isDefined(this.barMenuBtn)) {
			this.barMenuBtn.onclick = function(){constr.openMainMenu();return false};
		}
	}
	this.setHandlers = setHandlers;


	function showTitleBar2(){
		var b = this.statMenuBtn;
		var x = getLeft(b.parentNode);
		var y = getTop(b)-3;
		this.titlebar.style.top = y + "px";
		this.titlebar.style.left = x + "px";
		show(this.dragbar);
	}
	this.showTitleBar2 = showTitleBar2;

	
	function openLeftMenu2(){
		show(this.leftmenu);
		this.menuOpen = true;
	}
	this.openLeftMenu2 = openLeftMenu2;

	function resetState2(){
		hide(this.leftmenu);
//		hide(this.mainmenu);
		hideMenu(this);
		this.barMenuBtn.src=this.btnSrcOff;
		this.menuOpen = false;
	}
	this.resetState2 = resetState2;

}

	function setHoverClass(el, hoverClassName){
		el.className = el.className + " " + hoverClassName;
	}

	function unSetHoverClass(el, hoverClassName){
		el.className = el.className.replace(hoverClassName, "");
	}
/** 
 * itemtitlebar.js 
 * @author ssingh
 * */	
function JSItemTitleBar(){
	this.template = TitlebarTemplate;
	this.activeClass = "itemTitlebar hilite";
	this.notActiveClass = "itemTitlebar";
	//this.portletLabel = "";
	this.itemContainer = null;
	//this.itemContainerIdSuffix = "items";
	this.previousSelected = null;
   this.hasButtons = false;
	
	function create(args){
		//this.portletLabel = args[0];
		var contId = args[0];//this.portletLabel + "_" + this.itemContainerIdSuffix;
		this.itemContainer = document.getElementById(contId);
		this.addItemTitlebar();
		this.setHandlers();
	}
	this.create = create;

	function addButton(href,onclick,src){
		var span = this.itemContainer.getElementsByTagName("SPAN")[0];
		span.innerHTML += this.template.itemTitlebarButton.replace("{href}",href).replace("{onclick}",onclick).replace("{imgsrc}",src);
  		this.hasButtons = true;
		//this.setHandlers()
	}
	this.addButton = addButton;
	
	function addItemTitlebar(){
		var ic = this.itemContainer;
		ic.innerHTML += this.template.itemTitlebar;
		ic.insertBefore(ic.lastChild,ic.firstChild);
	}
	this.addItemTitlebar = addItemTitlebar;
	
	function setHandlers(){
		var constr = this;
		this.itemContainer.onmouseover = function(){constr.setActive(this,true)};
		this.itemContainer.onmouseout = function(){constr.setActive(this,false)};
	}
	this.setHandlers = setHandlers;
	
	function setActive(item,f){
		if(f) this.activate(item);
		else this.deactivate(this.previousSelected);
	}
	this.setActive = setActive;

	function activate(item){
		if(!item) return;
		if (this.hasButtons) {
		    item.className = this.activeClass;
		    switchEditButtons(item,true);
		    this.previousSelected = item;
		}
	}
	this.activate = activate;
	
	function deactivate(item){
		if(!item) return;
		item.className = this.notActiveClass;
		switchEditButtons(item,false);
	}
	this.deactivate = deactivate;
	
	function switchEditButtons(item,f){
		var span = item.getElementsByTagName("SPAN");
		if(!span.length) return;
		span = span[0];
		span.style.display = f?"block":"none";
	}
	
	function getChildren(o){
		var res = [];
		var ch = o.childNodes;
		for(var i=0;i<ch.length;i++){
			if(ch[i].tagName && ch[i].tagName=="DIV") res[res.length] = ch[i];
		}
		return res;
	}

	if(arguments.length) this.create(arguments);
}
/**
 * Begin :- titlebar-template .js 
 * @author ssingh
 */
function JSTitlebarTemplate(){
	this.titleBar = '<div id="{id}" style="display:none" class="moveContent">' +
					'<div class="movePortlet"><a href="#" title=""><img src="{imgsrc}" alt="" /></a></div>' +
					'<ul style="display:none">' +
					'</ul>' +
					'<ul style="display:none" class="view">' +
					'</ul>' +
					'</div>';

	this.titleBarBtn = '<a id="{id}" class="menuOpenBtn" style="float:right" href="#" title=""><img src="{imgsrc}" alt="" /></a>';
	this.menuTitle = '<li class="title">{title}</li>';
	this.menuItem = '<li><a href="{href}" title="" onclick="{onclick}" ><img src="{imgsrc}" alt="" />{title}</a></li>';
	this.menuViewItem = '<li><a id="{id}" href="{href}" title=""><img src="{imgsrc}" alt="" />{title}</a></li>';
	this.subMenuItemWithSeparator = '<li class="line"><a href="{href}" title=""><img src="{imgsrc}" alt="" />{title}</a></li>';
	this.subMenuItem = '<li><a href="{href}" title="" onclick="{onclick}" ><img src="{imgsrc}" alt=""/>{title}</a></li>';
	
	this.itemTitlebar = '<span class="editItem" style="display:none"></span>';
	this.itemTitlebarButton = '<a href="{href}" title="" onclick="{onclick}" ><img  style="position:relevant" src="{imgsrc}" alt=""/></a>';
}
TitlebarTemplate = new JSTitlebarTemplate();
	/* IE6 iframe-over-select hack */