fix(popupLyrics): update view in system tray mode (#3330)

Author: Lseoksee

Extensions/popupLyrics.js

@@ -18,6 +18,7 @@ if (!navigator.serviceWorker) {
 			num = setInterval(() => postMessage("popup-lyric-update-ui"), 16.66);
 		} else if (event.data === "popup-lyric-stop-update") {
 			clearInterval(num);
+			postMessage("popup-lyric-update-ui");
 			num = null;
 		}
 	};
@@ -42,6 +43,21 @@ function PopupLyrics() {
 		}
 	};
 
+	let workerIsRunning = null;
+	document.addEventListener("visibilitychange", (e) => {
+		if (e.target.hidden) {
+			if (!workerIsRunning) {
+				worker.postMessage("popup-lyric-request-update");
+				workerIsRunning = true;
+			}
+		} else {
+			if (workerIsRunning) {
+				worker.postMessage("popup-lyric-stop-update");
+				workerIsRunning = false;
+			}
+		}
+	});
+
 	const LyricUtils = {
 		normalize(s, emptySymbol = true) {
 			const result = s
@@ -457,7 +473,6 @@ function PopupLyrics() {
 
 				try {
 					const data = await service.call(info);
-					console.log(data);
 					sharedData = data;
 					CACHE[info.uri] = sharedData;
 
@@ -765,7 +780,6 @@ function PopupLyrics() {
 		ctx.restore();
 	}
 
-	let workerIsRunning = null;
 	let timeout = null;
 
 	async function tick(options) {
@@ -801,17 +815,7 @@ function PopupLyrics() {
 			return;
 		}
 
-		if (document.hidden) {
-			if (!workerIsRunning) {
-				worker.postMessage("popup-lyric-request-update");
-				workerIsRunning = true;
-			}
-		} else {
-			if (workerIsRunning) {
-				worker.postMessage("popup-lyric-stop-update");
-				workerIsRunning = false;
-			}
-
+		if (!document.hidden) {
 			requestAnimationFrame(() => tick(options));
 		}
 	}
@@ -910,7 +914,6 @@ button.btn:disabled {
 }
 #popup-config-container input {
     width: 100%;
-    margin-top: 10px;
     padding: 0 5px;
     height: 32px;
     border: 0;