Added a global action + minor animation changes

This commit is contained in:
nuttylmao
2025-05-04 23:26:08 +10:00
parent 6edee0ad2d
commit 2f31fd547f
2 changed files with 49 additions and 14 deletions
+40 -13
View File
@@ -44,6 +44,7 @@ const hideAfter = GetIntParam("hideAfter", 8);
const showAnimation = urlParams.get("showAnimation") || ""; const showAnimation = urlParams.get("showAnimation") || "";
const hideAnimation = urlParams.get("hideAnimation") || ""; const hideAnimation = urlParams.get("hideAnimation") || "";
const playSounds = GetBooleanParam("playSounds", true); const playSounds = GetBooleanParam("playSounds", true);
const globalAction = urlParams.get("globalAction") || "";
const showMesesages = GetBooleanParam("showMesesages", true); const showMesesages = GetBooleanParam("showMesesages", true);
// Which Twitch alerts do you want to see? // Which Twitch alerts do you want to see?
@@ -84,6 +85,7 @@ const fourthwallAlertAction = urlParams.get("fourthwallAlertAction") || "";
if (!showAvatar) { if (!showAvatar) {
avatarElement.style.display = 'none'; avatarElement.style.display = 'none';
avatarSmallElement.style.display = 'none'; avatarSmallElement.style.display = 'none';
alertBox.style.padding = '0.5em 1em';
} }
// Set fonts for the widget // Set fonts for the widget
@@ -1187,7 +1189,7 @@ function GetWinnersList(gifts) {
} }
} }
async function UpdateAlertBox(platform, avatarURL, headerText, descriptionText, attributeText, username, message, sbAction, sbData) { function UpdateAlertBox(platform, avatarURL, headerText, descriptionText, attributeText, username, message, sbAction, sbData) {
// Check if the widget is in the middle of an animation // Check if the widget is in the middle of an animation
// If any alerts are requested while the animation is playing, it should be added to the alert queue // If any alerts are requested while the animation is playing, it should be added to the alert queue
if (widgetLocked) { if (widgetLocked) {
@@ -1227,18 +1229,24 @@ async function UpdateAlertBox(platform, avatarURL, headerText, descriptionText,
alertBox.style.height = theContentThatShowsFirstInsteadOfSecond.offsetHeight + "px"; alertBox.style.height = theContentThatShowsFirstInsteadOfSecond.offsetHeight + "px";
alertBox.style.animation = `${showAnimation} 0.5s ease-out forwards`; alertBox.style.animation = `${showAnimation} 0.5s ease-out forwards`;
// Run the Streamer.bot action if there is one
if (sbAction) {
console.debug('Running Streamer.bot action: ' + sbAction);
await client.doAction({name: sbAction}, sbData);
}
// Play sound effect // Play sound effect
if (playSounds) { if (playSounds) {
const audio = new Audio('sfx/notification.mp3'); const audio = new Audio('sfx/notification.mp3');
audio.play(); audio.play();
} }
// Run the Streamer.bot action if there is one
if (globalAction) {
console.debug('Running Streamer.bot action: ' + globalAction);
client.doAction({name: globalAction}, sbData);
}
// Run the Streamer.bot action if there is one
if (sbAction) {
console.debug('Running Streamer.bot action: ' + sbAction);
client.doAction({name: sbAction}, sbData);
}
// (1) Set timeout (8 seconds by default) // (1) Set timeout (8 seconds by default)
// (2) Set the message label // (2) Set the message label
// (3) Calculate the height of message label // (3) Calculate the height of message label
@@ -1248,16 +1256,34 @@ async function UpdateAlertBox(platform, avatarURL, headerText, descriptionText,
alertBox.style.transition = 'all 0.5s ease-in-out'; alertBox.style.transition = 'all 0.5s ease-in-out';
theContentThatShowsFirstInsteadOfSecond.style.opacity = 0; theContentThatShowsFirstInsteadOfSecond.style.opacity = 0;
theContentThatShowsLastInsteadOfFirst.style.display = 'inline-block'; if (message && showMesesages) {
alertBox.style.height = theContentThatShowsLastInsteadOfFirst.offsetHeight + "px";
theContentThatShowsLastInsteadOfFirst.style.opacity = 1;
setTimeout(() => { theContentThatShowsLastInsteadOfFirst.style.display = 'inline-block';
alertBox.style.height = theContentThatShowsLastInsteadOfFirst.offsetHeight + "px";
theContentThatShowsLastInsteadOfFirst.style.opacity = 1;
setTimeout(() => {
alertBox.style.animation = `${hideAnimation} 0.5s ease-out forwards`;
setTimeout(() => {
alertBox.style.height = '0px';
theContentThatShowsFirstInsteadOfSecond.style.opacity = 1;
theContentThatShowsLastInsteadOfFirst.style.opacity = 0;
theContentThatShowsLastInsteadOfFirst.style.display = 'none';
widgetLocked = false;
if (alertQueue.length > 0) {
console.debug("Pulling next alert from the queue");
let data = alertQueue.shift();
UpdateAlertBox(data.platform, data.avatarURL, data.headerText, data.descriptionText, data.attributeText, data.username, data.message, data.sbAction, data.sbData);
}
}, 1000);
}, hideAfter * 1000);
} else {
alertBox.style.animation = `${hideAnimation} 0.5s ease-out forwards`; alertBox.style.animation = `${hideAnimation} 0.5s ease-out forwards`;
setTimeout(() => { setTimeout(() => {
//alertBox.style.maxHeight = '0px';
alertBox.style.height = '0px'; alertBox.style.height = '0px';
theContentThatShowsFirstInsteadOfSecond.style.opacity = 1; theContentThatShowsFirstInsteadOfSecond.style.opacity = 1;
theContentThatShowsLastInsteadOfFirst.style.opacity = 0; theContentThatShowsLastInsteadOfFirst.style.opacity = 0;
theContentThatShowsLastInsteadOfFirst.style.display = 'none'; theContentThatShowsLastInsteadOfFirst.style.display = 'none';
@@ -1268,7 +1294,8 @@ async function UpdateAlertBox(platform, avatarURL, headerText, descriptionText,
UpdateAlertBox(data.platform, data.avatarURL, data.headerText, data.descriptionText, data.attributeText, data.username, data.message, data.sbAction, data.sbData); UpdateAlertBox(data.platform, data.avatarURL, data.headerText, data.descriptionText, data.attributeText, data.username, data.message, data.sbAction, data.sbData);
} }
}, 1000); }, 1000);
}, (message && showMesesages) ? hideAfter * 1000 : 0); }
}, hideAfter * 1000); }, hideAfter * 1000);
} }
+9 -1
View File
@@ -31,7 +31,7 @@
"type": "number", "type": "number",
"min": 1, "min": 1,
"max": 120, "max": 120,
"defaultValue": 30, "defaultValue": 20,
"group": "Appearance" "group": "Appearance"
}, },
{ {
@@ -203,6 +203,14 @@
"defaultValue": true, "defaultValue": true,
"group": "General" "group": "General"
}, },
{
"id": "globalAction",
"label": "Streamer.bot Action",
"description": "Run this Streamer.bot Action on every alert",
"type": "sb-actions",
"defaultValue": "",
"group": "General"
},
{ {
"id": "showMesesages", "id": "showMesesages",
"label": "Show Messages", "label": "Show Messages",