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 searching = (search != null && search != '');
//pull emote lists from the command preprocessor
var siteEmotes = this.client.chatBox.commandPreprocessor.emotes.site;
var chanEmotes = this.client.chatBox.commandPreprocessor.emotes.chan;
var personalEmotes = this.client.chatBox.commandPreprocessor.emotes.personal;
//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
siteEmotes = siteEmotes.filter(filterQuery);
chanEmotes = chanEmotes.filter(filterQuery);
@ -198,9 +200,9 @@ class emotePanel extends panelObj{
}
//render out the emote lists
this.renderEmotes(siteEmotes, this.siteEmoteList);
this.renderEmotes(chanEmotes, this.chanEmoteList);
this.renderEmotes(personalEmotes, this.personalEmoteList, true);
this.renderEmotes(siteEmotes, this.siteEmoteList, searching);
this.renderEmotes(chanEmotes, this.chanEmoteList, searching);
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 {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
container.innerHTML = '';
//If we have two or less emotes
if(emoteList.length <= 2){
if(emoteList.length <= 2 && searchRender){
//Set the container display to flex
container.style.display = 'flex';
//otherwise
@ -260,7 +262,7 @@ class emotePanel extends panelObj{
emoteMedia.classList.add('emote-list-media');
//if we have a low emote count
if(emoteList.length <= 2){
if(emoteList.length <= 2 && searchRender){
//render them huuuuuge
emoteMedia.classList.add('emote-list-big-media');
}