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

Layout updates

Browse Source
This commit is contained in:
nuttylmao
2025-07-06 06:31:04 +10:00
parent 4600c9e73e
commit 857e6481ae
4 changed files with 68 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files
multichat-overlay/index.html
+30 -26
View File
@@ -21,29 +21,31 @@
<template id="messageTemplate">
<div id="messageContainer">
<label>
<div id="firstMessage">
<span>✨ First Time Chat</span>
<span> from viewer</span>
<div class="message-contents">
<div id="avatar"></div>
<div>
<div id="firstMessage">
<span>✨ First Time Chat</span>
<span> from viewer</span>
</div>
<div id="sharedChat">
<span id="sharedChatChannel"></span>
</div>
<label id="userInfo">
<span id="timestamp"></span>
<span id="platform"></span>
<span id="badgeList"></span>
<span id="pronouns"></span>
<span id="username"></span>
<span id="colon-separator" style="display: none;">: </span>
<br id="line-space">
</label>
<div id="reply">
<span>➥ Replying to <span id="replyUser"></span>: <span id="replyMsg"></span></span>
</div>
<span id="message"></span>
</div>
<div id="sharedChat">
<span id="sharedChatChannel"></span>
</div>
<label id="userInfo">
<span id="avatar"></span>
<span id="timestamp"></span>
<span id="platform"></span>
<span id="badgeList"></span>
<span id="pronouns"></span>
<span id="username"></span>
<span id="colon-separator" style="display: none;">: </span>
<br id="line-space">
</label>
<div id="reply">
<span>➥ Replying to <span id="replyUser"></span>: <span id="replyMsg"></span></span>
</div>
<span id="message"></span>
</label>
</div>
</div>
</template>
@@ -72,16 +74,18 @@
<template id="tiktok-gift-template">
<div class="tiktok-gift">
<img class="tiktok-gift-avatar" src="https://static-cdn.jtvnw.net/jtv_user_pictures/f632e0c6-38e2-4065-a29e-6ba9b3e8cacf-profile_image-300x300.png"/>
<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">
<span id="tiktok-gift-username" style="font-size: 0.9em;">
<span id="tiktok-gift-username" style="font-size: 0.9em; font-weight: 700;">
</span>
<br/>
<br />
<span style="font-size: 0.7em;">
sent <span id="tiktok-gift-name"></span>
</span>
</div>
<img class="tiktok-gift-sticker" src="https://p19-webcast.tiktokcdn.com/img/maliva/webcast-va/3851a489dea62b3a9fe99f61de5470ae~tplv-obj.png"/>
<img class="tiktok-gift-sticker"
src="https://p19-webcast.tiktokcdn.com/img/maliva/webcast-va/3851a489dea62b3a9fe99f61de5470ae~tplv-obj.png" />
<div id="tiktok-gift-repeat-count">
x13
</div>
multichat-overlay/script.js
+18 -6
View File
@@ -348,13 +348,13 @@ function tikfinityConnect() {
tikfinityWebsocket.onclose = function () {
console.error(`TikFinity disconnected...`)
tikfinityWebsocket = null;
setTimeout(connect, 1000); // Schedule a reconnect attempt
setTimeout(tikfinityConnect, 1000); // Schedule a reconnect attempt
}
tikfinityWebsocket.onerror = function () {
console.error(`TikFinity failed for some reason...`)
tikfinityWebsocket = null;
setTimeout(connect, 1000); // Schedule a reconnect attempt
setTimeout(tikfinityConnect, 1000); // Schedule a reconnect attempt
}
tikfinityWebsocket.onmessage = function (response) {
@@ -431,7 +431,6 @@ async function TwitchChatMessage(data) {
}
// Set Shared Chat
console.log(showTwitchSharedChat);
const isSharedChat = data.isSharedChat;
if (isSharedChat) {
if (showTwitchSharedChat > 1) {
@@ -501,6 +500,7 @@ async function TwitchChatMessage(data) {
if (inlineChat) {
instance.querySelector("#colon-separator").style.display = `inline`;
instance.querySelector("#line-space").style.display = `none`;
instance.querySelector(".message-contents").style.alignItems = 'center';
}
// Render platform
@@ -559,6 +559,10 @@ async function TwitchChatMessage(data) {
avatar.classList.add("avatar");
avatarDiv.appendChild(avatar);
}
else
{
avatarDiv.style.display = 'none';
}
// Hide the header if the same username sends a message twice in a row
// EXCEPT when the scroll direction is set to reverse (scrollDirection == 2)
@@ -566,8 +570,10 @@ async function TwitchChatMessage(data) {
if (groupConsecutiveMessages && messageList.children.length > 0 && scrollDirection != 2) {
const lastPlatform = messageList.lastChild.dataset.platform;
const lastUserId = messageList.lastChild.dataset.userId;
if (lastPlatform == "twitch" && lastUserId == data.user.id)
if (lastPlatform == "twitch" && lastUserId == data.user.id){
userInfoDiv.style.display = "none";
avatarDiv.innerHTML = '';
}
}
// Embed image
@@ -624,8 +630,8 @@ async function TwitchAutomaticRewardRedemption(data) {
const gigaEmote = data.gigantified_emote.imageUrl;
const image = new Image();
image.src = gigaEmote;
image.style.padding = "20px 0px";
image.style.width = "50%";
image.style.padding = "0px 0px";
image.style.width = "10em";
image.onload = function () {
messageDiv.innerHTML = '';
@@ -696,6 +702,9 @@ async function TwitchAnnouncement(data) {
content.querySelector("#colon-separator").style.display = `inline`;
content.querySelector("#line-space").style.display = `none`;
// Remove the avatar
content.querySelector("#avatar").style.display = `none`;
// Render platform
content.querySelector("#platform").style.display = `none`;
@@ -1112,6 +1121,7 @@ function YouTubeMessage(data) {
if (inlineChat) {
instance.querySelector("#colon-separator").style.display = `inline`;
instance.querySelector("#line-space").style.display = `none`;
instance.querySelector(".message-contents").style.alignItems = 'center';
}
// Render platform
@@ -2007,6 +2017,7 @@ async function KickChatMessage(data) {
if (inlineChat) {
instance.querySelector("#colon-separator").style.display = `inline`;
instance.querySelector("#line-space").style.display = `none`;
instance.querySelector(".message-contents").style.alignItems = 'center';
}
// Render platform
@@ -2451,6 +2462,7 @@ function TikTokChat(data) {
if (inlineChat) {
instance.querySelector("#colon-separator").style.display = `inline`;
instance.querySelector("#line-space").style.display = `none`;
instance.querySelector(".message-contents").style.alignItems = 'center';
}
// Render platform
multichat-overlay/settings/settings.json
+3 -3
View File
@@ -5,7 +5,7 @@
"label": "Show Platform",
"description": "",
"type": "checkbox",
"defaultValue": true,
"defaultValue": false,
"group": "Appearance"
},
{
@@ -71,7 +71,7 @@
"type": "number",
"min": 1,
"max": 120,
"defaultValue": 30,
"defaultValue": 20,
"group": "Appearance"
},
{
@@ -97,7 +97,7 @@
"label": "Background Opacity",
"description": "",
"type": "number",
"defaultValue": "0.85",
"defaultValue": "0.90",
"min": 0,
"max": 1,
"step": ".01",
multichat-overlay/style.css
+17 -7
View File
@@ -1,8 +1,8 @@
* {
margin: 0;
padding: 0;
--margin: 40px;
--border-radius: 20px;
--margin: 20px;
--border-radius: 0.5em;
/* --line-spacing: 1.7em; */
}
@@ -95,15 +95,25 @@ li {
.highlightMessage {
background: #adadad46;
padding: 20px 40px;
padding: 0.5em 1em;
border-radius: var(--border-radius);
}
.message-contents {
display: flex;
flex-direction: row;
gap: 1em;
}
#avatar {
width: 2em;
}
.avatar {
height: 2em;
margin: 1px;
transform: translate(0px, 0.25em);
border-radius: 50%
border-radius: 50%;
}
.timestamp,
@@ -177,7 +187,7 @@ li {
#card {
background: #adadad46;
padding: 20px 40px;
padding: 0.5em 1em;
border-radius: var(--border-radius);
}
@@ -198,8 +208,8 @@ li {
display: flex;
flex-direction: row;
align-items: center;
gap: 20px;
padding: 20px 40px;
gap: 1em;
padding: 0.5em 1em;
border-radius: var(--border-radius);
max-width: 100%;
background: linear-gradient(#262626BF, #000000BF) !important;