issue 2390 Importer UI refactoring

git-svn-id: http://xe-core.googlecode.com/svn/branches/maserati@11548 201d5d3c-b55e-5fd7-737f-ddc643e51545
This commit is contained in:
ovclas 2012-09-27 06:40:23 +00:00
parent 6c5ad7a8d5
commit 46c3f69398
3 changed files with 310 additions and 16 deletions

View file

@ -427,6 +427,298 @@ $.fn.xeContentToggler = function(){
$('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="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="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($){

View file

@ -4,5 +4,7 @@
<load target="js/importer_admin.min.js" usecdn="true" />
<!--@end-->
{@ $type_list = array('module'=>$lang->type_module, 'ttxml'=>$lang->type_ttxml, 'member'=>$lang->type_member, 'sync'=>$lang->type_syncmember, 'message'=>$lang->type_message) }
<h1 class="h1">{$lang->importer}</h1>
<div class="x_page-header">
<h1>{$lang->importer}</h1>
</div>
<p>{nl2br($lang->about_importer)}</p>

View file

@ -5,24 +5,24 @@
<p>{$XE_VALIDATOR_MESSAGE}</p>
</div>
<form action="./" class="form" method="get" onsubmit="return doPreProcessing(this, 'documentForm')" id="documentForm">
<form action="./" method="get" onsubmit="return doPreProcessing(this, 'documentForm')" id="documentForm">
<input type="hidden" name="act" value="" />
<input type="hidden" name="type" value="module" />
<input type="hidden" name="unit_count" value="10" />
<h2 class="h2">{$lang->type_module}</h2>
<h2>{$lang->type_module}</h2>
<ul>
<li>
<p class="q">{$lang->xml_path} {$lang->path_info}</p>
<p class="a checkxml">
<input type="text" name="xml_file" value="./" />
<button type="button">{$lang->cmd_check_path}</button>
<button type="button" class="x_btn">{$lang->cmd_check_path}</button>
<em class="desc"></em><!--//class="error|success"-->
</p>
</li>
<li class="xml ttxml modulefinder">
<p class="q">{$lang->data_destination} <br />{$lang->import_desc}</p>
<div class="a">
<input type="text" name="site_keyword" /> <a href="#suggestion1" class="tgAnchor findsite">{$lang->find_site}</a>
<input type="text" name="site_keyword" /> <a href="#suggestion1" class="tgAnchor findsite x_btn">{$lang->find_site}</a>
<div id="suggestion1" class="tgContent suggestion">
<ul></ul>
</div>
@ -41,7 +41,7 @@
<li class="ttxml modulefinder">
<p class="q">{$lang->guestbook_destination}</p>
<div class="a">
<input type="text" name="site_keyword" /> <a href="#suggestion3" class="tgAnchor findsite">{$lang->find_site}</a>
<input type="text" name="site_keyword" /> <a href="#suggestion3" class="tgAnchor findsite x_btn">{$lang->find_site}</a>
<div id="suggestion3" class="tgContent suggestion">
<ul></ul>
</div>
@ -67,19 +67,19 @@
</li>
</ul>
<div class="btnArea">
<span class="btn"><input type="submit" value="{$lang->importer}" /></span>
<button type="submit" class="x_btn x_btn-primary">{$lang->importer}</button>
</div>
</form>
<form action="./" class="form" method="get" onsubmit="return doPreProcessing(this, 'memberForm')" id="memberForm">
<form action="./" method="get" onsubmit="return doPreProcessing(this, 'memberForm')" id="memberForm">
<input type="hidden" name="type" value="member" />
<input type="hidden" name="unit_count" value="100" />
<h2 class="h2">{$lang->type_member}</h2>
<h2>{$lang->type_member}</h2>
<ul>
<li>
<p class="q">{$lang->xml_path} {$lang->path_info}</p>
<p class="a checkxml">
<input type="text" name="xml_file" value="./" />
<button type="button">{$lang->cmd_check_path}</button>
<button type="button" class="x_btn">{$lang->cmd_check_path}</button>
<em class="desc">{$lang->msg_no_xml_file}</em>
</p>
</li>
@ -89,29 +89,29 @@
</li>
</ul>
<div class="btnArea">
<span class="btn"><input type="submit" value="{$lang->importer}" /></span>
<button type="submit" class="x_btn x_btn-primary">{$lang->importer}</button>
</div>
</form>
<form action="./" class="form" method="get" onsubmit="return doPreProcessing(this)" id="fo_import">
<form action="./" method="get" onsubmit="return doPreProcessing(this)" id="fo_import">
<input type="hidden" name="type" value="message" />
<input type="hidden" name="unit_count" value="100" />
<h2 class="h2">{$lang->type_message}</h2>
<h2>{$lang->type_message}</h2>
<ul>
<li>
<p class="q">{$lang->xml_path} {$lang->path_info}</p>
<p class="a checkxml">
<input type="text" name="xml_file" value="./" />
<button type="button">{$lang->cmd_check_path}</button>
<button type="button" class="x_btn">{$lang->cmd_check_path}</button>
<em class="desc"></em><!--//class="error|success"-->
</p>
</li>
</ul>
<div class="btnArea">
<span class="btn"><input type="submit" value="{$lang->importer}" /></span>
<button type="submit" class="x_btn x_btn-primary">{$lang->importer}</button>
</div>
</form>
<a href="#process" class="modalAnchor"></a>
<div class="modal" id="process" style="display:none;">
<div class="x_modal" id="process" style="display:none;">
<form action="./" method="get" onsubmit="return doImport()" id="fo_process" class="fg">
<input type="hidden" name="type" value="" />
<input type="hidden" name="total" value="" />