widget multi select UI enhancement.

git-svn-id: http://xe-core.googlecode.com/svn/branches/1.5.0@9001 201d5d3c-b55e-5fd7-737f-ddc643e51545
This commit is contained in:
ChanMyeong 2011-09-02 09:30:55 +00:00
parent 2fe6b927d6
commit d17b0e6503
6 changed files with 156 additions and 153 deletions

View file

@ -1,4 +1,6 @@
var ModuleListManager = xe.createApp("ModuleListManager", {
(function($){
xe.ModuleListManager = xe.createApp("ModuleListManager", {
values: null,
keyObj: null,
moduleNameObj: null,
@ -6,99 +8,70 @@ var ModuleListManager = xe.createApp("ModuleListManager", {
selectedObj: null,
init: function(key, values){
var values = this.values = values;
var keyObj = this.keyObj = jQuery('input[name='+key+']');
var moduleNameObj = this.moduleNameObj = keyObj.parent().find('.moduleList');
var moduleSrlObj = this.moduleSrlObj = keyObj.parent().find('.moduleIdList');
var selectedObj = this.selectedObj = keyObj.parent().find('.modulelist_selected');
var thisObj = this;
keyObj.parent().find('.modulelist_add').bind('click', function(){ thisObj.cast('MODULELIST_ADD'); return false; });
keyObj.parent().find('.modulelist_del').bind('click', function(){ thisObj.cast('MODULELIST_DEL'); return false; });
keyObj.parent().find('.modulelist_up').bind('click', function(){ thisObj.cast('MODULELIST_UP'); return false; });
keyObj.parent().find('.modulelist_down').bind('click', function(){ thisObj.cast('MODULELIST_DOWN'); return false; });
var values = this.values = values, self = this;
var $keyObj = this.keyObj = $('input[name='+key+']');
this.moduleNameObj = $keyObj.parent().find('.moduleList');
this.moduleSrlObj = $keyObj.parent().find('.moduleIdList');
this.selectedObj = $keyObj.parent().find('.modulelist_selected');
this.moduleSrlObj
.nextAll('button')
.filter('.modulelist_add').bind('click', function(){ self.cast('MODULELIST_ADD'); return false; }).hide().end()
.filter('.modulelist_del').bind('click', function(){ self.cast('MODULELIST_DEL'); return false; }).end()
.filter('.modulelist_up').bind('click', function(){ self.cast('MODULELIST_UP'); return false; }).end()
.filter('.modulelist_down').bind('click', function(){ self.cast('MODULELIST_DOWN'); return false; }).end()
.end()
.bind('show', function(){
$(this).nextAll().show();
});
},
API_MODULELIST_ADD: function(){
var module = this.moduleNameObj.children('option:selected').text();
var moduleSrl = this.moduleSrlObj.val();
var browserTitle = this.moduleSrlObj.children('option:selected').text();
var moduleTitle = this.moduleNameObj.find('>option:selected').text();
this.moduleSrlObj
.find('>option:selected').clone(true)
.text(function(){ return $(this).text() + ' ('+moduleTitle+')'; })
.appendTo(this.selectedObj);
if (this.addValue(moduleSrl, module, browserTitle)) this.apply();
this.removeDuplicated();
this.refreshValue();
},
API_MODULELIST_DEL: function(){
var index = this.selectedObj.get(0).selectedIndex;
if (index == -1) return;
if (this.delValue(index)) this.apply();
this.selectedObj.find('>option:selected').remove();
this.refreshValue();
},
API_MODULELIST_UP: function(){
var index = this.selectedObj.get(0).selectedIndex;
if (index == -1) return;
if (this.up(index)) this.apply();
var $selected = this.selectedObj.find('>option:selected');
$selected.eq(0).prev('option').before($selected);
this.refreshValue();
},
API_MODULELIST_DOWN: function(){
var index = this.selectedObj.get(0).selectedIndex;
if (index == -1) return;
if (this.down(index)) this.apply();
var $selected = this.selectedObj.find('>option:selected');
$selected.eq(-1).next('option').after($selected);
this.refreshValue();
},
addValue: function(moduleSrl, module, browserTitle){
var value = {'moduleSrl': moduleSrl, 'module': module, 'browserTitle': browserTitle};
if (this.values == undefined) this.values = new Array();
for (var i in this.values){
if (this.values[i].moduleSrl == value.moduleSrl) return false;
}
this.values.push(value);
return true;
removeDuplicated : function() {
var selected = {};
this.selectedObj.find('>option').each(function(){
if(selected[this.value]) $(this).remove();
selected[this.value] = true;
});
},
delValue: function(index){
this.values.splice(index, 1);
return true;
},
up: function(index){
if (index == 0) return false;
var targets = this.values.splice(index-1, 2);
for(var i in targets){
this.values.splice(index-1, 0, targets[i]);
}
return true;
},
down: function(index){
if (index == this.values.length-1) return false;
var targets = this.values.splice(index, 2);
for(var i in targets){
this.values.splice(index, 0, targets[i]);
}
return true;
},
apply: function(){
var keys = new Array();
for (var i in this.values){
keys.push(this.values[i].moduleSrl);
}
this.keyObj.val(keys.join(','));
var prevValue = this.selectedObj.val();
this.selectedObj.empty();
for (var i in this.values){
var module = this.values[i];
var html = '<option value="'+module.moduleSrl+'">'+module.browserTitle+'('+module.module+')</option>';
this.selectedObj.append(html);
}
this.selectedObj.val(prevValue);
refreshValue : function() {
var srls = [];
this.selectedObj.find('>option').each(function(){
srls.push(this.value);
});
this.keyObj.val(srls.join(','));
}
});
})(jQuery);