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

Userlist colors persist accross other users' reconnects.

Browse source
This commit is contained in:
rainbow napkin 2026-04-22 12:34:49 -04:00
parent d669ed4783
commit de5268a41f
2 changed files with 30 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

3
www/js/channel/commandPreprocessor.js
View file

@ -269,7 +269,8 @@ class commandPreprocessor{
usernames:{ usernames:{
prefix: '', prefix: '',
postfix: '', postfix: '',
cmds: injectPerms(Array.from(client.userList.colorMap.keys())) //cmds: injectPerms(Array.from(client.userList.colorMap.keys()))
cmds: injectPerms(client.userList.getOnlineUserNames())
}, },
emotes:{ emotes:{
prefix:'[', prefix:'[',

40
www/js/channel/userlist.js
View file

@ -33,6 +33,12 @@ class userList{
*/ */
this.clickDragger = new canopyUXUtils.clickDragger("#chat-panel-users-drag-handle", "#chat-panel-users-div", true, this.client.chatBox.clickDragger); this.clickDragger = new canopyUXUtils.clickDragger("#chat-panel-users-drag-handle", "#chat-panel-users-div", true, this.client.chatBox.clickDragger);
/**
* List of currently connected users
*/
this.userList = [];
/** /**
* Userlist color array (Maps to css classes) * Userlist color array (Maps to css classes)
*/ */
@ -46,7 +52,7 @@ class userList{
"userlist-color6"]; "userlist-color6"];
/** /**
* Map of usernames to assigned username color * Map of connected and buffered usernames to assigned username color/flair
*/ */
this.colorMap = new Map(); this.colorMap = new Map();
@ -58,7 +64,7 @@ class userList{
/** /**
* userlist div * userlist div
*/ */
this.userList = document.querySelector("#chat-panel-users-list-div"); this.userListDiv = document.querySelector("#chat-panel-users-list-div");
/** /**
* user count label * user count label
@ -103,28 +109,28 @@ class userList{
updateList(list){ updateList(list){
//Clear list and set user count //Clear list and set user count
this.userCount.textContent = list.length == 1 ? '1 User' : `${list.length} Users`; this.userCount.textContent = list.length == 1 ? '1 User' : `${list.length} Users`;
this.userList.innerHTML = null; this.userListDiv.innerHTML = null;
//create a new map //Set userlist array to received list
var newMap = new Map(); this.userList = list;
//for each user //for each user
list.forEach((user) => { list.forEach((user) => {
//randomly pick a color //randomly pick a color
var color = this.userColors[Math.floor(Math.random()*this.userColors.length)] var color = this.userColors[Math.floor(Math.random()*this.userColors.length)]
//if this user was in the previous colormap //if this user wasn't in the previous colormap
if(this.colorMap.get(user.user) != null){ if(this.colorMap.get(user.user) == null){
//Override with previous color //Store new randomly selected color
this.colorMap.set(user.user, color);
}else{
//Use color from previous entry
color = this.colorMap.get(user.user); color = this.colorMap.get(user.user);
} }
newMap.set(user.user, color);
this.renderUser(user, color); this.renderUser(user, color);
}); });
this.colorMap = newMap;
//Make sure we're not cutting the ux off //Make sure we're not cutting the ux off
this.clickDragger.fixCutoff(); this.clickDragger.fixCutoff();
} }
@ -168,7 +174,7 @@ class userList{
userSpan.addEventListener('click', renderContextMenu.bind(this)); userSpan.addEventListener('click', renderContextMenu.bind(this));
userSpan.addEventListener('contextmenu', renderContextMenu.bind(this)); userSpan.addEventListener('contextmenu', renderContextMenu.bind(this));
this.userList.appendChild(userSpan); this.userListDiv.appendChild(userSpan);
function renderContextMenu(event){ function renderContextMenu(event){
//Setup menu map //Setup menu map
@ -211,4 +217,14 @@ class userList{
} }
} }
//returns list of strings containing all currently online users
getOnlineUserNames(){
var names = [];
for(let user of this.userList){
names.push(user.user);
}
return names;
}
} }