diff options
| -rw-r--r-- | scripts/badges.js | 24 | ||||
| -rw-r--r-- | scripts/chat.js | 12 | ||||
| -rw-r--r-- | twitch.html | 4 |
3 files changed, 40 insertions, 0 deletions
diff --git a/scripts/badges.js b/scripts/badges.js new file mode 100644 index 0000000..3f8b8da --- /dev/null +++ b/scripts/badges.js @@ -0,0 +1,24 @@ +function getTwitchBadges(name, badges) { + const bb = []; + fetch("https://api.ivr.fi/v2/twitch/badges/global") + .then((r) => r.json()) + .then((b) => { + for (const badge of b) { + for (const version of badge["versions"]) { + badges[`${badge["set_id"]}/${version["id"]}`] = version["image_url_1x"]; + } + } + addSystemMessage("Loaded Twitch global badges."); + }); + + fetch(`https://api.ivr.fi/v2/twitch/badges/channel?login=${name}`) + .then((r) => r.json()) + .then((b) => { + for (const badge of b) { + for (const version of badge["versions"]) { + badges[`${badge["set_id"]}/${version["id"]}`] = version["image_url_1x"]; + } + } + addSystemMessage("Loaded Twitch channel badges."); + }); +}
\ No newline at end of file diff --git a/scripts/chat.js b/scripts/chat.js index 83d7445..2c0eaad 100644 --- a/scripts/chat.js +++ b/scripts/chat.js @@ -50,6 +50,18 @@ function addMessage(message) { const elem = document.createElement("p"); elem.classList.add("message"); + // badges + if ("badges" in message.tags && message.tags["badges"].length > 0) { + for (const b of message.tags["badges"].split(",")) { + if (b in badges) { + const badgeImg = document.createElement("img"); + badgeImg.src = badges[b]; + badgeImg.loading = 'lazy'; + elem.append(badgeImg); + } + } + } + // username const usernameElem = document.createElement("span"); elem.append(usernameElem); diff --git a/twitch.html b/twitch.html index a2cd48d..f5df236 100644 --- a/twitch.html +++ b/twitch.html @@ -11,9 +11,13 @@ </body> <script src="/scripts/chat.js"></script> + <script src="/scripts/badges.js"></script> <script> + const badges = {}; + window.addEventListener("load", () => { connectToChat("wss://irc-ws.chat.twitch.tv", "justinfan12345", "65432", "forsen"); + getTwitchBadges("forsen", badges); }); </script> </html>
\ No newline at end of file |