Implement new kind of taglist to show thumbnail of set value

This commit is contained in:
Hadi Nategh 2018-05-28 17:41:52 +02:00
parent f4a8d74469
commit 8b7f6012d6
3 changed files with 24 additions and 1 deletions

View File

@ -82,7 +82,7 @@
<description value="If you wish to have randomly selected images you may upload multiple images."/> <description value="If you wish to have randomly selected images you may upload multiple images."/>
</vbox> </vbox>
<vbox> <vbox>
<taglist id="newsettings[login_background_file]" width="100%" allowFreeEntries="true" empty_label="Upload your background image or enter the URL"/> <taglist-thumbnail id="newsettings[login_background_file]" width="100%" allowFreeEntries="true" empty_label="Upload your background image or enter the URL"/>
<file width="100%" label="upload" onchange="app.admin.login_background_update"/> <file width="100%" label="upload" onchange="app.admin.login_background_update"/>
</vbox> </vbox>
</row> </row>

View File

@ -1310,6 +1310,26 @@ var et2_taglist_category = (function(){ "use strict"; return et2_taglist.extend(
});}).call(this); });}).call(this);
et2_register_widget(et2_taglist_category, ["taglist-cat"]); et2_register_widget(et2_taglist_category, ["taglist-cat"]);
/**
* Taglist customized specificlly for image url shown as thumbnail,
*
*/
var et2_taglist_thumbnail = (function(){ "use strict"; return et2_taglist.extend(
{
init:function ()
{
this._super.apply(this, arguments);
},
selectionRenderer: function(item)
{
var tag = jQuery('<span>').attr('title',item.label);
jQuery('<img class="et2_taglist_thumbnail"/>').attr('src', item.label).prependTo(tag);
return tag;
}
});}).call(this);
et2_register_widget(et2_taglist_thumbnail, ["taglist-thumbnail"]);
/** /**
* et2_taglist_ro is the readonly implementation of the taglist. * et2_taglist_ro is the readonly implementation of the taglist.

View File

@ -1087,6 +1087,9 @@ ul.et2_link_string {
.et2_taglist, .et2_taglist > div.ms-ctn { .et2_taglist, .et2_taglist > div.ms-ctn {
min-height: 23px; min-height: 23px;
} }
img.et2_taglist_thumbnail, table.egwGridView_grid .et2_taglist .et2_taglist_thumbnail {
height:100px;
}
/* Toggle single / multiple */ /* Toggle single / multiple */
.et2_taglist_toggle { .et2_taglist_toggle {
position: relative; position: relative;