rainbownapkin/canopy
1
0
Fork 0
Code Issues 2 Pull requests Actions Packages Projects Releases Wiki Activity

Made emotes in emote pallette only enlargen on search to improve UX.

Browse source
This commit is contained in:
rainbow napkin 2025-09-06 21:26:14 -04:00
parent 9650caeed0
commit cbd2136ca6
1 changed files with 9 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
www/js/channel/panels/emotePanel.js
View file

@ -179,13 +179,15 @@ class emotePanel extends panelObj{
var search = this.searchPrompt.value; var search = this.searchPrompt.value;
} }
var searching = (search != null && search != '');
//pull emote lists from the command preprocessor //pull emote lists from the command preprocessor
var siteEmotes = this.client.chatBox.commandPreprocessor.emotes.site; var siteEmotes = this.client.chatBox.commandPreprocessor.emotes.site;
var chanEmotes = this.client.chatBox.commandPreprocessor.emotes.chan; var chanEmotes = this.client.chatBox.commandPreprocessor.emotes.chan;
var personalEmotes = this.client.chatBox.commandPreprocessor.emotes.personal; var personalEmotes = this.client.chatBox.commandPreprocessor.emotes.personal;
//If we have a search bar and a search in the search bar //If we have a search bar and a search in the search bar
if(search != null && search != ''){ if(searching){
//filter emote lists using the filterQuery function //filter emote lists using the filterQuery function
siteEmotes = siteEmotes.filter(filterQuery); siteEmotes = siteEmotes.filter(filterQuery);
chanEmotes = chanEmotes.filter(filterQuery); chanEmotes = chanEmotes.filter(filterQuery);
@ -198,9 +200,9 @@ class emotePanel extends panelObj{
} }
//render out the emote lists //render out the emote lists
this.renderEmotes(siteEmotes, this.siteEmoteList); this.renderEmotes(siteEmotes, this.siteEmoteList, searching);
this.renderEmotes(chanEmotes, this.chanEmoteList); this.renderEmotes(chanEmotes, this.chanEmoteList, searching);
this.renderEmotes(personalEmotes, this.personalEmoteList, true); this.renderEmotes(personalEmotes, this.personalEmoteList, searching, true);
} }
/** /**
@ -209,12 +211,12 @@ class emotePanel extends panelObj{
* @param {Node} container - Container to render emotes out to * @param {Node} container - Container to render emotes out to
* @param {Boolean} personal - Denotes whether or not we're rendering personal emotes * @param {Boolean} personal - Denotes whether or not we're rendering personal emotes
*/ */
renderEmotes(emoteList, container, personal = false){ renderEmotes(emoteList, container, searchRender = false, personal = false){
//Clear out the container //Clear out the container
container.innerHTML = ''; container.innerHTML = '';
//If we have two or less emotes //If we have two or less emotes
if(emoteList.length <= 2){ if(emoteList.length <= 2 && searchRender){
//Set the container display to flex //Set the container display to flex
container.style.display = 'flex'; container.style.display = 'flex';
//otherwise //otherwise
@ -260,7 +262,7 @@ class emotePanel extends panelObj{
emoteMedia.classList.add('emote-list-media'); emoteMedia.classList.add('emote-list-media');
//if we have a low emote count //if we have a low emote count
if(emoteList.length <= 2){ if(emoteList.length <= 2 && searchRender){
//render them huuuuuge //render them huuuuuge
emoteMedia.classList.add('emote-list-big-media'); emoteMedia.classList.add('emote-list-big-media');
} }