auto live chat selector for youtbue

steveseguin · Nov 23, 2024 · 60a71b3 · 60a71b3
1 parent 4a42980
commit 60a71b3
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 6 deletions.
diff --git a/background.js b/background.js
@@ -2461,7 +2461,9 @@ chrome.runtime.onMessage.addListener(async function (request, sender, sendRespon
 			if (request.setting == "twichadannounce") {
 				pushSettingChange();
 			}
-
+			if (request.setting == "autoLiveYoutube") {
+				pushSettingChange();
+			}
 			if (request.setting == "ticker") {
 				try {
 					await loadFileTicker();

diff --git a/popup.html b/popup.html
@@ -3542,13 +3542,21 @@ <h3><span data-translate="misc-chat-options">Miscellaneous options for sites</sp
                                     </label>
                                     <img class="icon" src="./sources/images/twitch.png" style="display: inline-block;" />🔇 <span data-translate="auto-mute-twitch-ads"> Automatically mute Twitch video ads</span>
                                 </div>
-								 <div title="Trigger an inbound message starting when there is an ad starting/stopping">
+								<div title="Trigger an inbound message starting when there is an ad starting/stopping">
                                     <label class="switch">
                                         <input type="checkbox" data-setting="twichadannounce" />
                                         <span class="slider round"></span>
                                     </label>
                                     <img class="icon" src="./sources/images/twitch.png" style="display: inline-block;" />🅰️ <span data-translate="twichadannounce"> Announce when an ad plays/stops in Twitch</span>
                                 </div>
+								<div title="Instead of Top Chat, which is default, auto-select Live Chat; Youtube Live chat pop out.">
+                                    <label class="switch">
+                                        <input type="checkbox" data-setting="autoLiveYoutube" />
+                                        <span class="slider round"></span>
+                                    </label>
+                                    <img class="icon" src="./sources/images/youtube.png" style="display: inline-block;" />🤷‍♂️ <span data-translate="autoLiveYoutube"> Auto-select <b>Live Chat</b> in Youtube Popout</span>
+                                </div>
+
                                 <div title="If you enable this, it will work even if the extension itself is set to inactive">
                                     <label class="switch">
                                         <input type="checkbox" data-setting="detweet" />

diff --git a/sources/youtube.js b/sources/youtube.js
@@ -532,14 +532,14 @@
 		try {
 			chatimg = ele.querySelector("#img[src], #author-photo img[src]").src;
 			if (chatimg.startsWith("data:image/gif;base64")) { 
-				await delay(500);console.log(ele);
+				await delay(500);//console.log(ele);
 				chatimg = document.querySelector("#"+ele.id+" #author-photo img[src]:not([src^='data:image/gif;base64'])") || "";
 				if (chatimg){
 					chatimg = chatimg.src;
 				}
 			}
 		} catch (e) {
-			console.log(e);
+			//console.log(e);
 			chatimg = "";
 		}
 
@@ -967,7 +967,7 @@
 	}
 
 	console.log("Social stream inserted");
-
+	var marked = false;
 	const checkTimer = setInterval(function () {
 	  const ele = document.querySelector("yt-live-chat-app #items.yt-live-chat-item-list-renderer");
 	  if (ele && !ele.skip) {
@@ -1021,6 +1021,21 @@
 	  }
 	  // style-scope yt-live-chat-message-renderer
 
+	  if (settings.autoLiveYoutube && document.querySelector("#trigger") && !marked){
+			marked = true;
+			document.querySelector("#trigger").click()
+			document.querySelector('[slot="dropdown-content"] [tabindex="0"]').click()
+			var waitTilClear = setInterval(function(){
+				if (document.querySelectorAll('#menu > a').length==2){
+					clearInterval(waitTilClear);
+					document.querySelectorAll('#menu > a')[1].click()
+					document.querySelector("yt-live-chat-header-renderer").style.display = "none";
+				}
+			},100)
+	  } else if (document.querySelector("#trigger") && !settings.autoLiveYoutube && marked){
+		  document.querySelector("yt-live-chat-header-renderer").style.display = "unset";
+		  marked = false;
+	  }
 	}, 1000);
 
 	if (window.location.href.includes("youtube.com/watch")) {
@@ -1092,7 +1107,7 @@
 						);
 					}
 				} catch (e) {
-					console.log(e);
+					//console.log(e);
 				}
 			  });
 		}