Smartcraft-Media-Tech/chatrd
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add files via upload

Browse Source
This commit is contained in:
Rodrigo Emanuel
2025-05-25 22:58:20 -03:00
committed by GitHub
parent 4d97f6f9a4
commit f06d42632d
4 changed files with 24 additions and 122 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
chat.html
View File

@@ -58,41 +58,8 @@
<form>
<input type="text">
</form>
<button id="chat-input-config"><i class="fa-solid fa-gear"></i></button>
<button id="chat-input-send"><i class="fa-solid fa-paper-plane"></i></button>
<div id="chat-input-settings" class="settings animate__faster" style="display: none;">
<span class="chat-enabler" id="twitch">
<img src="images/logo-twitch.svg">
<label class="switch">
<input type="checkbox" data-platform="twitch" name="twitchChatSend" checked>
<span class="slider"></span>
</label>
</span>
<span class="chat-enabler" id="youtube">
<img src="images/logo-youtube.svg">
<label class="switch">
<input type="checkbox" data-platform="youtube" name="youtubeChatSend" checked>
<span class="slider"></span>
</label>
</span>
<span class="chat-enabler" id="kick" title="Only Chat, No commands.">
<img src="images/logo-kick.svg">
<label class="switch">
<input type="checkbox" data-platform="kick" name="kickChatSend" checked>
<span class="slider"></span>
</label>
<i class="fa-solid fa-triangle-exclamation"></i>
</span>
<span class="chat-enabler" id="tiktok">
<img src="images/logo-tiktok.svg">
<i class="fa-solid fa-ban"></i>
</span>
</div>
</div>
</div>
</div>

7
css/app.css
View File

@@ -575,13 +575,8 @@ body {
color: #ffcc00;
}
#chat-input #chat-input-config {
right: 20px;
}
#chat-input #chat-input-send {
right: 60px;
right: 20px;
}
#chat-input .settings {

8
index.html
View File

@@ -121,7 +121,7 @@
<div class="tab-content" id="twitch">
<h2><i class="fa-brands fa-twitch"></i> Twitch</h2>
<div class="setting"><label>Chat</label><label class="switch"><input type="checkbox" name="showTwitchMessages" checked><span class="slider"></span></label></div>
<div class="setting"><label>Chat<br><small>Reads Twitch chat. If <strong>Chat Field is on</strong>, allows to send messages.</small></label><label class="switch"><input type="checkbox" name="showTwitchMessages" checked><span class="slider"></span></label></div>
<div class="setting"><label>Followers</label><label class="switch"><input type="checkbox" name="showTwitchFollows" checked><span class="slider"></span></label></div>
<div class="setting"><label>Bits</label><label class="switch"><input type="checkbox" name="showTwitchBits" checked><span class="slider"></span></label></div>
<div class="setting"><label>Announcements</label><label class="switch"><input type="checkbox" name="showTwitchAnnouncements" checked><span class="slider"></span></label></div>
@@ -137,7 +137,7 @@
<div class="tab-content" id="youtube">
<h2><i class="fa-brands fa-youtube"></i> YouTube</h2>
<div class="setting"><label>Chat</label><label class="switch"><input type="checkbox" name="showYouTubeMessages" checked><span class="slider"></span></label></div>
<div class="setting"><label>Chat<br><small>Reads YouTube chat. If <strong>Chat Field is on</strong>, allows to send messages.</small></label><label class="switch"><input type="checkbox" name="showYouTubeMessages" checked><span class="slider"></span></label></div>
<div class="setting"><label>SuperChat</label><label class="switch"><input type="checkbox" name="showYouTubeSuperChats" checked><span class="slider"></span></label></div>
<div class="setting"><label>Super Sticker</label><label class="switch"><input type="checkbox" name="showYouTubeSuperStickers" checked><span class="slider"></span></label></div>
@@ -178,7 +178,7 @@
<div class="tab-content" id="tiktok">
<h2><i class="fa-brands fa-tiktok"></i> TikTok</h2>
<div class="setting"><label>Chat</label><label class="switch"><input type="checkbox" name="showTikTokMessages" checked><span class="slider"></span></label></div>
<div class="setting"><label>Chat<br><small>Reads TikTok chat. Currently doesn't work with <strong>Chat Field</strong>.</small></label><label class="switch"><input type="checkbox" name="showTikTokMessages" checked><span class="slider"></span></label></div>
<div class="setting"><label>Followers</label><label class="switch"><input type="checkbox" name="showTikTokFollows" checked><span class="slider"></span></label></div>
<div class="setting"><label>Likes<br><small>Show likes in <strong>15</strong> increments. Why? <em>Blame TikFinity!</em> 🤣</small></label><label class="switch"><input type="checkbox" name="showTikTokLikes" checked><span class="slider"></span></label></div>
<div class="setting"><label>Gifts</label><label class="switch"><input type="checkbox" name="showTikTokGifts" checked><span class="slider"></span></label></div>
@@ -200,7 +200,7 @@
<div class="setting field"><label>Your Kick Username<br><small>Your user handle. It's on kick.com/<strong><u>username</u></strong></small></label><input type="text" name="kickUserName" value=""></div>
<div class="setting"><label>Chat</label><label class="switch"><input type="checkbox" name="showKickMessages" checked><span class="slider"></span></label></div>
<div class="setting"><label>Chat<br><small>Reads Kick chat. If <strong>Chat Field is on</strong>, allows to send messages.</small></label><label class="switch"><input type="checkbox" name="showKickMessages" checked><span class="slider"></span></label></div>
<div class="setting"><label>Statistics<br><small>Show Kick Viewers. Self-updates each 15 seconds.</small></label><label class="switch"><input type="checkbox" name="showKickViewers" checked><span class="slider"></span></label></div>

96
js/app.js
View File

@@ -406,7 +406,6 @@ function hexToRGBA(hexadecimal,opacity) {
const chatInputConfig = document.getElementById("chat-input-config");
const chatInputSend = document.getElementById("chat-input-send");
const chatInputForm = document.querySelector("#chat-input form");
const chatInput = chatInputForm.querySelector("input[type=text]")
@@ -417,14 +416,13 @@ chatInputForm.addEventListener("submit", function(event) {
var chatSendPlatforms = [];
const settingsContainer = document.getElementById("chat-input-settings");
const checkboxes = settingsContainer.querySelectorAll('input[type="checkbox"]');
if (showTwitchMessages == true) {
chatSendPlatforms.push('twitch');
}
checkboxes.forEach(checkbox => {
const checked = checkbox.checked;
const platform = checkbox.getAttribute('data-platform');
if (checked == true) { chatSendPlatforms.push(platform); }
});
if (showYouTubeMessages == true) {
chatSendPlatforms.push('youtube');
}
chatSendPlatforms = chatSendPlatforms.join(',')
@@ -432,7 +430,6 @@ chatInputForm.addEventListener("submit", function(event) {
const chatInputText = chatInput.value;
// Sends Message to Twitch and YouTube
streamerBotClient.doAction(
{ name : "ChatRD Messages and Commands" },
{
@@ -444,17 +441,19 @@ chatInputForm.addEventListener("submit", function(event) {
console.debug('Sending Chat to Streamer.Bot', sendchatstuff);
});
// Sends Message to Kick that are not commands
if (chatSendPlatforms.includes('kick')) {
if (!chatInputText.startsWith('/')) {
streamerBotClient.doAction(
{ name : "ChatRD Kick Messages" },
{
"message": chatInputText,
if (showKickMessages == true) {
// Sends Message to Kick that are not commands
if (chatSendPlatforms.includes('kick')) {
if (!chatInputText.startsWith('/')) {
streamerBotClient.doAction(
{ name : "ChatRD Kick Messages" },
{
"message": chatInputText,
}
).then( (sendchatstuff) => {
console.debug('Sending Kick Chat to Streamer.Bot', sendchatstuff);
});
}
).then( (sendchatstuff) => {
console.debug('Sending Kick Chat to Streamer.Bot', sendchatstuff);
});
}
}
@@ -465,41 +464,7 @@ chatInputSend.addEventListener("click", function () {
chatInputForm.requestSubmit();
});
chatInputConfig.addEventListener("click", function () {
const isHidden = chatSettings.style.display === "none" || chatSettings.classList.contains("animate__fadeOutDown");
if (isHidden) {
// Remover animação de saída (caso ainda esteja presente)
chatSettings.classList.remove("animate__fadeOutDown");
// Mostrar com animação de entrada
chatSettings.style.display = "block";
chatSettings.classList.add("animate__animated", "animate__fadeInUp");
// Limpa as classes após a animação
chatSettings.addEventListener("animationend", function handler() {
chatSettings.classList.remove("animate__animated", "animate__fadeInUp");
chatSettings.removeEventListener("animationend", handler);
});
chatInputConfig.classList.add("active");
}
else {
// Começar animação de saída
chatSettings.classList.remove("animate__fadeInUp");
chatSettings.classList.add("animate__animated", "animate__fadeOutDown");
// Após animação, esconder elemento
chatSettings.addEventListener("animationend", function handler() {
chatSettings.style.display = "none";
chatSettings.classList.remove("animate__animated", "animate__fadeOutDown");
chatSettings.removeEventListener("animationend", handler);
});
chatInputConfig.classList.remove("active");
}
});
async function executeModCommand(event, command) {
@@ -520,31 +485,6 @@ async function executeModCommand(event, command) {
}
document.addEventListener("DOMContentLoaded", () => {
const settingsContainer = document.getElementById("chat-input-settings");
// Seleciona apenas checkboxes DENTRO do container
const checkboxes = settingsContainer.querySelectorAll('input[type="checkbox"]');
checkboxes.forEach(checkbox => {
const name = checkbox.name;
if (!name) return; // Ignora se o checkbox não tem 'name'
// Restaurar estado salvo
const saved = localStorage.getItem(name);
if (saved !== null) {
checkbox.checked = saved === "true";
}
// Salvar alterações
checkbox.addEventListener("change", () => {
localStorage.setItem(name, checkbox.checked);
});
});
});
let chatcommands = {
"Twitch" : [
{ "name" : "/me", "usage" : "[message]" },