Chapril/xmpp.chapril.org-conversejs
Chapril/xmpp.chapril.org-conversejs
25
0
Fork 0
Code Issues Pull Requests Projects Releases Activity

emoji-views: don't iterate over all emojis if...

Browse Source 
new search term includes the previous one
This commit is contained in:
JC Brand 2019-09-05 16:17:59 +02:00
parent bf599f39ff
commit f52ade1193
2 changed files with 12 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/converse-emoji-views.js
View File

@ -147,6 +147,7 @@ converse.plugins.add('converse-emoji-views', {
}, },
async initialize () { async initialize () {
this.search_results = [];
this.debouncedFilter = debounce(input => this.filter(input.value), 150); this.debouncedFilter = debounce(input => this.filter(input.value), 150);
this.model.on('change:query', this.render, this); this.model.on('change:query', this.render, this);
this.model.on('change:current_skintone', this.render, this); this.model.on('change:current_skintone', this.render, this);
@ -168,7 +169,8 @@ converse.plugins.add('converse-emoji-views', {
'skintones': ['tone1', 'tone2', 'tone3', 'tone4', 'tone5'], 'skintones': ['tone1', 'tone2', 'tone3', 'tone4', 'tone5'],
'toned_emojis': _converse.emojis.toned, 'toned_emojis': _converse.emojis.toned,
'transform': u.getEmojiRenderer(), 'transform': u.getEmojiRenderer(),
'transformCategory': shortname => u.getEmojiRenderer()(this.getTonedShortname(shortname)) 'transformCategory': shortname => u.getEmojiRenderer()(this.getTonedShortname(shortname)),
'search_results': this.search_results
} }
) )
); );
@ -180,6 +182,14 @@ converse.plugins.add('converse-emoji-views', {
}, },
filter (value, set_property) { filter (value, set_property) {
const old_query = this.model.get('query');
if (!value) {
this.search_results = [];
} else if (old_query && value.includes(old_query)) {
this.search_results = this.search_results.filter(e => _converse.FILTER_CONTAINS(e.sn, value));
} else {
this.search_results = _converse.emojis_list.filter(e => _converse.FILTER_CONTAINS(e.sn, value));
}
this.model.set({'query': value}); this.model.set({'query': value});
if (set_property) { if (set_property) {
// XXX: Ideally we would set `query` on the model and // XXX: Ideally we would set `query` on the model and

2
src/templates/emojis.html
View File

@ -15,7 +15,7 @@
{[ if (o.query) { ]} {[ if (o.query) { ]}
<a id="emoji-picker-search-results" class="emoji-category__heading">{{{o.__('Search results')}}}</a> <a id="emoji-picker-search-results" class="emoji-category__heading">{{{o.__('Search results')}}}</a>
<ul class="emoji-picker"> <ul class="emoji-picker">
{[ o._converse.emojis_list.forEach(function (emoji) { ]} {[ o.search_results.forEach(function (emoji) { ]}
<li class="emoji insert-emoji {[ if (o.shouldBeHidden(emoji.sn)) { ]} hidden {[ }; ]}" <li class="emoji insert-emoji {[ if (o.shouldBeHidden(emoji.sn)) { ]} hidden {[ }; ]}"
data-emoji="{{{emoji.sn}}}" title="{{{emoji.sn}}}"> data-emoji="{{{emoji.sn}}}" title="{{{emoji.sn}}}">
<a href="#" data-emoji="{{{emoji.sn}}}"> {{ o.transform(emoji.sn) }} </a> <a href="#" data-emoji="{{{emoji.sn}}}"> {{ o.transform(emoji.sn) }} </a>