From 22b150da2f6b21d24f76704d294c6b3c09feb0da Mon Sep 17 00:00:00 2001 From: Rodrigo Emanuel Date: Fri, 25 Jul 2025 20:13:51 -0300 Subject: [PATCH 1/5] Added TikTok Followers Support --- multichat-overlay/script.js | 38 +++++++++++++++++++++++- multichat-overlay/settings/settings.json | 9 ++++++ 2 files changed, 46 insertions(+), 1 deletion(-) diff --git a/multichat-overlay/script.js b/multichat-overlay/script.js index 1b8274a..6c1f89b 100644 --- a/multichat-overlay/script.js +++ b/multichat-overlay/script.js @@ -68,6 +68,7 @@ const showYouTubeSuperStickers = GetBooleanParam("showYouTubeSuperStickers", tru const showYouTubeMemberships = GetBooleanParam("showYouTubeMemberships", true); const enableTikTokSupport = GetBooleanParam("enableTikTokSupport", false); +const showTikTokFollows = GetBooleanParam("showTikTokFollows", false); const showTikTokMessages = GetBooleanParam("showTikTokMessages", false); const showTikTokGifts = GetBooleanParam("showTikTokGifts", false); const showTikTokSubs = GetBooleanParam("showTikTokSubs", false); @@ -433,6 +434,9 @@ function TikfinityConnect() { case 'chat': TikTokChat(data); break; + case 'follow': + TikTokFollow(data); + break; case 'gift': TikTokGift(data); break; @@ -2667,6 +2671,38 @@ function TikTokGift(data) { AddMessageItem(instance, data.messageId); } + +function TikTokFollow(data) { + if (!showTikTokFollows) + return; + + // Get a reference to the template + const template = document.getElementById('cardTemplate'); + + // Create a new instance of the template + const instance = template.content.cloneNode(true); + + // Get divs + const cardDiv = instance.querySelector("#card"); + const headerDiv = instance.querySelector("#header"); + const avatarDiv = instance.querySelector("#avatar"); + const iconDiv = instance.querySelector("#icon"); + const titleDiv = instance.querySelector("#title"); + const contentDiv = instance.querySelector("#content"); + + // Set the card background colors + cardDiv.classList.add('tiktok'); + + const user = data.nickname; + const tiktokIcon = ``; + + titleDiv.innerHTML = `${tiktokIcon} ${user} followed you on TikTok`; + + AddMessageItem(instance, data.msgId); +} + + + function TikTokSubscribe(data) { if (!showTikTokSubs) return; @@ -2689,7 +2725,7 @@ function TikTokSubscribe(data) { cardDiv.classList.add('tiktok'); const user = data.nickname; - const tiktokIcon = ``; + const tiktokIcon = ``; titleDiv.innerHTML = `${tiktokIcon} ${user} subscribed on TikTok`; diff --git a/multichat-overlay/settings/settings.json b/multichat-overlay/settings/settings.json index 8389a86..3103e6b 100644 --- a/multichat-overlay/settings/settings.json +++ b/multichat-overlay/settings/settings.json @@ -393,6 +393,15 @@ "showIf": "enableTikTokSupport", "group": "Which TikTok messages do you want to see?" }, + { + "id": "showTikTokFollows", + "label": "New Followers", + "description": "", + "type": "checkbox", + "defaultValue": true, + "showIf": "enableTikTokSupport", + "group": "Which TikTok messages do you want to see?" + }, { "id": "showTikTokGifts", "label": "Gifts", From 9746c97289c3dc4988ff52f2eba4c05aa113ec1f Mon Sep 17 00:00:00 2001 From: Rodrigo Emanuel Date: Fri, 25 Jul 2025 21:23:46 -0300 Subject: [PATCH 2/5] Update script.js --- multichat-overlay/script.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/multichat-overlay/script.js b/multichat-overlay/script.js index 6c1f89b..4ba96cc 100644 --- a/multichat-overlay/script.js +++ b/multichat-overlay/script.js @@ -68,7 +68,7 @@ const showYouTubeSuperStickers = GetBooleanParam("showYouTubeSuperStickers", tru const showYouTubeMemberships = GetBooleanParam("showYouTubeMemberships", true); const enableTikTokSupport = GetBooleanParam("enableTikTokSupport", false); -const showTikTokFollows = GetBooleanParam("showTikTokFollows", false); +const showTikTokFollows = GetBooleanParam("showTikTokFollows", true); const showTikTokMessages = GetBooleanParam("showTikTokMessages", false); const showTikTokGifts = GetBooleanParam("showTikTokGifts", false); const showTikTokSubs = GetBooleanParam("showTikTokSubs", false); @@ -2694,9 +2694,9 @@ function TikTokFollow(data) { cardDiv.classList.add('tiktok'); const user = data.nickname; - const tiktokIcon = ``; + const tiktokIcon = ``; - titleDiv.innerHTML = `${tiktokIcon} ${user} followed you on TikTok`; + titleDiv.innerHTML = `${user} followed`; AddMessageItem(instance, data.msgId); } @@ -2725,7 +2725,7 @@ function TikTokSubscribe(data) { cardDiv.classList.add('tiktok'); const user = data.nickname; - const tiktokIcon = ``; + const tiktokIcon = ``; titleDiv.innerHTML = `${tiktokIcon} ${user} subscribed on TikTok`; From 087c4915a0514f58fc9cae1b001dd8d6ed11d5a7 Mon Sep 17 00:00:00 2001 From: Rodrigo Emanuel Date: Fri, 25 Jul 2025 21:24:59 -0300 Subject: [PATCH 3/5] Update script.js --- multichat-overlay/script.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/multichat-overlay/script.js b/multichat-overlay/script.js index 4ba96cc..1b2d7a0 100644 --- a/multichat-overlay/script.js +++ b/multichat-overlay/script.js @@ -68,7 +68,7 @@ const showYouTubeSuperStickers = GetBooleanParam("showYouTubeSuperStickers", tru const showYouTubeMemberships = GetBooleanParam("showYouTubeMemberships", true); const enableTikTokSupport = GetBooleanParam("enableTikTokSupport", false); -const showTikTokFollows = GetBooleanParam("showTikTokFollows", true); +const showTikTokFollows = GetBooleanParam("showTikTokFollows", false); const showTikTokMessages = GetBooleanParam("showTikTokMessages", false); const showTikTokGifts = GetBooleanParam("showTikTokGifts", false); const showTikTokSubs = GetBooleanParam("showTikTokSubs", false); From 3f35070a26ce87338ec4ecf357867ebe92158393 Mon Sep 17 00:00:00 2001 From: Rodrigo Emanuel Date: Fri, 25 Jul 2025 22:02:27 -0300 Subject: [PATCH 4/5] . --- multichat-overlay/script.js | 129 +++++++++++++++++------ multichat-overlay/settings/settings.json | 9 ++ 2 files changed, 105 insertions(+), 33 deletions(-) diff --git a/multichat-overlay/script.js b/multichat-overlay/script.js index 1b2d7a0..a709c34 100644 --- a/multichat-overlay/script.js +++ b/multichat-overlay/script.js @@ -69,6 +69,7 @@ const showYouTubeMemberships = GetBooleanParam("showYouTubeMemberships", true); const enableTikTokSupport = GetBooleanParam("enableTikTokSupport", false); const showTikTokFollows = GetBooleanParam("showTikTokFollows", false); +const showTikTokLikes = GetBooleanParam("showTikTokLikes", false); const showTikTokMessages = GetBooleanParam("showTikTokMessages", false); const showTikTokGifts = GetBooleanParam("showTikTokGifts", false); const showTikTokSubs = GetBooleanParam("showTikTokSubs", false); @@ -434,9 +435,15 @@ function TikfinityConnect() { case 'chat': TikTokChat(data); break; + + case 'like': + TikTokLikes(data); + break; + case 'follow': TikTokFollow(data); break; + case 'gift': TikTokGift(data); break; @@ -2636,6 +2643,91 @@ async function TikTokChat(data) { } } + +function TikTokFollow(data) { + if (!showTikTokFollows) + return; + + // Get a reference to the template + const template = document.getElementById('cardTemplate'); + + // Create a new instance of the template + const instance = template.content.cloneNode(true); + + // Get divs + const cardDiv = instance.querySelector("#card"); + const headerDiv = instance.querySelector("#header"); + const avatarDiv = instance.querySelector("#avatar"); + const iconDiv = instance.querySelector("#icon"); + const titleDiv = instance.querySelector("#title"); + const contentDiv = instance.querySelector("#content"); + + // Set the card background colors + cardDiv.classList.add('tiktok'); + + const user = data.nickname; + const tiktokIcon = ``; + + //titleDiv.innerHTML = `${tiktokIcon} ${user} followed`; + titleDiv.innerHTML = `${user} followed`; + + AddMessageItem(instance, data.msgId, 'tiktok', data.userId); +} + + +/* +* +* Note to Nutty: +* TikFinity only exposes the Like Count in batches of 15 at a time. >:( +* So basically this code will get the latest element and adds the like count to it +* and re-render them, preventing the "flood" it would otherwise cause. +* +*/ + +function TikTokLikes(data) { + if (!showTikTokLikes) + return; + + + // Get the total number of likes + var likeCountTotal = parseInt(data.likeCount); + + // Search for Previous Likes from the Same User + const previousLikeContainer = document.querySelector(`li[data-user-id="${data.userId}"]`); + + // If found, fetches the previous likes, deletes the element + // and then creates a new count with a sum of the like count + if (previousLikeContainer) { + const likeCountElem = previousLikeContainer.querySelector('#tiktok-gift-repeat-count'); + if (likeCountElem) { + var likeCountPrev = parseInt(likeCountElem.textContent.replace('x', '')); + likeCountTotal = Math.floor(likeCountPrev + likeCountTotal); + previousLikeContainer.remove(); + } + } + + // Get a reference to the template + const template = document.getElementById('tiktok-gift-template'); + + // Create a new instance of the template + const instance = template.content.cloneNode(true); + + // Get divs + const avatarImg = instance.querySelector('.tiktok-gift-avatar'); + const usernameSpan = instance.querySelector('#tiktok-gift-username'); + const giftNameSpan = instance.querySelector('#tiktok-gift-name'); + const stickerImg = instance.querySelector('.tiktok-gift-sticker'); + const repeatCountDiv = instance.querySelector('#tiktok-gift-repeat-count'); + + avatarImg.src = data.profilePictureUrl; + usernameSpan.innerText = data.nickname; + giftNameSpan.innerText = 'Likes'; + stickerImg.src = ''; + repeatCountDiv.innerText = `x${likeCountTotal}`; + + AddMessageItem(instance, data.msgId, 'tiktok', data.userId); +} + function TikTokGift(data) { if (!showTikTokGifts) return; @@ -2668,37 +2760,7 @@ function TikTokGift(data) { stickerImg.src = data.giftPictureUrl; // Set the sticker image URL repeatCountDiv.innerText = `x${data.repeatCount}`; // Set the number of gifts sent - AddMessageItem(instance, data.messageId); -} - - -function TikTokFollow(data) { - if (!showTikTokFollows) - return; - - // Get a reference to the template - const template = document.getElementById('cardTemplate'); - - // Create a new instance of the template - const instance = template.content.cloneNode(true); - - // Get divs - const cardDiv = instance.querySelector("#card"); - const headerDiv = instance.querySelector("#header"); - const avatarDiv = instance.querySelector("#avatar"); - const iconDiv = instance.querySelector("#icon"); - const titleDiv = instance.querySelector("#title"); - const contentDiv = instance.querySelector("#content"); - - // Set the card background colors - cardDiv.classList.add('tiktok'); - - const user = data.nickname; - const tiktokIcon = ``; - - titleDiv.innerHTML = `${user} followed`; - - AddMessageItem(instance, data.msgId); + AddMessageItem(instance, data.msgId, 'tiktok', data.userId); } @@ -2727,9 +2789,10 @@ function TikTokSubscribe(data) { const user = data.nickname; const tiktokIcon = ``; - titleDiv.innerHTML = `${tiktokIcon} ${user} subscribed on TikTok`; + //titleDiv.innerHTML = `${tiktokIcon} ${user} subscribed on TikTok`; + titleDiv.innerHTML = `${tiktokIcon} ${user} subscribed for ${data.subMonth} months`; - AddMessageItem(instance, data.msgId); + AddMessageItem(instance, data.msgId, 'tiktok', data.userId); } function YouTubeThumbnailPreview(data) { diff --git a/multichat-overlay/settings/settings.json b/multichat-overlay/settings/settings.json index 3103e6b..d1383cc 100644 --- a/multichat-overlay/settings/settings.json +++ b/multichat-overlay/settings/settings.json @@ -402,6 +402,15 @@ "showIf": "enableTikTokSupport", "group": "Which TikTok messages do you want to see?" }, + { + "id": "showTikTokLikes", + "label": "Likes", + "description": "Self-updating Likes", + "type": "checkbox", + "defaultValue": true, + "showIf": "enableTikTokSupport", + "group": "Which TikTok messages do you want to see?" + }, { "id": "showTikTokGifts", "label": "Gifts", From 69e7eb56aacc3427439b4056d7fdbd7b5fce286c Mon Sep 17 00:00:00 2001 From: Rodrigo Emanuel Date: Fri, 25 Jul 2025 22:06:01 -0300 Subject: [PATCH 5/5] Update script.js --- multichat-overlay/script.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/multichat-overlay/script.js b/multichat-overlay/script.js index a709c34..0982ba7 100644 --- a/multichat-overlay/script.js +++ b/multichat-overlay/script.js @@ -2668,8 +2668,7 @@ function TikTokFollow(data) { const user = data.nickname; const tiktokIcon = ``; - //titleDiv.innerHTML = `${tiktokIcon} ${user} followed`; - titleDiv.innerHTML = `${user} followed`; + titleDiv.innerHTML = `${tiktokIcon} ${user} followed`; AddMessageItem(instance, data.msgId, 'tiktok', data.userId); }