<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>{?$name?}区块配置</title>
<meta http-equiv="Content-Type" content="text/html; charset={?$jieqi_charset?}" />
<link rel="stylesheet" rev="stylesheet" href="{?$jieqi_url?}/templates/admin/blockconfig.css" type="text/css" media="all" />
<script language="javascript" type="text/javascript" src="{?$jieqi_url?}/scripts/common.js"></script>
<script language="javascript" type="text/javascript" src="{?$jieqi_url?}/scripts/drag.js"></script>
<script type="text/javascript">
//------------------------Utility------------------------
function findPosX(obj) {//辅助函数 得到元素左边与浏览器左边的边距
	var curleft = 0;
	if (obj && obj.offsetParent) {
		while (obj.offsetParent) {
			curleft += obj.offsetLeft;
			obj = obj.offsetParent;
		}
	} else if (obj && obj.x) curleft += obj.x;
	return curleft;// + document.body.scrollLeft - document.body.clientLeft;
}

function findPosY(obj) {//辅助函数 得到元素上边与浏览器上边的边距
	var curtop = 0;
	if (obj && obj.offsetParent) {
		while (obj.offsetParent) {
			curtop += obj.offsetTop;
			obj = obj.offsetParent;
		}
	} else if (obj && obj.y) curtop += obj.y;
	return curtop;// + document.body.scrollTop - document.body.clientTop;
}

var StringBuilder = function(){
	var self = this;
	var array = [];
	this.append = function(str){
		array.push(str);
	}
	this.toString = function(){
		return array.join("");
	}
}

function setCookie(sName,sValue,oExpires,sPath,sDomain,bSecure){
	var sCookie = sName + "=" + encodeURIComponent(sValue);
	if(oExpires)
		sCookie += "; expires=" + oExpires.toGMTString();
	if(sPath)
		sCookie += "; path=" + sPath;
	if(sDomain)
		sCookie += "; domain=" + sDomain;
	if(bSecure)
		sCookie += "; secure";
		
	document.cookie = sCookie;
}

function getCookie(sName){
	var sRE = "(?:; )?" + sName + "=([^;]*);?";
	var oRE = new RegExp(sRE);
	if(oRE.test(document.cookie))
		return decodeURIComponent(RegExp["$1"]);
	else
		return null;
}

var dragGhost = document.createElement("div");
dragGhost.style.border = "dashed 1px #CCCCCC";
dragGhost.style.background = "white";
dragGhost.style.display = "none";
dragGhost.style.margin = "10px";

var isIE = document.all;

//------------------------Start Here------------------------\
var module = function(moduleElm){
	var self = this;
	this.elm = moduleElm;
	this.elm.module = this;
	this.column = moduleElm.column;
	this.columns = moduleElm.columns;
	this.row = moduleElm.row;
	this.rows = moduleElm.rows;
	this.handle = this.elm.getElementsByTagName("div")[0];
	
	if(this.handle && this.elm){
		Drag.init(this.handle,this.elm);
	}else{
		return;
	}
	this.elm.onDragStart = function(left,top,mouseX,mouseY){
		//开始拖动的时候设置透明度
		this.style.opacity = "0.5";
		this.style.filter = "alpha(opacity=50)";
		dragGhost.style.height = (isIE?this.offsetHeight:this.offsetHeight - 2) + "px";
		
		//this指的是item
		this.style.width = this.offsetWidth + "px";//因为初始的width为auto
		this.style.left = (findPosX(this) - 5) + "px";
		this.style.top = (findPosY(this) - 5) + "px";
		this.style.position = "absolute";
		
		//将ghost插入到当前位置
		dragGhost.style.display = "block";
		self.column.insertBefore(dragGhost,this);
		
		//记录每一行的上边距 在拖动过程中判断拖动对象所在的行会用到
		this.rowsY = [];
		for(var i=0;i<this.rows.length;i++){
			this.rowsY.push(findPosY(this.rows[i]));
		}
		
		//记录每一列的左边距 在拖动过程中判断拖动对象所在的列会用到
		this.columnsX = [];
		for(var i=0;i<this.columns.length;i++){
			var tmpc = this.columns[i];
			var tmpX = [];
			for(var j=0;j<tmpc.length;j++){
				tmpX.push(findPosX(tmpc[j]));
			}
			this.columnsX.push(tmpX);
		}
	}
	this.elm.onDrag = function(left,top,mouseX,mouseY){
		if(dragGhost.parentNode) dragGhost.parentNode.removeChild(dragGhost);
		var rowIndex = 0;
		for(var i=0;i<this.rowsY.length;i++){
			if((top + this.offsetHeight/5) > this.rowsY[i]){
				rowIndex = i;
			}
		}
		var columnIndex = 0; 
		for(var i=0;i<this.columnsX[rowIndex].length;i++){
			if((left + this.offsetWidth/5) > this.columnsX[rowIndex][i]){
				columnIndex = i;
			}
		}
		//如果rowIndex , columnIndex在循环中没有被赋值 则表示当前拖动对象在第一行第一列
		var row = this.rows[rowIndex];
		var column = this.columns[rowIndex][columnIndex];
		
		if(self.column != column){
			//之前拖动对象不在这个列
			//将ghost放置到这一列的最下方			
			column.appendChild(dragGhost);
			self.column = column;
		}
		
		//然后在判断放在这一列的什么位置
		var currentNode = null;
		for(var i=0;i<self.column.childNodes.length;i++){
			if(self.column.childNodes[i].className == "block"
			&& self.column.childNodes[i] != this //不能跟拖动元素自己比较 否则不能在本列向下移动
			&& top < findPosY(self.column.childNodes[i])){ //从上到下找到第一个比拖动元素的上边距大的元素
				currentNode = self.column.childNodes[i];
				break;
			}
		}
		if(currentNode) self.column.insertBefore(dragGhost,currentNode);
		else self.column.appendChild(dragGhost); //拖到最下边 没有任何一个元素的上边距比拖动元素的top大 则添加到列的最后
	}
	
	this.elm.onDragEnd = function(left,top,mouseX,mouseY){
		self.column.insertBefore(this,dragGhost);
		this.style.opacity = "1";
		this.style.filter = "alpha(opacity=100)";
		this.style.position = "static";
		this.style.display = "block";
		this.style.width = "auto";
		dragGhost.style.display = "none";
		//getConfig();
	}
}
function getConfig(object){
		  var page = document.getElementById("page");
		  var str="";
		  for(var i=0; i<page.childNodes.length; i++){
		   var oneChild = page.childNodes[i];
		   if(oneChild.nodeName.toLowerCase() == "div"){
		       for(var j=0; j<oneChild.childNodes.length; j++){
			      var twoChild = oneChild.childNodes[j];
			      if(twoChild.nodeName.toLowerCase() == "div"){
				     var side = twoChild.title;//side
				     for(var k=0; k<twoChild.childNodes.length; k++){
					    var threeChild = twoChild.childNodes[k];
						if(twoChild.id=='centers'){
						   if(threeChild.id=='csplit'){
						      var side = 5;
							  continue;
						   }else if(threeChild.id=='content'){
						      var side = 6;
							  continue;
						   }
						}
						var splitstr = '|$^|';
					    if(threeChild.nodeName.toLowerCase() == "div" && threeChild.title!=undefined){
						   str += twoChild.id+"-{#}-"+side+"-{#}-"+threeChild.title+splitstr;
						}
					 }
				  }
			   }
		   }
		  }
		  object.value = str;
}
function drag_init(){
	var rows = [];
	var columns = [];
	var page = document.getElementById("page");
	for(var i=0; i<page.childNodes.length; i++){
		var row = page.childNodes[i];
		if(row.nodeName.toLowerCase() == "div"){
			rows.push(row);
			var tmpcols = [];
			for(var j=0; j<row.childNodes.length; j++){
				var column = row.childNodes[j];
				if(column.nodeName.toLowerCase() == "div"){
					tmpcols.push(column);
				}
			}
			columns.push(tmpcols);
		}
	}
	for(var i=0; i<columns.length; i++){
		var tmpcols = columns[i];
		for(var j=0; j<tmpcols.length; j++){
			var column = tmpcols[j];
			for(var k=0; k<column.childNodes.length; k++){
				var block = column.childNodes[k];
				if(block.nodeName.toLowerCase() == "div"){
					block.column = column;
					block.columns = columns;
					block.row = rows[i];
					block.rows = rows;
					new module(block);
				}
			}
		}
	}
}
function checkform(object){
    if(document.pageform.mod.value=='sub'){
	   if(confirm("你确定要保存本布局设置吗？")){
		 getConfig(object);
		 return true
	   }else{
		 return false
	   }
	}else{
	   getConfig(object);
	   return true
	}
}
function editBlock(key,side){
   var vars = $('block_title_'+key).title;
   openDialog('{?$jieqi_url?}/admin/blocksaction.php?action=edit&vars='+vars+'&side='+side+'&modules={?$modules?}&file={?$file?}&name={?$name?}&ajax_gets=jieqi_contents&key='+key, true);
}
function addBlock(modules){
   openDialog('{?$jieqi_url?}/admin/blocksaction.php?action=add&modules='+modules+'&ajax_gets=jieqi_contents', true);
}
function subMod(mod){
   if(mod =='doando'){
      var modstr = 'doando';
	  document.pageform.target = '_blank';
   }else{
      var modstr = 'sub';
	  document.pageform.target = '_parent';
   }
   document.pageform.mod.value = modstr;
}
if (document.all){
	window.attachEvent('onload',drag_init);
}else{
	window.addEventListener('load',drag_init,false);
}
</script>
</head>
<body>
{?if $mod!='doando'?}
<div class="m_top">
<div class="fl">&nbsp;&nbsp;&nbsp;提示：拖动区块开始版面布局！ </div>
<div class="fr"><form name="pageform" action="{?$jieqi_url?}/admin/blockconfig.php" target="_parent" method="post" onSubmit="return checkform(this.blockstr);">
<input type="hidden" name="blockstr" value="">
<input type="hidden" name='name' value="{?$name?}">
<input type="hidden" name='action' value="edit">
<input type="hidden" name='modules' value="{?$modules?}">
<input type="hidden" name='file' value="{?$file?}">
<input type="hidden" name='mod' value="doando">
<input type="submit" name='doando' value='预览页面' onClick="subMod('doando');">&nbsp;&nbsp;&nbsp;<input type="submit" name='sub' value='保存设置' onClick="subMod('sub');">&nbsp;&nbsp;&nbsp;</form></div>
<form name="sel"><div class="fr">
<select class="select" name="modules" id="modules" onchange="">
     <option value="">选择模块</option>
	{?section name=i loop=$jieqi_modules?}
      <option value="{?$i['key']?}"{?if $modules == $i['key']?} selected{?/if?}>{?$jieqi_modules[i].caption?}</option>
	{?/section?}  
</select>&nbsp;<input type="hidden" name="blockKEY" value="{?$blockKEY?}">
  <input type="button" name='button' value='添加区块' onClick="addBlock(document.sel.modules.options[document.sel.modules.selectedIndex].value);">&nbsp;&nbsp;&nbsp;&nbsp;</div></form>
  
</div>
{?/if?}
<div class="main m_top">
<div class="fl">&nbsp;JIEQI CMS欢迎您，author [<a href="{?$jieqi_url?}/logout.php">退出登录</a>]</div>
<div class="fr"><a href="/index.php?charset=gbk">简体版</a> · <a href="/index.php?charset=big5">繁体版</a>&nbsp;&nbsp;</div>
</div>

<div id="page">
<!-- 顶部通栏区块开始 -->
<div class="main" id="top">
<div id="topc" title="7">
{?if $jieqi_showtblock == 1?}
{?section name=i loop=$jieqi_tblocks?}
  <div class="block" title='{?$jieqi_tblocks[i].var?}' id="block_title_{?$jieqi_tblocks[i].id?}">
  <div class="blocktitle" id="block_subject_{?$jieqi_tblocks[i].id?}"> {?$jieqi_tblocks[i].title?} </div>
  <div class="blockoperate"><a href="javascript:;" onclick="editBlock({?$jieqi_tblocks[i].id?},this.parentNode.parentNode.parentNode.title);">编辑</a>|<a href="javascript:;" onclick="this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode);">删除</a>&nbsp;</div>
  <div class="blockcontent">{?$jieqi_tblocks[i].content?}</div>
  </div>
{?/section?}
{?/if?}
</div>
</div>
<!-- 顶部通栏区块结束 -->

<!-- 顶部左右区块开始 -->
<div class="main" id="topm">
<!-- 顶部左区块开始 -->
<div id="cleft" title="2">
{?if $jieqi_showcblock == 1?}
{?section name=i loop=$jieqi_clblocks?}
  <div class="block" title='{?$jieqi_clblocks[i].var?}' id="block_title_{?$jieqi_clblocks[i].id?}">
  <div class="blocktitle" id="block_subject_{?$jieqi_clblocks[i].id?}"> {?$jieqi_clblocks[i].title?} </div>
  <div class="blockoperate"><a href="javascript:;" onclick="editBlock({?$jieqi_clblocks[i].id?},this.parentNode.parentNode.parentNode.title);">编辑</a>|<a href="javascript:;" onclick="this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode);">删除</a>&nbsp;</div>
  <div class="blockcontent">{?$jieqi_clblocks[i].content?}</div>
  </div>
{?/section?}
{?/if?}
</div>
<!-- 顶部左区块结束 -->
<!-- 顶部右区块开始 -->
<div id="cright" title="3">
{?if $jieqi_showcblock == 1?}
{?section name=i loop=$jieqi_crblocks?}
  <div class="block" title='{?$jieqi_crblocks[i].var?}' id="block_title_{?$jieqi_crblocks[i].id?}">
  <div class="blocktitle" id="block_subject_{?$jieqi_crblocks[i].id?}"> {?$jieqi_crblocks[i].title?} </div>
  <div class="blockoperate"><a href="javascript:;" onclick="editBlock({?$jieqi_crblocks[i].id?},this.parentNode.parentNode.parentNode.title);">编辑</a>|<a href="javascript:;" onclick="this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode);">删除</a>&nbsp;</div>
  <div class="blockcontent">{?$jieqi_crblocks[i].content?}</div>
  </div>
{?/section?}
{?/if?}
</div>
<!-- 顶部右区块结束 -->
</div>
<!-- 顶部左右区块结束 -->

<!-- 中部左中右区块开始 -->
<div class="main" id="middle">
<!-- 中部左区块开始 -->
<div id="left" title="0">
{?if $jieqi_showlblock == 1?}
{?section name=i loop=$jieqi_lblocks?}
  <div class="block" title='{?$jieqi_lblocks[i].var?}' id="block_title_{?$jieqi_lblocks[i].id?}">
  <div class="blocktitle" id="block_subject_{?$jieqi_lblocks[i].id?}"> {?$jieqi_lblocks[i].title?}</div>
  <div class="blockoperate"><a href="javascript:;" onclick="editBlock({?$jieqi_lblocks[i].id?},this.parentNode.parentNode.parentNode.title);">编辑</a>|<a href="javascript:;" onclick="this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode);">删除</a>&nbsp;</div>
  <div class="blockcontent">{?$jieqi_lblocks[i].content?}</div>
  </div>
{?/section?}
{?/if?} 
</div>
<!-- 中部左区块结束 -->
<!-- 中部中区块开始 -->
<div id="centers" title="4">
{?if $jieqi_showcblock == 1?}
{?section name=i loop=$jieqi_ctblocks?}
  <div class="block" title='{?$jieqi_ctblocks[i].var?}' id="block_title_{?$jieqi_ctblocks[i].id?}">
  <div class="blocktitle" id="block_subject_{?$jieqi_ctblocks[i].id?}"> {?$jieqi_ctblocks[i].title?} </div>
  <div class="blockoperate"><a href="javascript:;" onclick="editBlock({?$jieqi_ctblocks[i].id?},this.parentNode.parentNode.parentNode.title);">编辑</a>|<a href="javascript:;" onclick="this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode);">删除</a>&nbsp;</div>
  <div class="blockcontent">{?$jieqi_ctblocks[i].content?}</div>
  </div>
{?/section?}
<div class="block" id="csplit">中上、中中分隔符</div>
{?section name=i loop=$jieqi_cmblocks?}
  <div class="block" title='{?$jieqi_cmblocks[i].var?}' id="block_title_{?$jieqi_cmblocks[i].id?}">
  <div class="blocktitle" id="block_subject_{?$jieqi_cmblocks[i].id?}"> {?$jieqi_cmblocks[i].title?} </div>
  <div class="blockoperate"><a href="javascript:;" onclick="editBlock({?$jieqi_cmblocks[i].id?},this.parentNode.parentNode.parentNode.title);">编辑</a>|<a href="javascript:;" onclick="this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode);">删除</a>&nbsp;</div>
  <div class="blockcontent">{?$jieqi_cmblocks[i].content?}</div>
  </div>
{?/section?}
<div class="block" id="content">内容占位</div>
{?section name=i loop=$jieqi_cbblocks?}
  <div class="block" title='{?$jieqi_cbblocks[i].var?}' id="block_title_{?$jieqi_cbblocks[i].id?}">
  <div class="blocktitle" id="block_subject_{?$jieqi_cbblocks[i].id?}"> {?$jieqi_cbblocks[i].title?} </div>
  <div class="blockoperate"><a href="javascript:;" onclick="editBlock({?$jieqi_cbblocks[i].id?},this.parentNode.parentNode.parentNode.title);">编辑</a>|<a href="javascript:;" onclick="this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode);">删除</a>&nbsp;</div>
  <div class="blockcontent">{?$jieqi_cbblocks[i].content?}</div>
  </div>
{?/section?}
{?/if?}
</div>
<!-- 中部中区块结束 -->
<!-- 中部右区块开始 -->
<div id="right" title="1">
{?if $jieqi_showrblock == 1?}
{?section name=i loop=$jieqi_rblocks?}
  <div class="block" title='{?$jieqi_rblocks[i].var?}' id="block_title_{?$jieqi_rblocks[i].id?}">
  <div class="blocktitle" id="block_subject_{?$jieqi_rblocks[i].id?}"> {?$jieqi_rblocks[i].title?} </div>
  <div class="blockoperate"><a href="javascript:;" onclick="editBlock({?$jieqi_rblocks[i].id?},this.parentNode.parentNode.parentNode.title);">编辑</a>|<a href="javascript:;" onclick="this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode);">删除</a>&nbsp;</div>
  <div class="blockcontent">{?$jieqi_rblocks[i].content?}</div>
  </div>
{?/section?}
{?/if?}
</div>
<!-- 中部右区块结束 -->
</div>
<!-- 中部左中右区块结束 -->
<!-- 底部通栏区块开始 -->
<div class="main" id="bottom">
<div id="bottomc" title="8">
{?if $jieqi_showbblock == 1?}
{?section name=i loop=$jieqi_bblocks?}
  <div class="block" title='{?$jieqi_bblocks[i].var?}' id="block_title_{?$jieqi_bblocks[i].id?}">
  <div class="blocktitle" id="block_subject_{?$jieqi_bblocks[i].id?}"> {?$jieqi_bblocks[i].title?} </div>
  <div class="blockoperate"><a href="javascript:;" onclick="editBlock({?$jieqi_bblocks[i].id?},this.parentNode.parentNode.parentNode.title);">编辑</a>|<a href="javascript:;" onclick="this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode);">删除</a>&nbsp;</div>
  <div class="blockcontent">{?$jieqi_bblocks[i].content?}</div>
  </div>
{?/section?}
{?/if?}
</div>
</div>
<!-- 底部通栏区块结束 -->
</div>

<div class="main m_foot">
Powered by <a href="http://www.jieqi.com">JIEQI CMS</a>
</div>
</body>
</html>