Squash: Emojis!

* Emojis!
* fix bug
* no more discord
* maia: proper cache bustin
main
easrng 2022-02-14 12:31:30 -05:00 committed by maia arson crimew
parent c9330bdb5c
commit 0ce6b32a12
4 changed files with 21 additions and 2 deletions

BIN
frontend/emojis/blobcat.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

View File

@ -1,4 +1,5 @@
import { setDebounce, setVideoTime, setPlaying } from "./watch-session.mjs";
import { setDebounce, setVideoTime, setPlaying } from "./watch-session.mjs?v=9";
import { emojify } from "./emojis.mjs?v=9";
const setupChatboxEvents = (socket) => {
// clear events by just reconstructing the form
@ -236,7 +237,7 @@ export const logEventToChat = (event) => {
case "ChatMessage": {
const messageContent = document.createElement("span");
messageContent.classList.add("message-content");
messageContent.textContent = event.data;
messageContent.append(...emojify(event.data));
printChatMessage(
"chat-message",
event.user,

11
frontend/lib/emojis.mjs Normal file
View File

@ -0,0 +1,11 @@
export function emojify(text) {
let last = 0;
let nodes = [];
text.replace(/:([^\s:]+):/g, (match, name, index) => {
if(last <= index) nodes.push(document.createTextNode(text.slice(last, index)))
nodes.push(Object.assign(new Image(), {src: `/emojis/${name}.png`, className: "emoji", alt: name}))
last = index + match.length
})
if(last < text.length) nodes.push(document.createTextNode(text.slice(last)))
return nodes
}

View File

@ -159,6 +159,13 @@ button.small-button {
color: unset !important;
}
.emoji {
width: 2ch;
height: 2ch;
object-fit: contain;
margin-bottom: -0.35ch;
}
#chatbox {
padding: 0.5em 2em;
min-height: 8em;