fix(lyrics-genius): fix #1253

th-ch · Oct 6, 2023 · 375fb08 · 375fb08
1 parent 8b65f1d
commit 375fb08
Showing 1 changed file with 83 additions and 81 deletions.
diff --git a/plugins/lyrics-genius/front.ts b/plugins/lyrics-genius/front.ts
@@ -4,103 +4,105 @@ import is from 'electron-is';
 import type { SongInfo } from '../../providers/song-info';
 
 export default () => {
-  ipcRenderer.on('update-song-info', (_, extractedSongInfo: SongInfo) => setTimeout(async () => {
-    const tabList = document.querySelectorAll('tp-yt-paper-tab');
-    const tabs = {
-      upNext: tabList[0],
-      lyrics: tabList[1],
-      discover: tabList[2],
-    };
-
-    // Check if disabled
-    if (!tabs.lyrics?.hasAttribute('disabled')) {
-      return;
+  const setLyrics = (lyricsContainer: Element, lyrics: string | null) => {
+    lyricsContainer.innerHTML = `
+      <div id="contents" class="style-scope ytmusic-section-list-renderer description ytmusic-description-shelf-renderer genius-lyrics">
+        ${lyrics?.replaceAll(/\r\n|\r|\n/g, '<br/>') ?? 'Could not retrieve lyrics from genius'}
+      </div>
+      <yt-formatted-string class="footer style-scope ytmusic-description-shelf-renderer" style="align-self: baseline">
+      </yt-formatted-string>
+    `;
+
+    if (lyrics) {
+      const footer = lyricsContainer.querySelector('.footer');
+
+      if (footer) {
+        footer.textContent = 'Source: Genius';
+      }
     }
+  };
 
-    let hasLyrics = true;
-
-    const lyrics = await ipcRenderer.invoke(
-      'search-genius-lyrics',
-      extractedSongInfo,
-    ) as string;
-    if (!lyrics) {
-      // Delete previous lyrics if tab is open and couldn't get new lyrics
-      checkLyricsContainer(() => {
-        hasLyrics = false;
-        setTabsOnclick(undefined);
-      });
-      return;
-    }
+  let unregister: (() => void) | null = null; 
 
-    if (is.dev()) {
-      console.log('Fetched lyrics from Genius');
-    }
+  ipcRenderer.on('update-song-info', (_, extractedSongInfo: SongInfo) => {
+    unregister?.();
+
+    setTimeout(async () => {
+      const tabList = document.querySelectorAll<HTMLElement>('tp-yt-paper-tab');
+      const tabs = {
+        upNext: tabList[0],
+        lyrics: tabList[1],
+        discover: tabList[2],
+      };
 
-    enableLyricsTab();
+      // Check if disabled
+      if (!tabs.lyrics?.hasAttribute('disabled')) return;
 
-    setTabsOnclick(enableLyricsTab);
+      const lyrics = await ipcRenderer.invoke(
+        'search-genius-lyrics',
+        extractedSongInfo,
+      ) as string | null;
 
-    checkLyricsContainer();
+      if (!lyrics) {
+        // Delete previous lyrics if tab is open and couldn't get new lyrics
+        tabs.upNext.click();
+
+        return;
+      }
+
+      if (is.dev()) {
+        console.log('Fetched lyrics from Genius');
+      }
+
+      const tryToInjectLyric = (callback?: () => void) => {
+        const lyricsContainer = document.querySelector(
+          '[page-type="MUSIC_PAGE_TYPE_TRACK_LYRICS"] > ytmusic-message-renderer',
+        );
+
+        if (lyricsContainer) {
+          callback?.();
+
+          setLyrics(lyricsContainer, lyrics);
+          applyLyricsTabState();
+        }
+      };
+      const applyLyricsTabState = () => {
+        if (lyrics) {
+          tabs.lyrics.removeAttribute('disabled');
+          tabs.lyrics.removeAttribute('aria-disabled');
+        } else {
+          tabs.lyrics.setAttribute('disabled', '');
+          tabs.lyrics.setAttribute('aria-disabled', '');
+        }
+      };
+      const lyricsTabHandler = () => {
+        const tabContainer = document.querySelector('ytmusic-tab-renderer');
+        if (!tabContainer) return;
 
-    const lyricsTabHandler = () => {
-      const tabContainer = document.querySelector('ytmusic-tab-renderer');
-      if (tabContainer) {
         const observer = new MutationObserver((_, observer) => {
-          checkLyricsContainer(() => observer.disconnect());
+          tryToInjectLyric(() => observer.disconnect());
         });
+
         observer.observe(tabContainer, {
           attributes: true,
           childList: true,
           subtree: true,
         });
-      }
-    };
-
-    tabs.lyrics.addEventListener('click', lyricsTabHandler);
-
-    function checkLyricsContainer(callback = () => {
-    }) {
-      const lyricsContainer = document.querySelector(
-        '[page-type="MUSIC_PAGE_TYPE_TRACK_LYRICS"] > ytmusic-message-renderer',
-      );
-      if (lyricsContainer) {
-        callback();
-        setLyrics(lyricsContainer);
-      }
-    }
+      };
 
-    function setLyrics(lyricsContainer: Element) {
-      lyricsContainer.innerHTML = `<div id="contents" class="style-scope ytmusic-section-list-renderer description ytmusic-description-shelf-renderer genius-lyrics">
-      ${
-        hasLyrics
-          ? lyrics.replaceAll(/\r\n|\r|\n/g, '<br/>')
-          : 'Could not retrieve lyrics from genius'
-      }
-
-        </div>
-        <yt-formatted-string class="footer style-scope ytmusic-description-shelf-renderer" style="align-self: baseline"></yt-formatted-string>`;
-      if (hasLyrics) {
-        const footer = lyricsContainer.querySelector('.footer');
-        if (footer) {
-          footer.textContent = 'Source: Genius';
-          enableLyricsTab();
-        }
-      }
-    }
+      applyLyricsTabState();
 
-    const defaultHandler = () => {};
+      tabs.discover.addEventListener('click', applyLyricsTabState);
+      tabs.lyrics.addEventListener('click', lyricsTabHandler);
+      tabs.upNext.addEventListener('click', applyLyricsTabState);
 
-    function setTabsOnclick(callback: EventListenerOrEventListenerObject | undefined) {
-      for (const tab of [tabs.upNext, tabs.discover]) {
-        if (tab) {
-          tab.addEventListener('click', callback ?? defaultHandler);
-        }
-      }
-    }
+      tryToInjectLyric();
 
-    function enableLyricsTab() {
-      tabs.lyrics.removeAttribute('disabled');
-      tabs.lyrics.removeAttribute('aria-disabled');
-    }
-  }, 500));
+      unregister = () => {
+        tabs.discover.removeEventListener('click', applyLyricsTabState);
+        tabs.lyrics.removeEventListener('click', lyricsTabHandler);
+        tabs.upNext.removeEventListener('click', applyLyricsTabState);
+      };
+    }, 500);
+  });
 };