mirror of
https://github.com/Lastorder-DC/rhymix.git
synced 2026-01-25 22:29:55 +09:00
issue 70 sitemap developement.
but yet not completed git-svn-id: http://xe-core.googlecode.com/svn/branches/1.5.0@8940 201d5d3c-b55e-5fd7-737f-ddc643e51545
This commit is contained in:
ovclas
parent
d497aa06d3
commit
a3b9fc7338
9 changed files with 544 additions and 5 deletions
289
modules/menu/tpl/js/sitemap.js
Normal file
289
modules/menu/tpl/js/sitemap.js
Normal file
|
|
@ -0,0 +1,289 @@
|
|||
/* NHN (developers@xpressengine.com) */
|
||||
jQuery(function($){
|
||||
|
||||
var
|
||||
dragging = false,
|
||||
$holder = $('<li class="placeholder">');
|
||||
|
||||
$('form.siteMap')
|
||||
.delegate('li:not(.placeholder)', {
|
||||
'mousedown.st' : function(event) {
|
||||
var $this, $uls, $ul, width, height, offset, position, offsets, i, dropzone, wrapper='';
|
||||
|
||||
if($(event.target).is('a,input,label,textarea') || event.which != 1) return;
|
||||
|
||||
dragging = true;
|
||||
|
||||
$this = $(this);
|
||||
height = $this.height();
|
||||
width = $this.width();
|
||||
$uls = $this.parentsUntil('.siteMap').filter('ul');
|
||||
$ul = $uls.eq(-1);
|
||||
|
||||
$ul.css('position', 'relative');
|
||||
|
||||
position = {x:event.pageX, y:event.pageY};
|
||||
offset = getOffset(this, $ul.get(0));
|
||||
|
||||
$clone = $this.clone(true).attr('target', true);
|
||||
|
||||
for(i=$uls.length-1; i; i--) {
|
||||
$clone = $clone.wrap('<li><ul /></li>').parent().parent();
|
||||
}
|
||||
|
||||
// get offsets of all list-item elements
|
||||
offsets = [];
|
||||
$ul.find('li').each(function(idx) {
|
||||
if($this[0] === this || $this.has(this).length) return true;
|
||||
|
||||
var o = getOffset(this, $ul.get(0));
|
||||
offsets.push({top:o.top, bottom:o.top+32, item:this});
|
||||
});
|
||||
|
||||
// Remove unnecessary elements from the clone, set class name and styles.
|
||||
// Append it to the list
|
||||
$clone
|
||||
.find('.side,input').remove().end()
|
||||
.addClass('draggable')
|
||||
.css({
|
||||
position: 'absolute',
|
||||
opacity : .6,
|
||||
width : width,
|
||||
height : height,
|
||||
left : offset.left,
|
||||
top : offset.top,
|
||||
zIndex : 100
|
||||
})
|
||||
.appendTo($ul.eq(0));
|
||||
|
||||
// Set a place holder
|
||||
$holder
|
||||
.css({
|
||||
position:'absolute',
|
||||
opacity : .6,
|
||||
width : width,
|
||||
height : '5px',
|
||||
left : offset.left,
|
||||
top : offset.top,
|
||||
zIndex :99
|
||||
})
|
||||
.appendTo($ul.eq(0));
|
||||
|
||||
$this.css('opacity', .6);
|
||||
|
||||
$(document)
|
||||
.unbind('mousemove.st mouseup.st')
|
||||
.bind('mousemove.st', function(event) {
|
||||
var diff, nTop, item, i, c, o;
|
||||
|
||||
dropzone = null;
|
||||
|
||||
diff = {x:position.x-event.pageX, y:position.y-event.pageY};
|
||||
nTop = offset.top - diff.y;
|
||||
|
||||
for(i=0,c=offsets.length; i < c; i++) {
|
||||
o = offsets[i];
|
||||
if(o.top <= nTop && o.bottom >= nTop) {
|
||||
dropzone = {element:o.item, state:setHolder(o,nTop)};
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
$clone.css({top:nTop});
|
||||
})
|
||||
.bind('mouseup.st', function(event) {
|
||||
var $dropzone, $li;
|
||||
|
||||
dragging = false;
|
||||
|
||||
$(document).unbind('mousemove.st mouseup.st');
|
||||
$this.css('opacity', '');
|
||||
$clone.remove();
|
||||
$holder.remove();
|
||||
|
||||
// dummy list item for animation
|
||||
$li = $('<li />').height($this.height());
|
||||
|
||||
if(!dropzone) return;
|
||||
$dropzone = $(dropzone.element);
|
||||
|
||||
$this.before($li);
|
||||
|
||||
if(dropzone.state == 'prepend') {
|
||||
if(!$dropzone.find('>ul').length) $dropzone.find('>.side').after('<ul>');
|
||||
$dropzone.find('>ul').prepend($this.hide());
|
||||
} else {
|
||||
$dropzone[dropzone.state]($this.hide());
|
||||
}
|
||||
|
||||
$this.slideDown(100, function(){ $this.removeClass('active') });
|
||||
$li.slideUp(100, function(){ var $par = $li.parent(); $li.remove(); if(!$par.children('li').length) $par.remove() });
|
||||
});
|
||||
|
||||
return false;
|
||||
},
|
||||
'mouseover.st' : function() {
|
||||
if(!dragging) $(this).addClass('active');
|
||||
return false;
|
||||
},
|
||||
'mouseout.st' : function() {
|
||||
if(!dragging) $(this).removeClass('active');
|
||||
return false;
|
||||
}
|
||||
})
|
||||
.find('li')
|
||||
.prepend('<button type="button" class="moveTo">Move to</button>')
|
||||
.append('<span class="vr"></span><span class="hr"></span>')
|
||||
.find('input:text')
|
||||
.focus(function(){
|
||||
var $this = $(this), $label = $this.prev('label'), $par = $this.parent();
|
||||
|
||||
$this.width($par.width() - (parseInt($par.css('text-indent'))||0) - $this.next('.side').width() - 60).css('opacity', '');
|
||||
$label.hide();
|
||||
})
|
||||
.blur(function(){
|
||||
var $this = $(this), $label = $this.prev('label'), val = $this.val();
|
||||
|
||||
$this.width(0).css('opacity', 0);
|
||||
$label.removeClass('no-text').empty().text(val).show();
|
||||
if(!val) $label.addClass('no-text').text('---');
|
||||
})
|
||||
.each(function(i,input){
|
||||
var $this = $(this), id='sitemap-id-'+i;
|
||||
|
||||
$this
|
||||
.attr('id', id)
|
||||
.css({width:0,opacity:0,overflow:'hidden'})
|
||||
.before('<label />')
|
||||
.prev('label')
|
||||
.attr('for', id)
|
||||
.text($this.val());
|
||||
})
|
||||
.end()
|
||||
.end()
|
||||
|
||||
$('<div id="dropzone-marker" />')
|
||||
.css({display:'none',position:'absolute',backgroundColor:'#000',opacity:0.7})
|
||||
.appendTo('body');
|
||||
|
||||
function getOffset(elem, offsetParent) {
|
||||
var top = 0, left = 0;
|
||||
|
||||
while(elem && elem != offsetParent) {
|
||||
top += elem.offsetTop;
|
||||
left += elem.offsetLeft;
|
||||
|
||||
elem = elem.offsetParent;
|
||||
}
|
||||
|
||||
return {top:top, left:left};
|
||||
}
|
||||
|
||||
function setHolder(info, yPos) {
|
||||
if(Math.abs(info.top-yPos) <= 3) {
|
||||
$holder.css({top:info.top-3,height:'5px'});
|
||||
return 'before';
|
||||
} else if(Math.abs(info.bottom-yPos) <= 3) {
|
||||
$holder.css({top:info.bottom-3,height:'5px'});
|
||||
return 'after';
|
||||
} else {
|
||||
$holder.css({top:info.top+3,height:'27px'});
|
||||
return 'prepend';
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
$('.tgMap').click(function(){
|
||||
var t = $(this);
|
||||
t.parent('.siteMap').toggleClass('fold');
|
||||
if(t.parent('.siteMap').hasClass('fold')){
|
||||
t.text('펼치기').next('.lined').slideUp(200).next('.btnArea').hide();
|
||||
} else {
|
||||
t.text('접기').next('.lined').slideDown(200).next('.btnArea').show();
|
||||
}
|
||||
return false;
|
||||
});
|
||||
*/
|
||||
var editForm = $('#editForm');
|
||||
var menuSrl = null;
|
||||
var menuForm = null;
|
||||
|
||||
$('a._edit').click(function(){
|
||||
var parentKey = $(this).parent().prevAll('._parent_key').val();
|
||||
var childKey = $(this).parent().prevAll('._child_key').val();
|
||||
menuSrl = $(this).parents().prevAll('input[name=menu_srl]').val();
|
||||
menuForm = $('#menu_'+menuSrl);
|
||||
var menuItemSrl = null;
|
||||
|
||||
if(parentKey) menuItemSrl = parentKey;
|
||||
else if(childKey) menuItemSrl = childKey;
|
||||
else
|
||||
{
|
||||
alert('empty menu item key');
|
||||
return;
|
||||
}
|
||||
|
||||
var params = new Array();
|
||||
var response_tags = new Array('menu_item');
|
||||
params['menu_item_srl'] = menuItemSrl;
|
||||
|
||||
exec_xml("menu","getMenuAdminItemInfo", params, completeGetActList, response_tags);
|
||||
});
|
||||
|
||||
function completeGetActList(obj)
|
||||
{
|
||||
var menuItem = obj.menu_item;
|
||||
editForm.find('input[name=menu_srl]').val(menuItem.menu_srl);
|
||||
editForm.find('input[name=menu_item_srl]').val(menuItem.menu_item_srl);
|
||||
editForm.find('input[name=parent_srl]').val(menuItem.parent_srl);
|
||||
editForm.find('input[name=menu_name]').val(menuItem.name);
|
||||
editForm.find('input=[name=menu_url]').val(menuItem.url);
|
||||
|
||||
var openWindow = menuItem.open_window;
|
||||
var openWindowForm = editForm.find('input=[name=menu_open_window]');
|
||||
if(openWindow == 'Y') openWindowForm[1].checked = true;
|
||||
else openWindowForm[0].checked = true;
|
||||
|
||||
var htmlBuffer = '';
|
||||
for(x in menuItem.groupList.item)
|
||||
{
|
||||
var groupObj = menuItem.groupList.item[x];
|
||||
|
||||
htmlBuffer += '<input type="checkbox" name="group_srls[]" id="group_srls_'+groupObj.group_srl+'" value="'+groupObj.group_srl+'"';
|
||||
if(groupObj.isChecked) htmlBuffer += ' checked="checked" ';
|
||||
htmlBuffer += '/> <label for="group_srls_'+groupObj.group_srl+'">'+groupObj.title+'</label>'
|
||||
}
|
||||
$('#groupList').html(htmlBuffer);
|
||||
}
|
||||
|
||||
$('a._delete').click(function() {
|
||||
menuSrl = $(this).parents().prevAll('input[name=menu_srl]').val();
|
||||
menuForm = $('#menu_'+menuSrl);
|
||||
|
||||
var menu_item_srl = $(this).parent().prevAll('._child_key').val();
|
||||
menuForm.find('input[name=menu_item_srl]').val(menu_item_srl);
|
||||
menuForm.submit();
|
||||
});
|
||||
|
||||
$('a._add').click(function()
|
||||
{
|
||||
var menuItem = obj.menu_item;
|
||||
editForm.find('input[name=menu_srl]').val('');
|
||||
editForm.find('input[name=menu_item_srl]').val('');
|
||||
editForm.find('input[name=parent_srl]').val('');
|
||||
editForm.find('input[name=menu_name]').val('');
|
||||
editForm.find('input=[name=menu_url]').val('');
|
||||
editForm.find('input=[name=menu_open_window]')[0].checked = true;
|
||||
|
||||
var htmlBuffer = '';
|
||||
for(x in menuItem.groupList.item)
|
||||
{
|
||||
var groupObj = menuItem.groupList.item[x];
|
||||
|
||||
htmlBuffer += '<input type="checkbox" name="group_srls[]" id="group_srls_'+groupObj.group_srl+'" value="'+groupObj.group_srl+'"';
|
||||
if(groupObj.isChecked) htmlBuffer += ' checked="checked" ';
|
||||
htmlBuffer += '/> <label for="group_srls_'+groupObj.group_srl+'">'+groupObj.title+'</label>'
|
||||
}
|
||||
$('#groupList').html(htmlBuffer);
|
||||
});
|
||||
});
|
||||
132
modules/menu/tpl/sitemap.html
Normal file
132
modules/menu/tpl/sitemap.html
Normal file
|
|
@ -0,0 +1,132 @@
|
|||
<load target="./js/sitemap.js" />
|
||||
|
||||
<div class="content" id="content">
|
||||
<div cond="$XE_VALIDATOR_MESSAGE" class="message {$XE_VALIDATOR_MESSAGE_TYPE}">
|
||||
<p>{$XE_VALIDATOR_MESSAGE}</p>
|
||||
</div>
|
||||
<h1 class="h1">Site Map</h1>
|
||||
<!--@foreach($menu_list AS $key=>$value)-->
|
||||
{@$menu_srl = $value->menu_srl}
|
||||
<form class="portlet siteMap" id="menu_{$menu_srl}">
|
||||
<input type="hidden" name="act" value="procMenuAdminDeleteItem" />
|
||||
<input type="hidden" name="menu_srl" value="{$value->menu_srl}" />
|
||||
<input type="hidden" name="menu_item_srl" value="" />
|
||||
<input type="hidden" name="success_return_url" value="{getUrl('', 'module', 'admin', 'act', 'dispMenuAdminSiteMap')}" />
|
||||
|
||||
<h2 class="h2"><input name="title" value="{$value->title}" /></h2>
|
||||
<a href="#nav1" class="tgMap">접기</a>
|
||||
<ul class="lined" id="nav1">
|
||||
<li loop="$value->menuItems=>$key2,$value2">
|
||||
<input type="hidden" name="parent_key[]" value="{$key2}" class="_parent_key" />
|
||||
<input type="hidden" name="child_key[]" value="BEGIN_{$key2}" class="_child_key" />
|
||||
<input value="{$value2['name']}" />
|
||||
<span class="side"><a href="#editMenu" class="modalAnchor _edit">Edit...</a> | <a href="#">Setup</a> | <a href="#delete" class="_delete">Delete</a></span>
|
||||
<ul cond="$value2['subMenu']>0">
|
||||
<li loop="$value2['subMenu']=>$key3,$value3">
|
||||
<input type="hidden" name="child_key[]" value="{$key3}" class="_child_key" />
|
||||
<input value="{$value3->name}" /> <span class="side"><a href="#editMenu" class="modalAnchor _edit">Edit...</a> | <a href="#">Setup</a> | <a href="#delete" class="_delete">Delete</a></span>
|
||||
</li>
|
||||
</ul cond="$value2['subMenu']>0">
|
||||
</li>
|
||||
</ul>
|
||||
<p class="btnArea"><span class="btn small"><a href="#editMenu" class="modalAnchor _add">Add Menu...</a></span> <span class="btn small"><button value="procMenuAdminArrangeItem" name="act" type="submit">{$lang->cmd_save}</button></span></p>
|
||||
</form>
|
||||
<!--@end-->
|
||||
<div class="btnArea">
|
||||
<span class="btn medium"><button type="button">Add New Site Map...</button></span>
|
||||
</div>
|
||||
<div class="modal" id="editMenu">
|
||||
<div class="fg">
|
||||
<form ruleset="insertMenuItem" id="editForm" action="./" method="post" enctype="multipart/form-data" class="form">
|
||||
<input type="hidden" name="act" value="procMenuAdminInsertItem" />
|
||||
<input type="hidden" name="menu_srl" value="" />
|
||||
<input type="hidden" name="menu_item_srl" value="{$menu_info->menu_srl}" />
|
||||
<input type="hidden" name="parent_srl" value="{$menu_info->menu_srl}" />
|
||||
<h2 class="h2">My Navigation Setting</h2>
|
||||
<ul>
|
||||
<li>
|
||||
<p class="q"><label for="name">Name</label></p>
|
||||
<div class="a">
|
||||
<input type="text" class="vLang" id="name" name="menu_name" />
|
||||
<!-- Suggestion -->
|
||||
<div id="vLangSuggest" class="suggestion">
|
||||
<ul>
|
||||
<li><button type="button">다국어 하나</button></li>
|
||||
<li><button type="button">다국어 둘</button></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- /Suggestion -->
|
||||
<script type="text/javascript">
|
||||
// Multilingual Suggestion (UI Prototype)
|
||||
$('input.vLang')
|
||||
.focusin(function(){
|
||||
$('#vLangSuggest').fadeIn(200);
|
||||
})
|
||||
.focusout(function(){
|
||||
$('#vLangSuggest').fadeOut(200);
|
||||
})
|
||||
</script>
|
||||
<!-- Multilingual -->
|
||||
<div id="langEdit" class="langEdit tgContent">
|
||||
<ul>
|
||||
<li class="ko"><label for="ko_var1">Korean</label> <input type="text" value="안녕 세상아!" id="ko_var1" /></li>
|
||||
<li class="en"><label for="en_var1">English</label> <input type="text" value="Hello World!" id="en_var1" /></li>
|
||||
<li class="ja"><label for="ja_var1">Japanese</label> <input type="text" value="" id="ja_var1" /></li>
|
||||
<li class="zh"><label for="zhcn_var1">Chinese(Simplified)</label> <input type="text" value="" id="zhcn_var1" /></li>
|
||||
<li class="zh"><label for="zhtw_var1">Chinese(Traditional)</label> <input type="text" value="" id="zhtw_var1" /></li>
|
||||
<li class="fr"><label for="fr_var1">French</label> <input type="text" value="" id="fr_var1" /></li>
|
||||
<li class="de"><label for="de_var1">Deutsch</label> <input type="text" value="" id="de_var1" /></li>
|
||||
<li class="ru"><label for="ru_var1">Russian</label> <input type="text" value="" id="ru_var1" /></li>
|
||||
<li class="es"><label for="es_var1">Spanish</label> <input type="text" value="" id="es_var1" /></li>
|
||||
<li class="tr"><label for="tr_var1">Turkish</label> <input type="text" value="" id="tr_var1" /></li>
|
||||
<li class="vi"><label for="vi_var1">Vietnamese</label> <input type="text" value="" id="vi_var1" /></li>
|
||||
<li class="mn"><label for="mn_var1">Mongolian</label> <input type="text" value="" id="mn_var1" /></li>
|
||||
</ul>
|
||||
<div class="action">
|
||||
<!-- 여기부터 기존 랭귀지 변수를 수정한 경우에만 보인다 -->
|
||||
<p>다국어 텍스트가 변경되었습니다. <em>업데이트</em> 버튼을 클릭하면 같은 텍스트를 사용하는 다른 페이지에도 반영됩니다. <em>새로 저장</em> 버튼을 클릭하면 이 페이지에만 적용됩니다.</p>
|
||||
<div class="btnArea">
|
||||
<span class="btn small"><input type="submit" value="업데이트" /></span>
|
||||
<span class="btn small"><input type="submit" value="새로저장" /></span>
|
||||
</div>
|
||||
<!-- 여기까지 기존 랭귀지 변수를 수정한 경우에만 보인다 -->
|
||||
<p><a href="#">다국어 텍스트 관리</a></p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Multilingual -->
|
||||
<span class="desc"><a href="#langEdit" class="tgAnchor">Multilingual</a></span>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<p class="q"><label for="menu_url">Module ID or URL</label></p>
|
||||
<div class="a">
|
||||
<input type="text" id="menu_url" name="menu_url" />
|
||||
<div id="findMid" class="suggestion">
|
||||
<ul>
|
||||
<li><button type="button">freeBoard</button></li>
|
||||
<li><button type="button">userForum</button></li>
|
||||
</ul>
|
||||
</div>
|
||||
<span class="desc"><a href="#findMid" class="tgAnchor">Find Module ID</a></span>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<p class="q">Which window should be open?</p>
|
||||
<p class="a">
|
||||
<input type="radio" name="menu_open_window" id="self" value="N" /> <label for="self">Self</label>
|
||||
<input type="radio" name="menu_open_window" id="blank" value="Y" /> <label for="blank">Blank</label>
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p class="q">Authority for access.</p>
|
||||
<p class="a" id="groupList">
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="btnArea">
|
||||
<span class="btn"><input type="submit" value="Save" /></span>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
Loading…
Add table
Add a link
Reference in a new issue