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

Updated client-side DOM manipulation functions to unescape char-codes before injecting them via innerText instead of raw-dogging it into innerHTML

Browse source
This commit is contained in:
rainbow napkin 2025-04-12 07:21:36 -04:00
parent e46513cc1a
commit 4ed4b572f2
10 changed files with 25 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
www/js/adminPanel.js
View file

@ -216,7 +216,7 @@ class adminUserBanList{
userNode.title = "Nuked"
}else{
var userNode = document.createElement('p');
userNode.innerHTML = user.user;
userNode.textContent = utils.unescapeEntities(user.user);
}
return userNode;
}
@ -251,7 +251,7 @@ class adminUserBanList{
//Create a node
const userNode = document.createElement('p');
//Fill it wit the ip
userNode.innerHTML = user;
userNode.textContent = utils.unescapeEntities(user);
//Append it
deadUsers.appendChild(userNode);
}
@ -269,7 +269,7 @@ class adminUserBanList{
//Create a node
const ipNode = document.createElement('p');
//Fill it wit the ip
ipNode.innerHTML = ip;
ipNode.textContent = utils.unescapeEntities(ip);
//Append it
ipList.appendChild(ipNode);
}
@ -279,7 +279,7 @@ class adminUserBanList{
//Create a node
const ipNode = document.createElement('p');
//List it as a hashed ip with the hash as alt text
ipNode.innerHTML = '[Hashed IP]';
ipNode.textContent = utils.unescapeEntities('[Hashed IP]');
ipNode.title = hash;
//Append the node
ipList.appendChild(ipNode);
@ -372,7 +372,7 @@ class adminTokeCommandList{
//Create toke command label
const tokeLabel = document.createElement('p');
tokeLabel.innerHTML = `!${toke}`;
tokeLabel.textContent = utils.unescapeEntities(`!${toke}`);
tokeLabel.classList.add('toke-command-list');
//Create toke command delete icon
@ -481,7 +481,7 @@ class adminEmoteList{
//Set title class
emoteTitle.classList.add('emote-list-title');
//Set emote title
emoteTitle.innerHTML = `[${emote.name}]`;
emoteTitle.textContent = utils.unescapeEntities(`[${emote.name}]`);
//Create delete icon
const deleteIcon = document.createElement('i');

8
www/js/channel/chat.js
View file

@ -109,7 +109,7 @@ class chatBox{
//Create high-level label
var highLevel = document.createElement('p');
highLevel.classList.add("chat-panel-buffer","chat-entry-high-level","high-level");
highLevel.innerHTML = `${data.highLevel}`;
highLevel.textContent = utils.unescapeEntities(`${data.highLevel}`);
chatEntry.appendChild(highLevel);
//Create username label
@ -125,8 +125,8 @@ class chatBox{
//Create color span
var colorSpan = document.createElement('span');
colorSpan.classList.add("chat-entry-flair-span", flair);
colorSpan.innerHTML = `${data.user}`;
userLabel.innerHTML = `${colorSpan.outerHTML}: `;
colorSpan.textContent = utils.unescapeEntities(`${data.user}`);
userLabel.textContent = utils.unescapeEntities(`${colorSpan.outerHTML}: `);
chatEntry.appendChild(userLabel);
@ -277,7 +277,7 @@ class chatBox{
var flairOption = document.createElement('option');
//Set the name and innerHTML
flairOption.value = flair.name;
flairOption.innerHTML = flair.displayName;
flairOption.textContent = utils.unescapeEntities(flair.displayName);
//Append it to the select
this.flairSelect.appendChild(flairOption);

4
www/js/channel/chatPostprocessor.js
View file

@ -73,9 +73,7 @@ class chatPostprocessor{
//Create an empty array to hold the body
this.messageArray = [];
//First unescape char codes to keep from splitting on them
//This also means all text should be added to element via textContent and *NOT* innerHTML
//I'd rather not do this, but pre-processing everything while preserving codes is a fucking nightmare
//Escape any sanatized char codes as we use .textContent for double-safety, and to prevent splitting of char codes
//Split string by word-boundries on words and non-word boundries around whitespace, with negative lookaheads to exclude file seperators so we don't split link placeholders
//Also split by any invisble whitespace as a crutch to handle mushed links/emotes
//If we can one day figure out how to split non-repeating special chars instead of special chars with whitespace, that would be perf, unfortunately my brain hasn't rotted enough to understand regex like that just yet.

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

@ -220,7 +220,7 @@ class emotePanel extends panelObj{
//Set title class
emoteTitle.classList.add('emote-list-title');
//Set emote title
emoteTitle.innerHTML = `[${emote.name}]`;
emoteTitle.textContent = utils.unescapeEntities(`[${emote.name}]`);
//if we're rendering personal emotes
if(personal){

1
www/js/channel/panels/queuePanel/queuePanel.js
View file

@ -833,6 +833,7 @@ class queuePanel extends panelObj{
timetip.moveToMouse(event);
//Inject timetip label
//Normally wouldn't do innerHTML but these values are calculated serverside and it saves us making a <br> element
timetip.tooltip.innerHTML = [
`Start Time: ${utils.ux.timeStringFromDate(start, true)}`,
`End Time: ${utils.ux.timeStringFromDate(new Date(start.getTime() + (target.dataset['duration'] * 1000)), true)}`

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

@ -100,7 +100,7 @@ class userList{
//Create high-level label
var highLevel = document.createElement('p');
highLevel.classList.add("user-list-high-level","high-level");
highLevel.innerHTML = `${user.highLevel}`;
highLevel.textContent = `${user.highLevel}`;
//Create nameplate
var userEntry = document.createElement('p');

8
www/js/channelSettings.js
View file

@ -114,7 +114,7 @@ class rankList{
//Create an option for the given rank
const rankOption = document.createElement('option');
rankOption.value = rank;
rankOption.innerHTML = rank;
rankOption.textContent = utils.unescapeEntities(rank);
rankOption.selected = user.rank == rank;
rankContent.appendChild(rankOption);
});
@ -343,7 +343,7 @@ class tokeCommandList{
//Create toke command label
const tokeLabel = document.createElement('p');
tokeLabel.innerHTML = `!${toke}`;
tokeLabel.textContent = utils.unescapeEntities(`!${toke}`);
tokeLabel.classList.add('toke-command-list');
//Create toke command delete icon
@ -453,7 +453,7 @@ class emoteList{
//Set title class
emoteTitle.classList.add('emote-list-title');
//Set emote title
emoteTitle.innerHTML = `[${emote.name}]`;
emoteTitle.textContent = utils.unescapeEntities(`[${emote.name}]`);
//Create delete icon
const deleteIcon = document.createElement('i');
@ -504,7 +504,7 @@ class deleteAccountPopup{
this.label = document.querySelector("#delete-channel-popup-content");
//Fill channel label
this.label.innerHTML = this.label.innerHTML.replaceAll("[CHANNEL]", this.channel);
this.label.textContent = this.label.textContent.replaceAll("[CHANNEL]", utils.unescapeEntities(this.channel));
this.setupInput();
}

8
www/js/popup/banPopup.js
View file

@ -8,7 +8,7 @@ class banUserPopup{
asyncConstruction(){
this.title = document.querySelector(".popup-title");
//Setup title text real quick-like :P
this.title.innerHTML = `Ban ${this.target}`;
this.title.textContent = utils.unescapeEntities(`Ban ${this.target}`);
this.ipBan = document.querySelector("#ban-popup-ip");
this.permBan = document.querySelector("#ban-popup-perm");
@ -28,10 +28,10 @@ class banUserPopup{
permaBanLabel(event){
if(event.target.checked){
this.expirationPrefix.innerHTML = "Account Deletion In: "
this.expirationPrefix.textContent = "Account Deletion In: "
this.expiration.value = 30;
}else{
this.expirationPrefix.innerHTML = "Ban Expires In: "
this.expirationPrefix.textContent = "Ban Expires In: "
this.expiration.value = 14;
}
}
@ -63,7 +63,7 @@ class chanBanUserPopup{
asyncConstruction(){
this.title = document.querySelector(".popup-title");
//Setup title text real quick-like :P
this.title.innerHTML = `Ban ${this.target}`;
this.title.textContent = utils.unescapeEntities(`Ban ${this.target}`);
this.permBan = document.querySelector("#ban-popup-perm");
this.expiration = document.querySelector("#ban-popup-expiration");

2
www/js/profile.js
View file

@ -102,7 +102,7 @@ class profileUpdateTextPrompt extends profileUpdatePrompt{
const update = await utils.ajax.updateProfile(updateObj);
//Fill content from update, make sure to add line breaks for the bio
this.contentNode.innerHTML = update[this.field].replaceAll('\n','<br>');
this.contentNode.textContent = utils.unescapeEntities(update[this.field].replaceAll('\n','<br>'));
}
}
}

4
www/js/utils.js
View file

@ -330,7 +330,7 @@ class canopyUXUtils{
//Create menu title
const menuTitle = document.createElement('h2');
menuTitle.innerHTML = this.title;
menuTitle.textContent = utils.unescapeEntities(this.title);
//Append the title to the tooltip
this.tooltip.append(menuTitle);
@ -338,7 +338,7 @@ class canopyUXUtils{
for(let choice of this.menuMap){
//Create button
const button = document.createElement('button');
button.innerHTML = choice[0];
button.textContent = utils.unescapeEntities(choice[0]);
//Add event listeners
button.addEventListener('click', choice[1]);