Added emote support to Watch Streaks

horizontal-chat/script.js

@@ -802,7 +802,7 @@ async function TwitchWatchStreak(data) {
 	const displayName = data.displayName;
 	const watchStreak = data.watchStreak;
 
-	let message = `${displayName} is currently on a ${watchStreak}-stream streak!`;
+	let message = `${displayName} is currently on a ${watchStreak} stream streak!`;
 
 	ShowAlert(message, 'twitch');
 }

multichat-overlay/script.js

@@ -1201,9 +1201,29 @@ async function TwitchWatchStreak(data) {
 	const watchStreak = data.watchStreak;
 	const message = data.message;
 	
-	titleDiv.innerText = `${displayName} is currently on a ${watchStreak}-stream streak! `;
+	titleDiv.innerText = `${displayName} is currently on a ${watchStreak} stream streak! `;
 	contentDiv.innerText = `${message}`;
 
+	// Render emotes
+	for (i in data.emotes) {
+		const emoteElement = `<img src="${data.emotes[i].imageUrl}" class="emote"/>`;
+		const emoteName = EscapeRegExp(data.emotes[i].name);
+
+		let regexPattern = emoteName;
+
+		// Check if the emote name consists only of word characters (alphanumeric and underscore)
+		if (/^\w+$/.test(emoteName)) {
+			regexPattern = `\\b${emoteName}\\b`;
+		}
+		else {
+			// For non-word emotes, ensure they are surrounded by non-word characters or boundaries
+			regexPattern = `(?<=^|[^\\w])${emoteName}(?=$|[^\\w])`;
+		}
+
+		const regex = new RegExp(regexPattern, 'g');
+		contentDiv.innerHTML = contentDiv.innerHTML.replace(regex, emoteElement);
+	}
+
 	AddMessageItem(instance, data.messageId);
 }
 
@@ -3251,3 +3271,39 @@ async function GetYouTubeVideoData(videoId) {
 		return null;
 	}
 }
+
+let data = {
+    "msgId": "617ba873-519d-4e28-9d72-e25c13af8022",
+    "subscriber": false,
+    "message": "exeldr1Good",
+    "systemMessage": "Exeldro watched 5 consecutive streams and sparked a watch streak!",
+    "emotes": [
+      {
+        "id": "emotesv2_ae32a0ba44b347479250e76759d34b8a",
+        "type": "Twitch",
+        "name": "exeldr1Good",
+        "startIndex": 0,
+        "endIndex": 10,
+        "imageUrl": "https://static-cdn.jtvnw.net/emoticons/v2/emotesv2_ae32a0ba44b347479250e76759d34b8a/default/dark/2.0"
+      }
+    ],
+    "badges": [
+      {
+        "name": "moderator",
+        "version": "1",
+        "imageUrl": "https://static-cdn.jtvnw.net/badges/v1/3267646d-33f0-4b17-b3df-f923a41db1d0/3",
+        "info": ""
+      }
+    ],
+    "monthsSubscribed": 0,
+    "watchStreak": 5,
+    "copoReward": 450,
+    "string": "77656c7f-33ef-4d8d-981c-5be7fec88030",
+    "userId": "416052011",
+    "userName": "exeldro",
+    "displayName": "Exeldro",
+    "role": 3,
+    "isTest": false
+  }
+
+  TwitchWatchStreak(data);

multistream-alerts/script.js

@@ -743,7 +743,7 @@ async function TwitchWatchStreak(data) {
 		'twitch',
 		avatarURL,
 		`${username}`,
-		`is currently on a ${watchStreak}-stream streak!`,
+		`is currently on a ${watchStreak} stream streak!`,
 		'',
 		username,
 		'',