Layouter = function(){
    var dialog;
	var feedView = null;
	var spanEl;
    return {
        init : function(){
		
                dialog = new Ext.BorderLayout(document.body, {
                        modal:true,
                        shadow:true,
                        west: GENERAL_SETTINGS.PANELS_CONFIG.west,
	                    center: GENERAL_SETTINGS.PANELS_CONFIG.center
                   }
                );

				Layouter.dialog = dialog;
							
				var menuContTable = document.createElement("table");
				menuContTable.cellPadding = "0px";
				menuContTable.cellSpacing = "0px";
				menuContTable.width = "100%";
				menuContTable.style.height = "25px";
				var menuContTbody = document.createElement("tbody");				
				var menuContTr = document.createElement("tr");
				var menuContTd = document.createElement("td");
				var rightTd = document.createElement("td");
								
				menuContTable.appendChild(menuContTbody);
				menuContTbody.appendChild(menuContTr);
				menuContTr.appendChild(menuContTd);
				menuContTr.appendChild(rightTd);
				
				
				menuContTd.id = "menuContainer";				
				rightTd.id = "toolbarRightContainer";				
				menuContTable.className = "menuBackground";
						
				dialog.beginUpdate();
				var titleStr = '<input id="hideTabsImg" type="checkbox" style="z-index:9999;"/>'+
							   '<span id="fullScreen" style="padding-left:5px; vertical-align:top; ">'+Framework.Lang.fullScreen+'</span>';
                dialog.add('west', new Ext.ContentPanel('nav', {title: titleStr, closable: false, fitToFrame: true}));

				var feed = new Ext.ContentPanel('feedView', {title: 'feedView', closable: true});
				dialog.add('center', feed);
				var size = TABS_CONFIG.length;

				Layouter.newScrollLeftButton();
				var firstTabId = null;
				$("monitorPageContainer").style.visibility="visible";
				for( var id in TABS_CONFIG )
				{
					if( typeof(TABS_CONFIG[id]) == "function" )continue;
					this.addNewTab( TABS_CONFIG[id] );
					if (firstTabId == null) firstTabId = "tab_"+id;
				}

				Layouter.newRightButtons();

				dialog.getRegion('center').hidePanel('feedView');

				spanEl = document.createElement("DIV");
				spanEl.className = "collapseExpand";
				spanEl.setAttribute("mod", "hide");
				spanEl.title = Framework.Lang.collapse_expand;
				spanEl.className = "collExpshow";
				var tabTable = dialog.getRegion('center').getTabs().el.dom.firstChild.firstChild;
				tabTable.firstChild.style.paddingLeft = "0px";
				tabTable.insertBefore(spanEl, tabTable.firstChild);
				Ext.EventManager.addListener( spanEl, "click",Layouter.collapseExpand);

				tabTable.insertBefore(menuContTable, tabTable.firstChild);
				dialog.endUpdate();


				dialog.getRegion('west').addListener("collapsed", Controller.splitterMoved);
				dialog.getRegion('west').addListener("expanded", Controller.splitterMoved);


				var splitBar = dialog.getRegion('west').getSplitBar();
				splitBar.setAdapter(new Ext.SplitBar.AbsoluteLayoutAdapter("container"));


				activeTabId = "tab_"+getCookie("activeTabId");
				if ( dialog.getRegion('center').getTabs().getTab(activeTabId) )
					 dialog.getRegion('center').getTabs().getTab(activeTabId).activate();
				else if(dialog.getRegion('center').getTabs().getTab(firstTabId))
					 dialog.getRegion('center').getTabs().getTab(firstTabId).activate();

				var checkbox = $("hideTabsImg");
				checkbox.checked = (getCookie("fullScreen") == "hide") ? true : false;
				checkbox.setAttribute("mod", (checkbox.checked) ? "hide" : "show");
				changeFormStyle(checkbox.parentNode, false, false, false, true);
				$("fullScreen").previousSibling.style.marginLeft="7px";
				checkbox.onchange = function()
				{
					var mod = this.getAttribute("mod");
					setCookie("fullScreen", (this.checked) ? "hide" : "show", 30);

					switch(mod)
					{
						case "hide" :
						{
							this.setAttribute("mod", "show");
							spanEl.parentNode.style.display="none";
							$("newTabSpan").style.display="none";
							break;
						}
						case "show" :
						{
							this.setAttribute("mod", "hide");
							if(Browser.isIE){
								var tabs = dialog.getRegion("center").getTabs();
								var items = tabs.items;

								var tds = spanEl.parentNode.getElementsByTagName("TD");
								for(var  i = 3; i < tds.length; i++){
									if(tds[i].style.display)tds[i].style.display = "block";
									if(items[i]) items[i].hidden = false;

								}
								tabs.unhideTab("feedView");
								tabs.hideTab("feedView");
								firstTime = false;

							}
							spanEl.parentNode.style.display="block";
							$("newTabSpan").style.display="block";
							break;
						}

					}
					if(Browser.isIE){Layouter.carouselTabs();}
					if (mod == "hide") dialog.getRegion('west').collapse();
					if (mod == "show") dialog.getRegion('west').expand();
					this.changeValue(mod == "hide" ? true : false);
				}

				var firstTime = true;
				checkbox.onchange();


        },

		request_signOut: function(){
			var data = "type=signOut&id="+User.userId;
			Request.sendPOST(Framework.userURL+'?nocache='+Math.random(), data, Layouter.process_signOut);
		},

		process_signOut: function(response){
			var rootNode = response.responseXML.documentElement;
			if(rootNode.firstChild.nodeValue == "ok"){
				deleteCookie("activeTabId");
				deleteCookie("fullScreen");
				deleteCookie("menuWidth");
				deleteCookie("expandcollapse");
				window.location.href = "seo_home.jsp";
			} else {
				alert("Failed to sign out, try again.");
			}
		},

        getLeftTabs : function()
		{
			var center = dialog.getRegion('center');
			var tabs = center.getTabs();
			var activeTabId = tabs.getActiveTab().id;

			var wd = Layouter.getCorrectMaxWidth();

			for( var i=tabs.items.length - 1; i>=0 ; i-- )
			{
				if( tabs.items[i].hidden )
					continue;

				if( !tabs.items[1].hidden )
				{
					var previous = Layouter.getPreviousTab( activeTabId );
					if( previous.id == "feedView" )return;

					return;
				}

				if( activeTabId == tabs.items[i].id  )
				{
				}

				tabs.hideTab( tabs.items[i].id );

				for( var j=i-1; j>= 0; j--)
					if( !tabs.items[j].hidden )
						continue;
					else
						break;

				tabs.unhideTab( tabs.items[j].id );

				var cur_width = Layouter.getCurrentTabsWidth();
				if( cur_width  >= wd )
				{
					tabs.hideTab( tabs.items[i-1].id );
		       	}
				break;
			}

			$("tabsCarousel_left").style.visibility   = ( Layouter.isTopLeftHidden() )?"visible":"hidden";
			$("tabsCarousel_right").style.visibility  = ( Layouter.isTopRightHidden() )?"visible":"hidden";
        },


        getRightTabs : function(){
			var center = dialog.getRegion('center');
			var tabs = center.getTabs();
			var activeTabId = tabs.getActiveTab().id;

			var wd = Layouter.getCorrectMaxWidth();

			for( var i=1; i< tabs.items.length - 1; i++ )
			{
				if( tabs.items[i].hidden )
					continue;

				if( !tabs.items[tabs.items.length - 1].hidden )
				{
					var next = Layouter.getNextTab( activeTabId );
					return;
				}



				tabs.hideTab( tabs.items[i].id );

				for( var j=i+1; j< tabs.items.length - 1; j++)
					if( !tabs.items[j].hidden )
						continue;
					else
						break;
				tabs.unhideTab( tabs.items[j].id );

				var cur_width = Layouter.getCurrentTabsWidth();
				if( cur_width  >= wd )
				{
					tabs.hideTab( tabs.items[i-1].id );
		       	}

				break;
			}

			$("tabsCarousel_left").style.visibility   = ( Layouter.isTopLeftHidden() )?"visible":"hidden";
			$("tabsCarousel_right").style.visibility  = ( Layouter.isTopRightHidden() )?"visible":"hidden";

         },


		getPreviousTab: function( tabId )
		{
			var tabs = dialog.getRegion("center").getTabs();
			for( var i=0; i<tabs.items.length; i++ )
			{
				if( tabs.items[i].id == tabId )
				{
					if( i == 0 )return tabs.items[i];
					else return tabs.items[i-1];
				}
			}
		},

		getNextTab: function( tabId )
		{
			var tabs = dialog.getRegion("center").getTabs();
			for( var i=0; i<tabs.items.length; i++ )
			{
				if( tabs.items[i].id == tabId )
				{
					if( i == tabs.items.length -1 )return tabs.items[i];
					else return tabs.items[i+1];
				}
			}
		},
		collapseExpand : function(){
			var mod  = spanEl.getAttribute("mod");
			(mod=="hide") ? spanEl.setAttribute("mod","show") : spanEl.setAttribute("mod","hide");
			spanEl.className = "collExp" + mod;
			PortletLoader.collapseExpandAll(mod);
		},

		deletePage: function(id){
        	dialog.remove('center','tab_'+id);
        	dialog.endUpdate();
        },


        tabClosed: function(ev){
        	var id = this.id.substring(6);
            if(confirm(Framework.Lang.Tabs.TabConfirm)){
				var args = new Object();
				args.id = id;

				var items = dialog.getRegion('center').getTabs().items;
				if(items.length <= 2) alert("You cann't delete all tabs.");
				else 	PortletLoader.saveUserData("deletePage", id, Layouter.completeTabClosed, args)

			}

        },
		completeTabClosed: function(args){
			var wd = Layouter.getCorrectMaxWidth();

				var id = args.id;
				Layouter.deletePage(id);
				Layouter.carouselTabs(true);

				var tabs = dialog.getRegion('center').getTabs();
				var items = tabs.items;
				var activeTabId = Layouter.getActiveTabId();
				if(items.length <= 2){
					var tab =  tabs.getTab("tab_"+activeTabId);
					var el = $(tab.textEl.dom.id).parentNode;
					el.childNodes[el.childNodes.length - 2].style.visibility = "hidden";
				}


				for( var i=1; i<items.length; i++ )
				{
					if( "tab_" + activeTabId != items[i].id )continue;
					else break;
				}

				for( var j=i; j<items.length; j++ )
				{
					if( !items[j].hidden )continue;
					else
					{
						var cur_width = Layouter.getCurrentTabsWidth();
						if( cur_width <= wd )
						{
							tabs.unhideTab( items[j].id);
							cur_width = Layouter.getCurrentTabsWidth();
							if( cur_width > wd )
							{
								tabs.hideTab( items[j].id);
								break;
							}
						}
					}
				}

				for( var j=i; j>=1; j-- )
				{
					if( !items[j].hidden )continue;
					else
					{
						var cur_width = Layouter.getCurrentTabsWidth();
						if( cur_width <= wd )
						{
							tabs.unhideTab( items[j].id);
							cur_width = Layouter.getCurrentTabsWidth();
							if( cur_width > wd )
							{
								tabs.hideTab( items[j].id);
								break;
							}
						}

					}
				}

				$("tabsCarousel_left").style.visibility   = ( Layouter.isTopLeftHidden() )?"visible":"hidden";
				$("tabsCarousel_right").style.visibility  = ( Layouter.isTopRightHidden() )?"visible":"hidden";

		},

		newScrollLeftButton: function()
		{
			var items = dialog.getRegion('center').getTabs().items;
			var firstTabId = items[0].el.id;
			var tr = $(firstTabId).parentNode.parentNode;

			tr.parentNode.parentNode.style.overflowX = "hidden";

			var td = document.createElement("td");
			td.setAttribute("width", "30px");
			td.innerHTML = "<a href='javascript:void(0)' class='tab_carousel' id='tabsCarousel_left'></a>";
			tr.appendChild(td);
			//YAHOO.util.Event.addListener( tr.lastChild , "click", Layouter.getLeftTabs);
			Ext.EventManager.addListener(tr.lastChild, "click",Layouter.getLeftTabs);
		},

		TABS_MAX_LENGTH: 530,

		newRightButtons: function()
		{
			var items = dialog.getRegion('center').getTabs().items;
			var lastTabId = items[items.length - 1].el.id;
			var tr = $(lastTabId).parentNode.parentNode;

			var cur_width = Layouter.getCurrentTabsWidth();
			var wd = Layouter.getCorrectMaxWidth();

			if( wd-cur_width <= 0)
			{
				Layouter.carouselTabs();
				cur_width = Layouter.getCurrentTabsWidth();
			}
			var td = document.createElement("td");
			td.setAttribute("width", "80px");
			td.innerHTML = "<span id='newTabSpan' unselectable='on' class='new-tab-button'>"+Framework.Lang.Tabs.NewTab+"</span>";
			tr.appendChild(td);

			Ext.EventManager.addListener(tr.lastChild, "click",Layouter.createNewTab);

			var td = document.createElement("td");
			td.width = "30px";
			var wd = Layouter.getCorrectMaxWidth();
			var top = 0;
			if(Browser.isFirefox){
				top = 27;
			}
			td.innerHTML = "<a href='javascript:void(0)' class='tab_carousel' style='position:absolute;left: "+ (110+wd) +"px;top:"+top+"px' id='tabsCarousel_right'></a>";
			tr.appendChild(td);

			$("tabsCarousel_left").style.visibility   = ( Layouter.isTopLeftHidden() )?"visible":"hidden";
			$("tabsCarousel_right").style.visibility  = ( Layouter.isTopRightHidden() )?"visible":"hidden";

			Ext.EventManager.addListener(tr.lastChild, "click",Layouter.getRightTabs);
		},


		newTabButton: function(){
			return;
			var items = dialog.getRegion('center').getTabs().items;
			var lastTabId = items[items.length - 1].el.id;
			var tr = $(lastTabId).parentNode.parentNode;

			var td = document.createElement("td");
			td.innerHTML = "<span id='newTabSpan' unselectable='on' class='new-tab-button'>"+Framework.Lang.Tabs.NewTab+"</span>";
			tr.appendChild(td);

			//YAHOO.util.Event.addListener( tr.lastChild , "click", Layouter.createNewTab);
			Ext.EventManager.addListener(tr.lastChild, "click",Layouter.createNewTab);

		},
		oldText:"",
		tabEdited: function(ev){
			var items = dialog.getRegion('center').getTabs().items;
			var tab = dialog.getRegion('center').getTabs().items[parseInt(Layouter.getActiveTabId())];
			var tabId = 0;
			for(var i = 0; i< items.length; i++){
				if(items[i].id.substring(4) == parseInt(Layouter.getActiveTabId()))
					{tabId = i; tab = dialog.getRegion('center').getTabs().items[i];break;}
			}
			var el = $(tab.textEl.dom.id);
			var inner = '<input  width ="'+(tab.getText().length*7)+'" size="'+(tab.getText().length-3)+'" type = "text" maxLength = "20" value = "'+
			tab.getText()+'"  class="'+tab.textEl.dom.className+'"  onBlur="Layouter.editComplete()"  style="height:12px;margin-left:0px;border:1px dashed #6593CF;"/>'; //background:transparent;

			Layouter.oldText = tab.getText();
			el.innerHTML = inner;
			try{
				el.firstChild.focus();
				el.firstChild.select();
			}catch(ex){}
			

			var k = new Ext.KeyMap(el, { key:13,  fn:Layouter.editCompleteEnter, scope:el,   correctScope:true } );
	   		 k.enable();
 		//	var k = new YAHOO.util.KeyListener(el, { keys:13 },{ fn:Layouter.editComplete, scope:el,   correctScope:true } );


		},
		countForEnter:false,
		editCompleteEnter:function(){
			if(Layouter.countForEnter)return;
			Layouter.editComplete();
			Layouter.countForEnter = true;
			setTimeout( "Layouter.countForEnterSetFalse()", 500 );
			return false;
		},
		countForEnterSetFalse:function(){
			Layouter.countForEnter = false;
		},
		editComplete:function(){

			var items = dialog.getRegion('center').getTabs().items;
			var tabId = parseInt(Layouter.getActiveTabId());
			var tab = dialog.getRegion('center').getTabs().items[tabId];

			for(var i = 0; i< items.length; i++){
				if(items[i].id.substring(4) == tabId)
					{tab = dialog.getRegion('center').getTabs().items[i];break;}
			}
			var el = $(tab.textEl.dom.id);
			var text;
			try{
				text= el.firstChild.value.trim();
			}catch(ex){text= Layouter.oldText;}

			if(text == "")
					text = Layouter.oldText;
			var args = new Object();
			args.id = tabId;
			args.title = text;
			args.tab = tab;
			args.el = el;
			if(text == Layouter.oldText){
				Layouter.completeEditTab(args);
			}else{
				PortletLoader.saveUserData("renamePage", args, Layouter.completeEditTab, args);
			}
			return false;

		},

		completeEditTab:function(args){
			var title = args.title;
			args.el.innerHTML = "";
			args.tab.setText(title);
			TABS_CONFIG[args.id].title = title;
			Layouter.carouselTabs();
		},

		carouselTabs: function()
		{
			if( dialog == null )return;

			var tabs = dialog.getRegion("center").getTabs();
			var items = tabs.items;
			var firstTabId = items[0].el.id;
			var table = $(firstTabId).parentNode.parentNode.parentNode.parentNode;

			var table_width = table.offsetWidth;

			var div  = table.parentNode.parentNode;

			var cur_width = Layouter.getCurrentTabsWidth();

			wd = Layouter.getCorrectMaxWidth();

			if( cur_width  >= wd )
			{
				for( var i=1; i<items.length; i++ )
				{
					cur_width = Layouter.getCurrentTabsWidth();
					if( cur_width  >= wd )
						tabs.hideTab( items[i].id );
					else
					{
						break;
					}
				}

			}
			else
			{
				for(var i=items.length-1; i>=1; i--  )
				{
					if( items[i] == null || items[i].isHidden() )continue;
					else break;
				}

				for( var j=i; j<items.length; j++ )
				{
					if( !items[j].hidden )continue;
					else
					{
						var cur_width = Layouter.getCurrentTabsWidth();
						if( cur_width <= wd )
						{
							tabs.unhideTab( items[j].id);
							cur_width = Layouter.getCurrentTabsWidth();
							if( cur_width > wd )
							{
								tabs.hideTab( items[j].id);
								break;
							}
						}
					}
				}

				for( var j=i; j>=1; j-- )
				{
					if( !items[j].hidden )continue;
					else
					{
						var cur_width = Layouter.getCurrentTabsWidth();
						if( cur_width <= wd )
						{
							tabs.unhideTab( items[j].id);
							cur_width = Layouter.getCurrentTabsWidth();
							if( cur_width > wd )
							{
								tabs.hideTab( items[j].id);
								break;
							}
						}

					}
				}
			}
			try{
			$("tabsCarousel_left").style.visibility   = ( Layouter.isTopLeftHidden() )?"visible":"hidden";
			$("tabsCarousel_right").style.visibility  = ( Layouter.isTopRightHidden() )?"visible":"hidden";

			//$("tabsCarousel_right").style.left = (110+wd)+"px";

			}catch(ex){}
		},

		getCorrectMaxWidth: function()
		{
			var tabs = dialog.getRegion("center").getTabs();
			var items = tabs.items;
			var firstTabId = items[0].el.id;
			var table = $(firstTabId).parentNode.parentNode.parentNode.parentNode;

			return ((table.parentNode.offsetWidth-140)<Layouter.TABS_MAX_LENGTH)? (table.parentNode.offsetWidth-140): Layouter.TABS_MAX_LENGTH;
		},

		isTopLeftHidden: function()
		{
			var tabs = dialog.getRegion("center").getTabs();
			var items = tabs.items;
			if( items == null || items[1] == null)return false;
			return items[1].hidden;
		},

		isTopRightHidden: function()
		{
			var tabs = dialog.getRegion("center").getTabs();
			var items = tabs.items;
			if( items == null )return false;
			return items[items.length-1].hidden;
		},

		getCurrentTabsWidth: function()
		{
			var items = dialog.getRegion('center').getTabs().items;
			var cur_width = 0;
			for( var i=1; i<items.length; i++ )
				cur_width += items[i].el.dom.parentNode.offsetWidth;
			return cur_width;
		},

		activateTabs: function()
		{
			var items = dialog.getRegion('center').getTabs().items;
			for( var i=1; i<items.length; i++ )
			{
				var em = items[i].textEl.dom.parentNode;
				em.setAttribute("tabId", items[i].id );
				//YAHOO.util.Event.addListener( em.parentNode.parentNode, "mouseover", Layouter.activateTab, items[i].id);
				Ext.EventManager.addListener(em.parentNode.parentNode, "mouseover",Layouter.activateTab, items[i].id);
			}
		},
		activateTab: function(evt, em){
			dialog.getRegion('center').showPanel(em.getAttribute("tabId"));
		},
		disactivateTabs: function(){
			var items = dialog.getRegion('center').getTabs().items;
			for( var i=1; i<items.length; i++ )
			{
				var em = items[i].textEl.dom.parentNode;
				//YAHOO.util.Event.removeListener( em.parentNode.parentNode, "mouseover", Layouter.func, items[i].id);

				try{
				Ext.EventManager.removeListener(em.parentNode.parentNode, "mouseover",Layouter.activateTab, items[i].id);
				}catch(ex){}
			}
		},
		getActiveTabId: function(){
			var activeTab = Layouter.getActiveTab();
			return (activeTab==null)?null:(activeTab.getId().substring(4));
		},

		getActiveTab: function(){
			if( dialog == null  )return;
			var tab = dialog.getRegion('center').getActivePanel();
			return tab;
		},

		createNewTab : function (){
			var items = dialog.getRegion('center').getTabs().items;
			var titleNumber = items.length-1;

			var lastTabId = 0;
			var lastEl = items[items.length - 2].el.id;
			for(var i =0; i < items.length; i++){
				if(parseInt(items[i].id.substring(4)) >  lastTabId ){
					lastTabId = parseInt(items[i].id.substring(4));
					lastEl = items[i].el.id;
					var title  = items[i].text;

					if(title.substring(0,4) == "Page"){
						var num = parseInt(title.substring(5));
						if(num > titleNumber)
							titleNumber = num;
					}
				}
			}

			var id = lastTabId + 1;
			var args = new Object();
			args.title = "Page "+ (titleNumber+1);

			PortletLoader.saveUserData("addPage", args.title, Layouter.completeCreateTab, args);

		},
		completeCreateTab: function(args,resultArgs){
			if(resultArgs.id)
			{
				if( TABS_CONFIG[ resultArgs.id ] != null )return;
				var newId = resultArgs.id;
				var items = dialog.getRegion('center').getTabs().items;
				var lastEl = items[0].el.id;
				var tr = $(lastEl).parentNode.parentNode;
				tr.removeChild(tr.lastChild);
				tr.removeChild(tr.lastChild);

				Layouter.addNewTab( {id: newId, title: args.title,colCount:GENERAL_SETTINGS.DEFAULT_COLUMNS_COUNT} );
					TABS_CONFIG[newId]= {id:newId,title: args.title,colCount:GENERAL_SETTINGS.DEFAULT_COLUMNS_COUNT};

				Layouter.newRightButtons();
				dialog.getRegion('center').getTabs().items[items.length - 1].activate();
				Layouter.whenActivate();
				Layouter.carouselTabs();
				Layouter.showTopRight();
			}

		},

		showTopRight: function()
		{
			var tabs = dialog.getRegion('center').getTabs()
			var items = tabs.items;

			items[ items.length -1 ].activate();

			for( var i=items.length -1; i>=1; i-- )
				tabs.unhideTab( items[i].id);

			var wd = Layouter.getCorrectMaxWidth();

			for( var i=1; i<items.length; i++ )
			{
				cur_width = Layouter.getCurrentTabsWidth();
				if( cur_width > wd )
					tabs.hideTab( items[i].id);
				else
				{
					break;
				}
			}
			$("tabsCarousel_left").style.visibility   = ( Layouter.isTopLeftHidden() )?"visible":"hidden";

		},

		showTopLeft: function()
		{
			var tabs = dialog.getRegion('center').getTabs()
			var items = tabs.items;

			tabs.hideTab( items[0].id);

			if( items[ 1 ] == null )return;

			items[ 1 ].activate();

			for( var i=1; i<items.length; i++ )
				tabs.unhideTab( items[i].id);

			var wd = Layouter.getCorrectMaxWidth();

			for( var i=items.length-1; i>=0; i-- )
			{
				cur_width = Layouter.getCurrentTabsWidth();
				if( cur_width > wd )
					tabs.hideTab( items[i].id);
				else
				{
					break;
				}
			}
			$("tabsCarousel_right").style.visibility  = ( Layouter.isTopRightHidden() )?"visible":"hidden";

		},

		openTabOptions : function(){

			if($("tabOptionsContainer")){
				Layouter.closeTabOption();
				return;
			}
			var tabId = Layouter.getActiveTabId();
			var tab =  dialog.getRegion('center').getTabs().getTab("tab_"+tabId);

			var x = parseInt(tab.textEl.getX())- 10;
			var y = parseInt(findPosY($("expand_tab_options_"+tabId))) + 52;
			var div = document.createElement("div");
			div.id = "tabOptionsContainer";
			div.className="tab-option";
			div.style.left = x + "px";
			div.style.top = y + "px";
			div.style.height = "100px";
   			div.style.width = "160px";

			var table="<table cellspacing='0' cellpadding ='0' width='100%'	height='100%'	id='tabOptionTable'  ><tbody >"+
			"<tr class='tab-option-header'><td ><span class='tab-option-header-text' >"+Framework.Lang.Tabs.TabOptionsTitle+"</span> <span class='tab-option-close' onclick='Layouter.closeTabOption();'> </span></td></tr>";

			var columnNumber = TABS_CONFIG[tabId].colCount;
			table += "<tr ><td valign = 'top' style='height:20px;'><a class='tab-option-item' onclick='Layouter.tabEdited()'><span style='margin-left:16px;'>"+Framework.Lang.Tabs.TabOptionsChangeTitle+"</span></a></td></tr>";
			table += "<tr ><td valign = 'top'  style='height:20px;'><a class='tab-option-item tab-option-item-parent'  onclick='Layouter.expandColumnNumber()' ><span style='margin-left:16px;'>"+Framework.Lang.Tabs.TabOptionsNumberOfColumns+"</span></a></td></tr>";

			table += "<tr><td align='center' valign = 'top' ><div id='tabOptionNumCount'  align='center' style='display:none;width:100%;height:18px;' >";
			for( var i = 1; i <( GENERAL_SETTINGS.LAYOUT_MAX_COLUMNS_COUNT+1); i++ ){
			var classs = "tab-option-item ";
				if(columnNumber == i)
					classs += " tab-option-item-child-on";
				else
					classs += " tab-option-item-child";

				table += "<span align='center' class='"+classs+"' value='"+i+"' onclick='Layouter.changeNumberOfColumns("+i+")'>"+i+"</span>";
			}


			table+= "</div></td></tr>";
			table += "<tr height='18px'><td align='center'><table><tbody><tr><td align='right'><div class = 'tab-option-arrow-left' onclick='Layouter.changeTabFromOptions(\"left\")'></div></td>"+
					"<td ><div class = 'tab-option-arrow-right' onclick='Layouter.changeTabFromOptions(\"right\")' ></div></td></tr></tbody></table>"+
					"</td></tr>";
			table += "</tbody></table>";
			div.innerHTML = table;

			if(OS.isMac|| (Browser.isFirefox && OS.isLinux)) Layouter.hideCharts();
			document.body.appendChild(div);
			},
		closeTabOption: function(){
			document.body.removeChild($("tabOptionsContainer"));
			if(OS.isMac || (Browser.isFirefox && OS.isLinux)) Layouter.showCharts();

		},
		expandTabSharingOptions: function(){
			var aHref = $("tabOptionsContainer").getElementsByTagName("a");
			var h = parseInt($("tabOptionSharing").style.height);

			var target = $("tabOptionSharing");
			if(target.style.display == "none"){
				aHref[2].className = "tab-option-item tab-option-item-parent-open";
				target.style.display = "block";
				$("tabOptionsContainer").style.height = (parseInt($("tabOptionsContainer").style.height) + h) + "px";
			}else{
				aHref[2].className = "tab-option-item tab-option-item-parent";
				target.style.display = "none";
				$("tabOptionsContainer").style.height =( parseInt($("tabOptionsContainer").style.height) - h) + "px";

			}

		},
		shareTab: function(){
			var tabId = Layouter.getActiveTabId();

			var h = parseInt($("tabOptionSharing").style.height);
			var sharingTags = $("tabSharingTags").value;
			var sharingDesc = $("tabSharingDesc").value;

			PortletLoader.saveUserData( "share", null, Layouter.complete_shareTab, {tabId:tabId, tags:sharingTags, descr:sharingDesc} );

			var aHref = $("tabOptionsContainer").getElementsByTagName("a");
			aHref[2].className = "tab-option-item";
			aHref[2].onclick = Layouter.unShareTab;
			aHref[2].firstChild.innerHTML = Framework.Lang.Tabs.TabUnpublish;
			$("tabOptionSharing").style.display = "none";
			$("tabOptionsContainer").style.height =( parseInt($("tabOptionsContainer").style.height) - h) + "px";

			TABS_CONFIG[tabId].isShared = true;


		},

		complete_shareTab:function(params, respArgs){

		},


		unShareTab:function() {
			var tabId = Layouter.getActiveTabId();
			TABS_CONFIG[tabId].isShared = false;

			var aHref = $("tabOptionsContainer").getElementsByTagName("a");
			aHref[2].className = "tab-option-item tab-option-item-parent";
			aHref[2].onclick = Layouter.expandTabSharingOptions;
			aHref[2].firstChild.innerHTML = Framework.Lang.Tabs.TabSharing;


			PortletLoader.saveUserData( "unshare", null, Layouter.complete_shareTab, {tabId:tabId} );

			var table = "";
			table += "<table width='100%' height='100%' ><tbody><tr><td class='tabOptionSharing' align='center'>"+Framework.Lang.Tabs.Tags+"  <span class='example'>(e.g. free;service;)</span></td></tr>";
			table += "<tr><td align='center'><input size=13 id='tabSharingTags' type = 'text' value='' class='textinput'/></td></tr>";
			table += "<tr><td class='tabOptionSharing' align='center'>"+Framework.Lang.Description+"</td></tr><tr><td><textarea cols='10'  style='width:100%' rows ='3' id='tabSharingDesc'></textarea></td></tr>";
			table += "<tr><td align='center'><a class='tab-option-item '   onclick='Layouter.shareTab()'><span >"+Framework.Lang.Tabs.TabPublish+"</span></a></td></tr>"
			table += "</tbody></table>";

			$("tabOptionSharing").innerHTML = table;
			changeFormStyle($('tabOptionSharing'),true, false, false, false, true, false);

		},


		complete_unshareTab:function(params, respArgs){
		},
		tuneModulesIssueForIE: function(tabNum){
			if(!tabNum) tabNum = Layouter.getActiveTabId();
			for( var i=0; i<PORTLETS.length; i++ ){
				if(parseInt(tabNum) == PORTLETS[i].params.tabNumber){
					var portlet = PORTLETS[i];
					if(portlet.portlet_FRAME){
						portlet.portlet_FRAME.style.position = "static";
						portlet.portlet_FRAME.style.position = "relative";
						portlet.portlet_FRAME.style.left = "0px";
						portlet.portlet_FRAME.style.top = "0px";
					}
				}
			}
		},
		expandColumnNumber: function(){
			var aHref = $("tabOptionsContainer").getElementsByTagName("a");
			var h = parseInt($("tabOptionNumCount").style.height);

			var target = $("tabOptionNumCount");
			if(target.style.display == "none"){
				aHref[1].className = "tab-option-item tab-option-item-parent-open";
				target.style.display = "block";
				$("tabOptionsContainer").style.height = (parseInt($("tabOptionsContainer").style.height) + h) + "px";
			}else{
				aHref[1].className = "tab-option-item tab-option-item-parent";
				target.style.display = "none";
				$("tabOptionsContainer").style.height =( parseInt($("tabOptionsContainer").style.height) - h) + "px";
			}

		},
		changeNumberOfColumns: function(num){
			var tabId = Layouter.getActiveTabId();
			var tab =  dialog.getRegion('center').getTabs().getTab("tab_"+tabId);
			var columnNumber = TABS_CONFIG[tabId].colCount;

			var target = $("tabOptionNumCount");
			target.childNodes[columnNumber - 1].className = "tab-option-item tab-option-item-child";
			Controller.pre_changeTabLayout(num);
			target.childNodes[num - 1].className = "tab-option-item tab-option-item-child-on";
			if(Browser.isSafari || (Browser.isFirefox && OS.isLinux)) Layouter.hideCharts();

		},
		changeTabFromOptions: function (direction){
			var tabId = parseInt(Layouter.getActiveTabId());
			var tab =  dialog.getRegion('center').getTabs().getTab("tab_"+tabId);

			var items = dialog.getRegion('center').getTabs().items;
			var lastTabId = items[items.length - 2].el.id;
			var tr = $(lastTabId).parentNode.parentNode;


			var replacedTabId = null;
			var firstEl = 1;
			var lastEl = tr.childNodes.length - 3;
			for(var i = 0; i < items.length; i++){

				if(items[i].id.substring(4) == tabId)
				{
					if(direction == "left" && i > firstEl)
					{
						if( items[i-1].isHidden()) Layouter.getLeftTabs();

						replacedTabId = items[i-1].id;

						var it = items[i];
						items[i] = items[i-1];
						items[i-1] = it;
						tr.insertBefore(tr.childNodes[firstEl+i],tr.childNodes[firstEl+i-1]);

						$("tabOptionsContainer").style.left = parseInt(tab.textEl.getX())- 10 + "px";


					}else if(direction == "right" && i < items.length - 1)
					{
						if( items[i+1].isHidden()) Layouter.getRightTabs();

						replacedTabId = items[i+1].id;

						var it = items[i];
						items[i] = items[i+1];
						items[i+1] = it;
						tr.insertBefore(tr.childNodes[firstEl+i],tr.childNodes[firstEl+i+2]);
						$("tabOptionsContainer").style.left = parseInt(tab.textEl.getX())- 10 + "px";


					}

					break;

				}
			}

			if( replacedTabId == null )return;
			replacedTabId = replacedTabId.substr(replacedTabId.indexOf("_")+1, replacedTabId.length);

			var config = [];
			if( direction == "left" )config = [tabId, replacedTabId];
			if( direction == "right" )config = [replacedTabId, tabId];


			PortletLoader.saveUserData( "tab_place", null, Layouter.complete_changeTabLayout, config );
		},

		complete_chageTabPlace: function(params, respArgs){
		},

		addNewTab : function( params )
		{
			var tabContainerId = params['id'];
			var tabsContainer = $("tabsContainer");
			var content = document.createElement("DIV");
			content.id = "tab_" + tabContainerId;
			inner = "";
			inner += "	<table id='table_"+ tabContainerId +"' class='portletcont' border='0' cellpadding='0' cellspacing='0' height='auto'>";
			inner += "	   <tr name=\"row\" valign=\"top\" >";

			var default_count = (params["colCount"] != null)?params["colCount"]:GENERAL_SETTINGS.DEFAULT_COLUMNS_COUNT;
			var wd = (100 / default_count) + "%";

			for( var i=0; i<GENERAL_SETTINGS.LAYOUT_MAX_COLUMNS_COUNT; i++ )
			{
				--default_count;
				inner += "		   <td align='center' id='"+tabContainerId+"_body"+(i+1)+"'";
				inner += " width='"+((default_count>=0)?wd:"0%")+"'";


				if(i == 0 && default_count == 0 )
					inner += "class = 'topLeftCell topRightCell' style='display:" + ((default_count<0)?"none":"") + "' ";
				else if( i == 0 )
					inner += "class = 'topLeftCell' style='display:" + ((default_count<0)?"none":"") + "' ";
				else if( default_count == 0 )
					inner += "class = 'topRightCell' style='display:" + ((default_count<0)?"none":"") + "' ";
				else
					inner += " style='display:" + ((default_count<0)?"none":"") + "' ";

				inner += "  name='row' colNum="+(i+1)+"></td>";
			}

			inner += "	   </tr>";
			inner += "	</table>";

			content.innerHTML = inner;
			tabsContainer.appendChild( content );

			var tab = new Ext.ContentPanel('tab_'+tabContainerId, {title: params['title'], closable: true, tabId : tabContainerId, fitToFrame:true});
			tab.addListener("activate", Controller.tabChanged );
			dialog.add('center', tab);

			tab =  dialog.getRegion('center').getTabs().getTab("tab_"+tabContainerId);
			var el = $(tab.textEl.dom.id);
			el.parentNode.lastChild.style.visibility ="hidden";
			Ext.EventManager.addListener(el, "click",Layouter.tabEdited);
			tab.addListener("activate", Layouter.whenActivate );
			tab.addListener("deactivate", Layouter.whenDeactivate );

			var div = document.createElement("div");
				div.className = "close-icon";
				div.style.height = "9px";
				div.style.width = "9px";
				div.unselectable = "on";
				div.id = "close_" + tabContainerId;
				div.style.visibility = "visible";
				div.title = "Close this tab";
				el.parentNode.appendChild(div);

			
			Ext.EventManager.addListener(div, "click",Layouter.tabClosed);
			div = document.createElement("span");
      			div.className = "expand-tab-options";
     			div.unselectable = "on";
      			div.style.visibility = "visible";
      			div.title = "Tab options";
      			el.parentNode.appendChild(div);
			
			Ext.EventManager.addListener(div, "click",Layouter.openTabOptions);
			dialog.endUpdate();

			var tableParent = $("table_"+ tabContainerId).parentNode;
			tableParent.style.height="100%";
			tableParent.style.overflow="auto";
			tableParent.style.overflowX="hidden";
			var items = dialog.getRegion('center').getTabs().items;
			var el = $(tab.textEl.dom.id);
			var ch =  el.parentNode;
			if(items.length <= 2)
				{ch.childNodes[ch.childNodes.length - 2].style.visibility = "hidden";}

		},
		normalizeLastTabWidth: function(){
		
			var items = dialog.getRegion('center').getTabs().items;
			var lastTab = items[items.length - 1];
			var elLast = $(lastTab.textEl.dom.id);
			if(elLast.style.width == "0px"){
				elLast.style.width =  parseInt(lastTab.textEl.valWidth) +"px";
				elLast.parentNode.style.width =  parseInt(lastTab.textEl.valWidth) + "px";
				var parentEl = elLast.parentNode.parentNode.parentNode.parentNode;
				parentEl.style.width = parseInt(parentEl.style.width) + parseInt(lastTab.textEl.valWidth) + "px";
				
			}
			
			
		},
		whenActivate: function(){
			var tabId = Layouter.getActiveTabId();
			setCookie("activeTabId", tabId, 30);
			var tab =  dialog.getRegion('center').getTabs().getTab("tab_"+tabId);
			tab.addListener("deactivate", Layouter.whenDeactivate );
			var el = $(tab.textEl.dom.id);
			//YAHOO.util.Event.addListener( el, "click", Layouter.tabEdited);
			Ext.EventManager.addListener(el, "click",Layouter.tabEdited);

			var items = dialog.getRegion('center').getTabs().items;

			var ch =  el.parentNode;
			ch.childNodes[ch.childNodes.length - 1].style.visibility = "visible";
			if(items.length > 2)
				{ch.childNodes[ch.childNodes.length - 2].style.visibility = "visible";}

			if( PORTLETS.length != 0 )
				PortletLoader.loadPortlets(false,tabId);
			Layouter.normalizeLastTabWidth();

			setTimeout( "Controller.callModulesListener( 'onTabActivate' ) ", 500 );
		},
		whenDeactivate : function()
		{
			var tabId = Layouter.getActiveTabId();
			var tab =  dialog.getRegion('center').getTabs().getTab("tab_"+tabId);
			var el = $(tab.textEl.dom.id);
			if( el.firstChild == null )return;
			if(el.firstChild.tagName && el.firstChild.tagName == 'INPUT'){
				var title = el.firstChild.value.trim() ;
				if(title == "" ) title = "&nbsp;&nbsp;&nbsp;";
				el.innerHTML = "";
				tab.setText(title);
				TABS_CONFIG[tabId].title = title;
			}
			var ch =  el.parentNode;
			ch.childNodes[ch.childNodes.length - 1].style.visibility = "hidden";
			ch.childNodes[ch.childNodes.length - 2].style.visibility = "hidden";
			if($("tabOptionsContainer")){
				document.body.removeChild($("tabOptionsContainer"));return;
			}

			//YAHOO.util.Event.removeListener( el, "click", Layouter.tabEdited);
			Ext.EventManager.removeListener(el, "click",Layouter.tabEdited);
			tab.removeListener("deactivate", Layouter.whenDeactivate );

			Controller.callModulesListener("onTabDeactivate");
		},

		hideCharts: function(){
			var embeds = document.getElementsByTagName("EMBED");
			for(var i = 0; i < embeds.length; i++){
				embeds[i].style.visibility = "hidden";
			}
		},
		showCharts: function(){
			var embeds = document.getElementsByTagName("EMBED");
			for(var i = 0; i < embeds.length; i++){
				embeds[i].style.visibility = "visible";
			}
		},
		hideChartsForMsgDialog: function(){
			var arr = ["datagrid_TagCloud","datagrid_MysWindow"];
			var embeds = document.getElementsByTagName("EMBED");
			for(var i = 0; i < embeds.length; i++){
				for(var j = 0; j < arr.length; j++){
					if(arr[j] == embeds[i].id){
						embeds[i].style.visibility = "hidden";
					}
				}
			}
		},
		showChartsForMsgDialog: function(){
			var arr = ["datagrid_TagCloud","datagrid_MysWindow"];
			var embeds = document.getElementsByTagName("EMBED");
			for(var i = 0; i < embeds.length; i++){
				for(var j = 0; j < arr.length; j++){
					if(arr[j] == embeds[i].id){
						embeds[i].style.visibility = "visible";
					}
				}
			}
			$("cloudWindowBody").style.overflow = "visible";
		},
		showFeed : function(dm, selectedInd,titl){
			Layouter.activeTab = Layouter.getActiveTabId();
				if(feedView == null){
			feedView = new Ext.BorderLayout('feedView', {
                        modal:true,
                        shadow:true,
                        west: {
							split:true,
	                        initialSize: 140,
	                        titlebar: true,
	                        collapsible: true,
	                        minSize: 200,
	                        maxSize: 200,
	                        animate: true
	                    },
	                    center: {
	                        autoScroll:false,
	                        tabPosition: 'top',
	                        closeOnTab: true,
	                        alwaysShowTabs: false
	                    },
						north: {
	                        split:false,
	                        initialSize: 20,
	                        minSize: 20,
	                        maxSize: 20,
	                        titlebar: true,
	                        collapsible: false,
	                        animate: true

	                    }

                });
				}
                feedView.beginUpdate();
                feedView.add('west', new Ext.ContentPanel('feeds', {title: 'Feeds', closable: false, fitToFrame: true}));
                feedView.add('center', new Ext.ContentPanel('centerFeed', {title: 'Feed view', closable: false, fitToFrame: true}));
				 feedView.add('north', new Ext.ContentPanel('northFeed', {title: titl, closable: true, fitToFrame: true}));

				 var feeds = $("feeds");
          		 var content="";


          		 for(var i=0;i<dm.getCount();++i)
          		 {
          		 	content+="<div class='feedItems' onmouseover='this.className=\"feedItems_over\"' onmouseout='this.className=\"feedItems\"'>" + dm.getAt(i).data.title +"</div>";//dm.getValueAt(i, 0)
          		 }
				 $("centerFeed").innerHTML = "";
				feeds.innerHTML = content;
				var myfeeds = feeds.getElementsByTagName("div");
				selectedFeed = myfeeds[0];
				for(var j=0;j<myfeeds.length;++j){
				myfeeds[j].setAttribute("index",j);
				myfeeds[j].onclick = function(){
					this.onmouseover = null;
					this.onmouseout = null;
					if (selectedFeed) selectedFeed.className = "feedItems";
					selectedFeed = this;
					this.className = "feedItems_over";
					var  ind = parseInt(this.getAttribute("index"));
				    var desc = dm.getAt(ind).data.description;
				    if(titl == "News" || titl == "Help") desc = dm.getAt(ind).data.description;
					$("centerFeed").innerHTML = desc;
				}
				if(j==selectedInd){
					myfeeds[j].onclick();
				}
				}
				dialog.beginUpdate();
				var cent = dialog.getRegion('center');

				cent.showPanel('feedView');
				cent.hidePanel('feedView');
				dialog.endUpdate();
				feedView.endUpdate();

				var el = $( feedView.getRegion('north').el.dom.id);
						var div = document.createElement("div");
						div.className = "x-layout-closenorth";//ylayout-closenorth
						div.unselectable = "on";
						div.title = "Close feed view";
						el.firstChild.firstChild.nextSibling.appendChild(div);
						//YAHOO.util.Event.addListener( div, "click", Layouter.hideFeed);
						Ext.EventManager.addListener(div, "click",Layouter.hideFeed);

		},
		hideFeed : function(){
			var cent = dialog.getRegion('center');
			cent.hidePanel('feedView');
			dialog.getRegion('west').show();
			dialog.getRegion('center').showPanel('tab_' + Layouter.activeTab);
		}
		};
}();