diff --git a/.common/utils/helpers.js b/.common/utils/helpers.js index 2014a42..a6925f5 100644 --- a/.common/utils/helpers.js +++ b/.common/utils/helpers.js @@ -202,17 +202,21 @@ function RenderKickEmotes(message) { }); } -function GetCurrentTimeFormatted() { +function GetCurrentTimeFormatted(timeFormat = '12-hour') { const now = new Date(); let hours = now.getHours(); const minutes = String(now.getMinutes()).padStart(2, '0'); - const ampm = hours >= 12 ? 'PM' : 'AM'; + if (timeFormat === '24-hour') { + const paddedHours = String(hours).padStart(2, '0'); + return `${paddedHours}:${minutes}`; + } + + const ampm = hours >= 12 ? 'PM' : 'AM'; hours = hours % 12; hours = hours ? hours : 12; // the hour '0' should be '12' - const formattedTime = `${hours}:${minutes} ${ampm}`; - return formattedTime; + return `${hours}:${minutes} ${ampm}`; } function DecodeHTMLString(html) { @@ -353,6 +357,8 @@ function ConstructMessageFromParts(parts) { return emoteImg + bitLabel; case "mention": return part.text; + case "gif": + return ``; default: return `${EscapeHTML(part.text)}`; } diff --git a/horizontal-chat/script.js b/horizontal-chat/script.js index 23ef007..34967d1 100644 --- a/horizontal-chat/script.js +++ b/horizontal-chat/script.js @@ -26,6 +26,7 @@ let kickSubBadges = []; const showPlatform = GetBooleanParam("showPlatform", true); const showAvatar = GetBooleanParam("showAvatar", true); const showTimestamps = GetBooleanParam("showTimestamps", false); +const timeFormat = urlParams.get("timeFormat") || "12-hour"; const showBadges = GetBooleanParam("showBadges", true); const showPronouns = GetBooleanParam("showPronouns", false); const showUsername = GetBooleanParam("showUsername", true); @@ -555,7 +556,7 @@ async function TwitchChatMessage(data) { // Set timestamp if (showTimestamps) { timestampDiv.classList.add("timestamp"); - timestampDiv.innerText = GetCurrentTimeFormatted(); + timestampDiv.innerText = GetCurrentTimeFormatted(timeFormat); } // Set the username info @@ -706,8 +707,8 @@ async function TwitchSub(data) { let username = data.user.name; if (data.user.name.toLowerCase() != data.user.login.toLowerCase()) username = `${data.user.name} (${data.user.login})`; - const subTier = data.sub_tier; - const isPrime = data.is_prime; + const subTier = data.sub_tier ?? data.subTier; + const isPrime = data.is_prime ?? data.isPrime; let message = ''; @@ -922,7 +923,7 @@ function YouTubeMessage(data) { // Set timestamp if (showTimestamps) { timestampDiv.classList.add("timestamp"); - timestampDiv.innerText = GetCurrentTimeFormatted(); + timestampDiv.innerText = GetCurrentTimeFormatted(timeFormat); } // Set the message data @@ -1350,7 +1351,7 @@ async function KickChatMessage(data) { // Set timestamp if (showTimestamps) { timestampDiv.classList.add("timestamp"); - timestampDiv.innerText = GetCurrentTimeFormatted(); + timestampDiv.innerText = GetCurrentTimeFormatted(timeFormat); } // Set the username info @@ -1588,7 +1589,7 @@ async function TikTokChat(data) { // Set timestamp if (showTimestamps) { timestampDiv.classList.add("timestamp"); - timestampDiv.innerText = GetCurrentTimeFormatted(); + timestampDiv.innerText = GetCurrentTimeFormatted(timeFormat); } // Set the username info diff --git a/horizontal-chat/settings/settings.json b/horizontal-chat/settings/settings.json index a99b145..eac218e 100644 --- a/horizontal-chat/settings/settings.json +++ b/horizontal-chat/settings/settings.json @@ -24,6 +24,25 @@ "defaultValue": false, "group": "Appearance" }, + { + "id": "timeFormat", + "label": "Time Format", + "description": "", + "type": "select", + "showIf": "showTimestamps", + "options": [ + { + "value": "12-hour", + "label": "12 Hour Time" + }, + { + "value": "24-hour", + "label": "24 Hour Time" + } + ], + "defaultValue": "12-hour", + "group": "Appearance" + }, { "id": "showBadges", "label": "Show Badges", diff --git a/multichat-overlay/script.js b/multichat-overlay/script.js index b731db9..5c989db 100644 --- a/multichat-overlay/script.js +++ b/multichat-overlay/script.js @@ -23,6 +23,7 @@ let kickSubBadges = []; const showPlatform = GetBooleanParam("showPlatform", true); const showAvatar = GetBooleanParam("showAvatar", true); const showTimestamps = GetBooleanParam("showTimestamps", true); +const timeFormat = urlParams.get("timeFormat") || "12-hour"; const showBadges = GetBooleanParam("showBadges", true); const showPronouns = GetBooleanParam("showPronouns", true); const showUsername = GetBooleanParam("showUsername", true); @@ -654,7 +655,7 @@ async function TwitchChatMessage(data) { // Set timestamp if (showTimestamps) { timestampDiv.classList.add("timestamp"); - timestampDiv.innerText = GetCurrentTimeFormatted(); + timestampDiv.innerText = GetCurrentTimeFormatted(timeFormat); } // Set the username info @@ -919,7 +920,7 @@ async function TwitchAnnouncement(data) { // Set timestamp if (showTimestamps) { content.querySelector("#timestamp").classList.add("timestamp"); - content.querySelector("#timestamp").innerText = GetCurrentTimeFormatted(); + content.querySelector("#timestamp").innerText = GetCurrentTimeFormatted(timeFormat); } if (data.user.name.toLowerCase() == data.user.login.toLowerCase()) content.querySelector("#username").innerText = data.user.name; @@ -1026,8 +1027,8 @@ async function TwitchSub(data) { let username = data.user.name; if (data.user.name.toLowerCase() != data.user.login.toLowerCase()) username = `${data.user.name} (${data.user.login})`; - const subTier = data.sub_tier; - const isPrime = data.is_prime; + const subTier = data.sub_tier ?? data.subTier; + const isPrime = data.is_prime ?? data.isPrime; if (!isPrime) titleDiv.innerText = `${username} subscribed with Tier ${subTier.charAt(0)}`; @@ -1412,7 +1413,7 @@ async function YouTubeMessage(data) { // Set timestamp if (showTimestamps) { timestampDiv.classList.add("timestamp"); - timestampDiv.innerText = GetCurrentTimeFormatted(); + timestampDiv.innerText = GetCurrentTimeFormatted(timeFormat); } // Set the message data @@ -2397,7 +2398,7 @@ async function KickChatMessage(data) { // Set timestamp if (showTimestamps) { timestampDiv.classList.add("timestamp"); - timestampDiv.innerText = GetCurrentTimeFormatted(); + timestampDiv.innerText = GetCurrentTimeFormatted(timeFormat); } // Set the username info @@ -2880,7 +2881,7 @@ async function TikTokChat(data) { // Set timestamp if (showTimestamps) { timestampDiv.classList.add("timestamp"); - timestampDiv.innerText = GetCurrentTimeFormatted(); + timestampDiv.innerText = GetCurrentTimeFormatted(timeFormat); } // Set the username info diff --git a/multichat-overlay/settings/settings.json b/multichat-overlay/settings/settings.json index fee2d12..8445c9d 100644 --- a/multichat-overlay/settings/settings.json +++ b/multichat-overlay/settings/settings.json @@ -24,6 +24,25 @@ "defaultValue": true, "group": "Appearance" }, + { + "id": "timeFormat", + "label": "Time Format", + "description": "", + "type": "select", + "showIf": "showTimestamps", + "options": [ + { + "value": "12-hour", + "label": "12 Hour Time" + }, + { + "value": "24-hour", + "label": "24 Hour Time" + } + ], + "defaultValue": "12-hour", + "group": "Appearance" + }, { "id": "showBadges", "label": "Show Badges", diff --git a/multichat-overlay/style.css b/multichat-overlay/style.css index b391103..7b3ed0c 100644 --- a/multichat-overlay/style.css +++ b/multichat-overlay/style.css @@ -169,6 +169,11 @@ li { transform: translate(0px, 0.4em); } +.gif { + width: auto; + padding: 20px 0px; +} + .productImage { height: 3em; border-radius: 0.25em; diff --git a/multistream-alerts/script.js b/multistream-alerts/script.js index 7638a4a..b25d9f0 100644 --- a/multistream-alerts/script.js +++ b/multistream-alerts/script.js @@ -542,8 +542,8 @@ async function TwitchSub(data) { // Set the text const username = data.user.name; - const subTier = data.sub_tier; - const isPrime = data.is_prime; + const subTier = data.sub_tier ?? data.subTier; + const isPrime = data.is_prime ?? data.isPrime; // Render avatars const avatarURL = await GetAvatar(username, 'twitch');