From 8ccb9003cced448479b2026edf0ecf25dfc34ccc Mon Sep 17 00:00:00 2001 From: rainbownapkin Date: Tue, 3 Dec 2024 20:27:37 -0500 Subject: [PATCH] highLevel syncs across chans, shows in userlist --- src/app/channel/activeChannel.js | 5 +++-- src/app/channel/chatHandler.js | 38 +++++++++++++++++++++++--------- src/app/channel/connectedUser.js | 28 ++++++++++++++--------- src/schemas/userSchema.js | 9 ++++++-- www/css/channel.css | 16 ++++++++++---- www/css/theme/movie-night.css | 2 +- www/js/channel/chat.js | 18 +++++++++++---- www/js/channel/userlist.js | 24 +++++++++++++++----- 8 files changed, 102 insertions(+), 38 deletions(-) diff --git a/src/app/channel/activeChannel.js b/src/app/channel/activeChannel.js index c701288..ac8b590 100644 --- a/src/app/channel/activeChannel.js +++ b/src/app/channel/activeChannel.js @@ -39,7 +39,7 @@ module.exports = class{ userObj.sockets.push(socket.id); }else{ await userDB.populate('flair'); - userObj = new connectedUser(userDB.user, userDB.id, userDB.rank, chanRank, userDB.flair.name, this, socket); + userObj = new connectedUser(userDB, chanRank, this, socket); } //Set user entry in userlist @@ -84,7 +84,8 @@ module.exports = class{ this.userList.forEach((userObj, user) => { userList.push({ user: user, - flair: userObj.flair + flair: userObj.flair, + highLevel: userObj.highLevel }); }); diff --git a/src/app/channel/chatHandler.js b/src/app/channel/chatHandler.js index 174bc33..2682c92 100644 --- a/src/app/channel/chatHandler.js +++ b/src/app/channel/chatHandler.js @@ -28,15 +28,13 @@ module.exports = class{ defineListeners(socket){ socket.on("chatMessage", (data) => {this.relayChat(socket, data)}); - socket.on("setFlair", async (data) => {this.setFlair(socket, data)}); + socket.on("setFlair", (data) => {this.setFlair(socket, data)}); + socket.on("setHighLevel", (data) => {this.setHighLevel(socket, data)}); } relayChat(socket, data){ //Trim and Sanatize for XSS const msg = validator.trim(validator.escape(data.msg)); - //make sure high is an int - const high = validator.toInt(data.high); - const user = this.server.getSocketInfo(socket); //nuke the message if its empty or huge @@ -44,12 +42,7 @@ module.exports = class{ return; } - //nuke the message if the high number is wrong - if(high < 0 || high > 10){ - return; - } - - this.server.io.in(socket.chan).emit("chatMessage", {user: socket.user.user, flair: user.flair, high, msg}); + this.server.io.in(socket.chan).emit("chatMessage", {user: user.user, flair: user.flair, highLevel: user.highLevel, msg}); } async setFlair(socket, data){ @@ -60,8 +53,10 @@ module.exports = class{ //We can take this data raw since our schema checks it against existing flairs, and mongoose sanatizes queries const flairDB = await userDB.setFlair(data.flair); + //GetConnects across all channels const connections = this.server.getConnections(socket.user.user); + //For each connection connections.forEach((conn) => { conn.updateFlair(flairDB.name); }); @@ -70,4 +65,27 @@ module.exports = class{ } } } + + async setHighLevel(socket, data){ + var userDB = await userModel.findOne({user: socket.user.user}); + + if(userDB){ + try{ + //Set high level + userDB.highLevel = data.highLevel; + //Save user DB Document + await userDB.save(); + + //GetConnects across all channels + const connections = this.server.getConnections(socket.user.user); + + //For each connection + connections.forEach((conn) => { + conn.updateHighLevel(userDB.highLevel); + }); + }catch(err){ + return loggerUtils.socketExceptionHandler(socket, err); + } + } + } } \ No newline at end of file diff --git a/src/app/channel/connectedUser.js b/src/app/channel/connectedUser.js index 0484827..f835a62 100644 --- a/src/app/channel/connectedUser.js +++ b/src/app/channel/connectedUser.js @@ -19,12 +19,13 @@ const flairModel = require('../../schemas/flairSchema'); const permissionModel = require('../../schemas/permissionSchema'); module.exports = class{ - constructor(id, name, rank, chanRank, flair, channel, socket){ - this.id = id; - this.name = name; - this.rank = rank; + constructor(userDB, chanRank, channel, socket){ + this.id = userDB.id; + this.user = userDB.user; + this.rank = userDB.rank; + this.highLevel = userDB.highLevel; + this.flair = userDB.flair.name; this.chanRank = chanRank; - this.flair = flair; this.channel = channel; this.sockets = [socket.id]; } @@ -59,6 +60,8 @@ module.exports = class{ id: this.id, user: this.user, rank: this.rank, + chanRank: this.chanRank, + highLevel: this.highLevel, flair: this.flair } @@ -79,12 +82,17 @@ module.exports = class{ } updateFlair(flair){ - //This will run multiple times in a row, we don't need to broadcast the userlist every time - if(this.flair != flair){ - this.flair = flair; - this.channel.broadcastUserList(); - } + this.flair = flair; + this.channel.broadcastUserList(); + this.sendClientMetadata(); + } + + updateHighLevel(highLevel){ + this.highLevel = highLevel; + + //TODO: show high-level in userlist + this.channel.broadcastUserList(); this.sendClientMetadata(); } } \ No newline at end of file diff --git a/src/schemas/userSchema.js b/src/schemas/userSchema.js index 56d6723..ad88668 100644 --- a/src/schemas/userSchema.js +++ b/src/schemas/userSchema.js @@ -77,6 +77,13 @@ const userSchema = new mongoose.Schema({ required: true, default: "Signature not set!" }, + highLevel: { + type: mongoose.SchemaTypes.Number, + required: true, + min: 0, + max: 10, + default: 0 + }, flair: { type: mongoose.SchemaTypes.ObjectID, default: null, @@ -93,8 +100,6 @@ userSchema.pre('save', async function (next){ this.pass = hashUtil.hashPassword(this.pass); } - - //If the flair was changed if(this.isModified("flair")){ //Get flair properties diff --git a/www/css/channel.css b/www/css/channel.css index 0eebf82..e834919 100644 --- a/www/css/channel.css +++ b/www/css/channel.css @@ -185,9 +185,16 @@ input#chat-panel-prompt{ margin: 0.2em; } +.user-list-high-level{ + margin: auto; +} + .chat-entry-high-level{ margin: 0.2em; margin-right: 0; +} + +.high-level{ z-index: 2; background-image: url("/img/sweet_leaf_simple.png"); background-size: 1.3em; @@ -199,13 +206,14 @@ input#chat-panel-prompt{ flex-shrink: 0; } -.chat-entry-high-level-img{ - position: absolute; - height: 1.7em; +span.user-entry{ + display: flex; + margin-bottom: 0.1em; } .user-entry{ - margin: 0.2em; + margin: 0; + margin-left: 0.1em; font-size: 1em; width: fit-content; } diff --git a/www/css/theme/movie-night.css b/www/css/theme/movie-night.css index 80ab9cb..6f10926 100644 --- a/www/css/theme/movie-night.css +++ b/www/css/theme/movie-night.css @@ -242,7 +242,7 @@ div#chat-panel-control-div{ text-shadow: none; } -.chat-entry-high-level{ +.high-level{ text-shadow: 1px 1px 1px white, -1px -1px 1px white, 1px 1px 1px white, -1px 1px 1px white, 1px -1px 1px white; } diff --git a/www/js/channel/chat.js b/www/js/channel/chat.js index 6a08dfc..344bd15 100644 --- a/www/js/channel/chat.js +++ b/www/js/channel/chat.js @@ -59,6 +59,7 @@ class chatBox{ this.aspectLockIcon.addEventListener("click", this.lockAspect.bind(this)); this.showChatIcon.addEventListener("click", ()=>{this.toggleUI()}); this.hideChatIcon.addEventListener("click", ()=>{this.toggleUI()}); + this.highSelect.addEventListener("change", this.setHighLevel.bind(this)); this.flairSelect.addEventListener("change", this.setFlair.bind(this)); //Clickdragger/Resize @@ -79,8 +80,8 @@ class chatBox{ //Create high-level label var highLevel = document.createElement('p'); - highLevel.classList.add("chat-panel-buffer","chat-entry-high-level"); - highLevel.innerHTML = `${chat.high}`; + highLevel.classList.add("chat-panel-buffer","chat-entry-high-level","high-level"); + highLevel.innerHTML = `${chat.highLevel}`; chatEntry.appendChild(highLevel); //Create username label @@ -113,13 +114,20 @@ class chatBox{ async send(event){ if((!event || !event.key || event.key == "Enter") && this.chatPrompt.value){ - this.client.socket.emit("chatMessage",{msg: this.chatPrompt.value, high: this.highSelect.value}); + this.client.socket.emit("chatMessage",{msg: this.chatPrompt.value}); this.chatPrompt.value = ""; } } handleClientInfo(data){ this.updateFlairSelect(data.flairList, data.user.flair); + this.updateHighSelect(data.user.highLevel); + } + + setHighLevel(event){ + const highLevel = event.target.value; + + this.client.socket.emit("setHighLevel", {highLevel}); } setFlair(event){ @@ -128,7 +136,9 @@ class chatBox{ this.client.socket.emit("setFlair", {flair}); } - + updateHighSelect(highLevel){ + this.highSelect.value = highLevel; + } updateFlairSelect(flairList, flair){ //clear current flair select diff --git a/www/js/channel/userlist.js b/www/js/channel/userlist.js index 18d7179..f34a32b 100644 --- a/www/js/channel/userlist.js +++ b/www/js/channel/userlist.js @@ -88,20 +88,34 @@ class userList{ this.colorMap = newMap; } - renderUser(user, color){ - var userEntry = document.createElement('p'); + renderUser(user, flair){ + //Create user span + var userSpan = document.createElement('span'); + userSpan.classList.add('chat-panel-users', 'user-entry'); + + //Create high-level label + var highLevel = document.createElement('p'); + highLevel.classList.add("user-list-high-level","high-level"); + highLevel.innerHTML = `${user.highLevel}`; + userSpan.appendChild(highLevel); + + //Create nameplate + var userEntry = document.createElement('p'); userEntry.innerText = user.user; userEntry.id = `user-entry-${user.user}`; //Override color with flair if(user.flair != "classic"){ - color = `flair-${user.flair}`; + flair = `flair-${user.flair}`; } + //Add classes to classList + userEntry.classList.add("chat-panel-users","user-entry",flair); - userEntry.classList.add("chat-panel-users","user-entry",color); + userSpan.appendChild(userEntry); - this.userList.appendChild(userEntry); + + this.userList.appendChild(userSpan); } toggleUI(show = this.userDiv.style.display == "none"){