fix: hold to ff, cycle subtitles backwards when holding shift, disable chromatic abberation animation

fix: validate entries when app first loads but cache doesnt sync with online, this fixes issues when syncing across multiple devices

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "ui",
-	"version": "6.4.153",
+	"version": "6.4.154",
 	"license": "BUSL-1.1",
 	"private": true,
 	"packageManager": "pnpm@9.15.5",

src/lib/components/ui/player/player.svelte

@@ -429,12 +429,13 @@
 
   let openSubs: () => Promise<void>
 
-  function cycleSubtitles () {
+  function cycleSubtitles (e: KeyboardEvent | MouseEvent) {
     if (!subtitles) return
     const entries = Object.entries(subtitles._tracks.value)
     if (!entries.length) return
-    const index = entries.findIndex(([index]) => index === subtitles!.current.value) + 1
-    const [id, info] = entries[index] ?? [-1, { meta: { name: 'Off', language: 'Eng' } }]
+    const offset = e.shiftKey ? -1 : 1
+    const index = entries.findIndex(([index]) => index === subtitles!.current.value) + offset
+    const [id, info] = entries.at(index) ?? [-1, { meta: { name: 'Off', language: 'Eng' } }]
     playAnimation(info.meta.name ?? info.meta.language ?? 'Eng')
     subtitles.selectCaptions(id)
   }
@@ -476,9 +477,7 @@
     },
     Space: {
       fn: (e) => {
-        e.preventDefault()
-        e.stopImmediatePropagation()
-        e.stopPropagation()
+        if ('repeat' in e && e.repeat) return
         playPause()
       },
       id: 'play_arrow',
@@ -550,7 +549,7 @@
     //   desc: 'Toggle Cast [broken]'
     // },
     KeyC: {
-      fn: () => cycleSubtitles(),
+      fn: (e) => cycleSubtitles(e),
       id: 'subtitles',
       icon: Captions,
       type: 'icon',
@@ -674,6 +673,7 @@
       if (isMiniplayer) return
       if ('code' in event && (event.code !== 'Space')) return
       if ('button' in event && event.button !== 0) return
+      if ('repeat' in event && event.repeat) return
       if ('pointerId' in event) {
         document.setPointerCapture(event.pointerId)
       }

src/lib/modules/auth/client.ts

@@ -116,7 +116,7 @@ export default new class AuthAggregator {
   })
 
   async watch (outdated: Media, progress: number) {
-    const media = (await client.single(outdated.id)).data?.Media ?? outdated
+    const media = (await client.single(outdated.id, navigator.onLine ? 'network-only' : 'cache-first')).data?.Media ?? outdated
     const totalEps = episodes(media) ?? 1 // episodes or movie which is single episode
     if (totalEps < progress) return // woah, bad data from resolver?!
 

src/routes/+page.svelte

@@ -34,7 +34,7 @@
 
 <div class='size-full flex justify-center items-center'>
   <div class='size-10 relative logo-container' on:animationend|self={navigate}>
-    <Logo class='size-10 [filter:url(#chromaticAberration)]' />
+    <Logo class='size-10' />
     {#each spotlightData as s, i (i)}
       <div class='spotlight absolute blurred origin-left'
         style:--to-x={s.tox}
@@ -51,6 +51,7 @@
   </div>
 </div>
 
+<!--
 <svg width='0' height='0'>
   <filter id='chromaticAberration'>
     <feColorMatrix type='matrix'
@@ -82,7 +83,7 @@
     </feOffset>
     <feBlend mode='screen' in='red' in2='blue' />
   </filter>
-</svg>
+</svg> -->
 
 <style>
   @property --spotlight-opacity {
@@ -131,7 +132,7 @@
   }
 
   .spotlight {
-    filter: url('#chromaticAberration') blur(3px);
+    filter: blur(3px);
     --impect-radius: 192;
     --dist-factor: calc((192 - min(var(--to-dist), 192)) / 192);
     left: calc(var(--to-x) * 1px);