forked from lavender/watch-party
Squash: Emojis!
* Emojis! * fix bug * no more discord * maia: proper cache bustinvotekiss
parent
c9330bdb5c
commit
0ce6b32a12
Binary file not shown.
After Width: | Height: | Size: 2.7 KiB |
|
@ -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,
|
||||
|
|
|
@ -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
|
||||
}
|
|
@ -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;
|
||||
|
|
Loading…
Reference in New Issue