<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 = $("selectedUnitType").value;
	if(page!='' && !isNaN(page) && code!='') {
		getUnits(code, page);
	}
}

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

function showClipBoard() {
	if(confirm("クリップボード管理を開きます。\n保存されていないユニットレイアウトは破棄されますがよろしいですか？")) {
		Element.hide("unitmenu");
		parent.showBox('', 'unitclipboard.php', 840, 500);
	}
}

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

{/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">
									<form style="margin: 0;" name="unitmasterform">
										<select onchange="getUnits(this.value, 0)" name="selectedUnitType" id="selectedUnitType" style="width: 170px;">
{foreach from=$unitpullmenu item="unitmaster" key="unitmasterkey"}
											<option value="{$unitmasterkey}">{$unitmaster}</option>
{/foreach}
										</select>
									</form>
								</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}-{$ulist.unit_code}" class="unit" onmouseout="dispUnitName();" onmouseover="dispUnitName('{$ulist.unit_name}')"><img src="../../..{$PAGEU_IMGPATH}/{$ulist.unit_idname}/{$ulist.unit_idname}.gif"></li>
																<script type="text/javascript">
																//<![CDATA[{literal}
																new Draggable("{/literal}{$ulist.unit_idname}-{$ulist.unit_code}{literal}", {ghosting:true,revert:true});
																{/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 {$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">ページレイアウト設定</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" class="flowActive">ユニットレイアウト設定</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="btnClipboard"><a href="#noscript" title="クリップボード" onclick="return showClipBoard();">クリップボード</a></p>
					<p id="btnPagePreview"><a href="{$previewurl}" target="_blank" title="プレビュー">プレビュー</a></p>
				</div>
				</td>
			</tr>
		</table>
	</div>
</div>
<!--/ユニットボックス-->
<!--contents/-->
<div id="unitlayoutedit">
	<div id="page">
		<div id="items">{$items}</div>
		<div class="clr"></div>
	</div>
	<div id="debg"></div>
	<div style="height:40px; padding-top: 10px;">
		<p id="indicator" style="display: none;"><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;
	
	//順序変更時のセッションへの保存処理
	function getParams() {
	if(sort_flg) {
	var params = getGroupOrder();
	new Ajax.Request('../../aj/page-unitlayout.php', {
	asynchronous:true, 
	evalScripts:true, 
	//onComplete:function(request){Element.hide('indicator')}, 
	//onLoading:function(request){Element.show('indicator')}, 
	parameters:'mode=sort&u=' + params
	});
	}
	}
	
	//全てのカラム内のユニット配列を取得
	function getGroupOrder() {
	var params = '';
	for (i = 0; i < sections.length; i++) {
		var sectionID = sections[i];
		params += sectionID + ':' + Sortable.sequence($(sectionID)) + ';';
	}
	return params;
	}

	function ConfunitDel(id) {
	if(window.confirm('このユニットを削除します。\nよろしいですか？')){
		unitDel(id);
	}
	}
	
	function unitDel(id) {
	Element.hide(id);
	var dom_obj = $(id);
	var dom_obj_parent = dom_obj.parentNode;
	dom_obj_parent.removeChild(dom_obj);
	sort_flg = false;
	new Ajax.Request('../../aj/page-unitlayout.php', {
		asynchronous:true, 
		evalScripts:true, 
		onComplete:function(request){sort_flg=true;}, 
		parameters:'mode=delete&id=' + encodeURIComponent(id)
		});
	}
	
	function ConfunitCp(id) {
		input = window.prompt('このユニットをクリップボードに保存します。\n保存する場合は名前を入力してください。', "");
		if(input!=''&&input!=null){
			unitCp(id, encodeURI(input));
		} else if(input == "" && input != null){
			alert("クリップボードで管理するためのユニット名を入力してください。");
		}
	}
	function unitCp(id, input) {
	var dom_obj = $(id);
	new Ajax.Request('../../aj/page-unitlayout.php', {
		asynchronous:true, 
		evalScripts:true, 
		onComplete:unitCpEnd, 
		parameters:'mode=copy&input='+input+'&id=' + encodeURIComponent(id)
		});
	}
	
	function unitCpEnd(httpObject) {
		if(httpObject.responseText == 1) {
			alert("コピーしました。\nコピーしたユニットはプルダウンメニューの「クリップボード」より利用できます。");
			if($('selectedUnitType').value == '0:0') {
				getUnits($('selectedUnitType').value, 0);
			}
		} else {
			alert("ユニット個別設定がされていないためコピーできません。");
		}
	}
{/literal}//]]>
</script>
</div>
<hr />
<!--/contents-->
