Smartcraft-Media-Tech/nutty-tools
1
0
Fork 0
mirror of https://github.com/nuttylmao/nutty.gg.git synced 2026-09-18 19:50:58 -04:00
Code Issues Packages Projects Releases Wiki Activity

Added support for Kick kicks

Browse Source
This commit is contained in:
nuttylmao
2025-09-18 05:28:18 +10:00
parent 263a7cb07b
commit 798385ec33
12 changed files with 240 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files
multichat-overlay/icons/badges/kick-kicks.svg
+1
View File
File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 5.3 KiB

multichat-overlay/index.html
+22 -1
View File
@@ -66,7 +66,7 @@
</template>
<template id="tiktok-gift-template">
<div class="tiktok-gift">
<div class="tiktok-gift tiktok">
<img class="tiktok-gift-avatar"
src="https://static-cdn.jtvnw.net/jtv_user_pictures/f632e0c6-38e2-4065-a29e-6ba9b3e8cacf-profile_image-300x300.png" />
<div class="tiktok-gift-message">
@@ -84,6 +84,27 @@
</div>
</div>
</template>
<template id="kick-gift-template">
<div class="kick-gift kick">
<img class="kick-gift-avatar"
src="" />
<div class="kick-gift-contents">
<span id="kick-gift-username" style="font-weight: 700;">
</span>
<br>
<div style="display: flex; flex-direction: row; align-items: center;">
<span>sent <span id="kick-gift-name"></span></span>
<img src="icons/badges/kick-kicks.svg" style="height: 1em; padding-left: 0.5em; padding-right: 0.25em;">
<span id="kick-gift-amount">13</span>
</div>
<div id="kick-gift-message">
</div>
</div>
<img class="kick-gift-sticker"
src="" />
</div>
</template>
</body>
<script src="./script.js"></script>
multichat-overlay/script.js
+59 -18
View File
@@ -61,6 +61,7 @@ const showKickMessages = GetBooleanParam("showKickMessages", true);
const showKickSubs = GetBooleanParam("showKickSubs", true);
const showKickChannelPointRedemptions = GetBooleanParam("showKickChannelPointRedemptions", true);
const showKickHosts = GetBooleanParam("showKickHosts", true);
const showKickGifts = GetBooleanParam("showKickGifts", true);
const showYouTubeMessages = GetBooleanParam("showYouTubeMessages", true);
const showYouTubeSuperChats = GetBooleanParam("showYouTubeSuperChats", true);
@@ -322,6 +323,11 @@ client.on('Fourthwall.GiftDrawEnded', (response) => {
FourthwallGiftDrawEnded(response.data);
})
client.on('Fourthwall.GiftDrawEnded', (response) => {
console.debug(response.data);
FourthwallGiftDrawEnded(response.data);
})
///////////////////////////
@@ -334,7 +340,9 @@ async function KickConnect() {
return;
// Channel to subscribe to (you'll need the correct channel name here)
const chatroomId = await GetKickChatroomId(kickUsername);
const kickIds = await GetKickIds(kickUsername);
const chatroomId = kickIds.chatroomId;
const channelId = kickIds.channelId;
// Cache subscriber badges
kickSubBadges = await GetKickSubBadges(kickUsername);
@@ -367,6 +375,7 @@ async function KickConnect() {
websocket.send(JSON.stringify({ event: 'pusher:subscribe', data: { channel: `chatrooms.${chatroomId}` } }));
websocket.send(JSON.stringify({ event: 'pusher:subscribe', data: { channel: `chatrooms.${chatroomId}.v2` } }));
websocket.send(JSON.stringify({ event: 'pusher:subscribe', data: { channel: `predictions-channel-${chatroomId}` } }));
websocket.send(JSON.stringify({ event: 'pusher:subscribe', data: { channel: `channel_${channelId}` } }));
console.log(`[Pusher] Sent subscription request to channel: ${chatroomId}`);
}
@@ -398,6 +407,9 @@ async function KickConnect() {
case 'UserBannedEvent':
KickUserBanned(eventArgs);
break;
case 'KicksGifted':
KickKicksGifted(eventArgs);
break;
}
}
catch (error) {
@@ -2518,6 +2530,35 @@ function KickMessageDeleted(data) {
}, 500);
}
async function KickKicksGifted(data) {
if (!showKickGifts)
return;
// Get a reference to the template
const template = document.getElementById('kick-gift-template');
// Create a new instance of the template
const instance = template.content.cloneNode(true);
// Get divs
const avatarImg = instance.querySelector('.kick-gift-avatar');
const usernameSpan = instance.querySelector('#kick-gift-username');
const giftNameSpan = instance.querySelector('#kick-gift-name');
const stickerImg = instance.querySelector('.kick-gift-sticker');
const amountDiv = instance.querySelector('#kick-gift-amount');
const messageDiv = instance.querySelector('#kick-gift-message');
avatarImg.src = await GetAvatar(data.sender.username.replace('_', '-'), 'kick'); // Set the card header
usernameSpan.innerText = data.sender.username; // Set the username
usernameSpan.style.color = data.sender.username_color;
giftNameSpan.innerText = data.gift.name; // Set the gift name
stickerImg.src = `https://files.kick.com/kicks/gifts/${data.gift.gift_id.replace('_', '-')}.webp`; // Set the sticker image URL
amountDiv.innerText = data.gift.amount; // Set the number of gifts sent
messageDiv.innerText = data.message // Set the message
AddMessageItem(instance, null, 'kick', data.senderId);
}
function KickUserBanned(data) {
const messageList = document.getElementById("messageList");
@@ -3188,25 +3229,25 @@ function EscapeRegExp(string) {
return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); // $& means the whole matched string
}
async function GetKickChatroomId(username) {
const url = `https://kick.com/api/v2/channels/${username}`;
async function GetKickIds(username) {
const url = `https://kick.com/api/v2/channels/${username}`;
try {
const response = await fetch(url);
if (!response.ok) {
throw new Error(`HTTP error ${response.status}`);
}
try {
const response = await fetch(url);
if (!response.ok) {
throw new Error(`HTTP error ${response.status}`);
}
const data = await response.json();
if (data.chatroom && data.chatroom.id) {
return data.chatroom.id;
} else {
throw new Error("Chatroom ID not found in response.");
}
} catch (error) {
console.error("Failed to fetch chatroom ID:", error.message);
return null;
}
const data = await response.json();
if (data.chatroom && data.chatroom.id) {
return { chatroomId: data.chatroom.id, channelId: data.chatroom.channel_id };
} else {
throw new Error("Chatroom ID not found in response.");
}
} catch (error) {
console.error("Failed to fetch chatroom ID:", error.message);
return null;
}
}
async function GetKickSubBadges(username) {
multichat-overlay/settings/settings.json
+8
View File
@@ -376,6 +376,14 @@
"defaultValue": true,
"group": "Which Kick messages do you want to see?"
},
{
"id": "showKickGifts",
"label": "Gifts",
"description": "",
"type": "checkbox",
"defaultValue": true,
"group": "Which Kick messages do you want to see?"
},
{
"id": "enableTikTokSupport",
"label": "Enable TikTok Support",
multichat-overlay/style.css
+29 -8
View File
@@ -224,17 +224,18 @@ li {
transform: translate(0px, 0.25em);
}
.kick-gift,
.tiktok-gift {
display: flex;
flex-direction: row;
align-items: center;
gap: 1em;
padding: 0.5em 1em;
padding: 0.5em;
border-radius: var(--border-radius);
max-width: 100%;
background: linear-gradient(#262626BF, #000000BF) !important;
}
.kick-gift-avatar,
.tiktok-gift-avatar {
height: 3em;
margin: 1px;
@@ -243,17 +244,37 @@ li {
flex-shrink: 0;
}
.kick-gift-contents,
.tiktok-gift-message {
flex-grow: 1;
white-space: nowrap; /* keeps text in a single line */
overflow: hidden; /* hides overflowed content */
text-overflow: ellipsis; /* adds the "..." at the end */
/* white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis; */
gap: 1em;
}
.kick-gift-contents {
/* text-align: center; */
}
#kick-gift-message {
font-size: 0.9em;
}
.kick-gift-sticker,
.tiktok-gift-sticker {
flex-shrink: 0;
justify-content: flex-end;
filter: drop-shadow(5px 5px 5px #00000060);
}
.tiktok-gift-sticker {
height: 2.5em;
flex-shrink: 0;
justify-content: flex-end;
}
.kick-gift-sticker {
height: 5em;
}
#tiktok-gift-repeat-count {
@@ -292,7 +313,7 @@ li {
}
.kick {
background: linear-gradient(#53fc18, #005600) !important;
background: linear-gradient(#32b602, #005600) !important;
}
.streamlabs {