@banou/media-player 0.4.2 → 0.4.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@banou/media-player",
-  "version": "0.4.2",
+  "version": "0.4.4",
   "description": "",
   "type": "module",
   "main": "build/index.js",
@@ -39,7 +39,7 @@
     "@xstate/react": "^5.0.1",
     "ass-compiler": "^0.1.15",
     "jassub": "^1.7.18",
-    "libav-wasm": "^0.5.4",
+    "libav-wasm": "^0.5.5",
     "osra": "^0.1.2",
     "p-queue": "^7.3.4",
     "react": "^19.0.0",

package/src/components/control-bar.tsx

@@ -1,7 +1,8 @@
-import { RefObject, useCallback, useContext, useEffect, useRef, useState } from 'react'
+import { RefObject, useCallback, useContext, useEffect, useState } from 'react'
 import { css } from '@emotion/react'
 import { Maximize, Minimize, Pause, Play, RotateCcw } from 'react-feather'
 
+import { linearToLogVolume, logToLinearVolume } from '../utils/volume-utils'
 import { MediaMachineContext } from '../state-machines'
 import { TooltipDisplay } from './tooltip-display'
 import { togglePlay } from '../utils/actor-utils'
@@ -13,14 +14,13 @@ import pictureInPicture from '../assets/picture-in-picture.svg'
 import SettingsAction from './settings'
 import colors from '../utils/colors'
 import Sound from './sound'
-import { linearToLogVolume, logToLinearVolume } from '../utils/volume-utils'
 
 const style = css`
   position: absolute;
   bottom: 0;
   width: 100%;
 
-  background: linear-gradient(0deg,#000 0,rgba(0,0,0,.4) 60%,transparent);
+  background: linear-gradient(0deg, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.45) 20%, rgba(0,0,0,0.3) 40%, rgba(0,0,0,0.15) 70%, transparent 100%);
   transition: opacity 0.1s cubic-bezier(.4,0,1,1);
 
   .actions {

package/src/state-machines/subtitles.ts

@@ -4,7 +4,7 @@ import type { ASS_Event, JassubOptions } from 'jassub'
 import JASSUB from 'jassub'
 import { Attachment, SubtitleFragment } from 'libav-wasm/build/worker'
 
-import { parse } from 'ass-compiler'
+import { parse, stringify } from 'ass-compiler'
 import { fromAsyncCallback } from './utils'
 
 type SubtitlesEvents =
@@ -148,7 +148,9 @@ export default fromAsyncCallback<SubtitlesEvents, SubtitlesInput, SubtitlesEmitt
       if (!newSubtitleStreams) {
         throw new Error('newSubtitleStreams is undefined')
       }
-      jassubInstance.setTrack(newSubtitleStreams.header.content)
+      const parsedHeader = parse(newSubtitleStreams.header.content)
+      const modifiedHeader = { ...parsedHeader, info: { ...parsedHeader.info, ScaledBorderAndShadow: 'no' as const } }
+      jassubInstance.setTrack(stringify(modifiedHeader))
       jassubInstance.setCurrentTime(video.paused, video.currentTime, video.playbackRate)
       for (const styleIndex in newSubtitleStreams.header.parsed.styles) {
         const style = newSubtitleStreams.header.parsed.styles.style[Number(styleIndex)]
@@ -209,10 +211,12 @@ export default fromAsyncCallback<SubtitlesEvents, SubtitlesInput, SubtitlesEmitt
           appendedSubtitleParts.push(subtitlePart)
         } else if (subtitlePart.type === 'header') {
           if (!jassubInstance) {
+            const parsedHeader = parse(subtitlePart.content)
+            const modifiedHeader = { ...parsedHeader, info: { ...parsedHeader.info, ScaledBorderAndShadow: 'no' as const } }
             jassubInstance = new JASSUB({
               video,
               canvas,
-              subContent: subtitlePart.content,
+              subContent: stringify(modifiedHeader),
               workerUrl: subtitlesRendererOptions.workerUrl,
               modernWasmUrl: subtitlesRendererOptions.wasmUrl,
               fonts: attachments.filter(Boolean).map(([filename, data]) => data),