imgfloat/server
1
0
Fork 0
mirror of https://github.com/imgfloat/server.git synced 2026-02-05 03:39:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

Include twitch message metadata

Browse Source
This commit is contained in:
Andreas Krühlmann
2026-01-13 22:00:24 +01:00
parent 467977ddac
commit c9aac6e4f1
3 changed files with 87 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
doc/marketplace-scripts/chat-overlay/source.js
View File

@@ -29,9 +29,62 @@ function formatLines(messages, ctx, width) {
const maxWidth = Math.max(width - PADDING * 2, 0);
const lines = [];
messages.forEach((message) => {
const prefix = message.displayName ? `${message.displayName}: ` : "";
const raw = `${prefix}${message.message || ""}`;
wrapLine(ctx, raw, maxWidth).forEach((line) => lines.push(line));
const prefixText = message.displayName ? `${message.displayName}: ` : "";
const bodyText = message.message || "";
const nameColor = message.tags?.color || "#ffffff";
if (!prefixText) {
wrapLine(ctx, bodyText, maxWidth).forEach((line) =>
lines.push({
prefixText: "",
prefixWidth: 0,
nameColor,
text: line,
}),
);
return;
}
const prefixWidth = ctx.measureText(prefixText).width;
const words = bodyText.split(" ");
let current = "";
let isFirstLine = true;
let availableWidth = Math.max(maxWidth - prefixWidth, 0);
const flushLine = () => {
lines.push({
prefixText: isFirstLine ? prefixText : "",
prefixWidth: isFirstLine ? prefixWidth : 0,
nameColor,
text: current,
});
current = "";
isFirstLine = false;
availableWidth = maxWidth;
};
if (!words.length || !bodyText.trim()) {
lines.push({
prefixText,
prefixWidth,
nameColor,
text: "",
});
return;
}
words.forEach((word) => {
const test = current ? `${current} ${word}` : word;
if (ctx.measureText(test).width > availableWidth && current) {
flushLine();
current = word;
} else {
current = test;
}
});
if (current) {
flushLine();
}
});
return lines.slice(-MAX_LINES);
}
@@ -53,15 +106,21 @@ function tick(context) {
const lines = formatLines(messages, ctx, width);
const boxHeight = lines.length * LINE_HEIGHT + PADDING * 2;
const boxWidth = Math.max(
...lines.map((line) => ctx.measureText(line).width),
...lines.map((line) => line.prefixWidth + ctx.measureText(line.text).width),
120,
);
ctx.fillStyle = "rgba(0, 0, 0, 0.55)";
ctx.fillRect(PADDING, height - boxHeight - PADDING, boxWidth + PADDING * 2, boxHeight);
ctx.fillStyle = "#ffffff";
lines.forEach((line, index) => {
ctx.fillText(line, PADDING * 2, height - boxHeight - PADDING + PADDING + index * LINE_HEIGHT);
const x = PADDING * 2;
const y = height - boxHeight - PADDING + PADDING + index * LINE_HEIGHT;
if (line.prefixText) {
ctx.fillStyle = line.nameColor || "#ffffff";
ctx.fillText(line.prefixText, x, y);
}
ctx.fillStyle = "#ffffff";
ctx.fillText(line.text, x + line.prefixWidth, y);
});
}