<script src="../../../js/fixed.js" type="text/javascript"></script>
<script src="../../../js/scriptaculous.js?load=effects,dragdrop" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[{literal}
	
//ウィンドウサイズに会わせてメニューをリサイズ
function ImageChange(){
	if(document.all){
			//横幅・縦幅のウィンドウサイズを取得
		document.all("unitmenu").style.width = document.body.clientWidth;
	} else if (document.getElementById){
			//横幅・縦幅のウィンドウサイズを取得
		document.getElementById("unitmenu").style.width = window.innerWidth;
	}
}

function getUnits(TypeAndCode, page) {
	new Ajax.Updater("unitmasterlist", "../../aj/page-unitlayout-getunitlist.php", {
		asynchronous:true, 
		evalScripts:true,
		parameters:"code=" + TypeAndCode +"&page="+page,
		onComplete:function(request){
						chkpaging();
					}
	});
}

//ページングボタンの表示切り替え
function chkpaging() {
	if($("unitmaster-next")) { //次へボタン有効の場合
		$("unit-paging-next").src = "../../common-img/unitbox_btn_next_on.gif";
	} else { //次へ無効
		$("unit-paging-next").src = "../../common-img/unitbox_btn_next.gif";
	}
	if($("unitmaster-prev")) { //戻るボタン有効の場合
		$("unit-paging-prev").src = "../../common-img/unitbox_btn_prev_on.gif";
	} else { //戻る無効
		$("unit-paging-prev").src = "../../common-img/unitbox_btn_prev.gif";
	}
}

function getUnitsPaging(to) {
	var page='';
	if(to==1) {
		if($("unitmaster-next")) {
			page = $("unitmaster-next").value;
		}
	} else {
		if($("unitmaster-prev")) {
			page = $("unitmaster-prev").value;
		}
	}
	code = "1:0";
	if(page!='' && !isNaN(page) && code!='') {
		getUnits(code, page);
	}
}

function dispUnitName(str) {
	if(str!=null){
		$("unitnamedisplayarea").innerHTML = str;
	} else {
		$("unitnamedisplayarea").innerHTML = '&nbsp;';
	}
}


Event.observe(window, 'load', function(event) {
chkpaging();
ImageChange();
$('unitmenu').style.display='block';
}, false);
window.onresize = ImageChange;

{/literal}//]]>
</script>
<!--ユニットボックス/-->
<div id="unitmenu" style="display:none">
	<div id="unitboxInner">
		<table width="100%" border="0" cellspacing="0" cellpadding="0">
			<tr>
				<td width="546">
					<table border="0" cellspacing="0" cellpadding="0" style="height: 50px; background: url(../../common-img/unitbox_bg.gif) repeat-x top;">
						<tr>
							<td width="190" style="background: url(../../common-img/unitbox_bg_left.gif) no-repeat 0 0;">
								<!--プルダウンメニュー/-->
								<div id="pullMenuArea">
									<span style="color: #333; font-weight: bold; width: 170px; display: block;">レイアウトコンテナー</span>
								</div>
								<!--/プルダウンメニュー-->
								<div id="unitnamedisplayarea"></div>
								
							</td>
							<td width="351">
								<!--ユニット/-->
								<div id="unitMenuArea">
									<table border="0" cellspacing="0" cellpadding="0">
										<tr>
											<td style="width: 15px; vertical-align: top;"><a href="#noscript" onclick="getUnitsPaging(-1)"><img id="unit-paging-prev" src="../../common-img/unitbox_btn_prev.gif" width="15" height="41" border="0" /></a></td>
											<td style="width: 321px;">
												<!--コンテナユニット/-->
												<div id="menu1">
													<div class="unitBox">
														<div class="unitBoxInner">
															<ul id="unitmasterlist">
{foreach from=$unitlist item="ulist"}
																<li id="{$ulist.unit_idname}" class="unit" onmouseout="dispUnitName();" onmouseover="dispUnitName('{$ulist.unit_name}')"><img src="../../..{$PAGEC_IMGPATH}{$ulist.unit_idname}.gif"></li>
																<script type="text/javascript">
																	//<![CDATA[{literal}
																		new Draggable("{/literal}{$ulist.unit_idname}{literal}", {ghosting:true,revert:true}); //nn
																	{/literal}//]]>
																	</script>
{/foreach}
																{$unitlistpaging}
															</ul>
															<div class="clr"></div>
														</div>
													</div>
												</div>
												<!--/コンテナユニット-->											</td>
											<td width="15" style="vertical-align: top;"><a href="#noscript" onclick="getUnitsPaging(1)"><img id="unit-paging-next" src="../../common-img/unitbox_btn_next.gif" width="15" height="41" border="0" /></a></td>
										</tr>
									</table>
								</div>
								<!--/ユニット-->							</td>
							<td width="5" style="background: url(../../common-img/unitbox_bg_right.gif) no-repeat right top;"><img src="../../common-img/spacer.gif" width="5" height="1" /></td>
						</tr>
					</table>
				</td>
				<td><img src="../../common-img/spacer.gif" width="10" height="1" /></td>
					<td width="83">
					<!--保存ボタン/-->
					<div id="btnSaveArea">
						<form style="margin: 0;" {$form.attributes}>
							{$form.hidden}
							{$form.buttons.html}
						</form>
					</div>
					<!--/保存ボタン-->
					</td>
				<td width="10"><img src="../../common-img/spacer.gif" width="10" height="1" /></td>
				<td width="63">
				<p id="btnBacklist"><a href="{if $mprev}index2.php{else}index.php{/if}?sidx_code={$sidx_code}&cat_code={$cat_code}" target="_top" title="ページ一覧へ戻る">ページ一覧へ戻る</a></p>
				</td>
				<td width="165">
					<div class="pageFlow">
						<ul>
							<li class="step1"><a href="layout.php?mprev={$mprev}&pidx_code={$pidx_code}&sidx_code={$sidx_code}&cat_code={$cat_code}" title="ページレイアウト設定" target="_top" class="flowActive">ページレイアウト設定</a></li>
							<li class="step2"><a href="unitlayout.php?mprev={$mprev}&pidx_code={$pidx_code}&sidx_code={$sidx_code}&cat_code={$cat_code}" title="ユニットレイアウト設定" target="_top">ユニットレイアウト設定</a></li>
							<li class="step3"><a href="unitlist.php?mprev={$mprev}&pidx_code={$pidx_code}&sidx_code={$sidx_code}&cat_code={$cat_code}" title="ユニット個別設定" target="_top">ユニット個別設定</a></li>
						</ul>
					</div>
				</td>
				<td width="103">
				<div id="btnPreviewArea">
					<p id="btnClipboardOff">クリップボード</p>
					<p id="btnPagePreview"><a href="{$previewurl}" target="_blank" title="プレビュー">プレビュー</a></p>
				</div>
				</td>
			</tr>
		</table>
	</div>
</div>
<!--/ユニットボックス-->
<div id="layoutedit">
	
		<div id="page" class="page">
			<ul id="items" style="width:auto;">
				{$items}
			</ul>
			<div class="clr"></div>
		</div>
	
	<div id="debg"></div>
	<div style="height: 40px; padding-top: 10px;">
		<p id="indicator" style="display: none; margin-top: 0px;"><img alt="Indicator" src="../../common-img/loading.gif">読み込み中...</p>
	</div>
	<script type="text/javascript">
		//<![CDATA[{literal}
			var mp_x;
			var mp_y;
		Event.observe(window.document, 'mousemove', function(event) {
								mp_x = Event.pointerX(event);
								mp_y = Event.pointerY(event);
		}, false);
		
		var sort_flg = true;
		Droppables.add("page", {
			accept:'unit', 
			hoverclass:'page-active',
			onDrop:function(element, droppableElement) {
   	parent_dimensions = Element.getDimensions(droppableElement);
				var target_y = $("page").offsetTop;
				var torder=-1;
				var cnt = 0;
				for(var i=0;i<$("items").childNodes.length;i++) {
					if($("items").childNodes[i] && $("items").childNodes[i].className =="addunit") {
						var dime = Element.getDimensions($("items").childNodes[i]);
						var comp = eval(target_y+dime.height/2);
						if(mp_y < comp && torder<0) {
							torder = cnt;
						}
						target_y += dime.height;
						cnt++;
					}
				}					
				new Ajax.Updater('items', '../../aj/page-layout.php', {
					asynchronous:true, 
					evalScripts:true, 
					//onComplete:function(request){Element.hide('indicator');}, 
					//onLoading:function(request){Element.show('indicator')}, 
					parameters:'mode=add&id=' + encodeURIComponent(element.id)+'&pagec_pidx_code='+$("pidx_code").value+'&order='+torder
				});
		}
	});

	//順序変更時のセッションへの保存処理
	function getParams() {
		if(sort_flg) {
			//items<ul>リストのパラメータ作成
			var ccode = Sortable.sequence('items') //新規追加コンテナのcodeは0以下の値とする
			var ctype = "";
			//リストのパラメータをPHPへ渡し、itemsのulを書き換える
			new Ajax.Request('../../aj/page-layout.php', {
				asynchronous:true, 
				evalScripts:true, 
				//onComplete:function(request){Element.hide('indicator')}, 
				//onLoading:function(request){Element.show('indicator')}, 
				parameters:'mode=sort&pagec_code='+ccode
			});
		}
	}

	function ConfunitDel(id) {
		if(window.confirm('このコンテナを削除します。\nよろしいですか？')) {
			unitDel(id);
		}
	}

	function unitDel(id) {
		sort_flg = false;
		new Ajax.Request('../../aj/page-layout.php', {
			asynchronous:true, 
			evalScripts:true, 
			onComplete:function(request){
							sort_flg=true;
							if(request.responseText==0){
								alert('モジュール専用ユニットが存在するコンテナは削除できません。');
							} else {
								Element.hide(id);
							}
						}, 
			parameters:'mode=delete&id=' + encodeURIComponent(id)
		});
	}

{/literal}//]]>
</script>
</div>
