feat: video deband [no worky]

common/jsconfig.json

@@ -6,7 +6,13 @@
     },
     "checkJs": true,
     "target": "ESNext",
-    "moduleResolution": "node",
+    "moduleResolution": "bundler",
+    "verbatimModuleSyntax": true,
+    "isolatedModules": true,
+    "resolveJsonModule": true,
+    "sourceMap": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
     "module": "ESNext",
     "types": ["./types.d.ts"],
     "allowSyntheticDefaultImports": true

common/modules/util.js

@@ -147,6 +147,7 @@ export const defaults = {
   playerAutoplay: true,
   playerPause: true,
   playerAutocomplete: true,
+  playerDeband: false,
   rssQuality: '1080',
   rssFeedsNew: [['New Releases', 'SubsPlease']],
   rssAutoplay: true,

common/package.json

@@ -20,6 +20,7 @@
     "svelte-loader": "^3.1.9",
     "svelte-miniplayer": "^1.0.5",
     "svelte-sonner": "^0.3.6",
+    "video-deband": "^1.0.5",
     "webpack-merge": "^5.10.0"
   }
 }

common/types.d.ts

@@ -1,3 +1,5 @@
+import type { SvelteComponentTyped } from 'svelte'
+
 export {}
 
 type Track = {
@@ -31,3 +33,7 @@ declare global {
     audioTracks: Track[]
   }
 }
+
+declare module '*.svelte' {
+  export default SvelteComponentTyped
+}

common/views/Player/Player.svelte

@@ -10,6 +10,7 @@
   import { getChaptersAniSkip } from '@/modules/anime.js'
   import Seekbar from 'perfect-seekbar'
   import { click } from '@/modules/click.js'
+  import VideoDeband from 'video-deband'
 
   import { w2gEmitter, state } from '../WatchTogether/WatchTogether.svelte'
   import Keybinds, { loadWithDefaults, condition } from 'svelte-keybinds'
@@ -132,6 +133,10 @@
   function clearLoadInterval () {
     clearInterval(loadInterval)
   }
+  /**
+   * @type {VideoDeband}
+   */
+  let deband
 
   async function handleCurrent (file) {
     if (file) {
@@ -147,11 +152,20 @@
       currentSkippable = null
       completed = false
       if (subs) subs.destroy()
+      if (deband) {
+        deband.destroy()
+        deband.canvas.remove()
+      }
       current = file
       emit('current', current)
       src = file.url
       client.send('current', file)
       subs = new Subtitles(video, files, current, handleHeaders)
+      if ($settings.playerDeband) {
+        deband = new VideoDeband(video)
+        deband.canvas.classList.add('deband-canvas')
+        video.parentNode.append(deband.canvas)
+      }
       video.load()
     }
   }
@@ -1080,6 +1094,18 @@
 </div>
 
 <style>
+  :global(.deband-canvas) {
+    max-width: 100%;
+    max-height: 100%;
+    width: 100% !important;
+    height: 100% !important;
+    top: 50%;
+    left: 50%;
+    position: absolute;
+    transform: translate(-50%, -50%);
+    pointer-events: none;
+    object-fit: contain;
+  }
   .fitWidth {
     object-fit: cover;
   }

common/views/Settings/PlayerSettings.svelte

@@ -125,3 +125,9 @@
     <label for='player-autocomplete'>{settings.playerAutocomplete ? 'On' : 'Off'}</label>
   </div>
 </SettingCard>
+<SettingCard title='EXPERIMENTAL: Video Deband' description='Applies the next playing video. This however will likely lead to colors being rendered incorrectly. Not recomended.'>
+  <div class='custom-switch'>
+    <input type='checkbox' id='player-deband' bind:checked={settings.playerDeband} />
+    <label for='player-deband'>{settings.playerDeband ? 'On' : 'Off'}</label>
+  </div>
+</SettingCard>

electron/package.json

@@ -1,6 +1,6 @@
 {
   "name": "Miru",
-  "version": "4.5.6",
+  "version": "4.5.7",
   "private": true,
   "author": "ThaUnknown_ <[email protected]>",
   "description": "Stream anime torrents, real-time with no waiting for downloads.",