mirror of
https://github.com/Lastorder-DC/rhymix.git
synced 2026-01-14 00:39:57 +09:00
git-svn-id: http://xe-core.googlecode.com/svn/branches/maserati@11299 201d5d3c-b55e-5fd7-737f-ddc643e51545
842 lines
29 KiB
HTML
842 lines
29 KiB
HTML
<load target="./css/themes/classic/style.css" />
|
||
|
||
<load target="./js/_lib/jquery.cookie.js" />
|
||
<load target="./js/_lib/jquery.hotkeys.js" />
|
||
<load target="./js/jquery.jstree.js" />
|
||
<script src="http://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.js"></script>
|
||
|
||
<div class="x_page-header">
|
||
<h1>{$lang->menu_gnb_sub['siteMap']}</h1>
|
||
</div>
|
||
<div cond="$XE_VALIDATOR_MESSAGE" class="message {$XE_VALIDATOR_MESSAGE_TYPE}">
|
||
<p>{$XE_VALIDATOR_MESSAGE}</p>
|
||
</div>
|
||
<div id="site">
|
||
<div class="col map">
|
||
<section class="mapi">
|
||
<div id="siteMapTree"></div>
|
||
<script id="tmpl_menuTree" type="text/x-jquery-tmpl">
|
||
<ul>
|
||
{{html Nodes}}
|
||
</ul>
|
||
</script>
|
||
|
||
<script id="tmpl_menuTreeNode" type="text/x-jquery-tmpl">
|
||
<li id="${MenuId}">
|
||
<i class="v"></i><i class="h"></i>
|
||
<a href="#" class="tx">${MenuTitle}</a>
|
||
<span class="side">
|
||
<button data-toggle="#add">메뉴추가</button>
|
||
<button data-toggle="#info">속성편집</button>
|
||
</span>
|
||
{{html SubTree}}
|
||
</li>
|
||
</script>
|
||
|
||
<ul>
|
||
<li class="root">
|
||
<div class="item">
|
||
<strong>기본 사이트맵</strong>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
<ul>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#info" class="tx"><i class="x_icon-file"></i> 메뉴1 <i class="x_icon-home"></i></a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
<ul>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#info" class="tx"><i class="x_icon-file"></i> 메뉴1-1</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
<ul>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#info" class="tx"><i class="x_icon-file"></i> 메뉴1-1-1</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
<ul>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#" class="tx"><i class="x_icon-file"></i> 메뉴1-1-1-1</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
<ul>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#" class="tx"><i class="x_icon-file"></i> 메뉴1-1-1-1-1</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
<ul>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#" class="tx"><i class="x_icon-file"></i> 메뉴1-1-1-1-1-1</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#" class="tx"><i class="x_icon-file"></i> 메뉴1-1-1-2</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
<ul>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#" class="tx"><i class="x_icon-file"></i> 메뉴1-1-1-2-1</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#info" class="tx"><i class="x_icon-file"></i> 메뉴1-1-2</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#info" class="tx"><i class="x_icon-file"></i> 메뉴1-2</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#info" class="tx"><i class="x_icon-file"></i> 메뉴2</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
<ul>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#info" class="tx"><i class="x_icon-file"></i> 메뉴2-1</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
</li>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#info" class="tx"><i class="x_icon-file"></i> 메뉴2-2</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
</li>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#info" class="tx"><i class="x_icon-file"></i> 메뉴2-3</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
<li class="root">
|
||
<div class="item">
|
||
<strong>기본 사이트맵</strong>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
<ul>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#info" class="tx"><i class="x_icon-file"></i> 메뉴1</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
<ul>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#info" class="tx"><i class="x_icon-file"></i> 메뉴1-1</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
<ul>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#info" class="tx"><i class="x_icon-file"></i> 메뉴1-1-1</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
<ul>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#" class="tx"><i class="x_icon-file"></i> 메뉴1-1-1-1</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
<ul>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#" class="tx"><i class="x_icon-file"></i> 메뉴1-1-1-1-1</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
<ul>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#" class="tx"><i class="x_icon-file"></i> 메뉴1-1-1-1-1-1</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#" class="tx"><i class="x_icon-file"></i> 메뉴1-1-1-2</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
<ul>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#" class="tx"><i class="x_icon-file"></i> 메뉴1-1-1-2-1</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#info" class="tx"><i class="x_icon-file"></i> 메뉴1-1-2</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#info" class="tx"><i class="x_icon-file"></i> 메뉴1-2</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#info" class="tx"><i class="x_icon-file"></i> 메뉴2</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
<ul>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#info" class="tx"><i class="x_icon-file"></i> 메뉴2-1</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
</li>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#info" class="tx"><i class="x_icon-file"></i> 메뉴2-2</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
</li>
|
||
<li>
|
||
<i class="v"></i><i class="h"></i>
|
||
<div class="item">
|
||
<a href="#info" class="tx"><i class="x_icon-file"></i> 메뉴2-3</a>
|
||
<span class="side">
|
||
<a href="#add" data-toggle="#add">메뉴추가</a>
|
||
<a href="#info" data-toggle="#info">속성편집</a>
|
||
</span>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
<div class="x_btn-group" style="margin:15px 0;padding:10px 0;border-top:1px solid #ccc;text-align:right">
|
||
<button type="button" class="x_btn x_btn-small x_btn-inverse"><i class="x_icon-plus x_icon-white"></i> 사이트맵 추가</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="col" id="add">
|
||
<section>
|
||
<h1>메뉴 추가</h1>
|
||
<ul>
|
||
<li><a href="#add_page" data-show="#add_page" data-hide="#add_url,#download">문서 페이지 <i class="x_icon-circle-arrow-right"></i></a></li>
|
||
<li><a href="#add_page" data-show="#add_page" data-hide="#add_url,#download">위젯 페이지 <i class="x_icon-circle-arrow-right"></i></a></li>
|
||
<li><a href="#add_page" data-show="#add_page" data-hide="#add_url,#download">게시판 <i class="x_icon-circle-arrow-right"></i></a></li>
|
||
<li><a href="#add_url" data-show="#add_url" data-hide="#add_page,#download">URL 링크 <i class="x_icon-circle-arrow-right"></i></a></li>
|
||
</ul>
|
||
<div class="x_btn-group" style="margin:0;padding:10px 0;border-top:1px solid #ccc;text-align:right">
|
||
<a href="#download" class="x_btn x_btn-small x_btn-inverse" data-show="#download" data-hide="#add_page,#add_url"><i class="x_icon-plus x_icon-white"></i> 다른 메뉴타입설치</a>
|
||
</div>
|
||
</section>
|
||
</div>
|
||
<div class="col" id="add_page">
|
||
<fieldset>
|
||
<h1>문서 페이지</h1>
|
||
<ul>
|
||
<li>
|
||
<label for="menuName1">메뉴이름(브라우저 제목)</label>
|
||
<input id="menuName1" type="text" required />
|
||
</li>
|
||
<li>
|
||
<label for="menuId">메뉴 아이디 <a href="#help_menuId" class="x_icon-question-sign" data-toggle="#help_menuId">?</a></label>
|
||
<div id="help_menuId" class="x_alert x_alert-info" style="display:none;width:169px">
|
||
<button type="button" class="x_close" data-hide="#help_menuId">×</button>
|
||
<p>페이지 URL로 사용. URL을 사용할 필요가 없다면 생략 가능. 메뉴 생성 후 [속성>일반]에서 수정 가능.</p>
|
||
</div>
|
||
<input id="menuId" type="text" required placeholder="생략시 임의값 사용" />
|
||
</li>
|
||
</ul>
|
||
<div class="x_btn-group" style="margin:0;padding:10px 0;border-top:1px solid #ccc;text-align:right">
|
||
<button type="button" class="x_btn x_btn-small x_btn-primary">확인</button>
|
||
</div>
|
||
</fieldset>
|
||
<button type="button" class="x_close" data-hide="#add_page">×</button>
|
||
</div>
|
||
<div class="col" id="add_url">
|
||
<fieldset>
|
||
<h1>URL 링크</h1>
|
||
<ul>
|
||
<li>
|
||
<label for="menuName2">메뉴이름(브라우저 제목)</label>
|
||
<input id="menuName2" type="text" required />
|
||
</li>
|
||
<li>
|
||
<div class="x_tabbable">
|
||
<ul class="x_nav x_nav-tabs">
|
||
<li class="x_active"><a href="#linkUrl">URL 링크</a></li>
|
||
<li><a href="#linkMenu">메뉴 링크</a></li>
|
||
</ul>
|
||
<div class="x_tabcontent">
|
||
<div class="x_tab-pane x_active" id="linkUrl">
|
||
<input type="text" required title="URL 링크" />
|
||
</div>
|
||
<div class="x_tab-pane" id="linkMenu">
|
||
<input type="text" required title="메뉴 링크" disabled placeholder="메뉴를 선택하면 자동 입력됨" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
<div class="x_btn-group" style="margin:0;padding:10px 0;border-top:1px solid #ccc;text-align:right">
|
||
<button type="button" class="x_btn x_btn-small x_btn-primary">확인</button>
|
||
</div>
|
||
</fieldset>
|
||
<button type="button" class="x_close" data-hide="#add_url">×</button>
|
||
</div>
|
||
<div class="col" id="download">
|
||
<section>
|
||
<h1>다른 메뉴타입설치</h1>
|
||
<div class="list">
|
||
<div class="item">
|
||
<h2>모듈 이름</h2>
|
||
<p>많은 기능과 쉬운 사용법으로 사용자를 도와줄 게시판 모듈입니다. 주요기능 : 목록, 갤러리, 웹진, 블로그, 방명록, 한줄메모, 포인트경매등...</p>
|
||
<p>별점 9.7/58 <i>|</i> 최근 업데이트 2012-08-03 14:40 <i>|</i> 전체 다운로드 : 46,184</p>
|
||
<a href="#" class="x_icon-download-alt x_icon-white">설치</a>
|
||
</div>
|
||
<div class="item">
|
||
<h2>모듈 이름</h2>
|
||
<p>많은 기능과 쉬운 사용법으로 사용자를 도와줄 게시판 모듈입니다. 주요기능 : 목록, 갤러리, 웹진, 블로그, 방명록, 한줄메모, 포인트경매등...</p>
|
||
<p>별점 9.7/58 <i>|</i> 최근 업데이트 2012-08-03 14:40 <i>|</i> 전체 다운로드 : 46,184</p>
|
||
<a href="#" class="x_icon-download-alt x_icon-white">설치</a>
|
||
</div>
|
||
<div class="item">
|
||
<h2>모듈 이름</h2>
|
||
<p>많은 기능과 쉬운 사용법으로 사용자를 도와줄 게시판 모듈입니다. 주요기능 : 목록, 갤러리, 웹진, 블로그, 방명록, 한줄메모, 포인트경매등...</p>
|
||
<p>별점 9.7/58 <i>|</i> 최근 업데이트 2012-08-03 14:40 <i>|</i> 전체 다운로드 : 46,184</p>
|
||
<a href="#" class="x_icon-download-alt x_icon-white">설치</a>
|
||
</div>
|
||
<div class="item">
|
||
<h2>모듈 이름</h2>
|
||
<p>많은 기능과 쉬운 사용법으로 사용자를 도와줄 게시판 모듈입니다. 주요기능 : 목록, 갤러리, 웹진, 블로그, 방명록, 한줄메모, 포인트경매등...</p>
|
||
<p>별점 9.7/58 <i>|</i> 최근 업데이트 2012-08-03 14:40 <i>|</i> 전체 다운로드 : 46,184</p>
|
||
<a href="#" class="x_icon-download-alt x_icon-white">설치</a>
|
||
</div>
|
||
<div class="item">
|
||
<h2>모듈 이름</h2>
|
||
<p>많은 기능과 쉬운 사용법으로 사용자를 도와줄 게시판 모듈입니다. 주요기능 : 목록, 갤러리, 웹진, 블로그, 방명록, 한줄메모, 포인트경매등...</p>
|
||
<p>별점 9.7/58 <i>|</i> 최근 업데이트 2012-08-03 14:40 <i>|</i> 전체 다운로드 : 46,184</p>
|
||
<a href="#" class="x_icon-download-alt x_icon-white">설치</a>
|
||
</div>
|
||
</div>
|
||
<div class="x_pagination x_pagination-centered">
|
||
<ul>
|
||
<li class="x_disabled"><a href="#">«</a></li>
|
||
<li class="x_active"><a href="#">1</a></li>
|
||
<li><a href="#">2</a></li>
|
||
<li><a href="#">3</a></li>
|
||
<li><a href="#">4</a></li>
|
||
<li><a href="#">5</a></li>
|
||
<li><a href="#">»</a></li>
|
||
</ul>
|
||
</div>
|
||
</section>
|
||
<button type="button" class="x_close" data-hide="#download">×</button>
|
||
</div>
|
||
|
||
<div class="col" >
|
||
<section>
|
||
<h1>메뉴 1</h1>
|
||
</section>
|
||
</div>
|
||
|
||
<div class="col" >
|
||
<section>
|
||
<h1>메뉴 2</h1>
|
||
</section>
|
||
</div>
|
||
|
||
<div class="col" >
|
||
<section>
|
||
<h1>메뉴 3</h1>
|
||
</section>
|
||
</div>
|
||
|
||
<div class="col" >
|
||
<section>
|
||
<h1>메뉴 4</h1>
|
||
</section>
|
||
</div>
|
||
</div>
|
||
<style>
|
||
/* Site */
|
||
#site{position:relative;overflow-x:auto;overflow-y:hidden}
|
||
.col{position:relative;float:left;height:100%;min-width:200px;padding:0 10px;overflow-y:auto;overflow-x:hidden;border-left:1px solid #ddd}
|
||
.col:first-child{border:0;padding-left:0}
|
||
.col>section>h1{ line-height:30px;font-size:16px;border-bottom:2px solid #666;margin:0;color:#333}
|
||
.col>section>ul{ margin:0;padding:0;list-style:none}
|
||
/* .mapi * */
|
||
.mapi{margin:0 0 15px 0;min-width:200px}
|
||
.mapi ul{margin:0;padding:0;list-style:none}
|
||
.mapi li{padding:0 80px 0 0;white-space:nowrap;position:relative;line-height:30px;border-radius:3px;vertical-align:top}
|
||
.mapi li>ul{margin:0 -80px 0 0}
|
||
.mapi a{text-decoration:none}
|
||
.mapi>ul{padding:1px}
|
||
/* .root */
|
||
.mapi .root{margin-topp:15px;border:0 !important}
|
||
.mapi .root:first-child{ margin-top:0}
|
||
.mapi .root>ul{margin-top:10px}
|
||
.mapi .root>.item{position:relative;border-bottom:2px solid #666;margin:0 -80px 0 0;zoom:1}
|
||
.mapi .root>.item>strong{font-size:16px}
|
||
/* li>i.v || li>i.h */
|
||
.mapi .v,
|
||
.mapi .h{position:absolute;border:0;border-style:dotted;border-color:#ccc;overflow:hidden}
|
||
.mapi .v{width:0;top:30px;border-left-width:1px;display:none}
|
||
.mapi .h{width:14px;height:0;top:15px;border-top-width:1px}
|
||
.mapi .open>.v{display:block}
|
||
.mapi .hover .v,
|
||
.mapi .hover li>.h{border:1px solid #666}
|
||
.mapi .hover>.item,
|
||
.mapi .selected>.item{background:#666}
|
||
.mapi .root>ul>li>i.h{display:none}
|
||
/* li>.item */
|
||
.mapi .root li>.item{position:relative;z-index:2;border-radius:3px;margin:0 -80px 0 0;padding:0 80px 0 0;zoom:1}
|
||
.mapi .selected>.item{opacity:.75;filter:alpha(opacity=75)}
|
||
/* li>.item>.tx */
|
||
.mapi .tx{position:relative;z-index:2;display:block;line-height:30px;padding-right:30px;color:#000}
|
||
.mapi .hover>.item>.tx,
|
||
.mapi .selected>.item>.tx{color:#fff}
|
||
/* li>.item>a.tx */
|
||
.mapi .root>ul>li>.item>a{padding-left:24px}
|
||
.mapi .root>ul>li>ul>li>.item>a{padding-left:48px}
|
||
.mapi .root>ul>li>ul>li>ul>li>.item>a{padding-left:72px}
|
||
.mapi .root>ul>li>ul>li>ul>li>ul>li>.item>a{padding-left:96px}
|
||
.mapi .root>ul>li>ul>li>ul>li>ul>li>ul>li>.item>a{padding-left:120px}
|
||
.mapi .root>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>.item>a{padding-left:144px}
|
||
.mapi .root>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>.item>a{padding-left:168px}
|
||
.mapi .root>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>.item>a{padding-left:192px}
|
||
.mapi .root>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>.item>a{padding-left:216px}
|
||
/* li>.item>.tx>i */
|
||
.mapi .tx>i[class^="x_icon-"]:first-child{position:relative;left:-20px;margin:0 -20px 0 0;opacity:.5;filter:alpha(opacity=50)}
|
||
.mapi .tx>i[class^="x_icon-home"]{opacity:.75;filter:alpha(opacity=75)}
|
||
.mapi .hover>.item>.tx>i[class*="-white"],
|
||
.mapi .selected>.item>.tx>i[class*="-white"]{opacity:1;filter:alpha(opacity=100)}
|
||
/* li>.item>.side */
|
||
.mapi .side{position:absolute;z-index:2;top:3px;right:3px;line-height:0}
|
||
.mapi .side>a{display:inline-block;border-radius:3px;width:24px;height:24px;overflow:hidden;line-height:0;text-indent:24px;background:#94A55C url({getUrl('')}common/img/glyphicons-halflings-white.png) no-repeat}
|
||
.mapi .side>a[href="#add"]{background-position:5px -91px}
|
||
.mapi .side>a[href="#info"]{background-position:-427px 5px}
|
||
.mapi .side>a:hover,
|
||
.mapi .side>a:focus,
|
||
.mapi .side>a.active{background-color:#333}
|
||
/* li>.item>ul */
|
||
.mapi .root>ul ul{display:none}
|
||
.mapi .root>ul li.open>ul{display:block}
|
||
/* Add */
|
||
#add.col>section>ul>li{ border-top:1px dotted #ccc;padding:7px 0}
|
||
#add.col>section>ul>li:first-child{ border-top:0}
|
||
|
||
</style>
|
||
<!--[if IE 7]>
|
||
<script>
|
||
jQuery(function($){
|
||
// IE .col width bug fix
|
||
$('.col').each(function(){
|
||
var $this = $(this);
|
||
setTimeout(function(){
|
||
var childW = $this.children().width();
|
||
$this.width(childW);
|
||
},0);
|
||
});
|
||
});
|
||
</script>
|
||
<![endif]-->
|
||
<script>
|
||
//<![CDATA[
|
||
function onSiteMapReceived(htData){
|
||
var $ = jQuery;
|
||
var aMenuList = htData.menuList;
|
||
|
||
//console.log(aMenuList, aMenuList.length);
|
||
//console.log(createTreeMarkup(aMenuList));
|
||
$("#siteMapTree").html(createTreeMarkup(aMenuList));
|
||
|
||
$("#siteMapTree")
|
||
// call `.jstree` with the options object
|
||
.jstree({
|
||
// the `plugins` array allows you to configure the active plugins on this instance
|
||
"plugins" : ["themes","html_data","ui","crrm","hotkeys","contextmenu", "dnd"],
|
||
//"themes","json_data","ui","crrm","cookies","dnd","search","types","hotkeys","contextmenu"
|
||
// each plugin you have included can have its own config object
|
||
"core" : { "initially_open" : [ "nhtml_1" ] }
|
||
// it makes sense to configure a plugin only if overriding the defaults
|
||
})
|
||
.bind("create_node.jstree", function (event, data) {
|
||
var v = $("<i>").addClass("v");
|
||
var h = $("<i>").addClass("h");
|
||
//'<i class="v"></i><i class="h"></i>'
|
||
var btns = $("<span>").addClass("side").html('<button data-toggle="#add">메뉴추가</button> <button data-toggle="#info">속성편집</button>');
|
||
|
||
//data.rslt.obj.prepend(h);
|
||
//data.rslt.obj.prepend(v);
|
||
h.insertBefore(data.rslt.obj.find("a"));
|
||
v.insertBefore(data.rslt.obj.find("a"));
|
||
|
||
data.rslt.obj.append(btns);
|
||
});
|
||
}
|
||
|
||
var htNodeInfo = {};
|
||
// return html
|
||
function createTreeMarkup(aNode){
|
||
var $ = jQuery;
|
||
|
||
if(aNode.length == 0){
|
||
return "";
|
||
}
|
||
|
||
var sActiveBtn, sNormalBtn, sHoverBtn, sExpand, sLink, aSubNodes, sNodeSrl, sOpenWindow, sParentSrl, nSelected, sText, sURL, sIsStartModule, aSubNode;
|
||
|
||
// 1: Sitemap node, 2: Menu node
|
||
var nNodeType;
|
||
|
||
var sResult = "";
|
||
for(var i=0, nLen=aNode.length; i<nLen; i++){
|
||
//console.log(aNode[i]);
|
||
|
||
// Only sitemap node has menuSrl
|
||
if(aNode[i].menuSrl){
|
||
nNodeType = 1;
|
||
}else{
|
||
nNodeType = 2;
|
||
}
|
||
|
||
switch(nNodeType){
|
||
/*
|
||
list: Array[1]
|
||
menuSrl: "59"
|
||
title: "welcome_menu"
|
||
*/
|
||
case 1:
|
||
sText = aNode[i].title;
|
||
sNodeSrl = aNode[i].menu_srl;
|
||
|
||
aSubNode = aNode[i].menuItems.list;
|
||
break;
|
||
|
||
/*
|
||
active_btn: ""
|
||
expand: "N"
|
||
hover_btn: ""
|
||
href: ""
|
||
link: "menu1"
|
||
list: Array[1]
|
||
node_srl: "60"
|
||
normal_btn: ""
|
||
open_window: "N"
|
||
parent_srl: "0"
|
||
selected: 0
|
||
text: "menu1"
|
||
url: ""
|
||
is_start_module: 1 or true
|
||
*/
|
||
case 2:
|
||
sText = aNode[i].text;
|
||
sLink = aNode[i].link;
|
||
sURL = aNode[i].url;
|
||
sNodeSrl = aNode[i].node_srl;
|
||
sParentSrl = aNode[i].parent_srl;
|
||
|
||
sExpand = aNode[i].expand;
|
||
sOpenWindow = aNode[i].open_window;
|
||
|
||
nSelected = aNode[i].selected;
|
||
|
||
sActiveBtn = aNode[i].active_btn;
|
||
sNormalBtn = aNode[i].normal_btn;
|
||
sHoverBtn = aNode[i].hover_btn;
|
||
|
||
sIsStartModule = aNode[i].is_start_module;
|
||
|
||
aSubNode = aNode[i].list;
|
||
break;
|
||
|
||
default:
|
||
}
|
||
|
||
|
||
htNodeInfo[sNodeSrl] = aNode[i];
|
||
htNodeInfo[sNodeSrl].nNodeType = nNodeType;
|
||
|
||
sSubTree = "";
|
||
if(aSubNode && aSubNode.length>0){
|
||
sSubTree = createTreeMarkup(aSubNode, aNode[i]);
|
||
}
|
||
/*
|
||
if(sMenuType === "shortcut"){
|
||
sText = sText + " ${s}";
|
||
}
|
||
*/
|
||
if(sIsStartModule){
|
||
sText = sText + " ${h}";
|
||
}
|
||
|
||
sResult += $.tmpl( "menuTreeNode", {MenuTitle:sText,MenuId:sNodeSrl,SubTree:sSubTree} ).get()[0].outerHTML.replace("${s}", "<i class='icon-share-alt'></i>").replace("${h}", "<i class='x_icon-home'></i>");
|
||
}
|
||
|
||
return $.tmpl( "menuTree", {Nodes:sResult} ).get()[0].outerHTML;
|
||
}
|
||
|
||
jQuery(function($){
|
||
var _oldhide = $.fn.hide;
|
||
$.fn.hide = function(speed, callback) {
|
||
$(this).trigger('hide');
|
||
return _oldhide.apply(this,arguments);
|
||
}
|
||
|
||
//$( "#tmpl_siteMap" ).template( "siteMap" );
|
||
$( "#tmpl_menuTree" ).template( "menuTree" );
|
||
$( "#tmpl_menuTreeNode" ).template( "menuTreeNode" );
|
||
|
||
var params = {};
|
||
var response_tags = new Array('menuList');
|
||
params['menu_srl'] = 0;
|
||
$.exec_json("menu.getMenuAdminSiteMap", params, onSiteMapReceived);
|
||
|
||
//$.jstree._themes = "PATH/TO/FOLDER/";
|
||
//$.jstree._themes = "/maserati/modules/menu/tpl/css/themes/";
|
||
$.jstree._themes = '{getUrl("")}/modules/menu/tpl/css/themes/';
|
||
|
||
// Set #site height fix
|
||
$(window).resize(function(){
|
||
var wHeigh = $(window).height();
|
||
var $site = $('#site');
|
||
$site.height(wHeigh - 270);
|
||
}).resize();
|
||
// Draw .h/.v line and display file/folder icon
|
||
var $mapi = $('.map .root li');
|
||
$mapi.addClass('open');
|
||
function drawMap(){
|
||
$mapi.each(function(){
|
||
var $this = $(this);
|
||
var verticalX = parseInt($this.find('>.item>.tx').css('paddingLeft'));
|
||
// Draw line
|
||
$this.find('>.h').css({ // Horizontal line position
|
||
left: verticalX -39
|
||
});
|
||
var submenu = $this.find('>ul').length;
|
||
var hasopen = $this.hasClass('open');
|
||
if(submenu){ // Vertical line position
|
||
var verticalH = parseInt($this.height())-15;
|
||
var removeH = parseInt($this.find('>ul>li:last-child').height());
|
||
$this.find('>.v').css({
|
||
left: verticalX -15,
|
||
height: verticalH - removeH
|
||
});
|
||
$this.find('>.item>.tx>i').removeClass('x_icon-file'); // Remove file icon
|
||
} else {
|
||
$this.find('>.v').remove();
|
||
}
|
||
// Display icon
|
||
var folderOpen = 'x_icon-folder-open';
|
||
var folderClose = 'x_icon-folder-close';
|
||
if(submenu && hasopen){
|
||
$this.find('>.item>.tx>i:first-child').removeClass(folderClose).addClass(folderOpen);
|
||
} else if(submenu && !hasopen) {
|
||
$this.find('>.item>.tx>i:first-child').removeClass(folderOpen).addClass(folderClose);
|
||
}
|
||
|
||
});
|
||
}
|
||
drawMap();
|
||
// li.hover class toggle
|
||
$mapi.bind({
|
||
mouseover: function(event){
|
||
$(this).addClass('hover');
|
||
$(this).not('.selected').find('>.item>.tx>i').addClass('x_icon-white');
|
||
event.stopPropagation();
|
||
},
|
||
mouseout: function(event){
|
||
$(this).removeClass('hover');
|
||
$(this).not('.selected').find('>.item>.tx>i').removeClass('x_icon-white');
|
||
event.stopPropagation();
|
||
}
|
||
});
|
||
// a.tx submenu toggle
|
||
$mapi.find('>.item>.tx').click(function(){
|
||
$(this).closest('li').toggleClass('open');
|
||
drawMap();
|
||
return false;
|
||
});
|
||
// li.selected and .side>a toggle
|
||
var $mapi = $('.map li');
|
||
$mapi.find('>.item>.side>a')
|
||
.click(function(){
|
||
var $this = $(this);
|
||
var iconWhite = 'x_icon-white';
|
||
$mapi.removeClass('selected').find('>.item>.side>a').not($this).removeClass('active');
|
||
$mapi.find('>.item').not($this.closest('.item')).find('>.tx>i').removeClass(iconWhite);
|
||
$this.toggleClass('active').siblings().removeClass('active');
|
||
if($this.parent('.side').children('a.active').length){
|
||
$this.closest('li:not(".root")').addClass('selected').find('>.item>.tx>i').addClass(iconWhite);
|
||
}
|
||
})
|
||
.hover(
|
||
function(){
|
||
var $this = $(this);
|
||
var title = $this.text();
|
||
$this.attr('title', title);
|
||
},
|
||
function(){
|
||
var $this = $(this);
|
||
$this.removeAttr('title');
|
||
}
|
||
);
|
||
});
|
||
//]]>
|
||
</script>
|