[web] Lint source code

owntone · Apr 21, 2024 · a2000c0 · a2000c0
1 parent c3d5c6e
commit a2000c0
Show file tree

Hide file tree

Showing 6 changed files with 149 additions and 181 deletions.
diff --git a/web-src/eslint.config.js b/web-src/eslint.config.js
@@ -31,10 +31,10 @@ export default [
       'no-plusplus': 'off',
       'no-shadow': 'off',
       'no-ternary': 'off',
-      'no-unused-vars': ['error', { args: 'none', caughtErrors: 'none' }],
       'no-undef': 'off',
       'no-undefined': 'off',
       'no-unused-expressions': 'off',
+      'no-unused-vars': ['error', { args: 'none', caughtErrors: 'none' }],
       'no-useless-assignment': 'off',
       'one-var': 'off',
       'prefer-destructuring': 'off',
@@ -43,7 +43,6 @@ export default [
       'sort-vars': 'off',
       'vue/html-self-closing': 'off',
       'vue/max-attributes-per-line': 'off',
-      'vue/no-unused-vars': 'off',
       'vue/prop-name-casing': 'off',
       'vue/singleline-html-element-content-newline': 'off'
     }

diff --git a/web-src/src/App.vue b/web-src/src/App.vue
@@ -37,18 +37,18 @@ import webapi from '@/webapi'
 export default {
   name: 'App',
   components: {
-    NavbarTop,
-    NavbarBottom,
-    NotificationList,
     ModalDialogRemotePairing,
-    ModalDialogUpdate
+    ModalDialogUpdate,
+    NavbarBottom,
+    NavbarTop,
+    NotificationList
   },
 
   data() {
     return {
-      token_timer_id: 0,
+      pairing_active: false,
       reconnect_attempts: 0,
-      pairing_active: false
+      token_timer_id: 0
     }
   },
 
@@ -90,10 +90,8 @@ export default {
 
   created() {
     this.connect()
-
     // Start the progress bar on app start
     this.$Progress.start()
-
     // Hook the progress bar to start before we move router-view
     this.$router.beforeEach((to, from, next) => {
       if (to.meta.show_progress && !(to.path === from.path && to.hash)) {
@@ -104,7 +102,6 @@ export default {
       }
       next()
     })
-
     // Hook the progress bar to finish after we've finished moving router-view
     this.$router.afterEach((to, from) => {
       if (to.meta.show_progress) {
@@ -128,12 +125,11 @@ export default {
         .catch(() => {
           this.$store.dispatch('add_notification', {
             text: this.$t('server.connection-failed'),
-            type: 'danger',
-            topic: 'connection'
+            topic: 'connection',
+            type: 'danger'
           })
         })
     },
-
     open_ws() {
       if (this.$store.state.config.websocket_port <= 0) {
         this.$store.dispatch('add_notification', {
@@ -164,8 +160,8 @@ export default {
       }
 
       const socket = new ReconnectingWebSocket(wsUrl, 'notify', {
-        reconnectInterval: 1000,
-        maxReconnectInterval: 2000
+        maxReconnectInterval: 2000,
+        reconnectInterval: 1000
       })
 
       const vm = this
@@ -266,36 +262,37 @@ export default {
         }
       }
     },
-
-    update_library_stats() {
-      webapi.library_stats().then(({ data }) => {
-        this.$store.commit(types.UPDATE_LIBRARY_STATS, data)
-      })
-      webapi.library_count('scan_kind is rss').then(({ data }) => {
-        this.$store.commit(types.UPDATE_LIBRARY_RSS_COUNT, data)
-      })
+    update_is_clipped() {
+      if (this.show_burger_menu || this.show_player_menu) {
+        document.querySelector('html').classList.add('is-clipped')
+      } else {
+        document.querySelector('html').classList.remove('is-clipped')
+      }
     },
-
     update_outputs() {
       webapi.outputs().then(({ data }) => {
         this.$store.commit(types.UPDATE_OUTPUTS, data.outputs)
       })
     },
-
     update_player_status() {
       webapi.player_status().then(({ data }) => {
         this.$store.commit(types.UPDATE_PLAYER_STATUS, data)
         this.update_lyrics()
       })
     },
-
-    update_queue() {
-      webapi.queue().then(({ data }) => {
-        this.$store.commit(types.UPDATE_QUEUE, data)
-        this.update_lyrics()
+    update_lastfm() {
+      webapi.lastfm().then(({ data }) => {
+        this.$store.commit(types.UPDATE_LASTFM, data)
+      })
+    },
+    update_library_stats() {
+      webapi.library_stats().then(({ data }) => {
+        this.$store.commit(types.UPDATE_LIBRARY_STATS, data)
+      })
+      webapi.library_count('scan_kind is rss').then(({ data }) => {
+        this.$store.commit(types.UPDATE_LIBRARY_RSS_COUNT, data)
       })
     },
-
     update_lyrics() {
       const track = this.$store.getters.now_playing
       if (track && track.track_id) {
@@ -306,19 +303,23 @@ export default {
         this.$store.commit(types.UPDATE_LYRICS)
       }
     },
-
+    update_pairing() {
+      webapi.pairing().then(({ data }) => {
+        this.$store.commit(types.UPDATE_PAIRING, data)
+        this.pairing_active = data.active
+      })
+    },
+    update_queue() {
+      webapi.queue().then(({ data }) => {
+        this.$store.commit(types.UPDATE_QUEUE, data)
+        this.update_lyrics()
+      })
+    },
     update_settings() {
       webapi.settings().then(({ data }) => {
         this.$store.commit(types.UPDATE_SETTINGS, data)
       })
     },
-
-    update_lastfm() {
-      webapi.lastfm().then(({ data }) => {
-        this.$store.commit(types.UPDATE_LASTFM, data)
-      })
-    },
-
     update_spotify() {
       webapi.spotify().then(({ data }) => {
         this.$store.commit(types.UPDATE_SPOTIFY, data)
@@ -334,21 +335,6 @@ export default {
           )
         }
       })
-    },
-
-    update_pairing() {
-      webapi.pairing().then(({ data }) => {
-        this.$store.commit(types.UPDATE_PAIRING, data)
-        this.pairing_active = data.active
-      })
-    },
-
-    update_is_clipped() {
-      if (this.show_burger_menu || this.show_player_menu) {
-        document.querySelector('html').classList.add('is-clipped')
-      } else {
-        document.querySelector('html').classList.remove('is-clipped')
-      }
     }
   },
   template: '<App/>'

diff --git a/web-src/src/components/LyricsPane.vue b/web-src/src/components/LyricsPane.vue
@@ -50,6 +50,44 @@ export default {
     is_playing() {
       return this.player.state === 'play'
     },
+    lyrics() {
+      const raw = this.$store.state.lyrics.content
+      const parsed = []
+      if (raw) {
+        // Parse the lyrics
+        const regex = /(\[(\d+):(\d+)(?:\.\d+)?\] ?)?(.*)/u
+        raw.split('\n').forEach((item, index) => {
+          const matches = regex.exec(item)
+          if (matches && matches[4]) {
+            const verse = {
+              text: matches[4],
+              time: matches[2] * 60 + Number(matches[3])
+            }
+            parsed.push(verse)
+          }
+        })
+        // Split the verses into words
+        parsed.forEach((verse, index, lyrics) => {
+          const duration =
+            index < lyrics.length - 1 ? lyrics[index + 1].time - verse.time : 3
+          const unitDuration = duration / verse.text.length
+          let delay = 0
+          verse.words = verse.text.match(/\S+\s*/gu).map((text) => {
+            const duration = text.length * unitDuration
+            delay += duration
+            return {
+              duration,
+              delay,
+              text
+            }
+          })
+        })
+      }
+      return parsed
+    },
+    player() {
+      return this.$store.state.player
+    },
     verse_index() {
       if (this.lyrics.length && this.lyrics[0].time) {
         const currentTime = this.player.item_progress_ms / 1000,
@@ -99,44 +137,6 @@ export default {
       }
       this.reset_scrolling()
       return -1
-    },
-    lyrics() {
-      const raw = this.$store.state.lyrics.content
-      const parsed = []
-      if (raw) {
-        // Parse the lyrics
-        const regex = /(\[(\d+):(\d+)(?:\.\d+)?\] ?)?(.*)/u
-        raw.split('\n').forEach((item, index) => {
-          const matches = regex.exec(item)
-          if (matches && matches[4]) {
-            const verse = {
-              text: matches[4],
-              time: matches[2] * 60 + Number(matches[3])
-            }
-            parsed.push(verse)
-          }
-        })
-        // Split the verses into words
-        parsed.forEach((verse, index, lyrics) => {
-          const duration =
-            index < lyrics.length - 1 ? lyrics[index + 1].time - verse.time : 3
-          const unitDuration = duration / verse.text.length
-          let delay = 0
-          verse.words = verse.text.match(/\S+\s*/gu).map((text) => {
-            const duration = text.length * unitDuration
-            delay += duration
-            return {
-              duration,
-              delay,
-              text
-            }
-          })
-        })
-      }
-      return parsed
-    },
-    player() {
-      return this.$store.state.player
     }
   },
   watch: {
@@ -154,17 +154,6 @@ export default {
       this.lastItemId = this.player.item_id
       this.lastIndex = -1
     },
-    start_scrolling(e) {
-      // Consider only user events
-      if (e.screenX || e.screenX !== 0 || e.screenY || e.screenY !== 0) {
-        this.autoScrolling = false
-        if (this.scrollingTimer) {
-          clearTimeout(this.scrollingTimer)
-        }
-        // Reenable automatic scrolling after 2 seconds
-        this.scrollingTimer = setTimeout((this.autoScrolling = true), 2000)
-      }
-    },
     scroll_to_verse() {
       const pane = this.$refs.lyrics
       if (this.verse_index === -1) {
@@ -181,6 +170,17 @@ export default {
           (currentVerse.offsetHeight >> 1) -
           pane.scrollTop
       })
+    },
+    start_scrolling(e) {
+      // Consider only user events
+      if (e.screenX || e.screenX !== 0 || e.screenY || e.screenY !== 0) {
+        this.autoScrolling = false
+        if (this.scrollingTimer) {
+          clearTimeout(this.scrollingTimer)
+        }
+        // Reenable automatic scrolling after 2 seconds
+        this.scrollingTimer = setTimeout((this.autoScrolling = true), 2000)
+      }
     }
   }
 }