fanbinit/rhymix
1
0
Fork 0
mirror of https://github.com/Lastorder-DC/rhymix.git synced 2026-01-04 01:01:41 +09:00
Code Issues Projects Releases Packages Wiki Activity

widget multi select UI enhancement.

Browse source 
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
Download patch file Download diff file Expand all files Collapse all files

4
modules/admin/lang/lang.xml
View file

@ -896,4 +896,8 @@ Lütfen son sürümü için indirme linkine tıklayınız.]]></value>
<value xml:lang="ko"><![CDATA[보기]]></value>
<value xml:lang="en"><![CDATA[View]]></value>
</item>
<item name="select">
<value xml:lang="ko"><![CDATA[선택]]></value>
<value xml:lang="en"><![CDATA[Select]]></value>
</item>
</lang>

2
modules/admin/tpl/css/admin.css
View file

@ -248,7 +248,7 @@ body.modalContainer{_height:100%;_width:100%} /* IE6 only */
.x .message.update{border-color:#EAE9DC;background:#FFFDEF url(../img/msg.update.png) no-repeat 1em .5em}
/* Text Button */
.x input.text,
.x button.text{border:0;overflow:visible;padding:0;margin:0;color:#33a;background:none;text-decoration:underline}
.x button.text{border:0;overflow:visible;padding:0;margin:0 4px 0 0;color:#33a;background:none;text-decoration:underline}
/* H2 Anchor */
.x .h2Anchor{position:absolute;right:0;border:0;background:none;color:#00f;text-decoration:underline}
/* Waiting for server response */

8
modules/admin/tpl/js/admin.js
View file

@ -423,9 +423,11 @@ $('.modulefinder')
$mod_select.prop('selectedIndex', 0).change().focus();
if(!$mod_select.is(':visible')) {
$mod_select.slideDown(100, function(){
$finder.find('.moduleIdList:not(:visible)').slideDown(100);
});
$mod_select
.slideDown(100, function(){
$finder.find('.moduleIdList:not(:visible)').slideDown(100).trigger('show');
})
.trigger('show');
}
};

129
modules/widget/tpl/js/module_list.js
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);

104
modules/widget/tpl/widget_generate_code.html
View file

@ -3,43 +3,38 @@
<load target="js/multi_order.js" />
<load target="js/module_list.js" />
<!--%load_js_plugin("ui.colorpicker")-->
<h2 class="h2">{$widget_info->title}</h2>
<p>{$widget_info->description}</p>
<form class="form" action="./" method="post">
<input type="hidden" name="selected_widget" value="{$widget_info->widget}" />
<input type="hidden" name="selected_widget" value="{$widget_info->widget}" />
<h3 class="h3">{$lang->cmd_generate_code}</h3>
<p>{$lang->about_widget_code}</p>
<ul>
<li>
<p class="q"><label for="skin">{$lang->skin}</label></p>
<a class="a">
<select name="skin" id="skin">
<option value=""></option>
<select name="skin" id="skin" style="width:280px">
<option value="">{$lang->select}</option>
<option loop="$skin_list => $skin_name, $skin" value="{$skin_name}">{$skin->title} ({$skin_name})</option>
</select>
<span class="btn small"><input type="button" value="{$lang->cmd_select}" /></span>
<input type="button" value="{$lang->cmd_select}" />
</a>
</li>
<li>
<p class="q"><label for="colorset">{$lang->colorset}</label></p>
<p class="a">
<select name="colorset">
<select name="colorset" style="width:280px">
</select>
</p>
</li>
<li>
<p class="q"><label for="widget_cache">{$lang->widget_cache}</label></p>
<p class="a">
<input type="text" name="widget_cache" id="widget_cache" value="0" size="2" style="width: auto;" /> {$lang->unit_min}
<input type="text" name="widget_cache" id="widget_cache" value="0" size="2" style="width:auto" /> {$lang->unit_min}
({$lang->about_widget_cache})
</p>
<p class="desc">{$lang->about_widget_cache}</p>
</li>
</ul>
{@$suggestion_id = 0}
<block loop="$widget_info->extra_var => $id, $var">
{@$suggestion_id++}
@ -55,34 +50,19 @@
<p class="q"><label for="{$id}">{$var->name}</label></p>
<div class="a">
<input cond="$var->type == 'text'" type="text" name="{$id}" value="" id="{$id}" />
<input cond="$var->type == 'color'" type="text" name="{$id}" value="" id="{$id}" class="color-indicator" />
<textarea cond="$var->type == 'textarea'" name="{$id}" id="{$id}"></textarea>
<select cond="$var->type == 'select'" name="{$id}" id="{$id}">
<select cond="$var->type == 'select'" name="{$id}" id="{$id}" style="width:290px">
<option loop="$var->options => $key, $val" value="{$key}">{$val}</option>
</select>
<block cond="$var->type == 'select-multi-order'">
<input type="hidden" name="{$id}" value="" />
<div style="float:left; margin-left: 30px;">
<select class="multiorder_show" size="8" style="width: 100px;"></select>
</div>
<div style="float:left;margin-left:30px;">
<a class="multiorder_add" href="#">{$lang->cmd_insert}</a>
<br/><br/>
<a class="multiorder_del" href="#">{$lang->cmd_delete}</a>
</div>
<div style="float:left;margin-left:30px;">
<select class="multiorder_selected" size="8" style="width: 100px;"></select>
</div>
<div style="float:left;margin-left:30px;">
<a class="multiorder_up" href="#">{$lang->cmd_move_up}</a>
<br/><br/>
<a class="multiorder_down" href="#">{$lang->cmd_move_down}</a>
</div>
<select class="multiorder_show" size="8" multiple="multiple" style="width:290px;vertical-align:top"></select>
<button type="button" class="text multiorder_add" style="vertical-align:top">{$lang->cmd_insert}</button>
<select class="multiorder_selected" size="8" multiple="multiple" style="width:290px;vertical-align:top"></select>
<button type="button" class="text multiorder_up" style="vertical-align:top">{$lang->cmd_move_up}</button>
<button type="button" class="text multiorder_down" style="vertical-align:top">{$lang->cmd_move_down}</button>
<button type="button" class="text multiorder_del" style="vertical-align:top">{$lang->cmd_delete}</button>
<script type="text/javascript">
var options = [
<block loop="$var->options => $key, $val">
@ -104,62 +84,48 @@
},
</block>
];
new MultiOrderManager('{$id}', options);
</script>
</block>
<block cond="$var->type == 'mid_list'">
{@debugPrint($mid_list)}
<fieldset loop="$mid_list => $module_category_srl, $modules" style="border: 1px solid #ccc; margin: 0; padding: 4px 7px 9px 7px;">
<fieldset loop="$mid_list => $module_category_srl, $modules" style="border: 1px solid #ccc; margin:1em 0; padding:.5em 1em">
<legend cond="$modules->title">{$modules->title}</legend>
<legend cond="!$modules->title">{$lang->none_category}</legend>
<div loop="$modules->list => $key, $val">
<input type="checkbox" value="{$key}" name="{$id}" id="chk_mid_list_{$key}" />
<label for="chk_mid_list_{$key}">{$key} ({$val->browser_title})</label>
</div>
</fieldset>
</block>
<block cond="$var->type == 'member_group'">
<block loop="$group_list => $key, $val">
<input type="checkbox" value="{$key}" name="{$id}" id="chk_member_gruop_{$id}_{$key}" />
<label for="chk_member_gruop_{$id}_{$key}">{$val->title}</label>
</block>
</block>
<block cond="$var->type == 'module_srl_list'">
<input type="hidden" name="{$id}" value="" />
<div style="float:left; margin-left: 30px;">
<div class="a">
<input type="text" /> <a href="#suggestion_{$suggestion_id}" class="tgAnchor findsite">사이트찾기</a>
<div id="suggestion_{$suggestion_id}" class="tgContent suggestion">
<ul>
</ul>
</div>
<div class="a">
<input type="text" /> <a href="#suggestion_{$suggestion_id}" class="tgAnchor findsite">사이트찾기</a>
<div id="suggestion_{$suggestion_id}" class="tgContent suggestion">
<ul>
</ul>
</div>
<p class="a"><select class="moduleList" style="width: 290px;"></select></p>
<p class="a"><select class="moduleIdList" style="width: 290px;"></select></p>
</div>
<div style="float:left;margin-left:30px;">
<a class="modulelist_add" href="#">{$lang->cmd_insert}</a>
<br/><br/>
<a class="modulelist_del" href="#">{$lang->cmd_delete}</a>
</div>
<div style="float:left;margin-left:30px;">
<select class="modulelist_selected" size="8" style="width: 200px;"></select>
</div>
<div style="float:left;margin-left:30px;">
<a class="modulelist_up" href="#">{$lang->cmd_move_up}</a>
<br/><br/>
<a class="modulelist_down" href="#">{$lang->cmd_move_down}</a>
</div>
<p class="a">
<select class="moduleList" style="width:290px"></select>
</p>
<select class="moduleIdList" size="8" multiple="multiple" style="width:290px;vertical-align:top"></select>
<button type="button" class="text modulelist_add" style="vertical-align:top">{$lang->cmd_insert}</button>
<select class="modulelist_selected" size="8" multiple="multiple" style="width:290px;"></select>
<button type="button" class="text modulelist_up" style="vertical-align:top">{$lang->cmd_move_up}</button>
<button type="button" class="text modulelist_down" style="vertical-align:top">{$lang->cmd_move_down}</button>
<button type="button" class="text modulelist_del" style="vertical-align:top">{$lang->cmd_delete}</button>
<script type="text/javascript">
new ModuleListManager('{$id}');
xe.registerApp(new xe.ModuleListManager('{$id}'));
</script>
</block>
<block cond="$var->type == 'mid'">
<div class="a">
<input type="text" /> <a href="#suggestion_{$suggestion_id}" class="tgAnchor findsite">사이트찾기</a>
@ -168,10 +134,9 @@
</ul>
</div>
</div>
<p class="a"><select class="moduleList" style="width: 290px;"></select></p>
<p class="a"><select name="{$id}" class="moduleIdList" style="width: 290px;"></select></p>
<p class="a"><select class="moduleList" style="width:290px;"></select></p>
<p class="a"><select name="{$id}" class="moduleIdList" style="width:290px;"></select></p>
</block>
<block cond="$var->type == 'filebox'">
<div id="filebox_preview_{$id}" style="width:100px;height:100px;display:none" ></div>
<input type="hidden" name="{$id}" value="" />
@ -181,13 +146,12 @@
XE.filebox.init('{$id}');
//]]></script>
</block>
<select cond="$var->type == 'menu'">
<select cond="$var->type == 'menu'" style="width:290px">
<option value="">-</option>
<option loop="$menu_list => $key, $val" value="{$val->menu_srl}">{$val->title}</option>
</select>
</div>
<p class="desc" style="clear: both;">{$var->description}</p>
<p class="desc">{$var->description}</p>
</li>
</block>
</ul>

62
widgets/language_select/conf/info.xml
View file

@ -12,7 +12,7 @@
<description xml:lang="ko">사용자의 접속언어를 변경할 수 있는 select폼을 출력합니다.</description>
<description xml:lang="jp">言語を変更することが出来るセレクト（select）フォームを表示します。</description>
<description xml:lang="zh-CN">可以实现多国语言相互切换。</description>
<description xml:lang="en">This widget outputs a select form to allow s user to change the display language.</description>
<description xml:lang="en">This widget displays a select form for change of users' language.</description>
<description xml:lang="vi">Widget này sẽ hiển thị ngôn ngữ cho người dùng lựa chọn.</description>
<description xml:lang="es">Este widget muestra la forma de cambiar el idioma del usuario.</description>
<description xml:lang="ru">Этот виджет отображает форму для выбора пользовательского языка.</description>
@ -33,4 +33,64 @@
<name xml:lang="tr">NHN</name>
</author>
<extra_vars>
<var id="text" type="text">
<name>text</name>
</var>
<var id="color" type="color">
<name>color</name>
</var>
<var id="textarea" type="textarea">
<name>textarea</name>
</var>
<var id="select" type="select">
<name>select</name>
<options>
<value>1</value>
<name>일</name>
</options>
<options>
<value>2</value>
<name>이</name>
</options>
<options>
<value>3</value>
<name>삼</name>
</options>
</var>
<var id="selectmultiorder2" type="select-multi-order">
<name>selectmultiorder2</name>
<options default="true" init="true">
<value>one</value>
<name>기본(제거불가)</name>
</options>
<options>
<value>two</value>
<name>이</name>
</options>
<options init="true">
<value>three</value>
<name>삼</name>
</options>
</var>
<var id="mid_list" type="mid_list">
<name>mid_list</name>
</var>
<var id="member_group" type="member_group">
<name>member_group</name>
</var>
<var id="module_srl_list" type="module_srl_list">
<name>module_srl_list</name>
</var>
<var id="mid" type="mid">
<name>mid</name>
</var>
<var id="filebox" type="filebox">
<name>filebox</name>
</var>
<var id="menu" type="menu">
<name>menu</name>
</var>
</extra_vars>
</widget>