fix: toggle ext. on/off causing weird ui overflow

cdrani · Oct 28, 2023 · 2ef7752 · 2ef7752
1 parent dba39ec
commit 2ef7752
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 18 deletions.
diff --git a/src/actions/init.js b/src/actions/init.js
@@ -30,9 +30,11 @@ async function load() {
     document.addEventListener('app.enabled', async e => {
         const { enabled } = e.detail
 
+        const enabledFromSession = JSON.parse(sessionStorage.getItem('enabled'))
         sessionStorage.setItem('enabled', enabled)
         video.active = enabled
 
+        if (enabledFromSession === enabled) return
         enabled ? await app.connect() : app.disconnect()
     })
 

diff --git a/src/background.js b/src/background.js
@@ -53,9 +53,8 @@ chrome.storage.onChanged.addListener(async changes => {
 
     if (!changedKey) return
 
-    if (['now-playing', 'enabled'].includes(changedKey)) {
-        popupPort?.postMessage({ type: changedKey, data: changes[changedKey].newValue }) 
-        if (changedKey == 'now-playing') return
+    if (changedKey == 'now-playing' && ENABLED) {
+        return popupPort?.postMessage({ type: changedKey, data: changes[changedKey].newValue }) 
     }
 
     if (changedKey == 'enabled') {

diff --git a/src/popup/index.js b/src/popup/index.js
@@ -197,6 +197,10 @@ function sortByContrast(background, colors) {
     return sortedColors
 }
 
+async function updatePopupUIState(popupState) {
+    await setState({ key: 'popup-ui', value: popupState })
+}
+
 async function updateBackgroundAndTextColours({ imageElement, title, artists }) {
     const { cover, chorusPopup } = getElements()
 
@@ -208,22 +212,14 @@ async function updateBackgroundAndTextColours({ imageElement, title, artists })
     const nextPrimary = sortByContrast(background, sortedPalette.slice(1).filter(x => x.percentage > 0)).at(0)
 
     const textColor = getContrastColor(background.base, nextPrimary.base)
-    chorusPopup.style.backgroundColor = background.color
-
-    cover.src = imageElement.src
-    setTrackInfo({ title, artists, textColor })
+    const backgroundColor = background.color
+    chorusPopup.style.backgroundColor = backgroundColor
 
-    await setState({
-        key: 'popup-ui', 
-        value: {
-            title, 
-            artists,
-            textColor,
-            src: imageElement.src,
-            backgroundColor: background.color,
-        }
-    })
+    const src = imageElement.src
+    cover.src = src
 
+    setTrackInfo({ title, artists, textColor })
+    await updatePopupUIState({ title, artists, textColor, src, backgroundColor })
     return { textColor }
 }
 
@@ -373,7 +369,7 @@ function loadDefaultUI(enabled) {
 
     setTrackInfo({ title, artists: 'Chorus - Spotify Enhancer' })
 
-    chorusPopup.style.backgroundColor = '#1DD760'
+    chorusPopup.style.backgroundColor = '#1ED760'
     extToggle.setFill('#000')
 }