@munsonlabs/video-player 0.2.4 → 0.2.5
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 +27 -13
- package/dist/chunks/{ads-BV769SMr.mjs → ads-Dph3guS9.mjs} +1 -1
- package/dist/{elements/chunks/brightcove-rNI-XRxB.mjs → chunks/brightcove-DiJF_74z.mjs} +1 -1
- package/dist/chunks/constants-35ZnLsDv.mjs +1 -0
- package/dist/chunks/dailymotion-DTooszoV.mjs +1 -0
- package/dist/chunks/embedShared-CbArTtuR.mjs +1 -0
- package/dist/chunks/{jwplayer-WIkwoJTA.mjs → jwplayer-Dhq65VxK.mjs} +1 -1
- package/dist/chunks/loadScript-CxzeXqTe.mjs +1 -0
- package/dist/chunks/{sourceHelpers-rbs6D6ZG.mjs → sourceHelpers-B0tH-grj.mjs} +1 -1
- package/dist/chunks/vimeo-D0GAjId0.mjs +1 -0
- package/dist/chunks/youtube-B8AT2F-4.mjs +1 -0
- package/dist/elements/chunks/{ads-BV769SMr.mjs → ads-Dph3guS9.mjs} +1 -1
- package/dist/{chunks/brightcove-rNI-XRxB.mjs → elements/chunks/brightcove-DiJF_74z.mjs} +1 -1
- package/dist/elements/chunks/constants-35ZnLsDv.mjs +1 -0
- package/dist/elements/chunks/dailymotion-DTooszoV.mjs +1 -0
- package/dist/elements/chunks/embedShared-CbArTtuR.mjs +1 -0
- package/dist/elements/chunks/{jwplayer-WIkwoJTA.mjs → jwplayer-Dhq65VxK.mjs} +1 -1
- package/dist/elements/chunks/loadScript-CxzeXqTe.mjs +1 -0
- package/dist/elements/chunks/{sourceHelpers-rbs6D6ZG.mjs → sourceHelpers-B0tH-grj.mjs} +1 -1
- package/dist/elements/chunks/vimeo-D0GAjId0.mjs +1 -0
- package/dist/elements/chunks/youtube-B8AT2F-4.mjs +1 -0
- package/dist/elements/controls.d.mts +166 -38
- package/dist/elements/controls.mjs +1 -1
- package/dist/elements/core.d.mts +23 -31
- package/dist/elements/core.mjs +1 -1
- package/dist/elements/index.d.mts +133 -69
- package/dist/elements/index.mjs +1 -1
- package/dist/index.d.mts +203 -209
- package/dist/index.mjs +1 -1
- package/package.json +5 -3
- package/dist/chunks/constants-zR-UwEWY.mjs +0 -1
- package/dist/chunks/dailymotion-gEquA4h5.mjs +0 -1
- package/dist/chunks/embedShared-duyOYFQN.mjs +0 -1
- package/dist/chunks/loadScript-Du6JsTc2.mjs +0 -1
- package/dist/chunks/vimeo-WJYDJPA3.mjs +0 -1
- package/dist/chunks/youtube-DbJ-IrvP.mjs +0 -1
- package/dist/elements/chunks/constants-zR-UwEWY.mjs +0 -1
- package/dist/elements/chunks/dailymotion-gEquA4h5.mjs +0 -1
- package/dist/elements/chunks/embedShared-duyOYFQN.mjs +0 -1
- package/dist/elements/chunks/loadScript-Du6JsTc2.mjs +0 -1
- package/dist/elements/chunks/vimeo-WJYDJPA3.mjs +0 -1
- package/dist/elements/chunks/youtube-DbJ-IrvP.mjs +0 -1
|
@@ -1,18 +1,7 @@
|
|
|
1
|
-
import "vue";
|
|
1
|
+
import { Ref, UnwrapNestedRefs } from "vue";
|
|
2
2
|
//#region src/composables/player/emitter.d.ts
|
|
3
3
|
type PlaybackListener = (...args: unknown[]) => void;
|
|
4
4
|
//#endregion
|
|
5
|
-
//#region src/adapters/embeds/embedShared.d.ts
|
|
6
|
-
interface EmbedAdapterOptions {
|
|
7
|
-
src: string;
|
|
8
|
-
poster?: string;
|
|
9
|
-
autoplay?: boolean;
|
|
10
|
-
muted?: boolean;
|
|
11
|
-
volume?: number;
|
|
12
|
-
nativeUi?: boolean;
|
|
13
|
-
customVars?: Record<string, unknown>;
|
|
14
|
-
}
|
|
15
|
-
//#endregion
|
|
16
5
|
//#region src/types/playback.d.ts
|
|
17
6
|
interface MediaErrorLike {
|
|
18
7
|
code: number;
|
|
@@ -31,7 +20,7 @@ interface QualityLevelInfo {
|
|
|
31
20
|
}
|
|
32
21
|
interface PlaybackAdapter {
|
|
33
22
|
readonly el: HTMLElement;
|
|
34
|
-
play():
|
|
23
|
+
play(): Promise<void>;
|
|
35
24
|
pause(): void;
|
|
36
25
|
paused(): boolean;
|
|
37
26
|
currentTime(): number;
|
|
@@ -61,7 +50,7 @@ interface PlaybackAdapter {
|
|
|
61
50
|
togglePip(): void;
|
|
62
51
|
enterFullscreen(): void;
|
|
63
52
|
exitFullscreen(): void;
|
|
64
|
-
on(event: string
|
|
53
|
+
on(event: string, listener: PlaybackListener): void;
|
|
65
54
|
off(event: string, listener: PlaybackListener): void;
|
|
66
55
|
dispose(): void;
|
|
67
56
|
}
|
|
@@ -76,6 +65,14 @@ interface Matcher {
|
|
|
76
65
|
key: string;
|
|
77
66
|
embed: boolean;
|
|
78
67
|
}
|
|
68
|
+
interface EmbedAdapterOptions {
|
|
69
|
+
src: string;
|
|
70
|
+
poster?: string;
|
|
71
|
+
autoplay?: boolean;
|
|
72
|
+
muted?: boolean;
|
|
73
|
+
volume?: number;
|
|
74
|
+
nativeUi?: boolean;
|
|
75
|
+
}
|
|
79
76
|
type EmbedAdapterFactory = (videoEl: HTMLVideoElement, options: EmbedAdapterOptions) => PlaybackAdapter;
|
|
80
77
|
type SourceResolver = (url: string) => ResolvedSource | Promise<ResolvedSource>;
|
|
81
78
|
type PlatformConfig = Pick<Matcher, 'key' | 'test'> & ({
|
|
@@ -86,6 +83,96 @@ type PlatformConfig = Pick<Matcher, 'key' | 'test'> & ({
|
|
|
86
83
|
resolveSource?: SourceResolver;
|
|
87
84
|
});
|
|
88
85
|
//#endregion
|
|
86
|
+
//#region src/composables/player/playerState.d.ts
|
|
87
|
+
declare function createPlayerState(props: PlayerProps): {
|
|
88
|
+
isPlaying: import("vue").Ref<boolean, boolean>;
|
|
89
|
+
hasEnded: import("vue").Ref<boolean, boolean>;
|
|
90
|
+
isReady: import("vue").Ref<boolean, boolean>;
|
|
91
|
+
isLoaded: import("vue").Ref<boolean, boolean>;
|
|
92
|
+
isLive: import("vue").Ref<boolean, boolean>;
|
|
93
|
+
hasStarted: import("vue").Ref<boolean, boolean>;
|
|
94
|
+
isError: import("vue").Ref<boolean, boolean>;
|
|
95
|
+
errorMessage: import("vue").Ref<string, string>;
|
|
96
|
+
current: import("vue").Ref<number, number>;
|
|
97
|
+
total: import("vue").Ref<number, number>;
|
|
98
|
+
buffered: import("vue").Ref<number, number>;
|
|
99
|
+
progress: import("vue").ComputedRef<number>;
|
|
100
|
+
bufferedDisplay: import("vue").ComputedRef<number>;
|
|
101
|
+
vol: import("vue").Ref<number, number>;
|
|
102
|
+
isMuted: import("vue").Ref<boolean, boolean>;
|
|
103
|
+
isAudible: import("vue").ComputedRef<boolean>;
|
|
104
|
+
isLooping: import("vue").Ref<boolean, boolean>;
|
|
105
|
+
currentPlaybackRate: import("vue").Ref<number, number>;
|
|
106
|
+
supportsPlaybackRate: import("vue").Ref<boolean, boolean>;
|
|
107
|
+
isAdPlaying: import("vue").Ref<boolean, boolean>;
|
|
108
|
+
isAdPaused: import("vue").Ref<boolean, boolean>;
|
|
109
|
+
isAdMuted: import("vue").Ref<boolean, boolean>;
|
|
110
|
+
adRemainingTime: import("vue").Ref<number, number>;
|
|
111
|
+
supportsCaptions: import("vue").Ref<boolean, boolean>;
|
|
112
|
+
captionTracks: import("vue").Ref<{
|
|
113
|
+
index: number;
|
|
114
|
+
label: string;
|
|
115
|
+
language: string;
|
|
116
|
+
}[], CaptionTrackInfo[] | {
|
|
117
|
+
index: number;
|
|
118
|
+
label: string;
|
|
119
|
+
language: string;
|
|
120
|
+
}[]>;
|
|
121
|
+
activeCaptionIndex: import("vue").Ref<number | null, number | null>;
|
|
122
|
+
supportsQuality: import("vue").Ref<boolean, boolean>;
|
|
123
|
+
qualityLevels: import("vue").Ref<{
|
|
124
|
+
index: number;
|
|
125
|
+
height: number;
|
|
126
|
+
bitrate: number;
|
|
127
|
+
label: string;
|
|
128
|
+
}[], QualityLevelInfo[] | {
|
|
129
|
+
index: number;
|
|
130
|
+
height: number;
|
|
131
|
+
bitrate: number;
|
|
132
|
+
label: string;
|
|
133
|
+
}[]>;
|
|
134
|
+
currentQualityIndex: import("vue").Ref<number | null, number | null>;
|
|
135
|
+
isAutoQuality: import("vue").Ref<boolean, boolean>;
|
|
136
|
+
supportsPip: import("vue").Ref<boolean, boolean>;
|
|
137
|
+
isPipActive: import("vue").Ref<boolean, boolean>;
|
|
138
|
+
isNativeUi: import("vue").Ref<boolean, boolean>;
|
|
139
|
+
};
|
|
140
|
+
type PlayerState = ReturnType<typeof createPlayerState>;
|
|
141
|
+
//#endregion
|
|
142
|
+
//#region src/composables/player/usePlayerControls.d.ts
|
|
143
|
+
interface UsePlayerControlsReturn {
|
|
144
|
+
play: () => Promise<void>;
|
|
145
|
+
pause: () => void;
|
|
146
|
+
replay: () => Promise<void>;
|
|
147
|
+
togglePlay: () => void;
|
|
148
|
+
seek: (percent: number) => void;
|
|
149
|
+
seekTo: (seconds: number) => void;
|
|
150
|
+
toggleMute: () => void;
|
|
151
|
+
setVolume: (vol: number) => void;
|
|
152
|
+
toggleLoop: () => void;
|
|
153
|
+
setPlaybackRate: (rate: number) => void;
|
|
154
|
+
setCaptionTrack: (index: number | null) => void;
|
|
155
|
+
setQuality: (index: number | null) => void;
|
|
156
|
+
togglePip: () => void;
|
|
157
|
+
}
|
|
158
|
+
//#endregion
|
|
159
|
+
//#region src/composables/player/usePlayer.d.ts
|
|
160
|
+
type UsePlayerReturn = PlayerState & UsePlayerControlsReturn & {
|
|
161
|
+
fire: (type: StateChangeType, extras?: Partial<StateChangeEvent>) => void;
|
|
162
|
+
retry: () => void;
|
|
163
|
+
isBuffering: Ref<boolean>;
|
|
164
|
+
toggleAdMute: () => void;
|
|
165
|
+
isFullscreen: Ref<boolean>;
|
|
166
|
+
isFullscreenPending: Ref<boolean>;
|
|
167
|
+
toggleFullscreen: () => void;
|
|
168
|
+
};
|
|
169
|
+
//#endregion
|
|
170
|
+
//#region src/composables/player/playerSurface.d.ts
|
|
171
|
+
declare const PLAYER_METHOD_KEYS: readonly ["retry", "play", "pause", "replay", "togglePlay", "seek", "seekTo", "toggleMute", "setVolume", "toggleFullscreen", "toggleLoop", "toggleAdMute", "setPlaybackRate", "setCaptionTrack", "setQuality", "togglePip"];
|
|
172
|
+
declare const PLAYER_STATE_KEYS: readonly ["isPlaying", "hasEnded", "isReady", "isLoaded", "isAdPlaying", "isAdPaused", "isAdMuted", "adRemainingTime", "isLive", "isBuffering", "current", "total", "vol", "isMuted", "isAudible", "isLooping", "currentPlaybackRate", "hasStarted", "isError", "errorMessage", "progress", "bufferedDisplay", "isFullscreen", "supportsPlaybackRate", "supportsCaptions", "captionTracks", "activeCaptionIndex", "supportsQuality", "qualityLevels", "currentQualityIndex", "isAutoQuality", "supportsPip", "isPipActive", "isNativeUi"];
|
|
173
|
+
type PlayerMethodKey = (typeof PLAYER_METHOD_KEYS)[number];
|
|
174
|
+
type PlayerStateKey = (typeof PLAYER_STATE_KEYS)[number];
|
|
175
|
+
//#endregion
|
|
89
176
|
//#region src/types/player.d.ts
|
|
90
177
|
type BuiltinAction = 'mute' | 'loop' | 'autoplay';
|
|
91
178
|
interface CustomAction {
|
|
@@ -94,6 +181,25 @@ interface CustomAction {
|
|
|
94
181
|
onClick: () => void;
|
|
95
182
|
}
|
|
96
183
|
type PlayerAction = BuiltinAction | CustomAction;
|
|
184
|
+
type StateChangeType = 'loaded' | 'play' | 'pause' | 'ended' | 'seeked' | 'error' | 'adstart' | 'adend' | 'volumechange' | 'ratechange' | 'captionchange' | 'qualitychange' | 'pipchange' | 'loopchange' | 'firstQuartile' | 'midpoint' | 'thirdQuartile' | 'controlsopen' | 'controlsclose' | 'stageopen' | 'stageclose' | 'bufferstart' | 'bufferend' | 'timeupdate' | 'tap';
|
|
185
|
+
interface StateChangeEvent {
|
|
186
|
+
type: StateChangeType;
|
|
187
|
+
currentTime: number;
|
|
188
|
+
duration: number;
|
|
189
|
+
src: string;
|
|
190
|
+
error?: {
|
|
191
|
+
code: number;
|
|
192
|
+
message: string;
|
|
193
|
+
} | null;
|
|
194
|
+
isMuted?: boolean;
|
|
195
|
+
playbackRate?: number;
|
|
196
|
+
captionIndex?: number | null;
|
|
197
|
+
qualityIndex?: number | null;
|
|
198
|
+
isPipActive?: boolean;
|
|
199
|
+
isLooping?: boolean;
|
|
200
|
+
element?: HTMLElement | null;
|
|
201
|
+
payload?: Record<string, unknown>;
|
|
202
|
+
}
|
|
97
203
|
interface HeaderBiddingAdUnit {
|
|
98
204
|
code: string;
|
|
99
205
|
mediaTypes: {
|
|
@@ -118,7 +224,7 @@ interface CaptionTrackDef {
|
|
|
118
224
|
}
|
|
119
225
|
interface PlayerProps {
|
|
120
226
|
src: string;
|
|
121
|
-
|
|
227
|
+
label?: string;
|
|
122
228
|
poster?: string;
|
|
123
229
|
aspectRatio?: string;
|
|
124
230
|
adTagUrl?: string;
|
|
@@ -130,8 +236,6 @@ interface PlayerProps {
|
|
|
130
236
|
volume?: number;
|
|
131
237
|
playbackRate?: number;
|
|
132
238
|
nativeUi?: boolean;
|
|
133
|
-
autoStage?: boolean;
|
|
134
|
-
lazy?: boolean;
|
|
135
239
|
payload?: Record<string, unknown> | string;
|
|
136
240
|
action?: PlayerAction | null;
|
|
137
241
|
disableTapCapture?: boolean;
|
|
@@ -144,72 +248,32 @@ interface PlayerProps {
|
|
|
144
248
|
}
|
|
145
249
|
type PinCorner = 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left';
|
|
146
250
|
type PreloadMode = 'none' | 'metadata' | 'auto';
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
251
|
+
interface VideoEntry extends PlayerProps {
|
|
252
|
+
lazy?: boolean;
|
|
253
|
+
autoStage?: boolean;
|
|
150
254
|
}
|
|
151
255
|
interface TranscriptCue {
|
|
152
256
|
time: number;
|
|
153
257
|
end?: number;
|
|
154
258
|
text: string;
|
|
155
259
|
}
|
|
156
|
-
|
|
157
|
-
isPlaying: boolean;
|
|
158
|
-
togglePlay(): void;
|
|
159
|
-
hasEnded: boolean;
|
|
160
|
-
isError: boolean;
|
|
161
|
-
retry(): void;
|
|
162
|
-
isMuted: boolean;
|
|
163
|
-
toggleMute(): void;
|
|
164
|
-
isAudible: boolean;
|
|
165
|
-
isFullscreen: boolean;
|
|
166
|
-
toggleFullscreen(): void;
|
|
167
|
-
current: number;
|
|
168
|
-
total: number;
|
|
169
|
-
seek(percent: number): void;
|
|
170
|
-
bufferedDisplay: number;
|
|
171
|
-
isBuffering: boolean;
|
|
172
|
-
isLive: boolean;
|
|
173
|
-
vol: number;
|
|
174
|
-
setVolume(vol: number): void;
|
|
175
|
-
isLooping: boolean;
|
|
176
|
-
toggleLoop(): void;
|
|
177
|
-
supportsPip: boolean;
|
|
178
|
-
isPipActive: boolean;
|
|
179
|
-
togglePip(): void;
|
|
180
|
-
supportsCaptions: boolean;
|
|
181
|
-
captionTracks: CaptionTrackInfo[];
|
|
182
|
-
activeCaptionIndex: number | null;
|
|
183
|
-
setCaptionTrack(index: number | null): void;
|
|
184
|
-
supportsQuality: boolean;
|
|
185
|
-
qualityLevels: QualityLevelInfo[];
|
|
186
|
-
currentQualityIndex: number | null;
|
|
187
|
-
isAutoQuality: boolean;
|
|
188
|
-
setQuality(index: number | null): void;
|
|
189
|
-
supportsPlaybackRate: boolean;
|
|
190
|
-
currentPlaybackRate: number;
|
|
191
|
-
setPlaybackRate(rate: number): void;
|
|
192
|
-
}
|
|
260
|
+
type PlayerHandle = Pick<UnwrapNestedRefs<UsePlayerReturn>, PlayerMethodKey | PlayerStateKey>;
|
|
193
261
|
//#endregion
|
|
194
262
|
//#region src/adapters/index.d.ts
|
|
195
|
-
export declare function
|
|
196
|
-
|
|
197
|
-
|
|
263
|
+
export declare function resolvePlatform(url: string): {
|
|
264
|
+
key: string;
|
|
265
|
+
embed: boolean;
|
|
266
|
+
};
|
|
198
267
|
export declare function registerPlatform(config: PlatformConfig): void;
|
|
199
268
|
//#endregion
|
|
200
269
|
//#region src/elements/core.d.ts
|
|
201
|
-
declare const VideoPlayerElement: import("vue").VueElementConstructor<PlayerProps
|
|
202
|
-
hasPlaylist?: boolean;
|
|
203
|
-
hasNext?: boolean;
|
|
204
|
-
hasPrevious?: boolean;
|
|
205
|
-
autoAdvance?: boolean;
|
|
206
|
-
}>;
|
|
270
|
+
declare const VideoPlayerElement: import("vue").VueElementConstructor<PlayerProps>;
|
|
207
271
|
declare const VideoStageElement: import("vue").VueElementConstructor<{
|
|
208
|
-
pin?:
|
|
272
|
+
pin?: PinCorner | "full-width";
|
|
209
273
|
playlist?: VideoEntry[];
|
|
210
274
|
}>;
|
|
211
|
-
declare const VideoPlaceholderElement: import("vue").VueElementConstructor<
|
|
212
|
-
declare const VideoCardElement: import("vue").VueElementConstructor<
|
|
275
|
+
declare const VideoPlaceholderElement: import("vue").VueElementConstructor<VideoEntry>;
|
|
276
|
+
declare const VideoCardElement: import("vue").VueElementConstructor<VideoEntry>;
|
|
213
277
|
declare const HideMarkerElement: import("vue").VueElementConstructor<{}>;
|
|
214
278
|
export declare function defineElements(): void;
|
|
215
279
|
//#endregion
|