@tiwz/react-video-player 2.0.0 → 2.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +69 -50
- package/dist/index.js +1 -1
- package/dist/index.mjs +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -7,15 +7,18 @@ A modern, fully-featured, and mobile-friendly React video player component with
|
|
|
7
7
|
## ✨ Features
|
|
8
8
|
|
|
9
9
|
- 🎮 Custom video controls (no native controls UI)
|
|
10
|
-
- 📱 Mobile optimized (double-tap to seek ±10s)
|
|
10
|
+
- 📱 Mobile optimized (double-tap to seek ±10s, touch to toggle controls)
|
|
11
11
|
- ⌨️ Keyboard shortcuts support (desktop)
|
|
12
12
|
- 🖥 Fullscreen & Picture-in-Picture (PiP)
|
|
13
13
|
- 🔊 Volume control + mute toggle
|
|
14
|
+
- 🎯 Multi-quality source switching (resumes from same timestamp)
|
|
15
|
+
- ⚡ Playback speed control (0.25x – 4x)
|
|
14
16
|
- 🕒 Seek bar with buffered progress indicator
|
|
15
17
|
- 🚀 Smooth UX with throttled interactions
|
|
16
|
-
- 💡 Auto
|
|
18
|
+
- 💡 Auto-hide controls on inactivity
|
|
17
19
|
- 🧭 Landscape lock on fullscreen (mobile)
|
|
18
|
-
-
|
|
20
|
+
- 🔄 Loading indicator on buffering
|
|
21
|
+
- 🧩 Fully typed with TypeScript
|
|
19
22
|
|
|
20
23
|
---
|
|
21
24
|
|
|
@@ -24,15 +27,11 @@ A modern, fully-featured, and mobile-friendly React video player component with
|
|
|
24
27
|
```bash
|
|
25
28
|
npm install @tiwz/react-video-player
|
|
26
29
|
```
|
|
27
|
-
|
|
28
30
|
or
|
|
29
|
-
|
|
30
31
|
```bash
|
|
31
32
|
bun add @tiwz/react-video-player
|
|
32
33
|
```
|
|
33
|
-
|
|
34
34
|
or
|
|
35
|
-
|
|
36
35
|
```bash
|
|
37
36
|
yarn add @tiwz/react-video-player
|
|
38
37
|
```
|
|
@@ -43,7 +42,7 @@ yarn add @tiwz/react-video-player
|
|
|
43
42
|
|
|
44
43
|
```tsx
|
|
45
44
|
import { VideoPlayer } from '@tiwz/react-video-player'
|
|
46
|
-
import '@tiwz/react-video-player/
|
|
45
|
+
import '@tiwz/react-video-player/style.css'
|
|
47
46
|
|
|
48
47
|
export default function App() {
|
|
49
48
|
return (
|
|
@@ -57,19 +56,41 @@ export default function App() {
|
|
|
57
56
|
|
|
58
57
|
---
|
|
59
58
|
|
|
60
|
-
## Video Types
|
|
61
|
-
```ts
|
|
62
|
-
type VideoTypes = 'video/mp4' | 'video/ogg' | 'video/webm' |'application/vnd.apple.mpegurl' | 'application/x-mpegURL'
|
|
63
|
-
```
|
|
64
|
-
|
|
65
59
|
## 🧩 Props
|
|
60
|
+
|
|
66
61
|
### VideoPlayerProps
|
|
67
62
|
|
|
68
63
|
| Prop | Type | Required | Description |
|
|
69
|
-
|
|
70
|
-
| `
|
|
71
|
-
| `title` | `string` | ❌ | Video title
|
|
72
|
-
| `
|
|
64
|
+
|------|------|----------|-------------|
|
|
65
|
+
| `source` | `string \| VideoSourceQuality[]` | ✅ | Single URL or array of quality sources |
|
|
66
|
+
| `title` | `string` | ❌ | Video title shown in top bar |
|
|
67
|
+
| `poster` | `string` | ❌ | Thumbnail image shown before playback |
|
|
68
|
+
|
|
69
|
+
### VideoSourceQuality
|
|
70
|
+
|
|
71
|
+
```ts
|
|
72
|
+
type VideoSourceQuality = {
|
|
73
|
+
src: string // Video URL
|
|
74
|
+
quality: number // e.g. 1080, 720, 480. Use 0 for Auto
|
|
75
|
+
}
|
|
76
|
+
```
|
|
77
|
+
|
|
78
|
+
**Example with multiple qualities:**
|
|
79
|
+
|
|
80
|
+
```tsx
|
|
81
|
+
<VideoPlayer
|
|
82
|
+
title="My Video"
|
|
83
|
+
poster="/thumbnail.jpg"
|
|
84
|
+
source={[
|
|
85
|
+
{ src: '/video-1080p.mp4', quality: 1080 },
|
|
86
|
+
{ src: '/video-720p.mp4', quality: 720 },
|
|
87
|
+
{ src: '/video-480p.mp4', quality: 480 },
|
|
88
|
+
{ src: '/video-auto.mp4', quality: 0 }, // Auto
|
|
89
|
+
]}
|
|
90
|
+
/>
|
|
91
|
+
```
|
|
92
|
+
|
|
93
|
+
> Quality sources are automatically sorted highest to lowest. Switching quality resumes from the same timestamp.
|
|
73
94
|
|
|
74
95
|
---
|
|
75
96
|
|
|
@@ -78,22 +99,21 @@ type VideoTypes = 'video/mp4' | 'video/ogg' | 'video/webm' |'application/vnd.app
|
|
|
78
99
|
### Desktop
|
|
79
100
|
|
|
80
101
|
| Action | Control |
|
|
81
|
-
|
|
82
|
-
| Play / Pause | Click center
|
|
83
|
-
| Seek backward |
|
|
84
|
-
| Seek forward |
|
|
85
|
-
|
|
|
86
|
-
| Picture-in-Picture | P |
|
|
87
|
-
|
|
88
|
-
---
|
|
102
|
+
|--------|---------|
|
|
103
|
+
| Play / Pause | Click center or `Space` |
|
|
104
|
+
| Seek backward 10s | `←` Arrow |
|
|
105
|
+
| Seek forward 10s | `→` Arrow |
|
|
106
|
+
| Toggle fullscreen | `F` |
|
|
107
|
+
| Toggle Picture-in-Picture | `P` |
|
|
89
108
|
|
|
90
109
|
### Mobile
|
|
91
110
|
|
|
92
111
|
| Gesture | Action |
|
|
93
|
-
|
|
94
|
-
| Single
|
|
95
|
-
| Double
|
|
96
|
-
| Double
|
|
112
|
+
|---------|--------|
|
|
113
|
+
| Single tap | Show / hide controls |
|
|
114
|
+
| Double tap left | Seek backward 10s |
|
|
115
|
+
| Double tap right | Seek forward 10s |
|
|
116
|
+
| Consecutive taps | Stacked seek (±20s, ±30s, ...) |
|
|
97
117
|
|
|
98
118
|
---
|
|
99
119
|
|
|
@@ -101,49 +121,48 @@ type VideoTypes = 'video/mp4' | 'video/ogg' | 'video/webm' |'application/vnd.app
|
|
|
101
121
|
|
|
102
122
|
Supports all modern browsers including:
|
|
103
123
|
|
|
104
|
-
- Chrome
|
|
105
|
-
-
|
|
106
|
-
-
|
|
107
|
-
- Safari
|
|
108
|
-
- Mobile Safari
|
|
109
|
-
- Chrome Android
|
|
124
|
+
- Chrome / Edge / Firefox
|
|
125
|
+
- Safari (desktop)
|
|
126
|
+
- Mobile Safari / Chrome Android
|
|
110
127
|
|
|
111
|
-
Includes automatic **orientation lock** for landscape videos on mobile.
|
|
128
|
+
Includes automatic **orientation lock** to landscape for landscape videos on mobile.
|
|
112
129
|
|
|
113
130
|
---
|
|
114
131
|
|
|
115
132
|
## 📺 Picture-in-Picture (PiP)
|
|
116
133
|
|
|
117
|
-
Automatically enables PiP when supported by the browser.
|
|
118
|
-
|
|
119
134
|
Works on:
|
|
120
135
|
|
|
121
|
-
- Chrome
|
|
122
|
-
- Edge
|
|
136
|
+
- Chrome / Edge
|
|
123
137
|
- Safari (desktop & iPadOS)
|
|
124
138
|
|
|
139
|
+
> Automatically resumes playback when entering PiP if the video is paused.
|
|
140
|
+
|
|
125
141
|
---
|
|
126
142
|
|
|
127
143
|
## ⚡ Performance
|
|
128
144
|
|
|
129
|
-
- Throttled mouse movement
|
|
130
|
-
- Optimized re-rendering
|
|
131
|
-
-
|
|
145
|
+
- Throttled mouse movement (200ms)
|
|
146
|
+
- Optimized re-rendering via `useReducer` + `useRef`
|
|
147
|
+
- Stale closure prevention with refs for hot-path callbacks
|
|
148
|
+
- Smart seek stacking with auto-reset
|
|
132
149
|
- Minimal event listeners
|
|
133
150
|
|
|
134
151
|
---
|
|
135
152
|
|
|
136
153
|
## 🧪 Browser Support
|
|
137
154
|
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
155
|
+
| Browser | Fullscreen | PiP | Orientation Lock |
|
|
156
|
+
|---------|-----------|-----|-----------------|
|
|
157
|
+
| Chrome | ✅ | ✅ | ✅ |
|
|
158
|
+
| Edge | ✅ | ✅ | ✅ |
|
|
159
|
+
| Firefox | ✅ | ✅ | ⚠️ Partial |
|
|
160
|
+
| Safari (desktop) | ✅ | ✅ | — |
|
|
161
|
+
| Mobile Safari | ✅ | ✅ (iPadOS) | ✅ |
|
|
162
|
+
| Chrome Android | ✅ | ✅ | ✅ |
|
|
144
163
|
|
|
145
164
|
---
|
|
146
165
|
|
|
147
166
|
## 📄 License
|
|
148
167
|
|
|
149
|
-
MIT © tiwz
|
|
168
|
+
MIT © 2026 tiwz
|
package/dist/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var e=require("react/jsx-runtime"),t=require("react");function n(e,t){switch(t.type){case"SET_VOLUME":return{...e,volume:t.volume};case"SET_PAUSED":return{...e,isPaused:t.isPaused};case"SET_DURATION":return{...e,durationTime:t.duration};case"SET_CURRENT_TIME":return{...e,currentTime:t.time};case"SET_PLAYBACK_SPEED":return{...e,playbackSpeed:t.speed};default:return e}}function r(e,t){switch(t.type){case"SET_CONTROLS_VISIBLE":return{...e,isControlsVisible:t.visible};case"SET_SETTING_PANEL":return{...e,settingPanel:t.name};case"SET_HOVER_TIME":return{...e,hoverTime:{x:t.x,time:t.time}};case"SET_FULLSCREEN":return{...e,isFullscreen:t.active};case"SET_LOADING":return{...e,isLoading:t.loading};case"SET_SETTING":return{...e,isSettingsVisible:t.active};case"SET_MUTED":return{...e,isMuted:t.muted};case"ADD_SEEK":return{...e,seekStack:t.amount>0?e.seekStack<0?t.amount:e.seekStack+t.amount:e.seekStack>0?t.amount:e.seekStack+t.amount};case"RESET_SEEK":return{...e,seekStack:0};case"SET_SEEK_MODE":return{...e,isSeekMode:t.isActive};default:return e}}const a=["play","pause"];function s({name:t,style:n,bigger:r}){return"loading"===t?e.jsxs("svg",{version:"1.1",id:"L1",xmlns:"http://www.w3.org/2000/svg",xmlnsXlink:"http://www.w3.org/1999/xlink",x:"0px",y:"0px",viewBox:"0 0 100 100",enableBackground:"new 0 0 100 100",xmlSpace:"preserve",children:[e.jsx("title",{children:"loading"}),e.jsx("circle",{fill:"none",stroke:"currentColor",strokeWidth:"6",strokeMiterlimit:"15",strokeDasharray:"14.2472,14.2472",cx:"50",cy:"50",r:"47",children:e.jsx("animateTransform",{attributeName:"transform",attributeType:"XML",type:"rotate",dur:"5s",from:"0 50 50",to:"360 50 50",repeatCount:"indefinite"})}),e.jsx("circle",{fill:"none",stroke:"currentColor",strokeWidth:"1",strokeMiterlimit:"10",strokeDasharray:"10,10",cx:"50",cy:"50",r:"39",children:e.jsx("animateTransform",{attributeName:"transform",attributeType:"XML",type:"rotate",dur:"5s",from:"0 50 50",to:"-360 50 50",repeatCount:"indefinite"})}),e.jsxs("g",{fill:"currentColor",children:[e.jsx("rect",{x:"30",y:"35",width:"5",height:"30",children:e.jsx("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 5 ; 0 -5; 0 5",repeatCount:"indefinite",begin:"0.1"})}),e.jsx("rect",{x:"40",y:"35",width:"5",height:"30",children:e.jsx("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 5 ; 0 -5; 0 5",repeatCount:"indefinite",begin:"0.2"})}),e.jsx("rect",{x:"50",y:"35",width:"5",height:"30",children:e.jsx("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 5 ; 0 -5; 0 5",repeatCount:"indefinite",begin:"0.3"})}),e.jsx("rect",{x:"60",y:"35",width:"5",height:"30",children:e.jsx("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 5 ; 0 -5; 0 5",repeatCount:"indefinite",begin:"0.4"})}),e.jsx("rect",{x:"70",y:"35",width:"5",height:"30",children:e.jsx("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 5 ; 0 -5; 0 5",repeatCount:"indefinite",begin:"0.5"})})]})]}):e.jsxs("svg",{fill:a.includes(t)?"currentColor":"none",strokeWidth:1.5,width:r?56:24,viewBox:"0 0 24 24",stroke:"currentColor",style:n,xmlns:"http://www.w3.org/2000/svg",children:[e.jsx("title",{children:t}),"play"===t&&e.jsx("path",{fillRule:"evenodd",d:"M4.5 5.653c0-1.427 1.529-2.33 2.779-1.643l11.54 6.347c1.295.712 1.295 2.573 0 3.286L7.28 19.99c-1.25.687-2.779-.217-2.779-1.643V5.653Z",clipRule:"evenodd"}),"pause"===t&&e.jsx("path",{fillRule:"evenodd",d:"M6.75 5.25a.75.75 0 0 1 .75-.75H9a.75.75 0 0 1 .75.75v13.5a.75.75 0 0 1-.75.75H7.5a.75.75 0 0 1-.75-.75V5.25Zm7.5 0A.75.75 0 0 1 15 4.5h1.5a.75.75 0 0 1 .75.75v13.5a.75.75 0 0 1-.75.75H15a.75.75 0 0 1-.75-.75V5.25Z",clipRule:"evenodd"}),"setting"===t&&e.jsxs(e.Fragment,{children:[e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.325.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 0 1 1.37.49l1.296 2.247a1.125 1.125 0 0 1-.26 1.431l-1.003.827c-.293.241-.438.613-.43.992a7.723 7.723 0 0 1 0 .255c-.008.378.137.75.43.991l1.004.827c.424.35.534.955.26 1.43l-1.298 2.247a1.125 1.125 0 0 1-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.47 6.47 0 0 1-.22.128c-.331.183-.581.495-.644.869l-.213 1.281c-.09.543-.56.94-1.11.94h-2.594c-.55 0-1.019-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 0 1-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 0 1-1.369-.49l-1.297-2.247a1.125 1.125 0 0 1 .26-1.431l1.004-.827c.292-.24.437-.613.43-.991a6.932 6.932 0 0 1 0-.255c.007-.38-.138-.751-.43-.992l-1.004-.827a1.125 1.125 0 0 1-.26-1.43l1.297-2.247a1.125 1.125 0 0 1 1.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.086.22-.128.332-.183.582-.495.644-.869l.214-1.28Z"}),e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"})]}),"fullscreen"===t&&e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M3.75 3.75v4.5m0-4.5h4.5m-4.5 0L9 9M3.75 20.25v-4.5m0 4.5h4.5m-4.5 0L9 15M20.25 3.75h-4.5m4.5 0v4.5m0-4.5L15 9m5.25 11.25h-4.5m4.5 0v-4.5m0 4.5L15 15"}),"exit-fullscreen"===t&&e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M9 9V4.5M9 9H4.5M9 9 3.75 3.75M9 15v4.5M9 15H4.5M9 15l-5.25 5.25M15 9h4.5M15 9V4.5M15 9l5.25-5.25M15 15h4.5M15 15v4.5m0-4.5 5.25 5.25"}),"mute"===t&&e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M19.114 5.636a9 9 0 0 1 0 12.728M16.463 8.288a5.25 5.25 0 0 1 0 7.424M6.75 8.25l4.72-4.72a.75.75 0 0 1 1.28.53v15.88a.75.75 0 0 1-1.28.53l-4.72-4.72H4.51c-.88 0-1.704-.507-1.938-1.354A9.009 9.009 0 0 1 2.25 12c0-.83.112-1.633.322-2.396C2.806 8.756 3.63 8.25 4.51 8.25H6.75Z"}),"unmute"===t&&e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M17.25 9.75 19.5 12m0 0 2.25 2.25M19.5 12l2.25-2.25M19.5 12l-2.25 2.25m-10.5-6 4.72-4.72a.75.75 0 0 1 1.28.53v15.88a.75.75 0 0 1-1.28.53l-4.72-4.72H4.51c-.88 0-1.704-.507-1.938-1.354A9.009 9.009 0 0 1 2.25 12c0-.83.112-1.633.322-2.396C2.806 8.756 3.63 8.25 4.51 8.25H6.75Z"}),"picture-in-picture"===t&&e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M16.5 8.25V6a2.25 2.25 0 0 0-2.25-2.25H6A2.25 2.25 0 0 0 3.75 6v8.25A2.25 2.25 0 0 0 6 16.5h2.25m8.25-8.25H18a2.25 2.25 0 0 1 2.25 2.25V18A2.25 2.25 0 0 1 18 20.25h-7.5A2.25 2.25 0 0 1 8.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 0 0-2.25 2.25v6"}),"quality"===t&&e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M10.5 6h9.75M10.5 6a1.5 1.5 0 1 1-3 0m3 0a1.5 1.5 0 1 0-3 0M3.75 6H7.5m3 12h9.75m-9.75 0a1.5 1.5 0 0 1-3 0m3 0a1.5 1.5 0 0 0-3 0m-3.75 0H7.5m9-6h3.75m-3.75 0a1.5 1.5 0 0 1-3 0m3 0a1.5 1.5 0 0 0-3 0m-9.75 0h9.75"}),"playback"===t&&e.jsxs(e.Fragment,{children:[e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"}),e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M15.91 11.672a.375.375 0 0 1 0 .656l-5.603 3.113a.375.375 0 0 1-.557-.328V8.887c0-.286.307-.466.557-.327l5.603 3.112Z"})]}),"plus"===t&&e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M12 4.5v15m7.5-7.5h-15"}),"minus"===t&&e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M5 12h14"})]})}var i="style-module_PlayerButton__3pLMQ",l="style-module_PlayerDesktop__ccJTe",o="style-module_PlayerWrapper__37Xpc",u="style-module_PlayerVideo__NkoX3",c="style-module_PlayerControls__IyMmM",d="style-module_PlayerShown__uVIfu",m="style-module_PlayerPanelTop__x02Dp",y="style-module_PlayerTitle__yTvNu",p="style-module_PlayerPanelCenter__y8jR0",_="style-module_PlayerSeekArea__z-qY-",h="style-module_PlayerPanelBottom__bdhhD",T="style-module_PlayerCurrentTime__IaolO",k="style-module_PlayerDurationTime__uCgjW",E="style-module_PlayerVolume__r7ll8",x="style-module_PlayerVolumeZone__7LHeR",v="style-module_PlayerRangeVolume__8XBa1",S="style-module_PlayerSeekTime__SEypx",b="style-module_PlayerHoverTime__iBu1D",g="style-module_PlayerRangeTime__QVr8d",f="style-module_PlayerRangeThumb__J5IcV",j="style-module_PlayerLoading__PBiIH",P="style-module_PlayerCenter__qLy3K",C="style-module_PlayerSetting__BhP11",M="style-module_PlayerSettingPanel__tZE0z",N="style-module_PlayerSettingPanelSpeed__ABgXy",w="style-module_PlayerSettingPanelQuality__4UQId",L="style-module_PlayerSettingList__KEYZR",R="style-module_PlayerSettingDisplay__-yFqd",I="style-module_PlayerButtonCursor__4PyXl",A="style-module_PlayerSpeedShow__u1NIt",V="style-module_PlayerPlayback__EZYH2",F="style-module_PlayerRangeSpeed__ElauL",D="style-module_PlayerCheckbox__At22K",q="style-module_PlayerQualityList__rvIel",O="style-module_seekLeft__9AAFX",H="style-module_seekRight__RMywZ";function B(e){if(void 0===e||Number.isNaN(e)||e<0)return"00:00";const t=Math.floor(e),n=t%60;return`${Math.floor(t/60).toString().padStart(2,"0")}:${n.toString().padStart(2,"0")}`}function U(e){return 0===e?"Auto":e<1e3?`${e}p`:e/1e3+"k"}exports.VideoPlayer=function({title:a,poster:Z,source:K}){const G=t.useRef(0),X=t.useRef(null),$=t.useRef(null),W=t.useRef(null),Q=t.useRef("string"==typeof K?[{src:K,quality:0}]:[...K].sort((e,t)=>t.quality-e.quality)),z=t.useMemo(()=>/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobi/i.test(navigator.userAgent),[]),[Y,J]=t.useReducer(n,{volume:1,isPaused:!0,currentTime:0,durationTime:0,playbackSpeed:1}),[ee,te]=t.useReducer(r,{seekStack:0,isMuted:!1,isLoading:!0,isSeekMode:!1,settingPanel:null,isFullscreen:!1,isControlsVisible:!0,isSettingsVisible:!1,hoverTime:{x:null,time:0}}),[ne,re]=t.useState(0),ae=t.useCallback(async e=>{if($.current)try{return await e($.current)}catch(e){return console.error("Video operation failed:",e),null}return null},[]),se=t.useRef(Y.currentTime),ie=t.useRef(ee.isControlsVisible);t.useEffect(()=>{se.current=Y.currentTime,ie.current=ee.isControlsVisible},[Y.currentTime,ee.isControlsVisible]);const le=t.useCallback(e=>{if(!ie.current)return;const t=e.currentTarget.currentTime;(Math.abs(t-se.current)>1||Math.floor(t)!==Math.floor(se.current))&&J({type:"SET_CURRENT_TIME",time:t})},[]),oe=t.useCallback(()=>{ae(async e=>{e.paused?await e.play():e.pause()})},[ae]),ue=t.useCallback(async()=>{(function(){const e=document;return!!(e.fullscreenEnabled||e.webkitFullscreenEnabled||e.mozFullScreenEnabled||e.msFullscreenEnabled)})()&&X.current&&(document.fullscreenElement?await async function(){const e=document,t=e.exitFullscreen||e.webkitExitFullscreen||e.mozCancelFullScreen||e.msExitFullscreen;if(t)try{return await t.call(e),!0}catch(e){return console.error("Failed to exit fullscreen:",e),!1}return!1}():await async function(e){const t=e,n=t.requestFullscreen||t.webkitRequestFullscreen||t.webkitEnterFullscreen||t.mozRequestFullScreen||t.msRequestFullscreen;if(n)try{return await n.call(t),!0}catch(e){return console.error("Failed to enter fullscreen:",e),!1}return!1}(X.current))},[]),ce=t.useCallback(()=>{ae(e=>{e.muted||0!==e.volume?(e.muted=!e.muted,te({type:"SET_MUTED",muted:e.muted})):(e.volume=1,e.muted=!1,te({type:"SET_MUTED",muted:!1}))})},[]),de=t.useCallback(async()=>{ae(async e=>{"pictureInPictureEnabled"in document&&"requestPictureInPicture"in HTMLVideoElement.prototype&&(document.pictureInPictureElement===e?await async function(e){if(!1===e.disablePictureInPicture&&"pictureInPictureElement"in document&&document.pictureInPictureElement)try{return await document.exitPictureInPicture(),!0}catch(e){return console.error("Failed to exit Picture-in-Picture:",e),!1}return!1}(e):await async function(e){if(!("pictureInPictureEnabled"in document)||"function"!=typeof e.requestPictureInPicture)return console.error("Picture-in-Picture is not supported"),null;try{return e.paused&&await e.play().catch(()=>{console.warn("Auto-play was prevented")}),await e.requestPictureInPicture()}catch(e){return console.error("Failed to enter Picture-in-Picture:",e),null}}(e))})},[]),me=t.useCallback(()=>{te({type:"SET_CONTROLS_VISIBLE",visible:!1}),W.current&&(clearTimeout(W.current),W.current=null)},[]),ye=t.useCallback((e=2500)=>{W.current&&clearTimeout(W.current),te({type:"SET_CONTROLS_VISIBLE",visible:!0}),W.current=setTimeout(me,e)},[me]),pe=t.useCallback(e=>{ee.isControlsVisible&&ae(t=>{t.currentTime=e,J({type:"SET_CURRENT_TIME",time:e}),ye()})},[ae,ee.isControlsVisible,ye]),_e=t.useMemo(()=>function(e,t){let n=null,r=0;return function(...a){const s=Date.now();r?(n&&clearTimeout(n),n=setTimeout(()=>{s-r>=t&&(e.apply(this,a),r=s)},t-(s-r))):(e.apply(this,a),r=s)}}(()=>{ye()},200),[ye]),he=t.useCallback(()=>{_e()},[_e]),Te=t.useCallback(()=>{me()},[me]),ke=t.useCallback(e=>{const t=e.currentTarget.getBoundingClientRect(),n=e.clientX-t.left,r=Math.min(Math.max(n/t.width,0),1)*Y.durationTime;te({type:"SET_HOVER_TIME",x:n,time:r})},[Y.durationTime]),Ee=t.useCallback(()=>{te({type:"SET_HOVER_TIME",x:null,time:0})},[]),xe=t.useCallback(e=>{J({type:"SET_VOLUME",volume:e.currentTarget.volume})},[]),ve=t.useCallback(e=>{ae(t=>{t.volume=+e.currentTarget.value})},[]),Se=t.useCallback(e=>{te({type:"SET_LOADING",loading:e})},[]),be=t.useCallback(e=>{ae(t=>{G.current=t.currentTime;const n=Q.current.findIndex(t=>t.quality===e);n<0||(Se(!0),re(n))})},[ae,Se]);t.useEffect(()=>{const e=$.current;if(!e||0===G.current)return;const t=()=>{e.currentTime=G.current,e.play()};return e.addEventListener("loadedmetadata",t,{once:!0}),()=>e.removeEventListener("loadedmetadata",t)},[ne]);const ge=t.useCallback(e=>{J({type:"SET_PLAYBACK_SPEED",speed:e.currentTarget.playbackRate})},[]),fe=t.useCallback(e=>{ae(t=>{t.playbackRate=e})},[]),je=t.useCallback(()=>{te({type:"SET_SETTING",active:!ee.isSettingsVisible})},[ee.isSettingsVisible]),Pe=t.useMemo(()=>{if(!$.current||!Y.durationTime)return 0;const e=$.current.buffered;if(0===e.length)return 0;let t=0;for(let n=0;n<e.length;n++)if(e.start(n)<=Y.currentTime&&e.end(n)>Y.currentTime){t=e.end(n);break}return t/Y.durationTime*100},[Y.currentTime,Y.durationTime]),Ce=t.useMemo(()=>Y.durationTime?Y.currentTime/Y.durationTime*100:0,[Y.currentTime,Y.durationTime]),Me=t.useRef(null),Ne=t.useCallback(()=>{Me.current&&clearTimeout(Me.current),te({type:"SET_SEEK_MODE",isActive:!0}),Me.current=setTimeout(()=>{te({type:"SET_SEEK_MODE",isActive:!1}),te({type:"RESET_SEEK"}),Me.current=null},1200)},[]),we=t.useCallback(e=>{ae(t=>{const n="+"===e?10:-10;t.currentTime+=n,te({type:"ADD_SEEK",amount:n}),Ne()})},[ae,Ne]),Le=t.useRef(0),Re=t.useCallback(e=>{if(!z)return;const t=Date.now(),n=t-Le.current;(n>0&&n<300||ee.isSeekMode)&&(ee.isSeekMode||te({type:"SET_SEEK_MODE",isActive:!0}),we(e)),Le.current=t},[ee.isSeekMode,we]),Ie=t.useCallback(e=>{if(!z)return;if(e.target.closest("button, input, [data-no-toggle]"))return ye();ee.isControlsVisible?me():ye()},[z,ee.isControlsVisible,ye,me]),Ae=ee.isControlsVisible,Ve=ee.isMuted?0:Y.volume;return t.useEffect(()=>{if(z)return;const e=e=>{switch([" ","f","p","ArrowLeft","ArrowRight"].includes(e.key)&&(e.preventDefault(),ye()),e.key){case" ":oe();break;case"f":ue();break;case"p":de();break;case"ArrowLeft":we("-");break;case"ArrowRight":we("+")}};return window.addEventListener("keydown",e),()=>{window.removeEventListener("keydown",e)}},[oe,ue,de,ye,we]),t.useEffect(()=>{const e=async()=>{const e=document.fullscreenElement===X.current;te({type:"SET_FULLSCREEN",active:e}),$.current&&async function(e,t){const n=e.videoWidth>e.videoHeight;if("undefined"!=typeof window&&window.screen&&"orientation"in window.screen&&window.screen.orientation&&"lock"in window.screen.orientation&&"function"==typeof window.screen.orientation.lock)try{t&&n?await window.screen.orientation.lock("landscape"):window.screen.orientation.unlock()}catch(e){console.warn("Failed to lock orientation:",e)}}($.current,e)};return document.addEventListener("fullscreenchange",e),()=>{document.removeEventListener("fullscreenchange",e),W.current&&clearTimeout(W.current)}},[]),e.jsxs("div",{ref:X,onMouseMove:z?void 0:he,onMouseLeave:z?void 0:Te,onTouchEnd:z?Ie:void 0,className:o+(z?"":` ${l}`),children:[e.jsx("video",{ref:$,poster:Z,controls:!1,onContextMenu:()=>!1,className:u,src:Q.current[ne].src,onWaiting:()=>Se(!0),onPlaying:()=>Se(!1),onCanPlay:()=>Se(!1),onLoadedData:()=>Se(!1),onTimeUpdate:le,onVolumeChange:xe,onRateChange:ge,onPlay:()=>J({type:"SET_PAUSED",isPaused:!1}),onPause:()=>J({type:"SET_PAUSED",isPaused:!0}),onDurationChange:e=>J({type:"SET_DURATION",duration:e.currentTarget.duration}),onLoadedMetadata:e=>J({type:"SET_DURATION",duration:e.currentTarget.duration})}),e.jsxs("div",{className:c+(Ae?` ${d}`:""),children:[e.jsxs("div",{className:m,children:[e.jsx("article",{className:y,children:a}),e.jsx("button",{type:"button",className:i,onClick:e=>{e.stopPropagation(),je()},onFocus:e=>e.currentTarget.blur(),children:e.jsx(s,{name:"setting"})})]}),e.jsxs("div",{className:p,onClick:z?void 0:oe,children:[e.jsx("div",{className:_,"data-no-toggle":!0,onTouchEnd:()=>Re("-"),children:ee.seekStack<0&&e.jsx("div",{inert:!0,className:O,children:ee.seekStack.toString()},ee.seekStack)}),e.jsx("div",{className:_,"data-no-toggle":!0,onTouchEnd:()=>Re("+"),children:ee.seekStack>0&&e.jsx("div",{inert:!0,className:H,children:`+${ee.seekStack.toString()}`},ee.seekStack)})]}),e.jsxs("div",{className:h,children:[e.jsx("div",{className:T,children:B(Y.currentTime)}),e.jsxs("div",{className:S,children:[e.jsx("div",{className:b,style:{display:null===ee.hoverTime.x?"none":void 0,"--player-hover-position":`${ee.hoverTime.x}px`},children:B(ee.hoverTime.time)}),e.jsx("input",{step:"any",type:"range",onFocus:e=>e.currentTarget.blur(),max:Y.durationTime,value:Y.currentTime,className:g,onMouseMove:ke,onMouseLeave:Ee,onChange:e=>pe(+e.currentTarget.value),style:{"--player-buffer-position":`${Pe}%`,"--player-time-position":`${Ce}%`}}),e.jsx("div",{className:f,style:{"--player-thumb-position":`${Ce}%`}})]}),e.jsx("div",{className:k,children:B(Y.durationTime)}),e.jsxs("div",{className:E,children:[e.jsx("button",{type:"button",className:i,onClick:e=>{e.stopPropagation(),ce()},onFocus:e=>e.currentTarget.blur(),children:e.jsx(s,{name:ee.isMuted||0===Y.volume?"unmute":"mute"})}),e.jsxs("div",{className:x,children:[e.jsx("input",{style:{"--player-buffer-position":100*Ve+"%","--player-time-position":100*Ve+"%"},onFocus:e=>e.currentTarget.blur(),onChange:ve,className:v,value:Ve,type:"range",step:"any",max:1}),e.jsx("div",{className:f,style:{"--player-thumb-position":100*Ve+"%"}})]})]}),e.jsx("button",{type:"button",className:i,onClick:e=>{e.stopPropagation(),de()},onFocus:e=>e.currentTarget.blur(),children:e.jsx(s,{name:"picture-in-picture"})}),e.jsx("button",{type:"button",className:i,onClick:e=>{e.stopPropagation(),ue()},onFocus:e=>e.currentTarget.blur(),children:e.jsx(s,{name:ee.isFullscreen?"exit-fullscreen":"fullscreen"})})]}),ee.isLoading?e.jsx("div",{className:j,children:e.jsx(s,{name:"loading",style:{width:"100%"}})}):e.jsx("div",{className:P,"data-no-toggle":!0,onClick:oe,children:e.jsx(s,{name:Y.isPaused?"play":"pause",bigger:!0})})]}),e.jsxs("div",{className:C,style:{display:ee.isSettingsVisible?void 0:"none"},onClick:()=>{te({type:"SET_SETTING",active:!1}),te({type:"SET_SETTING_PANEL",name:null})},onMouseMove:e=>e.stopPropagation(),children:[e.jsxs("div",{className:M,onClick:e=>e.stopPropagation(),style:{display:null===ee.settingPanel?void 0:"none"},children:[e.jsxs("div",{className:L,children:[e.jsx(s,{name:"quality",style:{stroke:"#000"}}),e.jsxs("div",{className:R,onClick:()=>te({type:"SET_SETTING_PANEL",name:"quality"}),children:[e.jsx("span",{children:"Video quality"}),e.jsx("span",{children:U(Q.current[ne].quality)})]})]}),e.jsxs("div",{className:L,children:[e.jsx(s,{name:"playback",style:{stroke:"#000"}}),e.jsxs("div",{className:R,onClick:()=>te({type:"SET_SETTING_PANEL",name:"speed"}),children:[e.jsx("span",{children:"Playback speed"}),e.jsxs("span",{children:[Y.playbackSpeed,"x"]})]})]})]}),e.jsxs("div",{className:N,onClick:e=>e.stopPropagation(),style:{display:"speed"===ee.settingPanel?void 0:"none"},children:[e.jsxs("div",{className:A,children:["Speed ",Y.playbackSpeed,"x"]}),e.jsxs("div",{className:V,children:[e.jsx("button",{type:"button",className:I,onClick:()=>fe(.25===Y.playbackSpeed?.25:Y.playbackSpeed-.25),onFocus:e=>e.currentTarget.blur(),children:e.jsx(s,{name:"minus"})}),e.jsx("input",{max:4,min:.25,step:.25,type:"range",onFocus:e=>e.currentTarget.blur(),style:{"--spped-thumb-position":(Y.playbackSpeed-.25)/3.75*100+"%"},className:F,onChange:e=>fe(+e.currentTarget.value),value:Y.playbackSpeed}),e.jsx("button",{type:"button",className:I,onClick:()=>fe(4===Y.playbackSpeed?4:Y.playbackSpeed+.25),onFocus:e=>e.currentTarget.blur(),children:e.jsx(s,{name:"plus"})})]})]}),e.jsxs("div",{className:w,onClick:e=>e.stopPropagation(),style:{display:"quality"===ee.settingPanel?void 0:"none"},children:[e.jsxs("div",{className:A,children:["Quality ",U(Q.current[ne].quality)]}),e.jsx("div",{className:q,children:Q.current.map(t=>e.jsxs("div",{className:L,onClick:()=>{be(t.quality),te({type:"SET_SETTING",active:!1}),te({type:"SET_SETTING_PANEL",name:null})},children:[e.jsx("input",{type:"checkbox",readOnly:!0,onFocus:e=>e.currentTarget.blur(),className:D,checked:Q.current[ne].quality===t.quality}),U(t.quality)]},t.quality))})]})]})]})};
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),t=require("react");function n(e,t){switch(t.type){case"SET_VOLUME":return{...e,volume:t.volume};case"SET_PAUSED":return{...e,isPaused:t.isPaused};case"SET_DURATION":return{...e,durationTime:t.duration};case"SET_CURRENT_TIME":return{...e,currentTime:t.time};case"SET_PLAYBACK_SPEED":return{...e,playbackSpeed:t.speed};default:return e}}function r(e,t){switch(t.type){case"SET_CONTROLS_VISIBLE":return{...e,isControlsVisible:t.visible};case"SET_SETTING_PANEL":return{...e,settingPanel:t.name};case"SET_HOVER_TIME":return{...e,hoverTime:{x:t.x,time:t.time}};case"SET_FULLSCREEN":return{...e,isFullscreen:t.active};case"SET_LOADING":return{...e,isLoading:t.loading};case"SET_SETTING":return{...e,isSettingsVisible:t.active};case"SET_MUTED":return{...e,isMuted:t.muted};case"ADD_SEEK":return{...e,seekStack:t.amount>0?e.seekStack<0?t.amount:e.seekStack+t.amount:e.seekStack>0?t.amount:e.seekStack+t.amount};case"RESET_SEEK":return{...e,seekStack:0};case"SET_SEEK_MODE":return{...e,isSeekMode:t.isActive};default:return e}}const a=["play","pause"];function s({name:t,style:n,bigger:r}){return"loading"===t?e.jsxs("svg",{version:"1.1",id:"L1",xmlns:"http://www.w3.org/2000/svg",xmlnsXlink:"http://www.w3.org/1999/xlink",x:"0px",y:"0px",viewBox:"0 0 100 100",enableBackground:"new 0 0 100 100",xmlSpace:"preserve",children:[e.jsx("title",{children:"loading"}),e.jsx("circle",{fill:"none",stroke:"currentColor",strokeWidth:"6",strokeMiterlimit:"15",strokeDasharray:"14.2472,14.2472",cx:"50",cy:"50",r:"47",children:e.jsx("animateTransform",{attributeName:"transform",attributeType:"XML",type:"rotate",dur:"5s",from:"0 50 50",to:"360 50 50",repeatCount:"indefinite"})}),e.jsx("circle",{fill:"none",stroke:"currentColor",strokeWidth:"1",strokeMiterlimit:"10",strokeDasharray:"10,10",cx:"50",cy:"50",r:"39",children:e.jsx("animateTransform",{attributeName:"transform",attributeType:"XML",type:"rotate",dur:"5s",from:"0 50 50",to:"-360 50 50",repeatCount:"indefinite"})}),e.jsxs("g",{fill:"currentColor",children:[e.jsx("rect",{x:"30",y:"35",width:"5",height:"30",children:e.jsx("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 5 ; 0 -5; 0 5",repeatCount:"indefinite",begin:"0.1"})}),e.jsx("rect",{x:"40",y:"35",width:"5",height:"30",children:e.jsx("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 5 ; 0 -5; 0 5",repeatCount:"indefinite",begin:"0.2"})}),e.jsx("rect",{x:"50",y:"35",width:"5",height:"30",children:e.jsx("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 5 ; 0 -5; 0 5",repeatCount:"indefinite",begin:"0.3"})}),e.jsx("rect",{x:"60",y:"35",width:"5",height:"30",children:e.jsx("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 5 ; 0 -5; 0 5",repeatCount:"indefinite",begin:"0.4"})}),e.jsx("rect",{x:"70",y:"35",width:"5",height:"30",children:e.jsx("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 5 ; 0 -5; 0 5",repeatCount:"indefinite",begin:"0.5"})})]})]}):e.jsxs("svg",{fill:a.includes(t)?"currentColor":"none",strokeWidth:1.5,width:r?56:24,viewBox:"0 0 24 24",stroke:"currentColor",style:n,xmlns:"http://www.w3.org/2000/svg",children:[e.jsx("title",{children:t}),"play"===t&&e.jsx("path",{fillRule:"evenodd",d:"M4.5 5.653c0-1.427 1.529-2.33 2.779-1.643l11.54 6.347c1.295.712 1.295 2.573 0 3.286L7.28 19.99c-1.25.687-2.779-.217-2.779-1.643V5.653Z",clipRule:"evenodd"}),"pause"===t&&e.jsx("path",{fillRule:"evenodd",d:"M6.75 5.25a.75.75 0 0 1 .75-.75H9a.75.75 0 0 1 .75.75v13.5a.75.75 0 0 1-.75.75H7.5a.75.75 0 0 1-.75-.75V5.25Zm7.5 0A.75.75 0 0 1 15 4.5h1.5a.75.75 0 0 1 .75.75v13.5a.75.75 0 0 1-.75.75H15a.75.75 0 0 1-.75-.75V5.25Z",clipRule:"evenodd"}),"setting"===t&&e.jsxs(e.Fragment,{children:[e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.325.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 0 1 1.37.49l1.296 2.247a1.125 1.125 0 0 1-.26 1.431l-1.003.827c-.293.241-.438.613-.43.992a7.723 7.723 0 0 1 0 .255c-.008.378.137.75.43.991l1.004.827c.424.35.534.955.26 1.43l-1.298 2.247a1.125 1.125 0 0 1-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.47 6.47 0 0 1-.22.128c-.331.183-.581.495-.644.869l-.213 1.281c-.09.543-.56.94-1.11.94h-2.594c-.55 0-1.019-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 0 1-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 0 1-1.369-.49l-1.297-2.247a1.125 1.125 0 0 1 .26-1.431l1.004-.827c.292-.24.437-.613.43-.991a6.932 6.932 0 0 1 0-.255c.007-.38-.138-.751-.43-.992l-1.004-.827a1.125 1.125 0 0 1-.26-1.43l1.297-2.247a1.125 1.125 0 0 1 1.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.086.22-.128.332-.183.582-.495.644-.869l.214-1.28Z"}),e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"})]}),"fullscreen"===t&&e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M3.75 3.75v4.5m0-4.5h4.5m-4.5 0L9 9M3.75 20.25v-4.5m0 4.5h4.5m-4.5 0L9 15M20.25 3.75h-4.5m4.5 0v4.5m0-4.5L15 9m5.25 11.25h-4.5m4.5 0v-4.5m0 4.5L15 15"}),"exit-fullscreen"===t&&e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M9 9V4.5M9 9H4.5M9 9 3.75 3.75M9 15v4.5M9 15H4.5M9 15l-5.25 5.25M15 9h4.5M15 9V4.5M15 9l5.25-5.25M15 15h4.5M15 15v4.5m0-4.5 5.25 5.25"}),"mute"===t&&e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M19.114 5.636a9 9 0 0 1 0 12.728M16.463 8.288a5.25 5.25 0 0 1 0 7.424M6.75 8.25l4.72-4.72a.75.75 0 0 1 1.28.53v15.88a.75.75 0 0 1-1.28.53l-4.72-4.72H4.51c-.88 0-1.704-.507-1.938-1.354A9.009 9.009 0 0 1 2.25 12c0-.83.112-1.633.322-2.396C2.806 8.756 3.63 8.25 4.51 8.25H6.75Z"}),"unmute"===t&&e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M17.25 9.75 19.5 12m0 0 2.25 2.25M19.5 12l2.25-2.25M19.5 12l-2.25 2.25m-10.5-6 4.72-4.72a.75.75 0 0 1 1.28.53v15.88a.75.75 0 0 1-1.28.53l-4.72-4.72H4.51c-.88 0-1.704-.507-1.938-1.354A9.009 9.009 0 0 1 2.25 12c0-.83.112-1.633.322-2.396C2.806 8.756 3.63 8.25 4.51 8.25H6.75Z"}),"picture-in-picture"===t&&e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M16.5 8.25V6a2.25 2.25 0 0 0-2.25-2.25H6A2.25 2.25 0 0 0 3.75 6v8.25A2.25 2.25 0 0 0 6 16.5h2.25m8.25-8.25H18a2.25 2.25 0 0 1 2.25 2.25V18A2.25 2.25 0 0 1 18 20.25h-7.5A2.25 2.25 0 0 1 8.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 0 0-2.25 2.25v6"}),"quality"===t&&e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M10.5 6h9.75M10.5 6a1.5 1.5 0 1 1-3 0m3 0a1.5 1.5 0 1 0-3 0M3.75 6H7.5m3 12h9.75m-9.75 0a1.5 1.5 0 0 1-3 0m3 0a1.5 1.5 0 0 0-3 0m-3.75 0H7.5m9-6h3.75m-3.75 0a1.5 1.5 0 0 1-3 0m3 0a1.5 1.5 0 0 0-3 0m-9.75 0h9.75"}),"playback"===t&&e.jsxs(e.Fragment,{children:[e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"}),e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M15.91 11.672a.375.375 0 0 1 0 .656l-5.603 3.113a.375.375 0 0 1-.557-.328V8.887c0-.286.307-.466.557-.327l5.603 3.112Z"})]}),"plus"===t&&e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M12 4.5v15m7.5-7.5h-15"}),"minus"===t&&e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M5 12h14"})]})}var i="style-module_PlayerButton__3pLMQ",l="style-module_PlayerDesktop__ccJTe",o="style-module_PlayerWrapper__37Xpc",u="style-module_PlayerVideo__NkoX3",c="style-module_PlayerControls__IyMmM",d="style-module_PlayerShown__uVIfu",m="style-module_PlayerPanelTop__x02Dp",y="style-module_PlayerTitle__yTvNu",p="style-module_PlayerPanelCenter__y8jR0",_="style-module_PlayerSeekArea__z-qY-",h="style-module_PlayerPanelBottom__bdhhD",T="style-module_PlayerCurrentTime__IaolO",k="style-module_PlayerDurationTime__uCgjW",E="style-module_PlayerVolume__r7ll8",x="style-module_PlayerVolumeZone__7LHeR",v="style-module_PlayerRangeVolume__8XBa1",S="style-module_PlayerSeekTime__SEypx",b="style-module_PlayerHoverTime__iBu1D",g="style-module_PlayerRangeTime__QVr8d",f="style-module_PlayerRangeThumb__J5IcV",j="style-module_PlayerLoading__PBiIH",P="style-module_PlayerCenter__qLy3K",C="style-module_PlayerSetting__BhP11",M="style-module_PlayerSettingPanel__tZE0z",N="style-module_PlayerSettingPanelSpeed__ABgXy",w="style-module_PlayerSettingPanelQuality__4UQId",L="style-module_PlayerSettingList__KEYZR",R="style-module_PlayerSettingDisplay__-yFqd",A="style-module_PlayerButtonCursor__4PyXl",I="style-module_PlayerSpeedShow__u1NIt",V="style-module_PlayerPlayback__EZYH2",F="style-module_PlayerRangeSpeed__ElauL",D="style-module_PlayerCheckbox__At22K",q="style-module_PlayerQualityList__rvIel",O="style-module_seekLeft__9AAFX",H="style-module_seekRight__RMywZ";function B(e){if(void 0===e||Number.isNaN(e)||e<0)return"00:00";const t=Math.floor(e),n=t%60;return`${Math.floor(t/60).toString().padStart(2,"0")}:${n.toString().padStart(2,"0")}`}function U(e){return 0===e?"Auto":e<1e3?`${e}p`:e/1e3+"k"}function Z(){return"pictureInPictureEnabled"in document&&"requestPictureInPicture"in HTMLVideoElement.prototype}exports.VideoPlayer=function({title:a,poster:K,source:G}){const X=t.useRef(0),$=t.useRef(null),W=t.useRef(null),Q=t.useRef(null),z=t.useRef("string"==typeof G?[{src:G,quality:0}]:[...G].sort((e,t)=>t.quality-e.quality)),Y=t.useMemo(()=>/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobi/i.test(navigator.userAgent),[]),[J,ee]=t.useReducer(n,{volume:1,isPaused:!0,currentTime:0,durationTime:0,playbackSpeed:1}),[te,ne]=t.useReducer(r,{seekStack:0,isMuted:!1,isLoading:!0,isSeekMode:!1,settingPanel:null,isFullscreen:!1,isControlsVisible:!0,isSettingsVisible:!1,hoverTime:{x:null,time:0}}),[re,ae]=t.useState(0),se=t.useCallback(async e=>{if(W.current)try{return await e(W.current)}catch(e){return console.error("Video operation failed:",e),null}return null},[]),ie=t.useRef(J.currentTime),le=t.useRef(te.isControlsVisible);t.useEffect(()=>{ie.current=J.currentTime,le.current=te.isControlsVisible},[J.currentTime,te.isControlsVisible]);const oe=t.useCallback(e=>{if(!le.current)return;const t=e.currentTarget.currentTime;(Math.abs(t-ie.current)>1||Math.floor(t)!==Math.floor(ie.current))&&ee({type:"SET_CURRENT_TIME",time:t})},[]),ue=t.useCallback(()=>{se(async e=>{e.paused?await e.play():e.pause()})},[se]),ce=t.useCallback(async()=>{(function(){const e=document;return!!(e.fullscreenEnabled||e.webkitFullscreenEnabled||e.mozFullScreenEnabled||e.msFullscreenEnabled)})()&&$.current&&(document.fullscreenElement?await async function(){const e=document,t=e.exitFullscreen||e.webkitExitFullscreen||e.mozCancelFullScreen||e.msExitFullscreen;if(t)try{return await t.call(e),!0}catch(e){return console.error("Failed to exit fullscreen:",e),!1}return!1}():await async function(e){const t=e,n=t.requestFullscreen||t.webkitRequestFullscreen||t.webkitEnterFullscreen||t.mozRequestFullScreen||t.msRequestFullscreen;if(n)try{return await n.call(t),!0}catch(e){return console.error("Failed to enter fullscreen:",e),!1}return!1}($.current))},[]),de=t.useCallback(()=>{se(e=>{e.muted||0!==e.volume?(e.muted=!e.muted,ne({type:"SET_MUTED",muted:e.muted})):(e.volume=1,e.muted=!1,ne({type:"SET_MUTED",muted:!1}))})},[]),me=t.useCallback(async()=>{se(async e=>{Z()&&(document.pictureInPictureElement===e?await async function(){if("pictureInPictureElement"in document&&document.pictureInPictureElement)try{return await document.exitPictureInPicture(),!0}catch(e){return console.error("Failed to exit Picture-in-Picture:",e),!1}return!1}():await async function(e){if(!Z())return console.error("Picture-in-Picture is not supported"),null;try{return e.paused&&await e.play().catch(()=>{console.warn("Auto-play was prevented")}),await e.requestPictureInPicture()}catch(e){return console.error("Failed to enter Picture-in-Picture:",e),null}}(e))})},[]),ye=t.useCallback(()=>{ne({type:"SET_CONTROLS_VISIBLE",visible:!1}),Q.current&&(clearTimeout(Q.current),Q.current=null)},[]),pe=t.useCallback((e=2500)=>{Q.current&&clearTimeout(Q.current),ne({type:"SET_CONTROLS_VISIBLE",visible:!0}),Q.current=setTimeout(ye,e)},[ye]),_e=t.useCallback(e=>{te.isControlsVisible&&se(t=>{t.currentTime=e,ee({type:"SET_CURRENT_TIME",time:e}),pe()})},[se,te.isControlsVisible,pe]),he=t.useMemo(()=>function(e,t){let n=null,r=0;return function(...a){const s=Date.now();r?(n&&clearTimeout(n),n=setTimeout(()=>{s-r>=t&&(e.apply(this,a),r=s)},t-(s-r))):(e.apply(this,a),r=s)}}(()=>{pe()},200),[pe]),Te=t.useCallback(()=>{he()},[he]),ke=t.useCallback(()=>{ye()},[ye]),Ee=t.useCallback(e=>{const t=e.currentTarget.getBoundingClientRect(),n=e.clientX-t.left,r=Math.min(Math.max(n/t.width,0),1)*J.durationTime;ne({type:"SET_HOVER_TIME",x:n,time:r})},[J.durationTime]),xe=t.useCallback(()=>{ne({type:"SET_HOVER_TIME",x:null,time:0})},[]),ve=t.useCallback(e=>{ee({type:"SET_VOLUME",volume:e.currentTarget.volume})},[]),Se=t.useCallback(e=>{se(t=>{t.volume=+e.currentTarget.value})},[]),be=t.useCallback(e=>{ne({type:"SET_LOADING",loading:e})},[]),ge=t.useCallback(e=>{se(t=>{X.current=t.currentTime;const n=z.current.findIndex(t=>t.quality===e);n<0||(be(!0),ae(n))})},[se,be]);t.useEffect(()=>{const e=W.current;if(!e||0===X.current)return;const t=()=>{e.currentTime=X.current,e.play()};return e.addEventListener("loadedmetadata",t,{once:!0}),()=>e.removeEventListener("loadedmetadata",t)},[re]);const fe=t.useCallback(e=>{ee({type:"SET_PLAYBACK_SPEED",speed:e.currentTarget.playbackRate})},[]),je=t.useCallback(e=>{se(t=>{t.playbackRate=e})},[]),Pe=t.useCallback(()=>{ne({type:"SET_SETTING",active:!te.isSettingsVisible})},[te.isSettingsVisible]),Ce=t.useMemo(()=>{if(!W.current||!J.durationTime)return 0;const e=W.current.buffered;if(0===e.length)return 0;let t=0;for(let n=0;n<e.length;n++)if(e.start(n)<=J.currentTime&&e.end(n)>J.currentTime){t=e.end(n);break}return t/J.durationTime*100},[J.currentTime,J.durationTime]),Me=t.useMemo(()=>J.durationTime?J.currentTime/J.durationTime*100:0,[J.currentTime,J.durationTime]),Ne=t.useRef(null),we=t.useCallback(()=>{Ne.current&&clearTimeout(Ne.current),ne({type:"SET_SEEK_MODE",isActive:!0}),Ne.current=setTimeout(()=>{ne({type:"SET_SEEK_MODE",isActive:!1}),ne({type:"RESET_SEEK"}),Ne.current=null},1200)},[]),Le=t.useCallback(e=>{se(t=>{const n="+"===e?10:-10;t.currentTime+=n,ne({type:"ADD_SEEK",amount:n}),we()})},[se,we]),Re=t.useRef(0),Ae=t.useCallback(e=>{if(!Y)return;const t=Date.now(),n=t-Re.current;(n>0&&n<300||te.isSeekMode)&&(te.isSeekMode||ne({type:"SET_SEEK_MODE",isActive:!0}),Le(e)),Re.current=t},[te.isSeekMode,Le]),Ie=t.useCallback(e=>{if(!Y)return;if(e.target.closest("button, input, [data-no-toggle]"))return pe();te.isControlsVisible?ye():pe()},[Y,te.isControlsVisible,pe,ye]),Ve=te.isControlsVisible,Fe=te.isMuted?0:J.volume;return t.useEffect(()=>{if(Y)return;const e=e=>{switch([" ","f","p","ArrowLeft","ArrowRight"].includes(e.key)&&(e.preventDefault(),pe()),e.key){case" ":ue();break;case"f":ce();break;case"p":me();break;case"ArrowLeft":Le("-");break;case"ArrowRight":Le("+")}};return window.addEventListener("keydown",e),()=>{window.removeEventListener("keydown",e)}},[ue,ce,me,pe,Le]),t.useEffect(()=>{const e=async()=>{const e=document.fullscreenElement===$.current;ne({type:"SET_FULLSCREEN",active:e}),W.current&&async function(e,t){const n=e.videoWidth>e.videoHeight;if("undefined"!=typeof window&&window.screen&&"orientation"in window.screen&&window.screen.orientation&&"lock"in window.screen.orientation&&"function"==typeof window.screen.orientation.lock)try{t&&n?await window.screen.orientation.lock("landscape"):window.screen.orientation.unlock()}catch(e){console.warn("Failed to lock orientation:",e)}}(W.current,e)};return document.addEventListener("fullscreenchange",e),()=>{document.removeEventListener("fullscreenchange",e),Q.current&&clearTimeout(Q.current)}},[]),e.jsxs("div",{ref:$,onMouseMove:Y?void 0:Te,onMouseLeave:Y?void 0:ke,onTouchEnd:Y?Ie:void 0,className:o+(Y?"":` ${l}`),children:[e.jsx("video",{ref:W,poster:K,controls:!1,onContextMenu:()=>!1,className:u,src:z.current[re].src,onWaiting:()=>be(!0),onPlaying:()=>be(!1),onCanPlay:()=>be(!1),onLoadedData:()=>be(!1),onTimeUpdate:oe,onVolumeChange:ve,onRateChange:fe,onPlay:()=>ee({type:"SET_PAUSED",isPaused:!1}),onPause:()=>ee({type:"SET_PAUSED",isPaused:!0}),onDurationChange:e=>ee({type:"SET_DURATION",duration:e.currentTarget.duration}),onLoadedMetadata:e=>ee({type:"SET_DURATION",duration:e.currentTarget.duration})}),e.jsxs("div",{className:c+(Ve?` ${d}`:""),children:[e.jsxs("div",{className:m,children:[e.jsx("article",{className:y,children:a}),e.jsx("button",{type:"button",className:i,onClick:e=>{e.stopPropagation(),Pe()},onFocus:e=>e.currentTarget.blur(),children:e.jsx(s,{name:"setting"})})]}),e.jsxs("div",{className:p,onClick:Y?void 0:ue,children:[e.jsx("div",{className:_,"data-no-toggle":!0,onTouchEnd:()=>Ae("-"),children:te.seekStack<0&&e.jsx("div",{inert:!0,className:O,children:te.seekStack.toString()},te.seekStack)}),e.jsx("div",{className:_,"data-no-toggle":!0,onTouchEnd:()=>Ae("+"),children:te.seekStack>0&&e.jsx("div",{inert:!0,className:H,children:`+${te.seekStack.toString()}`},te.seekStack)})]}),e.jsxs("div",{className:h,children:[e.jsx("div",{className:T,children:B(J.currentTime)}),e.jsxs("div",{className:S,children:[e.jsx("div",{className:b,style:{display:null===te.hoverTime.x?"none":void 0,"--player-hover-position":`${te.hoverTime.x}px`},children:B(te.hoverTime.time)}),e.jsx("input",{step:"any",type:"range",onFocus:e=>e.currentTarget.blur(),max:J.durationTime,value:J.currentTime,className:g,onMouseMove:Ee,onMouseLeave:xe,onChange:e=>_e(+e.currentTarget.value),style:{"--player-buffer-position":`${Ce}%`,"--player-time-position":`${Me}%`}}),e.jsx("div",{className:f,style:{"--player-thumb-position":`${Me}%`}})]}),e.jsx("div",{className:k,children:B(J.durationTime)}),e.jsxs("div",{className:E,children:[e.jsx("button",{type:"button",className:i,onClick:e=>{e.stopPropagation(),de()},onFocus:e=>e.currentTarget.blur(),children:e.jsx(s,{name:te.isMuted||0===J.volume?"unmute":"mute"})}),e.jsxs("div",{className:x,children:[e.jsx("input",{style:{"--player-buffer-position":100*Fe+"%","--player-time-position":100*Fe+"%"},onFocus:e=>e.currentTarget.blur(),onChange:Se,className:v,value:Fe,type:"range",step:"any",max:1}),e.jsx("div",{className:f,style:{"--player-thumb-position":100*Fe+"%"}})]})]}),e.jsx("button",{type:"button",className:i,onClick:e=>{e.stopPropagation(),me()},onFocus:e=>e.currentTarget.blur(),children:e.jsx(s,{name:"picture-in-picture"})}),e.jsx("button",{type:"button",className:i,onClick:e=>{e.stopPropagation(),ce()},onFocus:e=>e.currentTarget.blur(),children:e.jsx(s,{name:te.isFullscreen?"exit-fullscreen":"fullscreen"})})]}),te.isLoading?e.jsx("div",{className:j,children:e.jsx(s,{name:"loading",style:{width:"100%"}})}):e.jsx("div",{className:P,"data-no-toggle":!0,onClick:ue,children:e.jsx(s,{name:J.isPaused?"play":"pause",bigger:!0})})]}),e.jsxs("div",{className:C,style:{display:te.isSettingsVisible?void 0:"none"},onClick:()=>{ne({type:"SET_SETTING",active:!1}),ne({type:"SET_SETTING_PANEL",name:null})},onMouseMove:e=>e.stopPropagation(),children:[e.jsxs("div",{className:M,onClick:e=>e.stopPropagation(),style:{display:null===te.settingPanel?void 0:"none"},children:[e.jsxs("div",{className:L,children:[e.jsx(s,{name:"quality",style:{stroke:"#000"}}),e.jsxs("div",{className:R,onClick:()=>ne({type:"SET_SETTING_PANEL",name:"quality"}),children:[e.jsx("span",{children:"Video quality"}),e.jsx("span",{children:U(z.current[re].quality)})]})]}),e.jsxs("div",{className:L,children:[e.jsx(s,{name:"playback",style:{stroke:"#000"}}),e.jsxs("div",{className:R,onClick:()=>ne({type:"SET_SETTING_PANEL",name:"speed"}),children:[e.jsx("span",{children:"Playback speed"}),e.jsxs("span",{children:[J.playbackSpeed,"x"]})]})]})]}),e.jsxs("div",{className:N,onClick:e=>e.stopPropagation(),style:{display:"speed"===te.settingPanel?void 0:"none"},children:[e.jsxs("div",{className:I,children:["Speed ",J.playbackSpeed,"x"]}),e.jsxs("div",{className:V,children:[e.jsx("button",{type:"button",className:A,onClick:()=>je(.25===J.playbackSpeed?.25:J.playbackSpeed-.25),onFocus:e=>e.currentTarget.blur(),children:e.jsx(s,{name:"minus"})}),e.jsx("input",{max:4,min:.25,step:.25,type:"range",onFocus:e=>e.currentTarget.blur(),style:{"--spped-thumb-position":(J.playbackSpeed-.25)/3.75*100+"%"},className:F,onChange:e=>je(+e.currentTarget.value),value:J.playbackSpeed}),e.jsx("button",{type:"button",className:A,onClick:()=>je(4===J.playbackSpeed?4:J.playbackSpeed+.25),onFocus:e=>e.currentTarget.blur(),children:e.jsx(s,{name:"plus"})})]})]}),e.jsxs("div",{className:w,onClick:e=>e.stopPropagation(),style:{display:"quality"===te.settingPanel?void 0:"none"},children:[e.jsxs("div",{className:I,children:["Quality ",U(z.current[re].quality)]}),e.jsx("div",{className:q,children:z.current.map(t=>e.jsxs("div",{className:L,onClick:()=>{ge(t.quality),ne({type:"SET_SETTING",active:!1}),ne({type:"SET_SETTING_PANEL",name:null})},children:[e.jsx("input",{type:"checkbox",readOnly:!0,onFocus:e=>e.currentTarget.blur(),className:D,checked:z.current[re].quality===t.quality}),U(t.quality)]},t.quality))})]})]})]})};
|
package/dist/index.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as t,Fragment as n}from"react/jsx-runtime";import{useRef as r,useMemo as i,useReducer as a,useState as l,useCallback as o,useEffect as s}from"react";function u(e,t){switch(t.type){case"SET_VOLUME":return{...e,volume:t.volume};case"SET_PAUSED":return{...e,isPaused:t.isPaused};case"SET_DURATION":return{...e,durationTime:t.duration};case"SET_CURRENT_TIME":return{...e,currentTime:t.time};case"SET_PLAYBACK_SPEED":return{...e,playbackSpeed:t.speed};default:return e}}function c(e,t){switch(t.type){case"SET_CONTROLS_VISIBLE":return{...e,isControlsVisible:t.visible};case"SET_SETTING_PANEL":return{...e,settingPanel:t.name};case"SET_HOVER_TIME":return{...e,hoverTime:{x:t.x,time:t.time}};case"SET_FULLSCREEN":return{...e,isFullscreen:t.active};case"SET_LOADING":return{...e,isLoading:t.loading};case"SET_SETTING":return{...e,isSettingsVisible:t.active};case"SET_MUTED":return{...e,isMuted:t.muted};case"ADD_SEEK":return{...e,seekStack:t.amount>0?e.seekStack<0?t.amount:e.seekStack+t.amount:e.seekStack>0?t.amount:e.seekStack+t.amount};case"RESET_SEEK":return{...e,seekStack:0};case"SET_SEEK_MODE":return{...e,isSeekMode:t.isActive};default:return e}}const d=["play","pause"];function m({name:r,style:i,bigger:a}){return e("svg","loading"===r?{version:"1.1",id:"L1",xmlns:"http://www.w3.org/2000/svg",xmlnsXlink:"http://www.w3.org/1999/xlink",x:"0px",y:"0px",viewBox:"0 0 100 100",enableBackground:"new 0 0 100 100",xmlSpace:"preserve",children:[t("title",{children:"loading"}),t("circle",{fill:"none",stroke:"currentColor",strokeWidth:"6",strokeMiterlimit:"15",strokeDasharray:"14.2472,14.2472",cx:"50",cy:"50",r:"47",children:t("animateTransform",{attributeName:"transform",attributeType:"XML",type:"rotate",dur:"5s",from:"0 50 50",to:"360 50 50",repeatCount:"indefinite"})}),t("circle",{fill:"none",stroke:"currentColor",strokeWidth:"1",strokeMiterlimit:"10",strokeDasharray:"10,10",cx:"50",cy:"50",r:"39",children:t("animateTransform",{attributeName:"transform",attributeType:"XML",type:"rotate",dur:"5s",from:"0 50 50",to:"-360 50 50",repeatCount:"indefinite"})}),e("g",{fill:"currentColor",children:[t("rect",{x:"30",y:"35",width:"5",height:"30",children:t("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 5 ; 0 -5; 0 5",repeatCount:"indefinite",begin:"0.1"})}),t("rect",{x:"40",y:"35",width:"5",height:"30",children:t("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 5 ; 0 -5; 0 5",repeatCount:"indefinite",begin:"0.2"})}),t("rect",{x:"50",y:"35",width:"5",height:"30",children:t("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 5 ; 0 -5; 0 5",repeatCount:"indefinite",begin:"0.3"})}),t("rect",{x:"60",y:"35",width:"5",height:"30",children:t("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 5 ; 0 -5; 0 5",repeatCount:"indefinite",begin:"0.4"})}),t("rect",{x:"70",y:"35",width:"5",height:"30",children:t("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 5 ; 0 -5; 0 5",repeatCount:"indefinite",begin:"0.5"})})]})]}:{fill:d.includes(r)?"currentColor":"none",strokeWidth:1.5,width:a?56:24,viewBox:"0 0 24 24",stroke:"currentColor",style:i,xmlns:"http://www.w3.org/2000/svg",children:[t("title",{children:r}),"play"===r&&t("path",{fillRule:"evenodd",d:"M4.5 5.653c0-1.427 1.529-2.33 2.779-1.643l11.54 6.347c1.295.712 1.295 2.573 0 3.286L7.28 19.99c-1.25.687-2.779-.217-2.779-1.643V5.653Z",clipRule:"evenodd"}),"pause"===r&&t("path",{fillRule:"evenodd",d:"M6.75 5.25a.75.75 0 0 1 .75-.75H9a.75.75 0 0 1 .75.75v13.5a.75.75 0 0 1-.75.75H7.5a.75.75 0 0 1-.75-.75V5.25Zm7.5 0A.75.75 0 0 1 15 4.5h1.5a.75.75 0 0 1 .75.75v13.5a.75.75 0 0 1-.75.75H15a.75.75 0 0 1-.75-.75V5.25Z",clipRule:"evenodd"}),"setting"===r&&e(n,{children:[t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.325.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 0 1 1.37.49l1.296 2.247a1.125 1.125 0 0 1-.26 1.431l-1.003.827c-.293.241-.438.613-.43.992a7.723 7.723 0 0 1 0 .255c-.008.378.137.75.43.991l1.004.827c.424.35.534.955.26 1.43l-1.298 2.247a1.125 1.125 0 0 1-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.47 6.47 0 0 1-.22.128c-.331.183-.581.495-.644.869l-.213 1.281c-.09.543-.56.94-1.11.94h-2.594c-.55 0-1.019-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 0 1-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 0 1-1.369-.49l-1.297-2.247a1.125 1.125 0 0 1 .26-1.431l1.004-.827c.292-.24.437-.613.43-.991a6.932 6.932 0 0 1 0-.255c.007-.38-.138-.751-.43-.992l-1.004-.827a1.125 1.125 0 0 1-.26-1.43l1.297-2.247a1.125 1.125 0 0 1 1.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.086.22-.128.332-.183.582-.495.644-.869l.214-1.28Z"}),t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"})]}),"fullscreen"===r&&t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M3.75 3.75v4.5m0-4.5h4.5m-4.5 0L9 9M3.75 20.25v-4.5m0 4.5h4.5m-4.5 0L9 15M20.25 3.75h-4.5m4.5 0v4.5m0-4.5L15 9m5.25 11.25h-4.5m4.5 0v-4.5m0 4.5L15 15"}),"exit-fullscreen"===r&&t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M9 9V4.5M9 9H4.5M9 9 3.75 3.75M9 15v4.5M9 15H4.5M9 15l-5.25 5.25M15 9h4.5M15 9V4.5M15 9l5.25-5.25M15 15h4.5M15 15v4.5m0-4.5 5.25 5.25"}),"mute"===r&&t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M19.114 5.636a9 9 0 0 1 0 12.728M16.463 8.288a5.25 5.25 0 0 1 0 7.424M6.75 8.25l4.72-4.72a.75.75 0 0 1 1.28.53v15.88a.75.75 0 0 1-1.28.53l-4.72-4.72H4.51c-.88 0-1.704-.507-1.938-1.354A9.009 9.009 0 0 1 2.25 12c0-.83.112-1.633.322-2.396C2.806 8.756 3.63 8.25 4.51 8.25H6.75Z"}),"unmute"===r&&t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M17.25 9.75 19.5 12m0 0 2.25 2.25M19.5 12l2.25-2.25M19.5 12l-2.25 2.25m-10.5-6 4.72-4.72a.75.75 0 0 1 1.28.53v15.88a.75.75 0 0 1-1.28.53l-4.72-4.72H4.51c-.88 0-1.704-.507-1.938-1.354A9.009 9.009 0 0 1 2.25 12c0-.83.112-1.633.322-2.396C2.806 8.756 3.63 8.25 4.51 8.25H6.75Z"}),"picture-in-picture"===r&&t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M16.5 8.25V6a2.25 2.25 0 0 0-2.25-2.25H6A2.25 2.25 0 0 0 3.75 6v8.25A2.25 2.25 0 0 0 6 16.5h2.25m8.25-8.25H18a2.25 2.25 0 0 1 2.25 2.25V18A2.25 2.25 0 0 1 18 20.25h-7.5A2.25 2.25 0 0 1 8.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 0 0-2.25 2.25v6"}),"quality"===r&&t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M10.5 6h9.75M10.5 6a1.5 1.5 0 1 1-3 0m3 0a1.5 1.5 0 1 0-3 0M3.75 6H7.5m3 12h9.75m-9.75 0a1.5 1.5 0 0 1-3 0m3 0a1.5 1.5 0 0 0-3 0m-3.75 0H7.5m9-6h3.75m-3.75 0a1.5 1.5 0 0 1-3 0m3 0a1.5 1.5 0 0 0-3 0m-9.75 0h9.75"}),"playback"===r&&e(n,{children:[t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"}),t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M15.91 11.672a.375.375 0 0 1 0 .656l-5.603 3.113a.375.375 0 0 1-.557-.328V8.887c0-.286.307-.466.557-.327l5.603 3.112Z"})]}),"plus"===r&&t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M12 4.5v15m7.5-7.5h-15"}),"minus"===r&&t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M5 12h14"})]})}var y="style-module_PlayerButton__3pLMQ",p="style-module_PlayerDesktop__ccJTe",_="style-module_PlayerWrapper__37Xpc",h="style-module_PlayerVideo__NkoX3",T="style-module_PlayerControls__IyMmM",E="style-module_PlayerShown__uVIfu",v="style-module_PlayerPanelTop__x02Dp",k="style-module_PlayerTitle__yTvNu",S="style-module_PlayerPanelCenter__y8jR0",g="style-module_PlayerSeekArea__z-qY-",b="style-module_PlayerPanelBottom__bdhhD",f="style-module_PlayerCurrentTime__IaolO",P="style-module_PlayerDurationTime__uCgjW",M="style-module_PlayerVolume__r7ll8",N="style-module_PlayerVolumeZone__7LHeR",w="style-module_PlayerRangeVolume__8XBa1",L="style-module_PlayerSeekTime__SEypx",C="style-module_PlayerHoverTime__iBu1D",x="style-module_PlayerRangeTime__QVr8d",I="style-module_PlayerRangeThumb__J5IcV",A="style-module_PlayerLoading__PBiIH",V="style-module_PlayerCenter__qLy3K",R="style-module_PlayerSetting__BhP11",D="style-module_PlayerSettingPanel__tZE0z",F="style-module_PlayerSettingPanelSpeed__ABgXy",q="style-module_PlayerSettingPanelQuality__4UQId",O="style-module_PlayerSettingList__KEYZR",H="style-module_PlayerSettingDisplay__-yFqd",B="style-module_PlayerButtonCursor__4PyXl",U="style-module_PlayerSpeedShow__u1NIt",j="style-module_PlayerPlayback__EZYH2",Z="style-module_PlayerRangeSpeed__ElauL",K="style-module_PlayerCheckbox__At22K",G="style-module_PlayerQualityList__rvIel",X="style-module_seekLeft__9AAFX",$="style-module_seekRight__RMywZ";function W(e){if(void 0===e||Number.isNaN(e)||e<0)return"00:00";const t=Math.floor(e),n=t%60;return`${Math.floor(t/60).toString().padStart(2,"0")}:${n.toString().padStart(2,"0")}`}function Q(e){return 0===e?"Auto":e<1e3?`${e}p`:e/1e3+"k"}function z({title:n,poster:d,source:z}){const Y=r(0),J=r(null),ee=r(null),te=r(null),ne=r("string"==typeof z?[{src:z,quality:0}]:[...z].sort((e,t)=>t.quality-e.quality)),re=i(()=>/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobi/i.test(navigator.userAgent),[]),[ie,ae]=a(u,{volume:1,isPaused:!0,currentTime:0,durationTime:0,playbackSpeed:1}),[le,oe]=a(c,{seekStack:0,isMuted:!1,isLoading:!0,isSeekMode:!1,settingPanel:null,isFullscreen:!1,isControlsVisible:!0,isSettingsVisible:!1,hoverTime:{x:null,time:0}}),[se,ue]=l(0),ce=o(async e=>{if(ee.current)try{return await e(ee.current)}catch(e){return console.error("Video operation failed:",e),null}return null},[]),de=r(ie.currentTime),me=r(le.isControlsVisible);s(()=>{de.current=ie.currentTime,me.current=le.isControlsVisible},[ie.currentTime,le.isControlsVisible]);const ye=o(e=>{if(!me.current)return;const t=e.currentTarget.currentTime;(Math.abs(t-de.current)>1||Math.floor(t)!==Math.floor(de.current))&&ae({type:"SET_CURRENT_TIME",time:t})},[]),pe=o(()=>{ce(async e=>{e.paused?await e.play():e.pause()})},[ce]),_e=o(async()=>{(function(){const e=document;return!!(e.fullscreenEnabled||e.webkitFullscreenEnabled||e.mozFullScreenEnabled||e.msFullscreenEnabled)})()&&J.current&&(document.fullscreenElement?await async function(){const e=document,t=e.exitFullscreen||e.webkitExitFullscreen||e.mozCancelFullScreen||e.msExitFullscreen;if(t)try{return await t.call(e),!0}catch(e){return console.error("Failed to exit fullscreen:",e),!1}return!1}():await async function(e){const t=e,n=t.requestFullscreen||t.webkitRequestFullscreen||t.webkitEnterFullscreen||t.mozRequestFullScreen||t.msRequestFullscreen;if(n)try{return await n.call(t),!0}catch(e){return console.error("Failed to enter fullscreen:",e),!1}return!1}(J.current))},[]),he=o(()=>{ce(e=>{e.muted||0!==e.volume?(e.muted=!e.muted,oe({type:"SET_MUTED",muted:e.muted})):(e.volume=1,e.muted=!1,oe({type:"SET_MUTED",muted:!1}))})},[]),Te=o(async()=>{ce(async e=>{"pictureInPictureEnabled"in document&&"requestPictureInPicture"in HTMLVideoElement.prototype&&(document.pictureInPictureElement===e?await async function(e){if(!1===e.disablePictureInPicture&&"pictureInPictureElement"in document&&document.pictureInPictureElement)try{return await document.exitPictureInPicture(),!0}catch(e){return console.error("Failed to exit Picture-in-Picture:",e),!1}return!1}(e):await async function(e){if(!("pictureInPictureEnabled"in document)||"function"!=typeof e.requestPictureInPicture)return console.error("Picture-in-Picture is not supported"),null;try{return e.paused&&await e.play().catch(()=>{console.warn("Auto-play was prevented")}),await e.requestPictureInPicture()}catch(e){return console.error("Failed to enter Picture-in-Picture:",e),null}}(e))})},[]),Ee=o(()=>{oe({type:"SET_CONTROLS_VISIBLE",visible:!1}),te.current&&(clearTimeout(te.current),te.current=null)},[]),ve=o((e=2500)=>{te.current&&clearTimeout(te.current),oe({type:"SET_CONTROLS_VISIBLE",visible:!0}),te.current=setTimeout(Ee,e)},[Ee]),ke=o(e=>{le.isControlsVisible&&ce(t=>{t.currentTime=e,ae({type:"SET_CURRENT_TIME",time:e}),ve()})},[ce,le.isControlsVisible,ve]),Se=i(()=>function(e,t){let n=null,r=0;return function(...i){const a=Date.now();r?(n&&clearTimeout(n),n=setTimeout(()=>{a-r>=t&&(e.apply(this,i),r=a)},t-(a-r))):(e.apply(this,i),r=a)}}(()=>{ve()},200),[ve]),ge=o(()=>{Se()},[Se]),be=o(()=>{Ee()},[Ee]),fe=o(e=>{const t=e.currentTarget.getBoundingClientRect(),n=e.clientX-t.left,r=Math.min(Math.max(n/t.width,0),1)*ie.durationTime;oe({type:"SET_HOVER_TIME",x:n,time:r})},[ie.durationTime]),Pe=o(()=>{oe({type:"SET_HOVER_TIME",x:null,time:0})},[]),Me=o(e=>{ae({type:"SET_VOLUME",volume:e.currentTarget.volume})},[]),Ne=o(e=>{ce(t=>{t.volume=+e.currentTarget.value})},[]),we=o(e=>{oe({type:"SET_LOADING",loading:e})},[]),Le=o(e=>{ce(t=>{Y.current=t.currentTime;const n=ne.current.findIndex(t=>t.quality===e);n<0||(we(!0),ue(n))})},[ce,we]);s(()=>{const e=ee.current;if(!e||0===Y.current)return;const t=()=>{e.currentTime=Y.current,e.play()};return e.addEventListener("loadedmetadata",t,{once:!0}),()=>e.removeEventListener("loadedmetadata",t)},[se]);const Ce=o(e=>{ae({type:"SET_PLAYBACK_SPEED",speed:e.currentTarget.playbackRate})},[]),xe=o(e=>{ce(t=>{t.playbackRate=e})},[]),Ie=o(()=>{oe({type:"SET_SETTING",active:!le.isSettingsVisible})},[le.isSettingsVisible]),Ae=i(()=>{if(!ee.current||!ie.durationTime)return 0;const e=ee.current.buffered;if(0===e.length)return 0;let t=0;for(let n=0;n<e.length;n++)if(e.start(n)<=ie.currentTime&&e.end(n)>ie.currentTime){t=e.end(n);break}return t/ie.durationTime*100},[ie.currentTime,ie.durationTime]),Ve=i(()=>ie.durationTime?ie.currentTime/ie.durationTime*100:0,[ie.currentTime,ie.durationTime]),Re=r(null),De=o(()=>{Re.current&&clearTimeout(Re.current),oe({type:"SET_SEEK_MODE",isActive:!0}),Re.current=setTimeout(()=>{oe({type:"SET_SEEK_MODE",isActive:!1}),oe({type:"RESET_SEEK"}),Re.current=null},1200)},[]),Fe=o(e=>{ce(t=>{const n="+"===e?10:-10;t.currentTime+=n,oe({type:"ADD_SEEK",amount:n}),De()})},[ce,De]),qe=r(0),Oe=o(e=>{if(!re)return;const t=Date.now(),n=t-qe.current;(n>0&&n<300||le.isSeekMode)&&(le.isSeekMode||oe({type:"SET_SEEK_MODE",isActive:!0}),Fe(e)),qe.current=t},[le.isSeekMode,Fe]),He=o(e=>{if(!re)return;if(e.target.closest("button, input, [data-no-toggle]"))return ve();le.isControlsVisible?Ee():ve()},[re,le.isControlsVisible,ve,Ee]),Be=le.isControlsVisible,Ue=le.isMuted?0:ie.volume;return s(()=>{if(re)return;const e=e=>{switch([" ","f","p","ArrowLeft","ArrowRight"].includes(e.key)&&(e.preventDefault(),ve()),e.key){case" ":pe();break;case"f":_e();break;case"p":Te();break;case"ArrowLeft":Fe("-");break;case"ArrowRight":Fe("+")}};return window.addEventListener("keydown",e),()=>{window.removeEventListener("keydown",e)}},[pe,_e,Te,ve,Fe]),s(()=>{const e=async()=>{const e=document.fullscreenElement===J.current;oe({type:"SET_FULLSCREEN",active:e}),ee.current&&async function(e,t){const n=e.videoWidth>e.videoHeight;if("undefined"!=typeof window&&window.screen&&"orientation"in window.screen&&window.screen.orientation&&"lock"in window.screen.orientation&&"function"==typeof window.screen.orientation.lock)try{t&&n?await window.screen.orientation.lock("landscape"):window.screen.orientation.unlock()}catch(e){console.warn("Failed to lock orientation:",e)}}(ee.current,e)};return document.addEventListener("fullscreenchange",e),()=>{document.removeEventListener("fullscreenchange",e),te.current&&clearTimeout(te.current)}},[]),e("div",{ref:J,onMouseMove:re?void 0:ge,onMouseLeave:re?void 0:be,onTouchEnd:re?He:void 0,className:_+(re?"":` ${p}`),children:[t("video",{ref:ee,poster:d,controls:!1,onContextMenu:()=>!1,className:h,src:ne.current[se].src,onWaiting:()=>we(!0),onPlaying:()=>we(!1),onCanPlay:()=>we(!1),onLoadedData:()=>we(!1),onTimeUpdate:ye,onVolumeChange:Me,onRateChange:Ce,onPlay:()=>ae({type:"SET_PAUSED",isPaused:!1}),onPause:()=>ae({type:"SET_PAUSED",isPaused:!0}),onDurationChange:e=>ae({type:"SET_DURATION",duration:e.currentTarget.duration}),onLoadedMetadata:e=>ae({type:"SET_DURATION",duration:e.currentTarget.duration})}),e("div",{className:T+(Be?` ${E}`:""),children:[e("div",{className:v,children:[t("article",{className:k,children:n}),t("button",{type:"button",className:y,onClick:e=>{e.stopPropagation(),Ie()},onFocus:e=>e.currentTarget.blur(),children:t(m,{name:"setting"})})]}),e("div",{className:S,onClick:re?void 0:pe,children:[t("div",{className:g,"data-no-toggle":!0,onTouchEnd:()=>Oe("-"),children:le.seekStack<0&&t("div",{inert:!0,className:X,children:le.seekStack.toString()},le.seekStack)}),t("div",{className:g,"data-no-toggle":!0,onTouchEnd:()=>Oe("+"),children:le.seekStack>0&&t("div",{inert:!0,className:$,children:`+${le.seekStack.toString()}`},le.seekStack)})]}),e("div",{className:b,children:[t("div",{className:f,children:W(ie.currentTime)}),e("div",{className:L,children:[t("div",{className:C,style:{display:null===le.hoverTime.x?"none":void 0,"--player-hover-position":`${le.hoverTime.x}px`},children:W(le.hoverTime.time)}),t("input",{step:"any",type:"range",onFocus:e=>e.currentTarget.blur(),max:ie.durationTime,value:ie.currentTime,className:x,onMouseMove:fe,onMouseLeave:Pe,onChange:e=>ke(+e.currentTarget.value),style:{"--player-buffer-position":`${Ae}%`,"--player-time-position":`${Ve}%`}}),t("div",{className:I,style:{"--player-thumb-position":`${Ve}%`}})]}),t("div",{className:P,children:W(ie.durationTime)}),e("div",{className:M,children:[t("button",{type:"button",className:y,onClick:e=>{e.stopPropagation(),he()},onFocus:e=>e.currentTarget.blur(),children:t(m,{name:le.isMuted||0===ie.volume?"unmute":"mute"})}),e("div",{className:N,children:[t("input",{style:{"--player-buffer-position":100*Ue+"%","--player-time-position":100*Ue+"%"},onFocus:e=>e.currentTarget.blur(),onChange:Ne,className:w,value:Ue,type:"range",step:"any",max:1}),t("div",{className:I,style:{"--player-thumb-position":100*Ue+"%"}})]})]}),t("button",{type:"button",className:y,onClick:e=>{e.stopPropagation(),Te()},onFocus:e=>e.currentTarget.blur(),children:t(m,{name:"picture-in-picture"})}),t("button",{type:"button",className:y,onClick:e=>{e.stopPropagation(),_e()},onFocus:e=>e.currentTarget.blur(),children:t(m,{name:le.isFullscreen?"exit-fullscreen":"fullscreen"})})]}),le.isLoading?t("div",{className:A,children:t(m,{name:"loading",style:{width:"100%"}})}):t("div",{className:V,"data-no-toggle":!0,onClick:pe,children:t(m,{name:ie.isPaused?"play":"pause",bigger:!0})})]}),e("div",{className:R,style:{display:le.isSettingsVisible?void 0:"none"},onClick:()=>{oe({type:"SET_SETTING",active:!1}),oe({type:"SET_SETTING_PANEL",name:null})},onMouseMove:e=>e.stopPropagation(),children:[e("div",{className:D,onClick:e=>e.stopPropagation(),style:{display:null===le.settingPanel?void 0:"none"},children:[e("div",{className:O,children:[t(m,{name:"quality",style:{stroke:"#000"}}),e("div",{className:H,onClick:()=>oe({type:"SET_SETTING_PANEL",name:"quality"}),children:[t("span",{children:"Video quality"}),t("span",{children:Q(ne.current[se].quality)})]})]}),e("div",{className:O,children:[t(m,{name:"playback",style:{stroke:"#000"}}),e("div",{className:H,onClick:()=>oe({type:"SET_SETTING_PANEL",name:"speed"}),children:[t("span",{children:"Playback speed"}),e("span",{children:[ie.playbackSpeed,"x"]})]})]})]}),e("div",{className:F,onClick:e=>e.stopPropagation(),style:{display:"speed"===le.settingPanel?void 0:"none"},children:[e("div",{className:U,children:["Speed ",ie.playbackSpeed,"x"]}),e("div",{className:j,children:[t("button",{type:"button",className:B,onClick:()=>xe(.25===ie.playbackSpeed?.25:ie.playbackSpeed-.25),onFocus:e=>e.currentTarget.blur(),children:t(m,{name:"minus"})}),t("input",{max:4,min:.25,step:.25,type:"range",onFocus:e=>e.currentTarget.blur(),style:{"--spped-thumb-position":(ie.playbackSpeed-.25)/3.75*100+"%"},className:Z,onChange:e=>xe(+e.currentTarget.value),value:ie.playbackSpeed}),t("button",{type:"button",className:B,onClick:()=>xe(4===ie.playbackSpeed?4:ie.playbackSpeed+.25),onFocus:e=>e.currentTarget.blur(),children:t(m,{name:"plus"})})]})]}),e("div",{className:q,onClick:e=>e.stopPropagation(),style:{display:"quality"===le.settingPanel?void 0:"none"},children:[e("div",{className:U,children:["Quality ",Q(ne.current[se].quality)]}),t("div",{className:G,children:ne.current.map(n=>e("div",{className:O,onClick:()=>{Le(n.quality),oe({type:"SET_SETTING",active:!1}),oe({type:"SET_SETTING_PANEL",name:null})},children:[t("input",{type:"checkbox",readOnly:!0,onFocus:e=>e.currentTarget.blur(),className:K,checked:ne.current[se].quality===n.quality}),Q(n.quality)]},n.quality))})]})]})]})}export{z as VideoPlayer};
|
|
1
|
+
import{jsxs as e,jsx as t,Fragment as n}from"react/jsx-runtime";import{useRef as r,useMemo as a,useReducer as i,useState as l,useCallback as o,useEffect as s}from"react";function u(e,t){switch(t.type){case"SET_VOLUME":return{...e,volume:t.volume};case"SET_PAUSED":return{...e,isPaused:t.isPaused};case"SET_DURATION":return{...e,durationTime:t.duration};case"SET_CURRENT_TIME":return{...e,currentTime:t.time};case"SET_PLAYBACK_SPEED":return{...e,playbackSpeed:t.speed};default:return e}}function c(e,t){switch(t.type){case"SET_CONTROLS_VISIBLE":return{...e,isControlsVisible:t.visible};case"SET_SETTING_PANEL":return{...e,settingPanel:t.name};case"SET_HOVER_TIME":return{...e,hoverTime:{x:t.x,time:t.time}};case"SET_FULLSCREEN":return{...e,isFullscreen:t.active};case"SET_LOADING":return{...e,isLoading:t.loading};case"SET_SETTING":return{...e,isSettingsVisible:t.active};case"SET_MUTED":return{...e,isMuted:t.muted};case"ADD_SEEK":return{...e,seekStack:t.amount>0?e.seekStack<0?t.amount:e.seekStack+t.amount:e.seekStack>0?t.amount:e.seekStack+t.amount};case"RESET_SEEK":return{...e,seekStack:0};case"SET_SEEK_MODE":return{...e,isSeekMode:t.isActive};default:return e}}const d=["play","pause"];function m({name:r,style:a,bigger:i}){return e("svg","loading"===r?{version:"1.1",id:"L1",xmlns:"http://www.w3.org/2000/svg",xmlnsXlink:"http://www.w3.org/1999/xlink",x:"0px",y:"0px",viewBox:"0 0 100 100",enableBackground:"new 0 0 100 100",xmlSpace:"preserve",children:[t("title",{children:"loading"}),t("circle",{fill:"none",stroke:"currentColor",strokeWidth:"6",strokeMiterlimit:"15",strokeDasharray:"14.2472,14.2472",cx:"50",cy:"50",r:"47",children:t("animateTransform",{attributeName:"transform",attributeType:"XML",type:"rotate",dur:"5s",from:"0 50 50",to:"360 50 50",repeatCount:"indefinite"})}),t("circle",{fill:"none",stroke:"currentColor",strokeWidth:"1",strokeMiterlimit:"10",strokeDasharray:"10,10",cx:"50",cy:"50",r:"39",children:t("animateTransform",{attributeName:"transform",attributeType:"XML",type:"rotate",dur:"5s",from:"0 50 50",to:"-360 50 50",repeatCount:"indefinite"})}),e("g",{fill:"currentColor",children:[t("rect",{x:"30",y:"35",width:"5",height:"30",children:t("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 5 ; 0 -5; 0 5",repeatCount:"indefinite",begin:"0.1"})}),t("rect",{x:"40",y:"35",width:"5",height:"30",children:t("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 5 ; 0 -5; 0 5",repeatCount:"indefinite",begin:"0.2"})}),t("rect",{x:"50",y:"35",width:"5",height:"30",children:t("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 5 ; 0 -5; 0 5",repeatCount:"indefinite",begin:"0.3"})}),t("rect",{x:"60",y:"35",width:"5",height:"30",children:t("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 5 ; 0 -5; 0 5",repeatCount:"indefinite",begin:"0.4"})}),t("rect",{x:"70",y:"35",width:"5",height:"30",children:t("animateTransform",{attributeName:"transform",dur:"1s",type:"translate",values:"0 5 ; 0 -5; 0 5",repeatCount:"indefinite",begin:"0.5"})})]})]}:{fill:d.includes(r)?"currentColor":"none",strokeWidth:1.5,width:i?56:24,viewBox:"0 0 24 24",stroke:"currentColor",style:a,xmlns:"http://www.w3.org/2000/svg",children:[t("title",{children:r}),"play"===r&&t("path",{fillRule:"evenodd",d:"M4.5 5.653c0-1.427 1.529-2.33 2.779-1.643l11.54 6.347c1.295.712 1.295 2.573 0 3.286L7.28 19.99c-1.25.687-2.779-.217-2.779-1.643V5.653Z",clipRule:"evenodd"}),"pause"===r&&t("path",{fillRule:"evenodd",d:"M6.75 5.25a.75.75 0 0 1 .75-.75H9a.75.75 0 0 1 .75.75v13.5a.75.75 0 0 1-.75.75H7.5a.75.75 0 0 1-.75-.75V5.25Zm7.5 0A.75.75 0 0 1 15 4.5h1.5a.75.75 0 0 1 .75.75v13.5a.75.75 0 0 1-.75.75H15a.75.75 0 0 1-.75-.75V5.25Z",clipRule:"evenodd"}),"setting"===r&&e(n,{children:[t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.325.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 0 1 1.37.49l1.296 2.247a1.125 1.125 0 0 1-.26 1.431l-1.003.827c-.293.241-.438.613-.43.992a7.723 7.723 0 0 1 0 .255c-.008.378.137.75.43.991l1.004.827c.424.35.534.955.26 1.43l-1.298 2.247a1.125 1.125 0 0 1-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.47 6.47 0 0 1-.22.128c-.331.183-.581.495-.644.869l-.213 1.281c-.09.543-.56.94-1.11.94h-2.594c-.55 0-1.019-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 0 1-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 0 1-1.369-.49l-1.297-2.247a1.125 1.125 0 0 1 .26-1.431l1.004-.827c.292-.24.437-.613.43-.991a6.932 6.932 0 0 1 0-.255c.007-.38-.138-.751-.43-.992l-1.004-.827a1.125 1.125 0 0 1-.26-1.43l1.297-2.247a1.125 1.125 0 0 1 1.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.086.22-.128.332-.183.582-.495.644-.869l.214-1.28Z"}),t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"})]}),"fullscreen"===r&&t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M3.75 3.75v4.5m0-4.5h4.5m-4.5 0L9 9M3.75 20.25v-4.5m0 4.5h4.5m-4.5 0L9 15M20.25 3.75h-4.5m4.5 0v4.5m0-4.5L15 9m5.25 11.25h-4.5m4.5 0v-4.5m0 4.5L15 15"}),"exit-fullscreen"===r&&t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M9 9V4.5M9 9H4.5M9 9 3.75 3.75M9 15v4.5M9 15H4.5M9 15l-5.25 5.25M15 9h4.5M15 9V4.5M15 9l5.25-5.25M15 15h4.5M15 15v4.5m0-4.5 5.25 5.25"}),"mute"===r&&t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M19.114 5.636a9 9 0 0 1 0 12.728M16.463 8.288a5.25 5.25 0 0 1 0 7.424M6.75 8.25l4.72-4.72a.75.75 0 0 1 1.28.53v15.88a.75.75 0 0 1-1.28.53l-4.72-4.72H4.51c-.88 0-1.704-.507-1.938-1.354A9.009 9.009 0 0 1 2.25 12c0-.83.112-1.633.322-2.396C2.806 8.756 3.63 8.25 4.51 8.25H6.75Z"}),"unmute"===r&&t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M17.25 9.75 19.5 12m0 0 2.25 2.25M19.5 12l2.25-2.25M19.5 12l-2.25 2.25m-10.5-6 4.72-4.72a.75.75 0 0 1 1.28.53v15.88a.75.75 0 0 1-1.28.53l-4.72-4.72H4.51c-.88 0-1.704-.507-1.938-1.354A9.009 9.009 0 0 1 2.25 12c0-.83.112-1.633.322-2.396C2.806 8.756 3.63 8.25 4.51 8.25H6.75Z"}),"picture-in-picture"===r&&t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M16.5 8.25V6a2.25 2.25 0 0 0-2.25-2.25H6A2.25 2.25 0 0 0 3.75 6v8.25A2.25 2.25 0 0 0 6 16.5h2.25m8.25-8.25H18a2.25 2.25 0 0 1 2.25 2.25V18A2.25 2.25 0 0 1 18 20.25h-7.5A2.25 2.25 0 0 1 8.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 0 0-2.25 2.25v6"}),"quality"===r&&t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M10.5 6h9.75M10.5 6a1.5 1.5 0 1 1-3 0m3 0a1.5 1.5 0 1 0-3 0M3.75 6H7.5m3 12h9.75m-9.75 0a1.5 1.5 0 0 1-3 0m3 0a1.5 1.5 0 0 0-3 0m-3.75 0H7.5m9-6h3.75m-3.75 0a1.5 1.5 0 0 1-3 0m3 0a1.5 1.5 0 0 0-3 0m-9.75 0h9.75"}),"playback"===r&&e(n,{children:[t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"}),t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M15.91 11.672a.375.375 0 0 1 0 .656l-5.603 3.113a.375.375 0 0 1-.557-.328V8.887c0-.286.307-.466.557-.327l5.603 3.112Z"})]}),"plus"===r&&t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M12 4.5v15m7.5-7.5h-15"}),"minus"===r&&t("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M5 12h14"})]})}var y="style-module_PlayerButton__3pLMQ",p="style-module_PlayerDesktop__ccJTe",_="style-module_PlayerWrapper__37Xpc",h="style-module_PlayerVideo__NkoX3",T="style-module_PlayerControls__IyMmM",E="style-module_PlayerShown__uVIfu",v="style-module_PlayerPanelTop__x02Dp",k="style-module_PlayerTitle__yTvNu",S="style-module_PlayerPanelCenter__y8jR0",g="style-module_PlayerSeekArea__z-qY-",b="style-module_PlayerPanelBottom__bdhhD",f="style-module_PlayerCurrentTime__IaolO",P="style-module_PlayerDurationTime__uCgjW",M="style-module_PlayerVolume__r7ll8",N="style-module_PlayerVolumeZone__7LHeR",w="style-module_PlayerRangeVolume__8XBa1",L="style-module_PlayerSeekTime__SEypx",C="style-module_PlayerHoverTime__iBu1D",x="style-module_PlayerRangeTime__QVr8d",A="style-module_PlayerRangeThumb__J5IcV",I="style-module_PlayerLoading__PBiIH",V="style-module_PlayerCenter__qLy3K",R="style-module_PlayerSetting__BhP11",D="style-module_PlayerSettingPanel__tZE0z",F="style-module_PlayerSettingPanelSpeed__ABgXy",q="style-module_PlayerSettingPanelQuality__4UQId",O="style-module_PlayerSettingList__KEYZR",H="style-module_PlayerSettingDisplay__-yFqd",B="style-module_PlayerButtonCursor__4PyXl",U="style-module_PlayerSpeedShow__u1NIt",j="style-module_PlayerPlayback__EZYH2",Z="style-module_PlayerRangeSpeed__ElauL",K="style-module_PlayerCheckbox__At22K",G="style-module_PlayerQualityList__rvIel",X="style-module_seekLeft__9AAFX",$="style-module_seekRight__RMywZ";function W(e){if(void 0===e||Number.isNaN(e)||e<0)return"00:00";const t=Math.floor(e),n=t%60;return`${Math.floor(t/60).toString().padStart(2,"0")}:${n.toString().padStart(2,"0")}`}function Q(e){return 0===e?"Auto":e<1e3?`${e}p`:e/1e3+"k"}function z(){return"pictureInPictureEnabled"in document&&"requestPictureInPicture"in HTMLVideoElement.prototype}function Y({title:n,poster:d,source:Y}){const J=r(0),ee=r(null),te=r(null),ne=r(null),re=r("string"==typeof Y?[{src:Y,quality:0}]:[...Y].sort((e,t)=>t.quality-e.quality)),ae=a(()=>/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobi/i.test(navigator.userAgent),[]),[ie,le]=i(u,{volume:1,isPaused:!0,currentTime:0,durationTime:0,playbackSpeed:1}),[oe,se]=i(c,{seekStack:0,isMuted:!1,isLoading:!0,isSeekMode:!1,settingPanel:null,isFullscreen:!1,isControlsVisible:!0,isSettingsVisible:!1,hoverTime:{x:null,time:0}}),[ue,ce]=l(0),de=o(async e=>{if(te.current)try{return await e(te.current)}catch(e){return console.error("Video operation failed:",e),null}return null},[]),me=r(ie.currentTime),ye=r(oe.isControlsVisible);s(()=>{me.current=ie.currentTime,ye.current=oe.isControlsVisible},[ie.currentTime,oe.isControlsVisible]);const pe=o(e=>{if(!ye.current)return;const t=e.currentTarget.currentTime;(Math.abs(t-me.current)>1||Math.floor(t)!==Math.floor(me.current))&&le({type:"SET_CURRENT_TIME",time:t})},[]),_e=o(()=>{de(async e=>{e.paused?await e.play():e.pause()})},[de]),he=o(async()=>{(function(){const e=document;return!!(e.fullscreenEnabled||e.webkitFullscreenEnabled||e.mozFullScreenEnabled||e.msFullscreenEnabled)})()&&ee.current&&(document.fullscreenElement?await async function(){const e=document,t=e.exitFullscreen||e.webkitExitFullscreen||e.mozCancelFullScreen||e.msExitFullscreen;if(t)try{return await t.call(e),!0}catch(e){return console.error("Failed to exit fullscreen:",e),!1}return!1}():await async function(e){const t=e,n=t.requestFullscreen||t.webkitRequestFullscreen||t.webkitEnterFullscreen||t.mozRequestFullScreen||t.msRequestFullscreen;if(n)try{return await n.call(t),!0}catch(e){return console.error("Failed to enter fullscreen:",e),!1}return!1}(ee.current))},[]),Te=o(()=>{de(e=>{e.muted||0!==e.volume?(e.muted=!e.muted,se({type:"SET_MUTED",muted:e.muted})):(e.volume=1,e.muted=!1,se({type:"SET_MUTED",muted:!1}))})},[]),Ee=o(async()=>{de(async e=>{z()&&(document.pictureInPictureElement===e?await async function(){if("pictureInPictureElement"in document&&document.pictureInPictureElement)try{return await document.exitPictureInPicture(),!0}catch(e){return console.error("Failed to exit Picture-in-Picture:",e),!1}return!1}():await async function(e){if(!z())return console.error("Picture-in-Picture is not supported"),null;try{return e.paused&&await e.play().catch(()=>{console.warn("Auto-play was prevented")}),await e.requestPictureInPicture()}catch(e){return console.error("Failed to enter Picture-in-Picture:",e),null}}(e))})},[]),ve=o(()=>{se({type:"SET_CONTROLS_VISIBLE",visible:!1}),ne.current&&(clearTimeout(ne.current),ne.current=null)},[]),ke=o((e=2500)=>{ne.current&&clearTimeout(ne.current),se({type:"SET_CONTROLS_VISIBLE",visible:!0}),ne.current=setTimeout(ve,e)},[ve]),Se=o(e=>{oe.isControlsVisible&&de(t=>{t.currentTime=e,le({type:"SET_CURRENT_TIME",time:e}),ke()})},[de,oe.isControlsVisible,ke]),ge=a(()=>function(e,t){let n=null,r=0;return function(...a){const i=Date.now();r?(n&&clearTimeout(n),n=setTimeout(()=>{i-r>=t&&(e.apply(this,a),r=i)},t-(i-r))):(e.apply(this,a),r=i)}}(()=>{ke()},200),[ke]),be=o(()=>{ge()},[ge]),fe=o(()=>{ve()},[ve]),Pe=o(e=>{const t=e.currentTarget.getBoundingClientRect(),n=e.clientX-t.left,r=Math.min(Math.max(n/t.width,0),1)*ie.durationTime;se({type:"SET_HOVER_TIME",x:n,time:r})},[ie.durationTime]),Me=o(()=>{se({type:"SET_HOVER_TIME",x:null,time:0})},[]),Ne=o(e=>{le({type:"SET_VOLUME",volume:e.currentTarget.volume})},[]),we=o(e=>{de(t=>{t.volume=+e.currentTarget.value})},[]),Le=o(e=>{se({type:"SET_LOADING",loading:e})},[]),Ce=o(e=>{de(t=>{J.current=t.currentTime;const n=re.current.findIndex(t=>t.quality===e);n<0||(Le(!0),ce(n))})},[de,Le]);s(()=>{const e=te.current;if(!e||0===J.current)return;const t=()=>{e.currentTime=J.current,e.play()};return e.addEventListener("loadedmetadata",t,{once:!0}),()=>e.removeEventListener("loadedmetadata",t)},[ue]);const xe=o(e=>{le({type:"SET_PLAYBACK_SPEED",speed:e.currentTarget.playbackRate})},[]),Ae=o(e=>{de(t=>{t.playbackRate=e})},[]),Ie=o(()=>{se({type:"SET_SETTING",active:!oe.isSettingsVisible})},[oe.isSettingsVisible]),Ve=a(()=>{if(!te.current||!ie.durationTime)return 0;const e=te.current.buffered;if(0===e.length)return 0;let t=0;for(let n=0;n<e.length;n++)if(e.start(n)<=ie.currentTime&&e.end(n)>ie.currentTime){t=e.end(n);break}return t/ie.durationTime*100},[ie.currentTime,ie.durationTime]),Re=a(()=>ie.durationTime?ie.currentTime/ie.durationTime*100:0,[ie.currentTime,ie.durationTime]),De=r(null),Fe=o(()=>{De.current&&clearTimeout(De.current),se({type:"SET_SEEK_MODE",isActive:!0}),De.current=setTimeout(()=>{se({type:"SET_SEEK_MODE",isActive:!1}),se({type:"RESET_SEEK"}),De.current=null},1200)},[]),qe=o(e=>{de(t=>{const n="+"===e?10:-10;t.currentTime+=n,se({type:"ADD_SEEK",amount:n}),Fe()})},[de,Fe]),Oe=r(0),He=o(e=>{if(!ae)return;const t=Date.now(),n=t-Oe.current;(n>0&&n<300||oe.isSeekMode)&&(oe.isSeekMode||se({type:"SET_SEEK_MODE",isActive:!0}),qe(e)),Oe.current=t},[oe.isSeekMode,qe]),Be=o(e=>{if(!ae)return;if(e.target.closest("button, input, [data-no-toggle]"))return ke();oe.isControlsVisible?ve():ke()},[ae,oe.isControlsVisible,ke,ve]),Ue=oe.isControlsVisible,je=oe.isMuted?0:ie.volume;return s(()=>{if(ae)return;const e=e=>{switch([" ","f","p","ArrowLeft","ArrowRight"].includes(e.key)&&(e.preventDefault(),ke()),e.key){case" ":_e();break;case"f":he();break;case"p":Ee();break;case"ArrowLeft":qe("-");break;case"ArrowRight":qe("+")}};return window.addEventListener("keydown",e),()=>{window.removeEventListener("keydown",e)}},[_e,he,Ee,ke,qe]),s(()=>{const e=async()=>{const e=document.fullscreenElement===ee.current;se({type:"SET_FULLSCREEN",active:e}),te.current&&async function(e,t){const n=e.videoWidth>e.videoHeight;if("undefined"!=typeof window&&window.screen&&"orientation"in window.screen&&window.screen.orientation&&"lock"in window.screen.orientation&&"function"==typeof window.screen.orientation.lock)try{t&&n?await window.screen.orientation.lock("landscape"):window.screen.orientation.unlock()}catch(e){console.warn("Failed to lock orientation:",e)}}(te.current,e)};return document.addEventListener("fullscreenchange",e),()=>{document.removeEventListener("fullscreenchange",e),ne.current&&clearTimeout(ne.current)}},[]),e("div",{ref:ee,onMouseMove:ae?void 0:be,onMouseLeave:ae?void 0:fe,onTouchEnd:ae?Be:void 0,className:_+(ae?"":` ${p}`),children:[t("video",{ref:te,poster:d,controls:!1,onContextMenu:()=>!1,className:h,src:re.current[ue].src,onWaiting:()=>Le(!0),onPlaying:()=>Le(!1),onCanPlay:()=>Le(!1),onLoadedData:()=>Le(!1),onTimeUpdate:pe,onVolumeChange:Ne,onRateChange:xe,onPlay:()=>le({type:"SET_PAUSED",isPaused:!1}),onPause:()=>le({type:"SET_PAUSED",isPaused:!0}),onDurationChange:e=>le({type:"SET_DURATION",duration:e.currentTarget.duration}),onLoadedMetadata:e=>le({type:"SET_DURATION",duration:e.currentTarget.duration})}),e("div",{className:T+(Ue?` ${E}`:""),children:[e("div",{className:v,children:[t("article",{className:k,children:n}),t("button",{type:"button",className:y,onClick:e=>{e.stopPropagation(),Ie()},onFocus:e=>e.currentTarget.blur(),children:t(m,{name:"setting"})})]}),e("div",{className:S,onClick:ae?void 0:_e,children:[t("div",{className:g,"data-no-toggle":!0,onTouchEnd:()=>He("-"),children:oe.seekStack<0&&t("div",{inert:!0,className:X,children:oe.seekStack.toString()},oe.seekStack)}),t("div",{className:g,"data-no-toggle":!0,onTouchEnd:()=>He("+"),children:oe.seekStack>0&&t("div",{inert:!0,className:$,children:`+${oe.seekStack.toString()}`},oe.seekStack)})]}),e("div",{className:b,children:[t("div",{className:f,children:W(ie.currentTime)}),e("div",{className:L,children:[t("div",{className:C,style:{display:null===oe.hoverTime.x?"none":void 0,"--player-hover-position":`${oe.hoverTime.x}px`},children:W(oe.hoverTime.time)}),t("input",{step:"any",type:"range",onFocus:e=>e.currentTarget.blur(),max:ie.durationTime,value:ie.currentTime,className:x,onMouseMove:Pe,onMouseLeave:Me,onChange:e=>Se(+e.currentTarget.value),style:{"--player-buffer-position":`${Ve}%`,"--player-time-position":`${Re}%`}}),t("div",{className:A,style:{"--player-thumb-position":`${Re}%`}})]}),t("div",{className:P,children:W(ie.durationTime)}),e("div",{className:M,children:[t("button",{type:"button",className:y,onClick:e=>{e.stopPropagation(),Te()},onFocus:e=>e.currentTarget.blur(),children:t(m,{name:oe.isMuted||0===ie.volume?"unmute":"mute"})}),e("div",{className:N,children:[t("input",{style:{"--player-buffer-position":100*je+"%","--player-time-position":100*je+"%"},onFocus:e=>e.currentTarget.blur(),onChange:we,className:w,value:je,type:"range",step:"any",max:1}),t("div",{className:A,style:{"--player-thumb-position":100*je+"%"}})]})]}),t("button",{type:"button",className:y,onClick:e=>{e.stopPropagation(),Ee()},onFocus:e=>e.currentTarget.blur(),children:t(m,{name:"picture-in-picture"})}),t("button",{type:"button",className:y,onClick:e=>{e.stopPropagation(),he()},onFocus:e=>e.currentTarget.blur(),children:t(m,{name:oe.isFullscreen?"exit-fullscreen":"fullscreen"})})]}),oe.isLoading?t("div",{className:I,children:t(m,{name:"loading",style:{width:"100%"}})}):t("div",{className:V,"data-no-toggle":!0,onClick:_e,children:t(m,{name:ie.isPaused?"play":"pause",bigger:!0})})]}),e("div",{className:R,style:{display:oe.isSettingsVisible?void 0:"none"},onClick:()=>{se({type:"SET_SETTING",active:!1}),se({type:"SET_SETTING_PANEL",name:null})},onMouseMove:e=>e.stopPropagation(),children:[e("div",{className:D,onClick:e=>e.stopPropagation(),style:{display:null===oe.settingPanel?void 0:"none"},children:[e("div",{className:O,children:[t(m,{name:"quality",style:{stroke:"#000"}}),e("div",{className:H,onClick:()=>se({type:"SET_SETTING_PANEL",name:"quality"}),children:[t("span",{children:"Video quality"}),t("span",{children:Q(re.current[ue].quality)})]})]}),e("div",{className:O,children:[t(m,{name:"playback",style:{stroke:"#000"}}),e("div",{className:H,onClick:()=>se({type:"SET_SETTING_PANEL",name:"speed"}),children:[t("span",{children:"Playback speed"}),e("span",{children:[ie.playbackSpeed,"x"]})]})]})]}),e("div",{className:F,onClick:e=>e.stopPropagation(),style:{display:"speed"===oe.settingPanel?void 0:"none"},children:[e("div",{className:U,children:["Speed ",ie.playbackSpeed,"x"]}),e("div",{className:j,children:[t("button",{type:"button",className:B,onClick:()=>Ae(.25===ie.playbackSpeed?.25:ie.playbackSpeed-.25),onFocus:e=>e.currentTarget.blur(),children:t(m,{name:"minus"})}),t("input",{max:4,min:.25,step:.25,type:"range",onFocus:e=>e.currentTarget.blur(),style:{"--spped-thumb-position":(ie.playbackSpeed-.25)/3.75*100+"%"},className:Z,onChange:e=>Ae(+e.currentTarget.value),value:ie.playbackSpeed}),t("button",{type:"button",className:B,onClick:()=>Ae(4===ie.playbackSpeed?4:ie.playbackSpeed+.25),onFocus:e=>e.currentTarget.blur(),children:t(m,{name:"plus"})})]})]}),e("div",{className:q,onClick:e=>e.stopPropagation(),style:{display:"quality"===oe.settingPanel?void 0:"none"},children:[e("div",{className:U,children:["Quality ",Q(re.current[ue].quality)]}),t("div",{className:G,children:re.current.map(n=>e("div",{className:O,onClick:()=>{Ce(n.quality),se({type:"SET_SETTING",active:!1}),se({type:"SET_SETTING_PANEL",name:null})},children:[t("input",{type:"checkbox",readOnly:!0,onFocus:e=>e.currentTarget.blur(),className:K,checked:re.current[ue].quality===n.quality}),Q(n.quality)]},n.quality))})]})]})]})}export{Y as VideoPlayer};
|