<public:component>
<public:attach event="oncontentready" onevent="init();" />
<public:attach event=onclick onevent="showLayoutMenu();" />
</public:component>
<script language="javascript">

var LayoutList=new Array();
var show=false;

function layoutItem(t,n,i)
{
this.Title=t;
this.Name=n;
this.Image=i;
}
function init() {
LayoutList[0]=new layoutItem('一列','OneCol','../../images/Layouts/layout0.gif'); 
LayoutList[1]=new layoutItem('三列,中间宽','ClassicTwoCol','../../images/Layouts/layout1.gif'); 
LayoutList[2]=new layoutItem('三列,左边窄','BackwardsTwoCol','../../images/Layouts/layout2.gif'); 
LayoutList[3]=new layoutItem('二列,右窄','ClassicThreeCol','../../images/Layouts/layout3.gif'); 
LayoutList[4]=new layoutItem('二个对称列','SymmetricTwoCol','../../images/Layouts/layout4.gif'); 
LayoutList[5]=new layoutItem('二列,右边宽','RightHeavyThreeCol','../../images/Layouts/layout5.gif')

}

function showLayoutMenu()
{
var vs=element.document.getElementById('system_layout_menu');
if(vs==null)
{
var menu = element.document.createElement("DIV");
menu.style.top=event.y +15+"px";
	menu.style.left=event.x+"px";
	//menu.style.top="1px";
	//menu.style.left="1px";
	menu.style.width="70px";
	menu.style.height="360px";
	menu.style.overflow='visible';
	menu.style.display='block';
	menu.style.position='absolute';
	menu.className='secondaryseltab';
	menu.id="system_layout_menu";

	//menu.Name="system_layout_menu";
	menu.innerHTML=getLayoutMenuItems();
	//element.document.body.insertAdjacentElement("beforeEnd",menu);
	element.document.body.appendChild(menu);
	//element.document.body.onclick=hide;
	show=true;
	return;
	}
	if(vs.style.display=='none')
	{
	 vs.style.display='block';
	}else
	{
	 vs.style.display='none';
	}
}
function hide()
{
 vs.style.display='none';
}
function getLayoutMenuItems()
{

var s='';
for(var i=0;i<LayoutList.length;i++)
{
var className=(LayoutList[i].Name==dlayoutManager.layoutType)?"selectedImg":"thumbnailImg";
s+='<DIV class=selectedImg >';
  s+='      <DIV title='+LayoutList[i].Title+' class=selectedImg  style="LEFT: 5px; WIDTH: 60px; POSITION: absolute; TOP: '+i*60+'px; HEIGHT: 60px" Alt='+LayoutList[i].Title+'></DIV>';
   s+='     <DIV class=selectedImg style="LEFT: 5px; WIDTH: 60px; POSITION: absolute; TOP:  '+i*60+'px; HEIGHT: 60px; "><A href="javascript:;" onclick="dlayoutManager.setLayout(\''+LayoutList[i].Name+'\');">';
    s+='<IMG class=selectedImg title='+LayoutList[i].Title+' style="WIDTH: 60px; HEIGHT: 60px" ';
s+='height=58 alt='+LayoutList[i].Title+' src="'+LayoutList[i].Image+'" width=50 pixelHeight="60" ';
s+='pixelWidth="60"></A></DIV></DIV>';
      
}
return s;
}
</script>
