diff --git a/src/app/channel/chatHandler.js b/src/app/channel/chatHandler.js index 22a8bc0..f485cca 100644 --- a/src/app/channel/chatHandler.js +++ b/src/app/channel/chatHandler.js @@ -32,6 +32,7 @@ module.exports = class{ socket.on("setFlair", (data) => {this.setFlair(socket, data)}); socket.on("setHighLevel", (data) => {this.setHighLevel(socket, data)}); socket.on("addPersonalEmote", (data) => {this.addPersonalEmote(socket, data)}); + socket.on("deletePersonalEmote", (data) => {this.deletePersonalEmote(socket, data)}); } handleChat(socket, data){ @@ -112,6 +113,16 @@ module.exports = class{ } } + async deletePersonalEmote(socket, data){ + //Get user doc from DB based on socket + const userDB = await userModel.findOne({user: socket.user.user}); + + //if we found a user + if(userDB != null){ + await userDB.deleteEmote(data.name); + } + } + relayUserChat(socket, msg, type, links){ const user = this.server.getSocketInfo(socket); this.relayChat(user.user, user.flair, user.highLevel, msg, type, socket.chan, links) diff --git a/src/schemas/userSchema.js b/src/schemas/userSchema.js index e65a0ab..eb34147 100644 --- a/src/schemas/userSchema.js +++ b/src/schemas/userSchema.js @@ -268,40 +268,6 @@ userSchema.statics.tattooToke = function(tokemap){ }); } -//methods -userSchema.methods.checkPass = function(pass){ - return hashUtil.comparePassword(pass, this.pass); -} - -userSchema.methods.getAuthenticatedSessions = async function(){ - var returnArr = []; - - //retrieve active sessions (they really need to implement this shit async already) - return new Promise((resolve) => { - server.store.all((err, sessions) => { - //You guys ever hear of a 'not my' problem? Fucking y33tskies lmao, better use a try/catch - if(err){ - throw err; - - } - - //crawl through active sessions - sessions.forEach((session) => { - //if a session matches the current user - if(session.user.id == this.id){ - //we return it - returnArr.push(session); - } - }); - - - resolve(returnArr); - - }); - }); - -} - userSchema.statics.getUserList = async function(fullList = false){ var userList = []; //Get all of our users @@ -337,6 +303,39 @@ userSchema.statics.getUserList = async function(fullList = false){ } //methods +userSchema.methods.checkPass = function(pass){ + return hashUtil.comparePassword(pass, this.pass); +} + +userSchema.methods.getAuthenticatedSessions = async function(){ + var returnArr = []; + + //retrieve active sessions (they really need to implement this shit async already) + return new Promise((resolve) => { + server.store.all((err, sessions) => { + //You guys ever hear of a 'not my' problem? Fucking y33tskies lmao, better use a try/catch + if(err){ + throw err; + + } + + //crawl through active sessions + sessions.forEach((session) => { + //if a session matches the current user + if(session.user.id == this.id){ + //we return it + returnArr.push(session); + } + }); + + + resolve(returnArr); + + }); + }); + +} + userSchema.methods.getProfile = function(){ //Create profile hashtable const profile = { @@ -397,6 +396,22 @@ userSchema.methods.getEmotes = function(){ return emoteList; } +userSchema.methods.deleteEmote = async function(name){ + //Get index by emote name + const emoteIndex = this.emotes.findIndex(checkName); + + //Splice out found emote + this.emotes.splice(emoteIndex, 1); + + //Save the user doc + await this.save(); + + function checkName(emote){ + //return emotes + return emote.name == name; + } +} + //note: if you gotta call this from a request authenticated by it's user, make sure to kill that session first! userSchema.methods.killAllSessions = async function(reason = "A full log-out from all devices was requested for your account."){ //get authenticated sessions diff --git a/www/css/panel/emote.css b/www/css/panel/emote.css index 38fba44..dc4c08c 100644 --- a/www/css/panel/emote.css +++ b/www/css/panel/emote.css @@ -19,17 +19,22 @@ justify-items: center; } + div.emote-panel-list-emote{ + position: relative; + margin: 0.5em; +} + +span.emote-panel-list-emote{ width: 9em; display: flex; - position: relative; flex-direction: column; padding: 0.5em 0; - margin: 0.5em; + margin: 0; cursor: pointer; } -div.emote-panel-list-big-emote{ +span.emote-panel-list-big-emote{ width: 100%; margin: 0.5em auto; } @@ -47,7 +52,7 @@ p.emote-list-title{ } .emote-list-big-media{ - max-height: 80VH; + max-height: 30VH; max-width: 100%; margin: 0.5em; } diff --git a/www/css/theme/movie-night.css b/www/css/theme/movie-night.css index 179ef67..b94b057 100644 --- a/www/css/theme/movie-night.css +++ b/www/css/theme/movie-night.css @@ -349,18 +349,18 @@ select.panel-head-element{ background-color: var(--accent0); } -div.emote-panel-list-emote{ +span.emote-panel-list-emote{ border: 1px solid var(--accent0); } -.emote-panel-list-emote:hover{ +span.emote-panel-list-emote:hover, span.emote-list-trash-icon:hover{ color: var(--focus0-alt0); border: 1px solid var(--focus0-alt0); text-shadow: var(--focus-glow0); box-shadow: var(--focus-glow0), var(--focus-glow0-inset); } -.emote-panel-list-emote:active{ +span.emote-panel-list-emote:active, span.emote-list-trash-icon:active{ color: var(--focus0-alt1); text-shadow: var(--focus-glow0-alt0); border: 1px solid var(--focus0-alt1); diff --git a/www/js/channel/panels/emotePanel.js b/www/js/channel/panels/emotePanel.js index 47551df..bd310a7 100644 --- a/www/js/channel/panels/emotePanel.js +++ b/www/js/channel/panels/emotePanel.js @@ -7,7 +7,6 @@ class emotePanel extends panelObj{ closer(){ this.client.socket.off("personalEmotes", this.renderEmoteLists.bind(this)); - console.log('emote closer'); } docSwitch(){ @@ -108,15 +107,26 @@ class emotePanel extends panelObj{ this.client.socket.emit("addPersonalEmote", {name, link}); } - renderEmoteLists(){ - var search = this.searchPrompt.value; + deletePersonalEmote(name){ + //send out delete + this.client.socket.emit('deletePersonalEmote', {name}); + } + renderEmoteLists(){ + //if we've initialized the search prompt (wont happen yet first run) + if(this.searchPrompt != null){ + //Get the search value + var search = this.searchPrompt.value; + } + + //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(search != ''){ + //If we have a search bar and a search in the search bar + if(search != null && search != ''){ + //filter emote lists using the filterQuery function siteEmotes = siteEmotes.filter(filterQuery); chanEmotes = chanEmotes.filter(filterQuery); personalEmotes = personalEmotes.filter(filterQuery); @@ -127,6 +137,7 @@ 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); @@ -148,14 +159,18 @@ class emotePanel extends panelObj{ //For each emote emoteList.forEach((emote) => { - //Create div to hold emote + //Create div to hold emote span const emoteDiv = document.createElement('div'); emoteDiv.classList.add('emote-panel-list-emote'); + const emoteSpan = document.createElement('span'); + emoteSpan.classList.add('emote-panel-list-emote'); + //If we have a low emote count if(emoteList.length <= 2){ //render them huuuuuge emoteDiv.classList.add('emote-panel-list-big-emote'); + emoteSpan.classList.add('emote-panel-list-big-emote'); } //If the emote is an image @@ -201,6 +216,10 @@ class emotePanel extends panelObj{ //Create trash icon const trashIcon = document.createElement('i'); trashIcon.classList.add('emote-list-trash-icon', 'bi-trash-fill'); + trashIcon.id = `emote-list-trash-icon-${emote.name}`; + + //add deletePersonalEmote event listener + trashIcon.addEventListener('click', ()=>{this.deletePersonalEmote(emote.name)}); //Add trash icon to trash span trashSpan.appendChild(trashIcon); @@ -210,12 +229,15 @@ class emotePanel extends panelObj{ } //Add the emote media to the emote span - emoteDiv.appendChild(emoteMedia); + emoteSpan.appendChild(emoteMedia); //Add title paragraph node - emoteDiv.appendChild(emoteTitle); + emoteSpan.appendChild(emoteTitle); //Add useEmote event listener - emoteDiv.addEventListener('click', ()=>{this.useEmote(emote.name)}); + emoteSpan.addEventListener('click', ()=>{this.useEmote(emote.name)}); + + //Add emote span to the emote div + emoteDiv.appendChild(emoteSpan); //Append the mote span to the emote list container.appendChild(emoteDiv);