From 4eac255d7df9cf77eaca194e6373cba906df32e2 Mon Sep 17 00:00:00 2001
From: flyskyko <sinsy200@gmail.com>
Date: Thu, 11 Oct 2012 03:08:17 +0000
Subject: [PATCH] Issue 2380:	Admin UI Refactoring - Advanced - Layouts

git-svn-id: http://xe-core.googlecode.com/svn/branches/maserati@11661 201d5d3c-b55e-5fd7-737f-ddc643e51545
---
 common/js/common.js                           |  11 -
 modules/admin/tpl/js/admin.js                 | 362 ++++++-
 modules/admin/tpl/js/admin.min.js             | 955 +-----------------
 modules/layout/tpl/layout_modify.html         |  11 +-
 modules/module/conf/module.xml                |   2 +
 modules/module/lang/lang.xml                  |  26 +
 modules/module/module.admin.model.php         |  40 +
 .../module/queries/getLangListByLangcode.xml  |   1 +
 modules/module/tpl/multilingual_v17.html      |  48 +
 modules/module/tpl/multilingual_v17_list.html |  64 ++
 10 files changed, 584 insertions(+), 936 deletions(-)
 create mode 100644 modules/module/tpl/multilingual_v17.html
 create mode 100644 modules/module/tpl/multilingual_v17_list.html

diff --git a/common/js/common.js b/common/js/common.js
index bb8128aae..5aa313bfd 100644
--- a/common/js/common.js
+++ b/common/js/common.js
@@ -924,17 +924,6 @@ function get_by_id(id) {
 }
 
 jQuery(function($){
-    $('.lang_code').each(
-		function() 
-		{
-			var objText = $(this);
-			var targetName = objText.attr("id");
-			if(typeof(targetName) == "undefined") targetName = objText.attr("name");
-			if(typeof(targetName) == "undefined") return;
-			objText.after("<a href='"+request_uri.setQuery('module','module').setQuery('act','dispModuleAdminLangcode').setQuery('target',targetName)+"' class='buttonSet buttonSetting' onclick='popopen(this.href);return false;'><span>find_langcode</span></a>"); 
-		}
-    );
-
 	// display popup menu that contains member actions and document actions
 	$(document).click(function(evt) {
 		var $area = $('#popup_menu_area');
diff --git a/modules/admin/tpl/js/admin.js b/modules/admin/tpl/js/admin.js
index 1920b6439..2755f1fb4 100644
--- a/modules/admin/tpl/js/admin.js
+++ b/modules/admin/tpl/js/admin.js
@@ -1,7 +1,7 @@
 /* NHN (developers@xpressengine.com) */
 jQuery(function($){
 // iSO mobile device toolbar remove
-	window.top.scrollTo(0,0);
+	window.scrollTo(0,0);
 // Skip to content
 	$('.x .skipNav>a').click(function(){
 		$($(this).attr('href')).attr('tabindex','0').css('outline','0').focus();
@@ -34,7 +34,7 @@ jQuery(function($){
 	});
 // Tab Navigation
 	$('.x .x_tab-content>.x_tab-pane:not(".x_active")').hide();
-	$('.x .x_nav-tabs').find('>li>a[href^="#"]').click(function(){
+	$(document.body).on('click', '.x .x_nav-tabs>li>a[href^="#"]', function(){
 		var $this = $(this);
 		$this.parent('li').addClass('x_active').siblings().removeClass('x_active');
 		$this.closest('.x_nav-tabs').next('.x_tab-content').find($this.attr('href')).addClass('x_active').show().siblings().removeClass('x_active').hide();
@@ -234,9 +234,9 @@ $.fn.xeModalWindow = function(){
 			$('.x_modal-backdrop').hide();
 			$this.focus();
 		});
+	$('div.x_modal').addClass('x').hide();
 };
 $('a.modalAnchor').xeModalWindow();
-$('div.x_modal').addClass('x').hide();
 
 });
 
@@ -896,6 +896,362 @@ $('.filebox')
 		simpleBtn.removeClass('x_active');
 	});
 
+// Multilingual
+	var $multilinguals_v15 = $('.vLang[type="hidden"]');
+	var $multilinguals = $('.lang_code');
+
+	if($multilinguals_v15.length || $multilinguals.length){
+		function on_complete(data){
+			var $content = $('.x #content');
+			$content.append(data.html);
+
+			var tmpCount = 0;
+
+			$multilinguals_v15.each(function(){
+				var $this = $(this);
+
+				$this.removeClass('vLang').addClass('lang_code');
+				$this.parent().find('.editUserLang').remove();
+			});
+
+			$multilinguals = $('.lang_code');
+
+			$multilinguals.each(function(){
+				var $this = $(this);
+				var id = $this.attr('id');
+				if(!id){
+					id = '__lang_code_' + tmpCount;
+					tmpCount++;
+					$this.attr('id', id);
+				}
+
+				if(this.tagName == 'TEXTAREA' || $this.next('textarea.vLang').length){
+					var $displayInput = $('<textarea id="lang_' + id + '" class="displayInput" style="width:179px">').data('lang-id', id);
+				}else{
+					var $displayInput = $('<input type="text" id="lang_' + id + '" class="displayInput" style="width:179px">').data('lang-id', id);
+				}
+				var $remover = $('<button type="button" class="x_add-on remover" title="Remove Multilingual Text"><i class="x_icon-remove"></i> Remove Multilingual Text</button>').data('lang-target', id);
+				var $setter = $('<a href="#g11n" class="x_add-on modalAnchor" title="Set Multilungual Text"><i class="x_icon-globe"></i> Set Multilingual Text</a>').data('lang-target', id);
+
+				$this.parent().addClass('g11n').addClass('x_input-append');
+				$this.after($displayInput, $remover, $setter);
+				$this.parent().find('.vLang').remove();
+				$this.hide();
+				$setter.xeModalWindow();
+
+				// text change
+				var $hiddenInput = $this;
+				$displayInput.keydown(function(){
+					$this = $(this);
+
+					if($this.closest('.g11n').hasClass('active')) return;
+
+					$hiddenInput.val($this.val());
+				});
+
+				// load value
+				$displayInput.val($hiddenInput.val());
+				var pattern = /^\$user_lang->/;
+				if(pattern.test($displayInput.val())){
+					$.exec_json('module.getModuleAdminLangCode', {'name': $displayInput.val().replace('$user_lang->', '')}, on_complete);
+
+					function on_complete(data){
+						if(!data || !data.langs) return;
+
+						$displayInput.closest('.g11n').addClass('active');
+						$displayInput.val(data.langs[xe.current_lang]).attr('disabled', 'disabled').width(135);
+					}
+				}
+			});
+
+			var $g11n_set = $('.x .g11n'); // set container
+			var $g11n_anchor = $g11n_set.children('.modalAnchor');
+			var $g11n_get = $('.x #g11n'); // get container
+			var $g11n_create = $g11n_get.find('#lang_create'); // create section
+			var $g11n_search = $g11n_get.find('#lang_search'); // search section
+			var is_create_changed = false;
+
+			// check create change
+			$g11n_create.find('.editMode textarea').change(function(){
+				is_create_changed = true;
+			});
+
+			// use lang code
+			function g11n_use_lang_code($this, code, value){
+				var $displayInput = $('#lang_' + $this.closest('.x_modal').data('lang-target'));
+
+				$displayInput
+					.width(135)
+					.attr('disabled', 'disabled')
+					.val(value)
+					.parent('.g11n').addClass('active');
+				$displayInput.siblings('#' + $displayInput.data('lang-id')).val('$user_lang->' + code);
+
+				is_create_changed = false;
+				$displayInput.siblings('[href="#g11n"]').trigger('close.mw');
+
+			}
+
+			// get list
+			function g11n_get_list(page, search_keyword, name){
+				if(!page) page = 1;
+				if(!search_keyword) search_keyword = '';
+				if(!name) name = '';
+
+				$.exec_json('module.getModuleAdminLangListHtml', {'page': page, 'search_keyword': search_keyword, 'name': name}, on_complete);
+
+				function on_complete(data){
+					if(!data || !data.html) return;
+
+					$('#lang_search').html(data.html);
+
+					// page
+					$('#lang_search .x_pagination a').click(function(){
+						var page = $(this).data('page');
+						var search_keyword = $(this).data('search_keyword');
+
+						if(!page) return;
+
+						g11n_get_list(page, search_keyword);
+						return false;
+					});
+
+					$('#lang_search .x_pagination').submit(function(){
+						var page = $(this).find('[name="page"]').val();
+						var search_keyword = $(this).data('search_keyword');
+
+						if(!page) return false;
+
+						g11n_get_list(page, search_keyword);
+						return false;
+					});
+
+					// search
+					$('#lang_search .search').submit(function(){
+						var search_keyword = $(this).find('[name="search_keyword"]').val();
+
+						g11n_get_list(1, search_keyword);
+						return false;
+					});
+
+					$('#lang_search #search_cancel').click(function(){
+						g11n_get_list(1, '');
+					});
+
+					// text click
+					$('#lang_search').find('[href^="#lang-"]').append('<i class="x_icon-chevron-down"></i>').click(function(){
+						var $this = $(this);
+						var lang_code = $this.data('lang_code');
+
+						g11n_search_save_confirm();
+
+						// Fieldset close/open display
+						var up = 'x_icon-chevron-up';
+						var down = 'x_icon-chevron-down';
+						if($this.next('fieldset').is(':visible')){
+							$this.children('i').removeClass(up).addClass(down);
+						}else{
+							$this.children('i').removeClass(down).addClass(up);
+							$this.parent('.item').siblings('.item').find('a > i').removeClass(up).addClass(down).end().children('fieldset').hide();
+						}
+
+						if($this.data('is_loaded')) return;
+
+						$.exec_json('module.getModuleAdminLangCode', {'name': lang_code}, on_complete);
+
+						function on_complete(data){
+							var $textareas = $($this.attr('href') + ' textarea');
+
+							$textareas.each(function(){
+								var $this = $(this);
+								var value = data.langs[$this.data('lang')];
+								var pattern = /^\$user_lang->/;
+
+								if(pattern.test(value)){
+									$this.val('').data('value', '');
+								}else{
+									$this.val(value).data('value', value);
+								}
+							});
+
+							$this.data('is_loaded', true);
+						}
+					});
+
+					if(name){
+						$('#lang_search').find('[href^="#lang-"]').trigger('click');
+					}
+
+					// Modify click
+					$('#lang_search').find('.modify').click(function(){
+						$(this).closest('fieldset').addClass('editMode').find('textarea').removeAttr('disabled');
+					});
+
+					// Cancel Click
+					$('#lang_search').find('.cancel').click(function(){
+						$(this).closest('fieldset').removeClass('editMode').find('textarea').attr('disabled', 'disabled').each(function(){
+							var $this = $(this);
+
+							$this.val($this.data('value'));
+						});
+
+						return false;
+					});
+
+					// Save Click
+					$('#lang_search').find('.item').submit(function(){
+						var $this = $(this);
+						var $textareas = $this.find('.editMode').children('textarea');
+						var $anchor = $this.find('[href^="#lang-"]');
+						var params = {};
+						var current_lang_value = null;
+
+						// create lang list
+						$textareas.each(function(){
+							var $this = $(this);
+							params[$this.attr('class')] = $this.val();
+							$this.data('tmp_value', $this.val());
+							if(xe.current_lang == $this.attr('class')){
+								current_lang_value = $this.val();
+							}
+						});
+
+						params.lang_name = $anchor.data('lang_code');
+
+						// submit
+						$.exec_json('module.procModuleAdminInsertLang', params, on_complete);
+
+						function on_complete(data){
+							if(!data || data.error || !data.name) return;
+
+							$textareas.each(function(){
+								var $this = $(this);
+								$this.data('value', $this.data('tmp_value'));
+							});
+							$anchor.children('span').html(current_lang_value);
+
+							$('#lang_search').find('.cancel').trigger('click');
+							$this.find('.useit').trigger('click');
+						}
+
+						return false;
+					});
+
+					// Useit click
+					$('#lang_search').find('.useit').click(function(){
+						var $this = $(this);
+						var $anchor = $this.closest('.item').find('[href^="#lang-"]');
+						var name = $anchor.data('lang_code');
+						var value = $anchor.children('span').text();
+
+						g11n_use_lang_code($this, name, value);
+					});
+				}
+			}
+
+			// #lang_create confirm
+			function g11n_create_save_confirm(){
+				if($g11n_create.is(':visible') && is_create_changed){
+					if(confirm(xe.msg_confirm_save_and_use_multilingual)){
+						$g11n_create.find('.save-useit').trigger('click');
+					}
+				}
+
+				return true;
+			}
+
+			// #lang_search confirm
+			function g11n_search_save_confirm(){
+				if($g11n_search.is(':visible') && $g11n_search.find('.editMode').length){
+					var $search_item = $g11n_search.find('form.item');
+					if(confirm(xe.msg_confirm_save_and_use_multilingual)){
+						$search_item.find('.save').trigger('click').end().find('textarea').attr('disabled', 'disabled');
+					}else{
+						$search_item.find('.cancel').trigger('click');
+					}
+				}
+
+				return true;
+			}
+
+			// #g11n Reset to default
+			function g11n_reset_default(){
+				$g11n_search.find('.item > fieldset').hide().prev('a').children('i').removeClass('x_icon-chevrom-up').addClass('x_icon-chevron-down');
+				$g11n_get.find('[href="#lang_create"]').trigger('click');
+				$g11n_create.find('.editMode').children('textarea').val('');
+				is_create_changed = false;
+
+				return true;
+			}
+
+			// Save-Useit click
+			$g11n_create.submit(function(){
+				var $this = $(this);
+				var params = {};
+				var current_lang_value = null;
+
+				// create lang list
+				$this.find('.editMode').children('textarea').each(function(){
+					var $this = $(this);
+					params[$this.attr('class')] = $this.val();
+					if(xe.current_lang == $this.attr('class')){
+						current_lang_value = $this.val();
+					}
+				});
+
+				if(!current_lang_value){
+					alert(xe.msg_empty_multilingual);
+					return false;
+				}
+
+				// submit
+				$.exec_json('module.procModuleAdminInsertLang', params, on_complete);
+
+				function on_complete(data){
+					if(!data || data.error || !data.name) return;
+
+					g11n_use_lang_code($this, data.name, current_lang_value);
+				}
+
+				return false;
+
+			});
+
+			// Remover click
+			$g11n_set.children('.remover').click(function(){
+				var $this = $(this);
+				var $g11n_set_input = $('#lang_' + $this.data('lang-target'));
+				$g11n_set_input.val('').removeAttr('disabled')
+					.width(179)
+					.parent('.g11n').removeClass('active');
+				$this.siblings('.lang_code').val('');
+			});
+
+			// Close click
+			$g11n_anchor.bind('before-close.mw', function(){
+				if(!g11n_create_save_confirm()) return false;
+				if(!g11n_search_save_confirm()) return false;
+				if(!g11n_reset_default()) return false;
+			});
+
+			// .modalAnchor click
+			$g11n_anchor.bind('open.mw',function(){
+				var $this = $(this);
+				var $displayInput = $this.siblings('.displayInput');
+
+				if($this.closest('.g11n').hasClass('active')){
+					g11n_get_list(1, '', $displayInput.prev('.lang_code').val().replace('$user_lang->', ''));
+					$($this.attr('href')).find('[href="#lang_search"]').trigger('click');
+				}else{
+					g11n_get_list();
+				}
+
+				$($this.attr('href')).data('lang-target', $this.data('lang-target'));
+			});
+		}
+		$.exec_json('module.getModuleAdminMultilingualHtml', {}, on_complete);
+	}
+
 });
 
 function getOffset(elem, offsetParent) {
diff --git a/modules/admin/tpl/js/admin.min.js b/modules/admin/tpl/js/admin.min.js
index 1920b6439..4f32cd67b 100644
--- a/modules/admin/tpl/js/admin.min.js
+++ b/modules/admin/tpl/js/admin.min.js
@@ -1,914 +1,41 @@
-/* NHN (developers@xpressengine.com) */
-jQuery(function($){
-// iSO mobile device toolbar remove
-	window.top.scrollTo(0,0);
-// Skip to content
-	$('.x .skipNav>a').click(function(){
-		$($(this).attr('href')).attr('tabindex','0').css('outline','0').focus();
-	});
-// TARGET toggle
-	$(document.body).on('click', '.x [data-toggle]', function(){
-		var $this = $(this);
-		var $target = $($this.attr('data-toggle'));
-		$target.toggle();
-		if($target.is(':visible') && !$target.find('a,input,button,textarea,select').length){
-			$target.attr('tabindex','0').focus();
-		} else if($target.is(':visible') && $target.find('a,input,button,textarea,select').length) {
-			$target.find('a,input,button,textarea,select').eq(0).focus();
-		} else {
-			$this.focus();
-		}
-		return false;
-	});
-// TARGET show
-	$(document.body).on('click', '.x [data-show]', function(){
-		$($(this).attr('data-show')).show().attr('tabindex','0').focus();
-		return false;
-	});
-// TARGET hide
-	$(document.body).on('click', '.x [data-hide]', function(){
-		var $this = $(this);
-		$($this.attr('data-hide')).hide();
-		$this.focus();
-		return false;
-	});
-// Tab Navigation
-	$('.x .x_tab-content>.x_tab-pane:not(".x_active")').hide();
-	$('.x .x_nav-tabs').find('>li>a[href^="#"]').click(function(){
-		var $this = $(this);
-		$this.parent('li').addClass('x_active').siblings().removeClass('x_active');
-		$this.closest('.x_nav-tabs').next('.x_tab-content').find($this.attr('href')).addClass('x_active').show().siblings().removeClass('x_active').hide();
-		return false;
-	});
-// GNB Height 100%
-	var $xBody = $('.x>.body');
-	var $xContent = $xBody.children('#content.content');
-	var $xGnb = $xBody.find('>.gnb');
-	var $xGnb_li = $xGnb.find('>ul>li');
-// GNB Hover toggle
-	function contentBugFix(){ // Chrome browser rendering bug fix
-		$xContent.width('99.99%');
-		setTimeout(function(){
-			$xContent.removeAttr('style');
-		}, 0);
-	}
-// GNB Click toggle
-	$xGnb_li.find('ul').prev('a')
-		.bind('click focus', function(){
-			var $this = $(this);
-			// Submenu toggle
-			$xGnb_li.not($this.parent('li')).removeClass('open');
-			$(this).parent('li').toggleClass('open');
-			$xBody.removeClass('wide');
-			contentBugFix();
-			return false;
-		});
-// GNB Mobile Toggle
-	$xGnb.find('>a[href="#gnbNav"]').click(function(){
-		$(this).parent('.gnb').toggleClass('open');
-		$xBody.toggleClass('wide');
-		contentBugFix();
-		return false;
-	});
-// GNB Close
-	$xGnb
-		.prepend('<button type="button" class="close before" />')
-		.append('<button type="button" class="close after" />');
-	$xGnb.find('>.close').focus(function(){
-		$xBody.addClass('wide');
-		contentBugFix();
-	});
-// Check All
-	$('.x th>input[type="checkbox"]')
-		.change(function() {
-			var $this = $(this), name = $this.data('name');
-
-			$this.closest('table')
-				.find('input:checkbox')
-					.filter(function(){
-						var $this = $(this);
-						return !$this.prop('disabled') && (($this.attr('name') == name) || ($this.data('name') == name));
-					})
-						.prop('checked', $this.prop('checked'))
-					.end()
-				.end()
-				.trigger('update.checkbox', [name, this.checked]);
-		});
-// Pagination
-	$(document.body).on('click', '.x .x_pagination .x_disabled, .x .x_pagination .x_active', function(){
-		return false;
-	});
-// Section Toggle
-	$('.x .section>h1').append('<button type="button" class="snToggle x_icon-chevron-up">Toggle this section</button>');
-	$('.x .section>h1>.snToggle').click(function(){
-		var $this = $(this);
-		var $section = $this.closest('.section');
-		if(!$section.hasClass('collapse')){
-			$section.addClass('collapse').children('h1:first').siblings().hide();
-			$this.removeClass('x_icon-chevron-up').addClass('x_icon-chevron-down');
-		} else {
-			$section.removeClass('collapse').children('h1:first').siblings().show();
-			$this.removeClass('x_icon-chevron-down').addClass('x_icon-chevron-up');
-		}
-	});
-// Alert Closer
-	var $xAlert = $('.x .x_alert');
-	$xAlert.prepend('<button type="button" class="x_close">&times;</button>');
-	$xAlert.children('.x_close').click(function(){
-		$(this).parent('.x_alert').hide();
-	});	
-// Desabled Buttons
-	$('.x .x_btn').click(function(){
-		if($(this).hasClass('x_disabled')){
-			return false;
-		}
-	});
-// Vertical Rule Style
-	$('.x i').each(function(){
-		var $this = $(this);
-		if($this.text() == '|'){
-			$this.addClass('vr');
-		}	
-	});
-});
-// Modal Window
-jQuery(function($){
-
-var ESC = 27;
-$.fn.xeModalWindow = function(){
-	this
-		.not('.xe-modal-window')
-		.addClass('xe-modal-window')
-		.each(function(){
-			$( $(this).attr('href') ).addClass('x').hide();
-		})
-		.click(function(){
-			var $this = $(this), $modal, $btnClose, disabled;
-
-			// get and initialize modal window
-			$modal = $( $this.attr('href') );
-
-			if($modal.data('state') == 'showing') {
-				$this.trigger('close.mw');
-			} else {
-				$this.trigger('open.mw');
-			}
-
-			return false;
-		})
-		.bind('open.mw', function(){
-			var $this = $(this), $modal, $btnClose, disabled, before_event, duration;
-			
-			$modal = $( $this.attr('href') );
-			if(!$modal.parent('body').length) {
-				$btnClose = $('<button type="button" class="x_close">&times;</button>');
-				$btnClose.click(function(){ $modal.data('anchor').trigger('close.mw') });
-				$modal.find('[data-hide]').click(function(){ $modal.data('anchor').trigger('close.mw') });
-				$('body').append('<div class="x_modal-backdrop"></div>').append($modal); // append background
-				$modal.prepend($btnClose); // prepend close button
-			}
-			
-			// set the related anchor
-			$modal.data('anchor', $this);
-
-			// before event trigger
-			before_event = $.Event('before-open.mw');
-			$this.trigger(before_event);
-
-			// is event canceled?
-			if(before_event.isDefaultPrevented()) return false;
-
-			// get modal window
-			$modal = $( $this.attr('href') );
-
-			// get duration
-			duration = $this.data('duration') || 'fast';
-
-			// set state : showing
-			$modal.data('state', 'showing');
-
-			// workaroud for IE6
-			$('html,body').addClass('modalContainer');
-
-			// after event trigger
-			function after(){ $this.trigger('after-open.mw') };
-
-			$(document).bind('keydown.mw', function(event){
-				if(event.which == ESC) {
-					$this.trigger('close.mw');
-					return false;
-				}
-			});
-
-			$modal
-				.fadeIn(duration, after)
-				.find('button.x_close:first').focus();
-			$('.x_modal-backdrop').show();
-		})
-		.bind('close.mw', function(){
-			var $this = $(this), before_event, $modal, duration;
-
-			// before event trigger
-			before_event = $.Event('before-close.mw');
-			$this.trigger(before_event);
-
-			// is event canceled?
-			if(before_event.isDefaultPrevented()) return false;
-
-			// get modal window
-			$modal = $( $this.attr('href') );
-
-			// get duration
-			duration = $this.data('duration') || 'fast';
-
-			// set state : hiding
-			$modal.data('state', 'hiding');
-
-			// workaroud for IE6
-			$('html,body').removeClass('modalContainer');
-
-			// after event trigger
-			function after(){ $this.trigger('after-close.mw') };
-
-			$modal.fadeOut(duration, after);
-			$('.x_modal-backdrop').hide();
-			$this.focus();
-		});
-};
-$('a.modalAnchor').xeModalWindow();
-$('div.x_modal').addClass('x').hide();
-
-});
-
-// Content Toggler
-jQuery(function($){
-
-var dont_close_this_time = false;
-var ESC = 27;
-
-$.fn.xeContentToggler = function(){
-	this
-		.not('.xe-content-toggler')
-		.addClass('xe-content-toggler')
-		.each(function(){
-			var $anchor = $(this); $layer = $($anchor.attr('href'));
-
-			$layer.hide()
-				.not('.xe-toggling-content')
-				.addClass('xe-toggling-content')
-				.mousedown(function(event){ dont_close_this_time = true })
-				.focusout(function(event){
-					setTimeout(function(){
-						if(!dont_close_this_time && !$layer.find(':focus').length && $layer.data('state') == 'showing') $anchor.trigger('close.tc');
-						dont_close_this_time = false;
-					}, 1);
-				});
-		})
-		.click(function(){
-			var $this = $(this), $layer;
-
-			// get content container
-			$layer = $( $this.attr('href') );
-
-			// set anchor object
-			$layer.data('anchor', $this);
-
-			if($layer.data('state') == 'showing') {
-				$this.trigger('close.tc');
-			} else {
-				$this.trigger('open.tc');
-			}
-
-			return false;
-		})
-		.bind('open.tc', function(){
-			var $this = $(this), $layer, effect, duration;
-
-			// get content container
-			$layer = $( $this.attr('href') );
-
-			// get effeect
-			effect = $this.data('effect');
-
-			// get duration
-			duration = $this.data('duration') || 'fast';
-
-			// set state : showing
-			$layer.data('state', 'showing');
-
-			// before event trigger
-			$this.trigger('before-open.tc');
-
-			dont_close_this_time = false;
-
-			// When mouse button is down or when ESC key is pressed close this layer
-			$(document)
-				.unbind('mousedown.tc keydown.tc')
-				.bind('mousedown.tc keydown.tc',
-					function(event){
-						if(event) {
-							if(event.type == 'keydown' && event.which != ESC) return true;
-							if(event.type == 'mousedown') {
-								var $t = $(event.target);
-								if($t.is('html,.tgAnchor,.tgContent') || $layer.has($t).length) return true;
-							}
-						}
-
-						$this.trigger('close.tc');
-
-						return false;
-					}
-				);
-
-			// triggering after
-			function trigger_after(){ $this.trigger('after-open.tc') }
-
-			switch(effect) {
-				case 'slide':
-					$layer.slideDown(duration, trigger_after);
-					break;
-				case 'slide-h':
-					var w = $layer.css({'overflow-x':'',width:''}).width();
-					$layer
-						.show()
-						.css({'overflow-x':'hidden',width:'0px'})
-						.animate({width:w}, duration, function(){ $layer.css({'overflow-x':'',width:''}); trigger_after(); });
-					break;
-				case 'fade':
-					$layer.fadeIn(duration, trigger_after);
-					break;
-				default:
-					$layer.show();
-					$this.trigger('after-open.tc');
-			}
-		})
-		.bind('close.tc', function(){
-			var $this = $(this), $layer, effect, duration;
-
-			// unbind document's event handlers
-			$(document).unbind('mousedown.tc keydown.tc');
-
-			// get content container
-			$layer = $( $this.attr('href') );
-
-			// get effeect
-			effect = $this.data('effect');
-
-			// get duration
-			duration = $this.data('duration') || 'fast';
-
-			// set state : hiding
-			$layer.data('state', 'hiding');
-
-			// before event trigger
-			$this.trigger('before-close.tc');
-
-			// triggering after
-			function trigger_after(){ $this.trigger('after-close.tc') };
-
-			// close this layer
-			switch(effect) {
-				case 'slide':
-					$layer.slideUp(duration, trigger_after);
-					break;
-				case 'slide-h':
-					$layer.animate({width:0}, duration, function(){ $layer.hide(); trigger_after(); });
-					break;
-				case 'fade':
-					$layer.fadeOut(duration, trigger_after);
-					break;
-				default:
-					$layer.hide();
-					$this.trigger('after-close.tc');
-			}
-		});
-
-	return this;
-};
-
-$('a.tgAnchor').xeContentToggler();
-
-});
-
-// Module finder
-jQuery(function($){
-
-$.fn.xeModuleFinder = function(){
-	this
-		.not('.xe-module-finder')
-		.addClass('xe-module-finder')
-		.find('a.tgAnchor.findsite')
-			.bind('before-open.tc', function(){
-				var $this, $ul, val;
-
-				$this = $(this);
-				$ul   = $($this.attr('href')).find('>ul');
-				val   = $this.prev('input:text').val();
-
-				function on_complete(data) {
-					var $li, list = data.site_list, i, c;
-
-					$ul.empty();
-					$this.closest('.modulefinder').find('.moduleList,.moduleIdList').attr('disabled','disabled');
-
-					if(data.error || !$.isArray(list)) {
-						$this.trigger('close.tc');
-						return;
-					}
-
-					for(i=0,c=list.length; i < c; i++) {
-						$li = $('<li />').appendTo($ul);
-						$('<button type="button" />').text(list[i].domain).data('site_srl', list[i].site_srl).appendTo($li);
-					}
-				};
-
-				$.exec_json('admin.getSiteAllList', {domain:val}, on_complete);
-			})
-		.end()
-		.find('.tgContent.suggestion')
-			.delegate('button','click',function(){
-				var $this, $finder;
-
-				$this    = $(this);
-				$finder  = $this.closest('.modulefinder');
-
-				function on_complete(data) {
-					var $mod_select, list = data.module_list, x;
-
-					if(data.error || !list) return;
-
-					$mod_select = $finder.find('.moduleList').data('module_list', list).removeAttr('disabled').empty();
-					for(x in list) {
-						if(!list.hasOwnProperty(x)) continue;
-						$('<option />').attr('value', x).text(list[x].title).appendTo($mod_select);
-					}
-					$mod_select.prop('selectedIndex', 0).change().focus();
-
-					if(!$mod_select.is(':visible')) {
-						$mod_select
-							.slideDown(100, function(){
-								$finder.find('.moduleIdList:not(:visible)').slideDown(100).trigger('show');
-							})
-							.trigger('show');
-					}
-				};
-
-				$finder.find('a.tgAnchor.findsite').trigger('close.tc');
-
-				$.exec_json('module.procModuleAdminGetList', {site_srl:$this.data('site_srl')}, on_complete);
-			})
-		.end()
-		.find('.moduleList,.moduleIdList').hide().end()
-		.find('.moduleList')
-			.change(function(){
-				var $this, $mid_select, val, list;
-
-				$this   = $(this);
-				val     = $this.val();
-				list    = $this.data('module_list');
-
-				if(!list[val]) return;
-
-				list = list[val].list;
-				$mid_select = $this.closest('.modulefinder').find('.moduleIdList').removeAttr('disabled').empty();
-
-				for(var x in list) {
-					if(!list.hasOwnProperty(x)) continue;
-					$('<option />').attr('value', list[x].module_srl).text(list[x].browser_title).appendTo($mid_select);
-				}
-				$mid_select.prop('selectedIndex', 0).change();
-			});
-
-	return this;
-};
-$('.modulefinder').xeModuleFinder();
-
-});
-
-// Module Search : A New Version Of Module Finder
-jQuery(function($){
-
-_xeModuleSearch = function(){
-	var t = this;
-	var $t = $(this);
-
-	var $moduleSearchWindow = $t.find(".moduleSearchWindow");
-
-	var $siteListDiv = $moduleSearchWindow.find('.siteList');
-	var $moduleTypeListDiv = $moduleSearchWindow.find('.moduleTypeList');
-	var $moduleInstanceListDiv = $moduleSearchWindow.find('.moduleInstanceList');
-
-	var $siteList = $siteListDiv.find('UL');
-	var $moduleTypeList = $moduleTypeListDiv.find('UL');
-	var $moduleInstanceList = $moduleInstanceListDiv.find('SELECT');
-
-	var $siteListSearchInput = $moduleSearchWindow.find('INPUT.siteListSearchInput');
-	var aSiteListData;
-
-	var MAX_LIST_HEIGHT = 280;
-	
-	function setListSize($UL, nHeight){
-		var nWidth, $div;
-		$UL.find('li div').width('');
-		$UL.css('height', '');
-		$UL.css('overflow-y', '');
-		if($UL.height() > nHeight){
-			$div = $UL.find('li div');
-			$div.width($div.width()-20+'px');
-			$UL.css('height', nHeight+'px');
-			$UL.css('overflow-y', 'auto');
-		}
-	}
-
-	function setSiteList(sFilter){
-		var sDomain;
-		var rxFilter = new RegExp(sFilter, "ig");
-		var list = aSiteListData;
-
-		$siteList.empty();
-	
-		for(i=0,c=list.length; i < c; i++) {
-			sDomain = list[i].domain;
-			if(sFilter){
-				if(!sDomain.match(rxFilter)) continue;
-				sDomain = sDomain.replace(rxFilter, function(sKeyword){
-					return '<span class="highlight">'+sKeyword+'</span>';
-				});
-			}
-
-			$li = $('<li />').appendTo($siteList);
-			$('<a>').attr('href', '#').html(
-				'<div>' + sDomain + '</div>' +
-				'<span class="x_icon-circle-arrow-right" style="display:inline-block;float:right;width:16px;height:16px;"></span>'
-			).data('site_srl', list[i].site_srl).appendTo($li);
-		}
-
-		setListSize($siteList, MAX_LIST_HEIGHT - $siteListSearchInput.parent("DIV").height());
-	}
-
-	$siteListSearchInput.keyup(function(){
-		setSiteList($siteListSearchInput.val());
-	});
-
-	if(typeof console == 'undefined'){
-		console={log:function(){}};
-	}
-
-	$t
-		.not('.xe-module-search')
-		.addClass('xe-module-search')
-		.find('a.tgAnchor.moduleSearch')
-			.bind('before-open.tc', function(){
-				var $this;
-
-				$this = $(this);
-
-				function on_complete(data) {
-					var $li, list = data.site_list, i, c;
-
-					if(data.error || !$.isArray(list)) {
-						$this.trigger('close.tc');
-						return;
-					}
-
-					aSiteListData = list;
-
-					setSiteList($siteListSearchInput.val());
-
-					$siteListSearchInput.focus();
-				};
-
-				$siteList.empty();
-				$moduleInstanceList.empty();
-				$moduleTypeListDiv.hide();
-				$moduleInstanceListDiv.hide();
-				$.exec_json('admin.getSiteAllList', {domain:""}, on_complete);
-			})
-		.end()
-		.find('.tgContent .siteListUL')
-			.delegate('a','click',function(oEvent){
-				var $this, $finder;
-
-				$this    = $(this);
-				$finder  = $this.closest('.modulefinder');
-
-				function on_complete(data) {
-
-					var list = data.module_list, x;
-
-					if(data.error || !list) return;
-
-					for(x in list) {
-						if(!list.hasOwnProperty(x)) continue;
-						$li = $('<li />').appendTo($moduleTypeList);
-						$('<a>').attr('href', '#').html(
-							'<div>'+list[x].title+'</div>' +
-							'<span class="x_icon-circle-arrow-right" style="display:inline-block;float:right;width:16px;height:16px;"></span>'
-						).data('moduleInstanceList', list[x].list).appendTo($li);
-						//$('<option />').attr('value', x).text(list[x].title).appendTo($mod_select);
-					}
-
-					$moduleSearchWindow.find('.moduleTypeList').show();
-					setListSize($moduleTypeList, MAX_LIST_HEIGHT);
-
-					$siteList.find('li').removeClass('on');
-					$this.parent('li').addClass('on');
-				};
-
-				//$finder.find('a.tgAnchor.findsite').trigger('close.tc');
-				$moduleTypeList.empty();
-				$moduleInstanceListDiv.hide();
-
-				$.exec_json('module.procModuleAdminGetList', {site_srl:$this.data('site_srl')}, on_complete);
-
-				oEvent.preventDefault();
-			})
-		.end()
-		//.find('.moduleList,.moduleIdList').hide().end()
-		.find('.moduleTypeListUL')
-			.delegate('a', 'click', function(oEvent){
-			
-				var $this, $mid_select, val, list;
-
-				$this = $(this);
-				list = $this.data('moduleInstanceList');
-				if(!list) return;
-
-				t.sSelectedModuleType = $this.text();
-				$moduleInstanceList.empty();
-
-				for(var x in list) {
-					if(!list.hasOwnProperty(x)) continue;
-
-					$li = $('<option />').html(list[x].browser_title).appendTo($moduleInstanceList).val(list[x].module_srl).data('mid', list[x].module_srl)
-							.data('module_srl', list[x].module_srl).data('layout_srl', list[x].layout_srl).data('browser_title', list[x].browser_title);
-				}
-
-				$moduleInstanceListDiv.show();
-				setListSize($moduleInstanceList, MAX_LIST_HEIGHT);
-
-				$moduleTypeList.find('li').removeClass('on');
-				$this.parent('li').addClass('on');
-
-				oEvent.preventDefault();
-			})
-		.end()
-		.find('.moduleSearch_ok').click(function(oEvent){
-				var aSelected = [];
-				$t.find('.moduleInstanceListSelect option:selected').each(function(){
-					aSelected.push({
-						'type' : t.sSelectedModuleType,
-						'module_srl' : $(this).data('module_srl'),
-						'layout_srl' : $(this).data('layout_srl'),
-						'browser_title' : $(this).data('browser_title')
-					});
-				});
-
-				$t.trigger('moduleSelect', [aSelected]);
-				$('.tgAnchor.moduleSearch').trigger('close.tc');
-				
-				oEvent.preventDefault();
-			});
-			
-
-	return this;
-};
-
-$.fn.xeModuleSearch = function(){
-	$(this).each(_xeModuleSearch);
-};
-
-$('.moduleSearch').xeModuleSearch();
-});
-
-// Sortable table
-jQuery(function($){
-
-var
-	dragging = false,
-	$holder  = $('<tr class="placeholder"><td>&nbsp;</td></tr>');
-
-$.fn.xeSortableTable = function(){
-	this
-		.not('.xe-sortable-table')
-		.addClass('xe-sortable-table')
-		.delegate('button.dragBtn', 'mousedown.st', function(event){
-			var $this, $tr, $table, $th, height, width, offset, position, offsets, i, dropzone, cols, ofspar;
-
-			if(event.which != 1) return;
-
-			$this  = $(this);
-			$tr    = $this.closest('tr');
-			$table = $this.closest('table');
-			ofspar = $table.get(0).offsetParent;
-			height = $tr.height();
-			width  = $tr.width();
-
-			// before event trigger
-			before_event = $.Event('before-drag.st');
-			$table.trigger(before_event);
-
-			// is event canceled?
-			if(before_event.isDefaultPrevented()) return false;
-
-			position = {x:event.pageX, y:event.pageY};
-			offset   = getOffset($tr.get(0), ofspar);
-
-			$clone = $tr.attr('target', true).clone(true).appendTo($table);
-
-			// get colspan
-			cols = ($th=$table.find('thead th')).length;
-			$th.filter('[colspan]').attr('colspan', function(idx,attr){ cols += attr - 1; });
-			$holder.find('td').attr('colspan', cols);
-
-			// get offsets of all list-item elements
-			offsets = [];
-			$table.find('tbody>tr:not([target],.sticky,:hidden)').each(function() {
-				var $this = $(this), o;
-
-				o = getOffset(this, ofspar);
-				offsets.push({top:o.top, bottom:o.top+$this.height(), $item:$this});
-			});
-
-			$clone
-				.addClass('draggable')
-				.css({
-					position: 'absolute',
-					opacity : .6,
-					width   : width,
-					height  : height,
-					left    : offset.left,
-					top     : offset.top,
-					zIndex  : 100
-				});
-
-			// Set a place holder
-			$holder
-				.css({
-					position:'absolute',
-					opacity : .6,
-					width   : width,
-					height  : '10px',
-					left    : offset.left,
-					top     : offset.top,
-					backgroundColor : '#bbb',
-					overflow: 'hidden',
-					zIndex  : 99
-				})
-				.appendTo($table);
-
-			$tr.css('opacity', .6);
-
-			$(document)
-				.unbind('mousedown.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( (i && o.top > nTop) || ((i < c-1) && o.bottom < nTop)) continue;
-
-						dropzone = {element:o.$item};
-						if(o.top > nTop - 12) {
-							dropzone.state = 'before';
-							$holder.css('top', o.top-5);
-						} else {
-							dropzone.state = 'after';
-							$holder.css('top', o.bottom-5);
-						}
-					}
-
-					$clone.css({top:nTop});
-				})
-				.bind('mouseup.st', function(event) {
-					var $dropzone;
-
-					dragging = false;
-
-					$(document).unbind('mousemove.st mouseup.st');
-					$tr.removeAttr('target').css('opacity', '');
-					$clone.remove();
-					$holder.remove();
-
-					if(!dropzone) return;
-					$dropzone = $(dropzone.element);
-
-					// use the clone for animation
-					$dropzone[dropzone.state]($tr);
-
-					$table.trigger('after-drag.st');
-				});
-		})
-
-	return this;
-};
-$('table.sortable').xeSortableTable();
-
-// filebox
-jQuery(function($){
-
-$('.filebox')
-	.bind('before-open.mw', function(){
-		var $this, $list, $parentObj;
-		var anchor;
-
-		$this = $(this);
-		anchor = $this.attr('href');
-
-		$list = $(anchor).find('.filebox_list');
-
-		function on_complete(data){
-			$list.html(data.html);
-
-			$list.find('.select')
-				.bind('click', function(event){
-					var selectedImages = $('input.select_checkbox:checked');
-					if(selectedImages.length == 0) {
-						var selectedImgSrc = $(this).closest('tr').find('img.filebox_item').attr('src');
-						if(!selectedImgSrc){
-							alert("None selected!");
-						}else{
-							$this.trigger('filebox.selected', [selectedImgSrc]);
-							$this.trigger('close.mw');
-						}
-					}else {
-						$this.trigger('filebox.selected', [selectedImages]);
-						$this.trigger('close.mw');
-					}
-					return false;
-				});
-
-			$list.find('.x_pagination')
-				.find('a')
-				.filter(function(){
-					if ($(this).data('toggle')) return false;
-					if ($(this).parent().hasClass('x_disabled')) return false;
-					if ($(this).parent().hasClass('x_active')) return false;
-					return true;
-				})
-				.bind('click', function(){
-					var page = $(this).attr('page');
-
-					$.exec_json('module.getFileBoxListHtml', {'page': page}, on_complete);
-					return false;
-				});
-
-			$('#goToFileBox')
-				.find('button')
-				.bind('click', function(){
-					var page = $(this).prev('input').val();
-
-					$.exec_json('module.getFileBoxListHtml', {'page': page}, on_complete);
-					return false;
-				});
-
-			$list.closest('.x_modal-body').scrollTop(0);
-		}
-
-		$.exec_json('module.getFileBoxListHtml', {'page': '1'}, on_complete);
-	});
-// Details toggle in admin table
-	var simpleBtn = $('.x .dsTg .__simple');
-	var detailBtn = $('.x .dsTg .__detail');
-	var tdTitle = $('.x .dsTg td.title');
-	tdTitle.each(function(){
-		var $t = $(this)
-		if($t.find('p.update').length==0){
-			$t.addClass('tg').find('>*:not(:first-child)').hide();
-		} else {
-			$t.addClass('up');
-		}
-	});
-	var details = $('.x .dsTg td.tg>*:not(:first-child)');
-	simpleBtn.click(function(){
-		details.slideUp(200);
-		detailBtn.removeClass('x_active');
-		simpleBtn.addClass('x_active');
-	});
-	detailBtn.click(function(){
-		details.slideDown(200);
-		detailBtn.addClass('x_active');
-		simpleBtn.removeClass('x_active');
-	});
-
-});
-
-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};
-}
-
-});
+jQuery(function(a){function e(){b.width("99.99%");setTimeout(function(){b.removeAttr("style")},0)}window.scrollTo(0,0);a(".x .skipNav>a").click(function(){a(a(this).attr("href")).attr("tabindex","0").css("outline","0").focus()});a(document.body).on("click",".x [data-toggle]",function(){var b=a(this),d=a(b.attr("data-toggle"));d.toggle();d.is(":visible")&&!d.find("a,input,button,textarea,select").length?d.attr("tabindex","0").focus():d.is(":visible")&&d.find("a,input,button,textarea,select").length?
+d.find("a,input,button,textarea,select").eq(0).focus():b.focus();return!1});a(document.body).on("click",".x [data-show]",function(){a(a(this).attr("data-show")).show().attr("tabindex","0").focus();return!1});a(document.body).on("click",".x [data-hide]",function(){var b=a(this);a(b.attr("data-hide")).hide();b.focus();return!1});a('.x .x_tab-content>.x_tab-pane:not(".x_active")').hide();a(document.body).on("click",'.x .x_nav-tabs>li>a[href^="#"]',function(){var b=a(this);b.parent("li").addClass("x_active").siblings().removeClass("x_active");
+b.closest(".x_nav-tabs").next(".x_tab-content").find(b.attr("href")).addClass("x_active").show().siblings().removeClass("x_active").hide();return!1});var d=a(".x>.body"),b=d.children("#content.content"),f=d.find(">.gnb"),g=f.find(">ul>li");g.find("ul").prev("a").bind("click focus",function(){var b=a(this);g.not(b.parent("li")).removeClass("open");a(this).parent("li").toggleClass("open");d.removeClass("wide");e();return!1});f.find('>a[href="#gnbNav"]').click(function(){a(this).parent(".gnb").toggleClass("open");
+d.toggleClass("wide");e();return!1});f.prepend('<button type="button" class="close before" />').append('<button type="button" class="close after" />');f.find(">.close").focus(function(){d.addClass("wide");e()});a('.x th>input[type="checkbox"]').change(function(){var b=a(this),d=b.data("name");b.closest("table").find("input:checkbox").filter(function(){var b=a(this);return!b.prop("disabled")&&(b.attr("name")==d||b.data("name")==d)}).prop("checked",b.prop("checked")).end().end().trigger("update.checkbox",
+[d,this.checked])});a(document.body).on("click",".x .x_pagination .x_disabled, .x .x_pagination .x_active",function(){return!1});a(".x .section>h1").append('<button type="button" class="snToggle x_icon-chevron-up">Toggle this section</button>');a(".x .section>h1>.snToggle").click(function(){var b=a(this),d=b.closest(".section");d.hasClass("collapse")?(d.removeClass("collapse").children("h1:first").siblings().show(),b.removeClass("x_icon-chevron-down").addClass("x_icon-chevron-up")):(d.addClass("collapse").children("h1:first").siblings().hide(),
+b.removeClass("x_icon-chevron-up").addClass("x_icon-chevron-down"))});f=a(".x .x_alert");f.prepend('<button type="button" class="x_close">&times;</button>');f.children(".x_close").click(function(){a(this).parent(".x_alert").hide()});a(".x .x_btn").click(function(){if(a(this).hasClass("x_disabled"))return!1});a(".x i").each(function(){var b=a(this);"|"==b.text()&&b.addClass("vr")})});
+jQuery(function(a){a.fn.xeModalWindow=function(){this.not(".xe-modal-window").addClass("xe-modal-window").each(function(){a(a(this).attr("href")).addClass("x").hide()}).click(function(){var e=a(this);"showing"==a(e.attr("href")).data("state")?e.trigger("close.mw"):e.trigger("open.mw");return!1}).bind("open.mw",function(){var e=a(this),d,b;d=a(e.attr("href"));d.parent("body").length||(b=a('<button type="button" class="x_close">&times;</button>'),b.click(function(){d.data("anchor").trigger("close.mw")}),
+d.find("[data-hide]").click(function(){d.data("anchor").trigger("close.mw")}),a("body").append('<div class="x_modal-backdrop"></div>').append(d),d.prepend(b));d.data("anchor",e);b=a.Event("before-open.mw");e.trigger(b);if(b.isDefaultPrevented())return!1;d=a(e.attr("href"));b=e.data("duration")||"fast";d.data("state","showing");a("html,body").addClass("modalContainer");a(document).bind("keydown.mw",function(b){if(27==b.which)return e.trigger("close.mw"),!1});d.fadeIn(b,function(){e.trigger("after-open.mw")}).find("button.x_close:first").focus();
+a(".x_modal-backdrop").show()}).bind("close.mw",function(){var e=a(this),d,b;d=a.Event("before-close.mw");e.trigger(d);if(d.isDefaultPrevented())return!1;d=a(e.attr("href"));b=e.data("duration")||"fast";d.data("state","hiding");a("html,body").removeClass("modalContainer");d.fadeOut(b,function(){e.trigger("after-close.mw")});a(".x_modal-backdrop").hide();e.focus()});a("div.x_modal").addClass("x").hide()};a("a.modalAnchor").xeModalWindow()});
+jQuery(function(a){var e=!1;a.fn.xeContentToggler=function(){this.not(".xe-content-toggler").addClass("xe-content-toggler").each(function(){var d=a(this);$layer=a(d.attr("href"));$layer.hide().not(".xe-toggling-content").addClass("xe-toggling-content").mousedown(function(){e=!0}).focusout(function(){setTimeout(function(){!e&&(!$layer.find(":focus").length&&"showing"==$layer.data("state"))&&d.trigger("close.tc");e=!1},1)})}).click(function(){var d=a(this),b;b=a(d.attr("href"));b.data("anchor",d);"showing"==
+b.data("state")?d.trigger("close.tc"):d.trigger("open.tc");return!1}).bind("open.tc",function(){function d(){b.trigger("after-open.tc")}var b=a(this),f,g,h;f=a(b.attr("href"));g=b.data("effect");h=b.data("duration")||"fast";f.data("state","showing");b.trigger("before-open.tc");e=!1;a(document).unbind("mousedown.tc keydown.tc").bind("mousedown.tc keydown.tc",function(d){if(d&&("keydown"==d.type&&27!=d.which||"mousedown"==d.type&&(d=a(d.target),d.is("html,.tgAnchor,.tgContent")||f.has(d).length)))return!0;
+b.trigger("close.tc");return!1});switch(g){case "slide":f.slideDown(h,d);break;case "slide-h":g=f.css({"overflow-x":"",width:""}).width();f.show().css({"overflow-x":"hidden",width:"0px"}).animate({width:g},h,function(){f.css({"overflow-x":"",width:""});d()});break;case "fade":f.fadeIn(h,d);break;default:f.show(),b.trigger("after-open.tc")}}).bind("close.tc",function(){function d(){b.trigger("after-close.tc")}var b=a(this),f,e,h;a(document).unbind("mousedown.tc keydown.tc");f=a(b.attr("href"));e=b.data("effect");
+h=b.data("duration")||"fast";f.data("state","hiding");b.trigger("before-close.tc");switch(e){case "slide":f.slideUp(h,d);break;case "slide-h":f.animate({width:0},h,function(){f.hide();d()});break;case "fade":f.fadeOut(h,d);break;default:f.hide(),b.trigger("after-close.tc")}});return this};a("a.tgAnchor").xeContentToggler()});
+jQuery(function(a){a.fn.xeModuleFinder=function(){this.not(".xe-module-finder").addClass("xe-module-finder").find("a.tgAnchor.findsite").bind("before-open.tc",function(){var e,d,b;e=a(this);d=a(e.attr("href")).find(">ul");b=e.prev("input:text").val();a.exec_json("admin.getSiteAllList",{domain:b},function(b){var g=b.site_list,h,j;d.empty();e.closest(".modulefinder").find(".moduleList,.moduleIdList").attr("disabled","disabled");if(b.error||!a.isArray(g))e.trigger("close.tc");else{h=0;for(j=g.length;h<
+j;h++)b=a("<li />").appendTo(d),a('<button type="button" />').text(g[h].domain).data("site_srl",g[h].site_srl).appendTo(b)}})}).end().find(".tgContent.suggestion").delegate("button","click",function(){var e,d;e=a(this);d=e.closest(".modulefinder");d.find("a.tgAnchor.findsite").trigger("close.tc");a.exec_json("module.procModuleAdminGetList",{site_srl:e.data("site_srl")},function(b){var e=b.module_list,g;if(!b.error&&e){b=d.find(".moduleList").data("module_list",e).removeAttr("disabled").empty();for(g in e)e.hasOwnProperty(g)&&
+a("<option />").attr("value",g).text(e[g].title).appendTo(b);b.prop("selectedIndex",0).change().focus();b.is(":visible")||b.slideDown(100,function(){d.find(".moduleIdList:not(:visible)").slideDown(100).trigger("show")}).trigger("show")}})}).end().find(".moduleList,.moduleIdList").hide().end().find(".moduleList").change(function(){var e,d,b;e=a(this);d=e.val();b=e.data("module_list");if(b[d]){b=b[d].list;e=e.closest(".modulefinder").find(".moduleIdList").removeAttr("disabled").empty();for(var f in b)b.hasOwnProperty(f)&&
+a("<option />").attr("value",b[f].module_srl).text(b[f].browser_title).appendTo(e);e.prop("selectedIndex",0).change()}});return this};a(".modulefinder").xeModuleFinder()});
+jQuery(function(a){_xeModuleSearch=function(){function e(b,a){var d;b.find("li div").width("");b.css("height","");b.css("overflow-y","");b.height()>a&&(d=b.find("li div"),d.width(d.width()-20+"px"),b.css("height",a+"px"),b.css("overflow-y","auto"))}function d(b){var d,f=RegExp(b,"ig"),g=q;l.empty();i=0;for(c=g.length;i<c;i++){d=g[i].domain;if(b){if(!d.match(f))continue;d=d.replace(f,function(b){return'<span class="highlight">'+b+"</span>"})}$li=a("<li />").appendTo(l);a("<a>").attr("href","#").html("<div>"+
+d+'</div><span class="x_icon-circle-arrow-right" style="display:inline-block;float:right;width:16px;height:16px;"></span>').data("site_srl",g[i].site_srl).appendTo($li)}e(l,w-n.parent("DIV").height())}var b=this,f=a(this),g=f.find(".moduleSearchWindow"),h=g.find(".siteList"),j=g.find(".moduleTypeList"),k=g.find(".moduleInstanceList"),l=h.find("UL"),p=j.find("UL"),m=k.find("SELECT"),n=g.find("INPUT.siteListSearchInput"),q,w=280;n.keyup(function(){d(n.val())});"undefined"==typeof console&&(console=
+{log:function(){}});f.not(".xe-module-search").addClass("xe-module-search").find("a.tgAnchor.moduleSearch").bind("before-open.tc",function(){var b;b=a(this);l.empty();m.empty();j.hide();k.hide();a.exec_json("admin.getSiteAllList",{domain:""},function(e){var f=e.site_list;e.error||!a.isArray(f)?b.trigger("close.tc"):(q=f,d(n.val()),n.focus())})}).end().find(".tgContent .siteListUL").delegate("a","click",function(b){var d;d=a(this);d.closest(".modulefinder");p.empty();k.hide();a.exec_json("module.procModuleAdminGetList",
+{site_srl:d.data("site_srl")},function(b){var f=b.module_list,u;if(!b.error&&f){for(u in f)f.hasOwnProperty(u)&&($li=a("<li />").appendTo(p),a("<a>").attr("href","#").html("<div>"+f[u].title+'</div><span class="x_icon-circle-arrow-right" style="display:inline-block;float:right;width:16px;height:16px;"></span>').data("moduleInstanceList",f[u].list).appendTo($li));g.find(".moduleTypeList").show();e(p,w);l.find("li").removeClass("on");d.parent("li").addClass("on")}});b.preventDefault()}).end().find(".moduleTypeListUL").delegate("a",
+"click",function(d){var f,g;f=a(this);if(g=f.data("moduleInstanceList")){b.sSelectedModuleType=f.text();m.empty();for(var h in g)g.hasOwnProperty(h)&&($li=a("<option />").html(g[h].browser_title).appendTo(m).val(g[h].module_srl).data("mid",g[h].module_srl).data("module_srl",g[h].module_srl).data("layout_srl",g[h].layout_srl).data("browser_title",g[h].browser_title));k.show();e(m,w);p.find("li").removeClass("on");f.parent("li").addClass("on");d.preventDefault()}}).end().find(".moduleSearch_ok").click(function(d){var e=
+[];f.find(".moduleInstanceListSelect option:selected").each(function(){e.push({type:b.sSelectedModuleType,module_srl:a(this).data("module_srl"),layout_srl:a(this).data("layout_srl"),browser_title:a(this).data("browser_title")})});f.trigger("moduleSelect",[e]);a(".tgAnchor.moduleSearch").trigger("close.tc");d.preventDefault()});return this};a.fn.xeModuleSearch=function(){a(this).each(_xeModuleSearch)};a(".moduleSearch").xeModuleSearch()});
+jQuery(function(a){function e(b,a){for(var d=0,e=0;b&&b!=a;)d+=b.offsetTop,e+=b.offsetLeft,b=b.offsetParent;return{top:d,left:e}}var d=a('<tr class="placeholder"><td>&nbsp;</td></tr>');a.fn.xeSortableTable=function(){this.not(".xe-sortable-table").addClass("xe-sortable-table").delegate("button.dragBtn","mousedown.st",function(b){var f,g,h,j,k,l,p,m,n,q;if(1==b.which){g=a(this);h=g.closest("tr");j=g.closest("table");q=j.get(0).offsetParent;g=h.height();k=h.width();before_event=a.Event("before-drag.st");
+j.trigger(before_event);if(before_event.isDefaultPrevented())return!1;f=b.pageY;l=e(h.get(0),q);$clone=h.attr("target",!0).clone(!0).appendTo(j);n=(b=j.find("thead th")).length;b.filter("[colspan]").attr("colspan",function(b,a){n+=a-1});d.find("td").attr("colspan",n);p=[];j.find("tbody>tr:not([target],.sticky,:hidden)").each(function(){var b=a(this),d;d=e(this,q);p.push({top:d.top,bottom:d.top+b.height(),$item:b})});$clone.addClass("draggable").css({position:"absolute",opacity:0.6,width:k,height:g,
+left:l.left,top:l.top,zIndex:100});d.css({position:"absolute",opacity:0.6,width:k,height:"10px",left:l.left,top:l.top,backgroundColor:"#bbb",overflow:"hidden",zIndex:99}).appendTo(j);h.css("opacity",0.6);a(document).unbind("mousedown.st mouseup.st").bind("mousemove.st",function(b){var a,e,g;m=null;b=l.top-(f-b.pageY);a=0;for(e=p.length;a<e;a++)g=p[a],a&&g.top>b||a<e-1&&g.bottom<b||(m={element:g.$item},g.top>b-12?(m.state="before",d.css("top",g.top-5)):(m.state="after",d.css("top",g.bottom-5)));$clone.css({top:b})}).bind("mouseup.st",
+function(){var b;a(document).unbind("mousemove.st mouseup.st");h.removeAttr("target").css("opacity","");$clone.remove();d.remove();m&&(b=a(m.element),b[m.state](h),j.trigger("after-drag.st"))})}});return this};a("table.sortable").xeSortableTable();jQuery(function(b){b(".filebox").bind("before-open.mw",function(){function a(f){e.html(f.html);e.find(".select").bind("click",function(){var a=b("input.select_checkbox:checked");0==a.length?(a=b(this).closest("tr").find("img.filebox_item").attr("src"))?
+(d.trigger("filebox.selected",[a]),d.trigger("close.mw")):alert("None selected!"):(d.trigger("filebox.selected",[a]),d.trigger("close.mw"));return!1});e.find(".x_pagination").find("a").filter(function(){return b(this).data("toggle")||b(this).parent().hasClass("x_disabled")||b(this).parent().hasClass("x_active")?!1:!0}).bind("click",function(){var d=b(this).attr("page");b.exec_json("module.getFileBoxListHtml",{page:d},a);return!1});b("#goToFileBox").find("button").bind("click",function(){var d=b(this).prev("input").val();
+b.exec_json("module.getFileBoxListHtml",{page:d},a);return!1});e.closest(".x_modal-body").scrollTop(0)}var d,e,f;d=b(this);f=d.attr("href");e=b(f).find(".filebox_list");b.exec_json("module.getFileBoxListHtml",{page:"1"},a)});var a=b(".x .dsTg .__simple"),d=b(".x .dsTg .__detail");b(".x .dsTg td.title").each(function(){var a=b(this);0==a.find("p.update").length?a.addClass("tg").find(">*:not(:first-child)").hide():a.addClass("up")});var e=b(".x .dsTg td.tg>*:not(:first-child)");a.click(function(){e.slideUp(200);
+d.removeClass("x_active");a.addClass("x_active")});d.click(function(){e.slideDown(200);d.addClass("x_active");a.removeClass("x_active")});var j=b('.vLang[type="hidden"]'),k=b(".lang_code");(j.length||k.length)&&b.exec_json("module.getModuleAdminMultilingualHtml",{},function(a){function d(a,e,f){a=b("#lang_"+a.closest(".x_modal").data("lang-target"));a.width(135).attr("disabled","disabled").val(f).parent(".g11n").addClass("active");a.siblings("#"+a.data("lang-id")).val("$user_lang->"+e);t=!1;a.siblings('[href="#g11n"]').trigger("close.mw")}
+function e(a,g,h){a||(a=1);g||(g="");h||(h="");b.exec_json("module.getModuleAdminLangListHtml",{page:a,search_keyword:g,name:h},function(a){a&&a.html&&(b("#lang_search").html(a.html),b("#lang_search .x_pagination a").click(function(){var a=b(this).data("page"),d=b(this).data("search_keyword");if(a)return e(a,d),!1}),b("#lang_search .x_pagination").submit(function(){var a=b(this).find('[name="page"]').val(),d=b(this).data("search_keyword");if(!a)return!1;e(a,d);return!1}),b("#lang_search .search").submit(function(){var a=
+b(this).find('[name="search_keyword"]').val();e(1,a);return!1}),b("#lang_search #search_cancel").click(function(){e(1,"")}),b("#lang_search").find('[href^="#lang-"]').append('<i class="x_icon-chevron-down"></i>').click(function(){function a(e){b(d.attr("href")+" textarea").each(function(){var a=b(this),d=e.langs[a.data("lang")];/^\$user_lang->/.test(d)?a.val("").data("value",""):a.val(d).data("value",d)});d.data("is_loaded",!0)}var d=b(this),e=d.data("lang_code");f();d.next("fieldset").is(":visible")?
+d.children("i").removeClass("x_icon-chevron-up").addClass("x_icon-chevron-down"):(d.children("i").removeClass("x_icon-chevron-down").addClass("x_icon-chevron-up"),d.parent(".item").siblings(".item").find("a > i").removeClass("x_icon-chevron-up").addClass("x_icon-chevron-down").end().children("fieldset").hide());d.data("is_loaded")||b.exec_json("module.getModuleAdminLangCode",{name:e},a)}),h&&b("#lang_search").find('[href^="#lang-"]').trigger("click"),b("#lang_search").find(".modify").click(function(){b(this).closest("fieldset").addClass("editMode").find("textarea").removeAttr("disabled")}),
+b("#lang_search").find(".cancel").click(function(){b(this).closest("fieldset").removeClass("editMode").find("textarea").attr("disabled","disabled").each(function(){var a=b(this);a.val(a.data("value"))});return!1}),b("#lang_search").find(".item").submit(function(){var a=b(this),d=a.find(".editMode").children("textarea"),e=a.find('[href^="#lang-"]'),f={},g=null;d.each(function(){var a=b(this);f[a.attr("class")]=a.val();a.data("tmp_value",a.val());xe.current_lang==a.attr("class")&&(g=a.val())});f.lang_name=
+e.data("lang_code");b.exec_json("module.procModuleAdminInsertLang",f,function(f){f&&(!f.error&&f.name)&&(d.each(function(){var a=b(this);a.data("value",a.data("tmp_value"))}),e.children("span").html(g),b("#lang_search").find(".cancel").trigger("click"),a.find(".useit").trigger("click"))});return!1}),b("#lang_search").find(".useit").click(function(){var a=b(this),e=a.closest(".item").find('[href^="#lang-"]'),f=e.data("lang_code"),e=e.children("span").text();d(a,f,e)}))})}function f(){if(s.is(":visible")&&
+s.find(".editMode").length){var b=s.find("form.item");confirm(xe.msg_confirm_save_and_use_multilingual)?b.find(".save").trigger("click").end().find("textarea").attr("disabled","disabled"):b.find(".cancel").trigger("click")}return!0}b(".x #content").append(a.html);var g=0;j.each(function(){var a=b(this);a.removeClass("vLang").addClass("lang_code");a.parent().find(".editUserLang").remove()});k=b(".lang_code");k.each(function(){var a=b(this),d=a.attr("id");d||(d="__lang_code_"+g,g++,a.attr("id",d));
+var e="TEXTAREA"==this.tagName||a.next("textarea.vLang").length?b('<textarea id="lang_'+d+'" class="displayInput" style="width:179px">').data("lang-id",d):b('<input type="text" id="lang_'+d+'" class="displayInput" style="width:179px">').data("lang-id",d),f=b('<button type="button" class="x_add-on remover" title="Remove Multilingual Text"><i class="x_icon-remove"></i> Remove Multilingual Text</button>').data("lang-target",d),d=b('<a href="#g11n" class="x_add-on modalAnchor" title="Set Multilungual Text"><i class="x_icon-globe"></i> Set Multilingual Text</a>').data("lang-target",
+d);a.parent().addClass("g11n").addClass("x_input-append");a.after(e,f,d);a.parent().find(".vLang").remove();a.hide();d.xeModalWindow();var h=a;e.keydown(function(){a=b(this);a.closest(".g11n").hasClass("active")||h.val(a.val())});e.val(h.val());if(/^\$user_lang->/.test(e.val())){b.exec_json("module.getModuleAdminLangCode",{name:e.val().replace("$user_lang->","")},j);var j=function(b){b&&b.langs&&(e.closest(".g11n").addClass("active"),e.val(b.langs[xe.current_lang]).attr("disabled","disabled").width(135))}}});
+var a=b(".x .g11n"),h=a.children(".modalAnchor"),v=b(".x #g11n"),r=v.find("#lang_create"),s=v.find("#lang_search"),t=!1;r.find(".editMode textarea").change(function(){t=!0});r.submit(function(){var a=b(this),e={},f=null;a.find(".editMode").children("textarea").each(function(){var a=b(this);e[a.attr("class")]=a.val();xe.current_lang==a.attr("class")&&(f=a.val())});if(!f)return alert(xe.msg_empty_multilingual),!1;b.exec_json("module.procModuleAdminInsertLang",e,function(b){b&&(!b.error&&b.name)&&d(a,
+b.name,f)});return!1});a.children(".remover").click(function(){var a=b(this);b("#lang_"+a.data("lang-target")).val("").removeAttr("disabled").width(179).parent(".g11n").removeClass("active");a.siblings(".lang_code").val("")});h.bind("before-close.mw",function(){r.is(":visible")&&t&&confirm(xe.msg_confirm_save_and_use_multilingual)&&r.find(".save-useit").trigger("click");if(!f())return!1;s.find(".item > fieldset").hide().prev("a").children("i").removeClass("x_icon-chevrom-up").addClass("x_icon-chevron-down");
+v.find('[href="#lang_create"]').trigger("click");r.find(".editMode").children("textarea").val("");t=!1});h.bind("open.mw",function(){var a=b(this),d=a.siblings(".displayInput");a.closest(".g11n").hasClass("active")?(e(1,"",d.prev(".lang_code").val().replace("$user_lang->","")),b(a.attr("href")).find('[href="#lang_search"]').trigger("click")):e();b(a.attr("href")).data("lang-target",a.data("lang-target"))})})})});
diff --git a/modules/layout/tpl/layout_modify.html b/modules/layout/tpl/layout_modify.html
index 094ec81f7..5d22432ba 100644
--- a/modules/layout/tpl/layout_modify.html
+++ b/modules/layout/tpl/layout_modify.html
@@ -67,17 +67,12 @@
 			<label class="x_control-label" for="{$name}">{$var->title}</label>
 			<div class="x_controls">
 				<div cond="$var->type == 'text'" class="multiLangEdit">
-					{@$use_multilang = true}
-					<input type="hidden" name="{$name}" value="<!--@if(strpos($var->value, "$user_lang->") !== false)-->{htmlspecialchars($var->value)}<!--@else-->{$var->value}<!--@end-->" class="vLang" />
-					<input type="text" id="{$name}" value="{$var->value}" class="vLang" />
-					<span class="desc"><a href="#langEdit" class="editUserLang tgAnchor">{$lang->cmd_set_multilingual}</a></span>
+					<input type="text" name="{$name}" id="{$name}" class="lang_code" value="<!--@if(strpos($var->value, "$user_lang->") !== false)-->{htmlspecialchars($var->value)}<!--@else-->{$var->value}<!--@end-->" />
 				</div>
 
 				<div cond="$var->type == 'textarea'" class="multiLangEdit">
 					{@$use_multilang_textarea = true}
-					<input type="hidden" name="{$name}" value="<!--@if(strpos($var->value, "$user_lang->") !== false)-->{htmlspecialchars($var->value)}<!--@else-->{$var->value}<!--@end-->" class="vLang" />
-					<textarea id="{$name}" rows="8" cols="42" class="vLang">{$var->value}</textarea>
-					<span class="desc"><a href="#langEditTextarea" class="editUserLang tgAnchor">{$lang->cmd_set_multilingual}</a></span>
+					<textarea name="{$name}" rows="8" cols="42" class="lang_code"><!--@if(strpos($var->value, "$user_lang->") !== false)-->{htmlspecialchars($var->value)}<!--@else-->{$var->value}<!--@end--></textarea>
 				</div>
 
 				<block cond="$var->type == 'image'">
@@ -95,7 +90,7 @@
 					<input type="hidden" name="name" value="{$name}" />
 						<p>
 							<input type="file" name="img" id="file_select_{$name}" value="" />
-							<input  type="submit" value="{$lang->cmd_submit}" />
+							<input class="x_btn x_btn-mini x_btn-primary" type="submit" value="{$lang->cmd_submit}" />
 						</p>
 					</form>
 				</block>
diff --git a/modules/module/conf/module.xml b/modules/module/conf/module.xml
index 30d9ea662..ffe5fada4 100644
--- a/modules/module/conf/module.xml
+++ b/modules/module/conf/module.xml
@@ -36,6 +36,8 @@
 		<action name="getFileBoxListHtml" type="model" />
 		<action name="getLangByLangcode" type="model" />
 		<action name="getModuleAdminGrant" type="model" />
+		<action name="getModuleAdminMultilingualHtml" type="model" />
+		<action name="getModuleAdminLangListHtml" type="model" />
 		<action name="getModuleInfoByMenuItemSrl" type="model" />
 
         <action name="procModuleAdminInsertCategory" type="controller" standalone="true" ruleset="insertCategory" />
diff --git a/modules/module/lang/lang.xml b/modules/module/lang/lang.xml
index 7e1dc2382..e08b52981 100644
--- a/modules/module/lang/lang.xml
+++ b/modules/module/lang/lang.xml
@@ -1057,4 +1057,30 @@ Le module [Administration des Modules] montera tous les modules installés et vo
 		<value xml:lang="en"><![CDATA[If content empty, maintain existing value.]]></value>
 		<value xml:lang="zh-TW"><![CDATA[If content empty, maintain existing value.]]></value>
 	</item>
+	<item name="cmd_save_and_use_it">
+		<value xml:lang="ko"><![CDATA[저장 &amp; 사용]]></value>
+		<value xml:lang="en"><![CDATA[Save &amp; Use it]]></value>
+	</item>
+	<item name="about_multilingual_manage" type="array">
+		<item name="text">
+			<value xml:lang="ko"><![CDATA[지원하는 목록은 [%s]에서 편집 가능.]]></value>
+			<value xml:lang="en"><![CDATA[You can manage multilingual at [%s].]]></value>
+		</item>
+		<item name="link">
+			<value xml:lang="ko"><![CDATA[콘텐츠>다국어]]></value>
+			<value xml:lang="en"><![CDATA[Content>Mualtilungal]]></value>
+		</item>
+	</item>
+	<item name="about_multilingual_search_result">
+		<value xml:lang="ko"><![CDATA[<strong>%d</strong>개의 다국어 세트가 있습니다.]]></value>
+		<value xml:lang="en"><![CDATA[There are <strong>%d</strong> multilingual sets.]]></value>
+	</item>
+	<item name="msg_confirm_save_and_use_multilingual">
+		<value xml:lang="ko"><![CDATA[현재 상태를 저장하고 사용하시겠습니까?]]></value>
+		<value xml:lang="en"><![CDATA[Do you want to save and use this status?]]></value>
+	</item>
+	<item name="msg_empty_multilingual">
+		<value xml:lang="ko"><![CDATA[다국어를 입력해 주세요.]]></value>
+		<value xml:lang="en"><![CDATA[Please enter value for multilingual.]]></value>
+	</item>
 </lang>
diff --git a/modules/module/module.admin.model.php b/modules/module/module.admin.model.php
index dc3d42c66..3de2e5b20 100644
--- a/modules/module/module.admin.model.php
+++ b/modules/module/module.admin.model.php
@@ -421,5 +421,45 @@
 			return $output;
 		}
 
+		/**
+		 * return multilingual html
+		 */
+		function getModuleAdminMultilingualHtml()
+		{
+			$oTemplate = TemplateHandler::getInstance();
+			$tpl = $oTemplate->compile('./modules/module/tpl', 'multilingual_v17.html');
+
+			$this->add('html', $tpl);
+		}
+
+		/**
+		 * return multilingual list html
+		 */
+		function getModuleAdminLangListHtml()
+		{
+			$siteModuleInfo = Context::get('site_module_info');
+			$args->site_srl = (int)$site_module_info->site_srl;
+			$args->langCode = Context::get('lang_type');
+			$args->page = Context::get('page');
+			$args->sort_index = 'name';
+			$args->order_type = 'asc';
+			$args->search_keyword = Context::get('search_keyword');
+			$args->name = Context::get('name');
+			$args->list_count = 5;
+			$args->page_count = 5;
+
+			$output = $this->getLangListByLangcode($args);
+
+			Context::set('total_count', $output->total_count);
+			Context::set('total_page', $output->total_page);
+			Context::set('page', $output->page);
+			Context::set('lang_code_list', $output->data);
+			Context::set('page_navigation', $output->page_navigation);
+
+			$oTemplate = TemplateHandler::getInstance();
+			$tpl = $oTemplate->compile('./modules/module/tpl', 'multilingual_v17_list.html');
+
+			$this->add('html', $tpl);
+		}
     }
 ?>
diff --git a/modules/module/queries/getLangListByLangcode.xml b/modules/module/queries/getLangListByLangcode.xml
index fe0e12e91..a0b7c8311 100644
--- a/modules/module/queries/getLangListByLangcode.xml
+++ b/modules/module/queries/getLangListByLangcode.xml
@@ -10,6 +10,7 @@
         <condition operation="equal" column="site_srl" var="site_srl" notnull="notnull" filter="number" />
         <condition operation="in" column="lang_code" var="langCode" pipe="and" />
 		<condition operation="like" column="value" var="search_keyword" pipe="and" />
+		<condition operation="equal" column="name" var="name" pipe="and" />
     </conditions>
     <navigation>
         <index var="sort_index" default="list_order" order="order_type" />
diff --git a/modules/module/tpl/multilingual_v17.html b/modules/module/tpl/multilingual_v17.html
new file mode 100644
index 000000000..8e4e7d96d
--- /dev/null
+++ b/modules/module/tpl/multilingual_v17.html
@@ -0,0 +1,48 @@
+{@
+	/* move current language to the top */
+	$a = array($lang_type=>$lang_supported[$lang_type]);
+	unset($lang_supported[$lang_type]);
+	$lang_supported = array_merge($a, $lang_supported);
+}
+<div class="x_modal" id="g11n" style="display:none">
+	<div class="x_modal-header">
+		<h3>{$lang->cmd_multilingual}</h3>
+	</div>
+	<div class="x_modal-body">
+		<div class="x_tabbable">
+			<ul class="x_nav x_nav-tabs">
+				<li class="x_active"><a href="#lang_create">{$lang->cmd_insert}</a></li>
+				<li><a href="#lang_search">{$lang->cmd_search}</a></li>
+			</ul>
+			<div class="x_tab-content">
+				<form action="" class="x_tab-pane x_active item" id="lang_create">
+					<fieldset class="editMode">
+						<textarea loop="$lang_supported => $code, $name" class="{$code}" rows="1" cols="12" title="{$name}" style="margin-right:5px"></textarea>
+						<div class="x_clearfix">
+							<button type="reset" class="x_btn cancel">{$lang->cmd_cancel}</button>
+							<span class="x_pull-right">
+								<button type="submit" class="x_btn x_btn-primary save-useit">{$lang->cmd_save_and_use_it}</button>
+							<span>
+						</div>
+					</fieldset>
+				</form>
+				<div class="x_tab-pane" id="lang_search">
+				</div>
+			</div>
+		</div>
+	</div>
+	<div class="x_modal-footer">
+		<button type="button" class="x_btn x_pull-left" data-hide="#g11n">{$lang->cmd_close}</button>
+		<p class="x_pull-right">
+			{@
+				$link = '<a href="' . getUrl('', 'module', 'admin', 'act', 'dispModuleAdminLangcode') . '">' . $lang->about_multilingual_manage['link'] . '</a>';
+				$text = sprintf($lang->about_multilingual_manage['text'], $link);
+			}
+			{$text}
+		</p>
+	</div>
+</div>
+<script>
+	xe.msg_confirm_save_and_use_multilingual = '{$lang->msg_confirm_save_and_use_multilingual}';
+	xe.msg_empty_multilingual = '{$lang->msg_empty_multilingual}';
+</script>
diff --git a/modules/module/tpl/multilingual_v17_list.html b/modules/module/tpl/multilingual_v17_list.html
new file mode 100644
index 000000000..81c4b8039
--- /dev/null
+++ b/modules/module/tpl/multilingual_v17_list.html
@@ -0,0 +1,64 @@
+{@
+	/* move current language to the top */
+	$a = array($lang_type=>$lang_supported[$lang_type]);
+	unset($lang_supported[$lang_type]);
+	$lang_supported = array_merge($a, $lang_supported);
+}
+<p>{sprintf($lang->about_multilingual_search_result, $total_count)}</p>
+<fieldset class="list">
+	<form loop="$lang_code_list => $no, $val" action="" class="item">
+		<a href="#lang-{$no}" data-toggle="#lang-{$no}" data-lang_code="{$val->name}"><span>{$val->value}<span></a>
+		<fieldset id="lang-{$no}">
+			<textarea loop="$lang_supported => $code, $lname" disabled class="{$code}" data-lang="{$code}" rows="1" cols="12" title="{$lname}" style="margin-right:5px"></textarea>
+			<div class="x_clearfix">
+				<span class="x_pull-left">
+					<button type="button" class="x_btn modify">{$lang->cmd_modify}</button>
+					<button type="reset" class="x_btn cancel">{$lang->cmd_cancel}</button>
+				</span>
+				<span class="x_pull-right">
+					<button type="button" class="x_btn useit x_btn-primary">{$lang->use}</button>
+					<button type="submit" class="x_btn save x_btn-primary">{$lang->cmd_save_and_use_it}</button>
+				</span>
+			</div>
+		</fieldset>
+	</form>
+</fieldset>
+<div class="x_clearfix">
+	<form cond="$page_navigation" action="./" class="x_pagination x_pull-left" data-search_keyword="{htmlspecialchars($search_keyword)}" no-error-return-url="true">
+		<ul>
+			<li class="x_disabled"|cond="!$page || $page == 1"><a href="#" data-page="1" data-search_keyword="{htmlspecialchars($search_keyword)}">&laquo; {$lang->first_page}</a></li>
+			<block cond="$page_navigation->first_page != 1 && $page_navigation->first_page + $page_navigation->page_count > $page_navigation->last_page - 1 && $page_navigation->page_count != $page_navigation->total_page">
+			{@$isGoTo = true}
+			<li>
+				<a href="#goTo" data-toggle="#goTo" title="{$lang->cmd_go_to_page}">...</a>
+				<span cond="$isGoTo" id="goTo" class="x_input-append">
+					<input type="number" min="1" max="{$page_navigation->last_page}" required name="page" title="{$lang->cmd_go_to_page}" />
+					<button type="submit" class="x_add-on">Go</button>
+				</span>
+			</li>
+			</block>
+			<!--@while($page_no = $page_navigation->getNextPage())-->
+			{@$last_page = $page_no}
+			<li class="x_active"|cond="$page_no == $page"><a  href="#" data-page="{$page_no}" data-search_keyword="{htmlspecialchars($search_keyword)}">{$page_no}</a></li>
+			<!--@end-->
+			<block cond="$last_page != $page_navigation->last_page && $last_page + 1 != $page_navigation->last_page">
+			{@$isGoTo = true}
+			<li>
+				<a href="#goTo" data-toggle="#goTo" title="{$lang->cmd_go_to_page}">...</a>
+				<span cond="$isGoTo" id="goTo" class="x_input-append">
+					<input type="number" min="1" max="{$page_navigation->last_page}" required name="page" title="{$lang->cmd_go_to_page}" />
+					<button type="submit" class="x_add-on">Go</button>
+				</span>
+			</li>
+			</block>
+		<li class="x_disabled"|cond="$page == $page_navigation->last_page"><a href="#" data-page="{$page_navigation->last_page}" data-search_keyword="{htmlspecialchars($search_keyword)}" title="{$page_navigation->last_page}">{$lang->last_page} &raquo;</a></li>
+		</ul>
+	</form>
+	<form action="" class="search center x_input-append x_pull-right">
+		<input type="search" name="search_keyword" required title="Search" value="<!--@if($name)-->{htmlspecialchars($lang_code_list[1]->value)}<!--@else-->{htmlspecialchars($search_keyword)}<!--@end-->">
+		<span class="x_btn-group">
+			<button class="x_btn x_btn-inverse" type="submit">{$lang->cmd_search}</button>
+			<button cond="$search_keyword || $name" id="search_cancel" class="x_btn" type="button">{$lang->cmd_cancel}</button>
+		</span>
+	</form>
+</div>