style(player): print width 120

auioc · Oct 8, 2023 · 47450aa · 47450aa
1 parent 7e0c6a5
commit 47450aa
Show file tree

Hide file tree

Showing 6 changed files with 68 additions and 230 deletions.
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -1,6 +1,7 @@
 {
     "cSpell.words": ["danmaku", "danmakuload", "stime"],
     "conventionalCommits.scopes": ["repo", "utils", "player", "pages", "start"],
+    "prettier.printWidth": 120,
     "markdownlint.config": {
         "MD001": false,
         "MD033": false,

diff --git a/public/index.html b/public/index.html
@@ -2,10 +2,7 @@
 <html>
     <head>
         <meta charset="utf-8" />
-        <meta
-            name="viewport"
-            content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no"
-        />
+        <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" />
         <link rel="stylesheet" href="player.css" />
         <link rel="stylesheet" href="lib/CommentCoreLibrary.css" />
     </head>
@@ -15,11 +12,7 @@
                 <tr>
                     <td><label for="video-file">Video: </label></td>
                     <td>
-                        <input
-                            id="video-file"
-                            type="file"
-                            accept="video/mp4,.flv"
-                        />
+                        <input id="video-file" type="file" accept="video/mp4,.flv" />
                     </td>
                     <td>
                         (Last: <span id="last-video-file"> <i>None</i> </span>)
@@ -34,11 +27,7 @@
                 <tr>
                     <td>Time Offset:</td>
                     <td>
-                        <input
-                            id="danmaku-time-offset"
-                            type="number"
-                            value="0"
-                        />
+                        <input id="danmaku-time-offset" type="number" value="0" />
                     </td>
                 </tr>
                 <tr>
@@ -69,8 +58,7 @@
                 return document.getElementById(id);
             }
             (function () {
-                const lastVideoFile =
-                    window.localStorage.getItem('lastVideoFile');
+                const lastVideoFile = window.localStorage.getItem('lastVideoFile');
                 if (lastVideoFile) {
                     id('last-video-file').textContent = lastVideoFile;
                 }
@@ -82,25 +70,14 @@
                 window.localStorage.setItem('lastVideoFile', video.name);
 
                 const danmaku = id('danmaku-file').files[0];
-                const danmakuUrl = danmaku
-                    ? URL.createObjectURL(danmaku)
-                    : null;
+                const danmakuUrl = danmaku ? URL.createObjectURL(danmaku) : null;
 
-                const player = new Player(
-                    id('player'),
-                    __player_metadata__,
-                    video.name,
-                    videoUrl,
-                    danmakuUrl,
-                    {
-                        autoPlay: id('auto-play').checked,
-                        fullscreen: id('fullscreen').checked,
-                        muted: id('muted').checked,
-                        danmakuTimeOffset: parseFloat(
-                            id('danmaku-time-offset').value
-                        ),
-                    }
-                );
+                const player = new Player(id('player'), __player_metadata__, video.name, videoUrl, danmakuUrl, {
+                    autoPlay: id('auto-play').checked,
+                    fullscreen: id('fullscreen').checked,
+                    muted: id('muted').checked,
+                    danmakuTimeOffset: parseFloat(id('danmaku-time-offset').value),
+                });
                 window.player = player;
                 id('start-panel').remove();
                 id('player').removeAttribute('style');

diff --git a/src/player.main.ts b/src/player.main.ts
@@ -53,9 +53,7 @@ class Player {
         {
             this.options.autoPlay ? this.play() : this.pause();
             this.options.muted ? this.mute() : this.unmute();
-            this.options.fullscreen
-                ? this.requestFullscreen()
-                : this.setContainerData('fullscreen', false);
+            this.options.fullscreen ? this.requestFullscreen() : this.setContainerData('fullscreen', false);
         }
         this.constructed = true;
         if (this.options.autoPlay) this.toast('Autoplay');
@@ -71,15 +69,9 @@ class Player {
             this.setContainerData('paused', this.video.paused);
             this.overHour = this.video.duration >= 60 * 60;
         });
-        this.onVideoEvent('play', () =>
-            this.setContainerData('paused', this.video.paused)
-        );
-        this.onVideoEvent('pause', () =>
-            this.setContainerData('paused', this.video.paused)
-        );
-        this.onVideoEvent('volumechange', () =>
-            this.setContainerData('muted', this.video.muted)
-        );
+        this.onVideoEvent('play', () => this.setContainerData('paused', this.video.paused));
+        this.onVideoEvent('pause', () => this.setContainerData('paused', this.video.paused));
+        this.onVideoEvent('volumechange', () => this.setContainerData('muted', this.video.muted));
         this.onPlayerEvent('fullscreenchange', () => {
             const fullscreen = document.fullscreenElement === this.container;
             this.setContainerData('fullscreen', fullscreen ? true : false);
@@ -118,9 +110,7 @@ class Player {
         this.container.addEventListener(type, listener);
     }
     firePlayerEvent(type: string, detail?: any) {
-        this.container.dispatchEvent(
-            new CustomEvent(type, detail ? { detail: detail } : null)
-        );
+        this.container.dispatchEvent(new CustomEvent(type, detail ? { detail: detail } : null));
     }
     toast(html: string) {
         if (this.constructed) {
@@ -129,11 +119,7 @@ class Player {
     }
     seek(time: number) {
         const fixedTime = clamp(time, 0, this.video.duration);
-        this.toast(
-            `Seek: ${fTime(fixedTime, this.overHour)} / ${fTime(
-                this.video.duration
-            )}`
-        );
+        this.toast(`Seek: ${fTime(fixedTime, this.overHour)} / ${fTime(this.video.duration)}`);
         this.video.currentTime = fixedTime;
     }
     seekPercent(percent: number) {

diff --git a/src/player.metadata.ts b/src/player.metadata.ts
@@ -1,18 +1,12 @@
 type MetaEventTypes = 'selfEvent' | 'playerEvent' | 'videoEvent';
 
-type MetaEvents<F extends AnyFunction> =
-    | EventListenerMap<F>
-    | (() => EventListenerMap<F>);
+type MetaEvents<F extends AnyFunction> = EventListenerMap<F> | (() => EventListenerMap<F>);
 
 type ElementMetaEvents<T extends HTMLTagNames> = MetaEvents<
     (player: Player, element: HTMLElementTagNameMap[T]) => void
 >;
 type ElementVideoMetaEvents<T extends HTMLTagNames> = MetaEvents<
-    (
-        player: Player,
-        element: HTMLElementTagNameMap[T],
-        video: HTMLVideoElement
-    ) => void
+    (player: Player, element: HTMLElementTagNameMap[T], video: HTMLVideoElement) => void
 >;
 
 function bindMetadataEvents( // TODO improve
@@ -112,10 +106,7 @@ class EDC<T extends HTMLTagNames> {
             {
                 selfEvent: [element, () => [player, element]],
                 playerEvent: [player.container, () => [player, element]],
-                videoEvent: [
-                    player.video,
-                    () => [player, element, player.video],
-                ],
+                videoEvent: [player.video, () => [player, element, player.video]],
             }
         );
         for (const childBulder of this._childrenBuilders) {