@hanifhan1f/vidstack-react 1.12.30 → 1.12.31
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/dev/chunks/vidstack-3rdEWplD.js +189 -0
- package/dev/chunks/vidstack-BRTBRJ_I.js +288 -0
- package/dev/chunks/vidstack-C56TjAKZ.js +61 -0
- package/dev/chunks/vidstack-C5tZAkKo.js +11694 -0
- package/dev/chunks/vidstack-CXjRKTos.js +401 -0
- package/dev/chunks/vidstack-C_xw7iZ2.js +34 -0
- package/dev/chunks/vidstack-CaaASbOf.js +476 -0
- package/dev/chunks/vidstack-D2Bi2Td9.js +1537 -0
- package/dev/chunks/vidstack-D95QIbAo.js +551 -0
- package/dev/chunks/vidstack-DnmOVAbr.js +643 -0
- package/dev/chunks/vidstack-Dnoefs4z.js +180 -0
- package/dev/chunks/vidstack-S_S6XDnL.js +375 -0
- package/dev/chunks/vidstack-oOGofWSl.js +668 -0
- package/dev/chunks/vidstack-vh0BKYWJ.js +84 -0
- package/dev/player/vidstack-default-components.js +8 -9
- package/dev/player/vidstack-default-icons.js +1 -1
- package/dev/player/vidstack-default-layout.js +8 -9
- package/dev/player/vidstack-plyr-layout.js +63 -77
- package/dev/player/vidstack-remotion.js +6 -6
- package/dev/vidstack.js +133 -22
- package/package.json +1 -1
- package/prod/chunks/vidstack-B0SSIHIv.js +1537 -0
- package/prod/chunks/vidstack-B3E9kXKq.js +34 -0
- package/prod/chunks/vidstack-BLWRqo3I.js +470 -0
- package/prod/chunks/vidstack-BXAOpsiW.js +61 -0
- package/prod/chunks/vidstack-BzPma_p3.js +288 -0
- package/prod/chunks/vidstack-C48MQkXV.js +11199 -0
- package/prod/chunks/vidstack-CKBLQMZi.js +159 -0
- package/prod/chunks/vidstack-CwlfLr4v.js +504 -0
- package/prod/chunks/vidstack-DVMwXUgY.js +189 -0
- package/prod/chunks/vidstack-D_Sd7838.js +663 -0
- package/prod/chunks/vidstack-DgsBXr1J.js +84 -0
- package/prod/chunks/vidstack-DhSvljmQ.js +375 -0
- package/prod/chunks/vidstack-DlPpeEXU.js +545 -0
- package/prod/chunks/vidstack-xwdT591E.js +386 -0
- package/prod/player/vidstack-default-components.js +8 -9
- package/prod/player/vidstack-default-icons.js +1 -1
- package/prod/player/vidstack-default-layout.js +8 -9
- package/prod/player/vidstack-plyr-layout.js +63 -77
- package/prod/player/vidstack-remotion.js +6 -6
- package/prod/vidstack.js +204 -22
- package/server/chunks/vidstack--ufi23Q6.js +1537 -0
- package/server/chunks/vidstack-3hd9uS5U.js +386 -0
- package/server/chunks/vidstack-B_l_DXPI.js +61 -0
- package/server/chunks/vidstack-Bb44UuL8.js +470 -0
- package/server/chunks/vidstack-Bu9QXEz1.js +159 -0
- package/server/chunks/vidstack-Cb_tNfNU.js +11199 -0
- package/server/chunks/vidstack-D9vUNwri.js +288 -0
- package/server/chunks/vidstack-DM-5dPT-.js +663 -0
- package/server/chunks/vidstack-DWfS9vAY.js +84 -0
- package/server/chunks/vidstack-DY51lx0R.js +189 -0
- package/server/chunks/vidstack-VGPw_CQP.js +375 -0
- package/server/chunks/vidstack-dz2TmHzm.js +34 -0
- package/server/chunks/vidstack-e0ZPAI-d.js +504 -0
- package/server/chunks/vidstack-zzooMghu.js +545 -0
- package/server/player/vidstack-default-components.js +8 -9
- package/server/player/vidstack-default-icons.js +1 -1
- package/server/player/vidstack-default-layout.js +8 -9
- package/server/player/vidstack-plyr-layout.js +63 -77
- package/server/player/vidstack-remotion.js +6 -6
- package/server/vidstack.js +204 -22
|
@@ -0,0 +1,470 @@
|
|
|
1
|
+
"use client"
|
|
2
|
+
|
|
3
|
+
import { listenEvent, effect, untrack, createScope, keysOf, onDispose, DOMEvent, peek } from './vidstack-D_bWd66h.js';
|
|
4
|
+
import { ListSymbol, TimeRange, RAFLoop } from './vidstack-Cb_tNfNU.js';
|
|
5
|
+
import { getCastSessionMedia, getCastContext, getCastSession, hasActiveCastSession, listenCastContextEvent, getCastErrorMessage } from './vidstack-Bu9QXEz1.js';
|
|
6
|
+
import 'react';
|
|
7
|
+
import '@floating-ui/dom';
|
|
8
|
+
|
|
9
|
+
class GoogleCastMediaInfoBuilder {
|
|
10
|
+
#info;
|
|
11
|
+
constructor(src) {
|
|
12
|
+
this.#info = new chrome.cast.media.MediaInfo(src.src, src.type);
|
|
13
|
+
}
|
|
14
|
+
build() {
|
|
15
|
+
return this.#info;
|
|
16
|
+
}
|
|
17
|
+
setStreamType(streamType) {
|
|
18
|
+
if (streamType.includes("live")) {
|
|
19
|
+
this.#info.streamType = chrome.cast.media.StreamType.LIVE;
|
|
20
|
+
} else {
|
|
21
|
+
this.#info.streamType = chrome.cast.media.StreamType.BUFFERED;
|
|
22
|
+
}
|
|
23
|
+
return this;
|
|
24
|
+
}
|
|
25
|
+
setTracks(tracks) {
|
|
26
|
+
this.#info.tracks = tracks.map(this.#buildCastTrack);
|
|
27
|
+
return this;
|
|
28
|
+
}
|
|
29
|
+
setMetadata(title, poster) {
|
|
30
|
+
this.#info.metadata = new chrome.cast.media.GenericMediaMetadata();
|
|
31
|
+
this.#info.metadata.title = title;
|
|
32
|
+
this.#info.metadata.images = [{ url: poster }];
|
|
33
|
+
return this;
|
|
34
|
+
}
|
|
35
|
+
#buildCastTrack(track, trackId) {
|
|
36
|
+
const castTrack = new chrome.cast.media.Track(trackId, chrome.cast.media.TrackType.TEXT);
|
|
37
|
+
castTrack.name = track.label;
|
|
38
|
+
castTrack.trackContentId = track.src;
|
|
39
|
+
castTrack.trackContentType = "text/vtt";
|
|
40
|
+
castTrack.language = track.language;
|
|
41
|
+
castTrack.subtype = track.kind.toUpperCase();
|
|
42
|
+
return castTrack;
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
class GoogleCastTracksManager {
|
|
47
|
+
#cast;
|
|
48
|
+
#ctx;
|
|
49
|
+
#onNewLocalTracks;
|
|
50
|
+
constructor(cast, ctx, onNewLocalTracks) {
|
|
51
|
+
this.#cast = cast;
|
|
52
|
+
this.#ctx = ctx;
|
|
53
|
+
this.#onNewLocalTracks = onNewLocalTracks;
|
|
54
|
+
}
|
|
55
|
+
setup() {
|
|
56
|
+
const syncRemoteActiveIds = this.syncRemoteActiveIds.bind(this);
|
|
57
|
+
listenEvent(this.#ctx.audioTracks, "change", syncRemoteActiveIds);
|
|
58
|
+
listenEvent(this.#ctx.textTracks, "mode-change", syncRemoteActiveIds);
|
|
59
|
+
effect(this.#syncLocalTracks.bind(this));
|
|
60
|
+
}
|
|
61
|
+
getLocalTextTracks() {
|
|
62
|
+
return this.#ctx.$state.textTracks().filter((track) => track.src && track.type === "vtt");
|
|
63
|
+
}
|
|
64
|
+
#getLocalAudioTracks() {
|
|
65
|
+
return this.#ctx.$state.audioTracks();
|
|
66
|
+
}
|
|
67
|
+
#getRemoteTracks(type) {
|
|
68
|
+
const tracks = this.#cast.mediaInfo?.tracks ?? [];
|
|
69
|
+
return type ? tracks.filter((track) => track.type === type) : tracks;
|
|
70
|
+
}
|
|
71
|
+
#getRemoteActiveIds() {
|
|
72
|
+
const activeIds = [], activeLocalAudioTrack = this.#getLocalAudioTracks().find((track) => track.selected), activeLocalTextTracks = this.getLocalTextTracks().filter((track) => track.mode === "showing");
|
|
73
|
+
if (activeLocalAudioTrack) {
|
|
74
|
+
const remoteAudioTracks = this.#getRemoteTracks(chrome.cast.media.TrackType.AUDIO), remoteAudioTrack = this.#findRemoteTrack(remoteAudioTracks, activeLocalAudioTrack);
|
|
75
|
+
if (remoteAudioTrack) activeIds.push(remoteAudioTrack.trackId);
|
|
76
|
+
}
|
|
77
|
+
if (activeLocalTextTracks?.length) {
|
|
78
|
+
const remoteTextTracks = this.#getRemoteTracks(chrome.cast.media.TrackType.TEXT);
|
|
79
|
+
if (remoteTextTracks.length) {
|
|
80
|
+
for (const localTrack of activeLocalTextTracks) {
|
|
81
|
+
const remoteTextTrack = this.#findRemoteTrack(remoteTextTracks, localTrack);
|
|
82
|
+
if (remoteTextTrack) activeIds.push(remoteTextTrack.trackId);
|
|
83
|
+
}
|
|
84
|
+
}
|
|
85
|
+
}
|
|
86
|
+
return activeIds;
|
|
87
|
+
}
|
|
88
|
+
#syncLocalTracks() {
|
|
89
|
+
const localTextTracks = this.getLocalTextTracks();
|
|
90
|
+
if (!this.#cast.isMediaLoaded) return;
|
|
91
|
+
const remoteTextTracks = this.#getRemoteTracks(chrome.cast.media.TrackType.TEXT);
|
|
92
|
+
for (const localTrack of localTextTracks) {
|
|
93
|
+
const hasRemoteTrack = this.#findRemoteTrack(remoteTextTracks, localTrack);
|
|
94
|
+
if (!hasRemoteTrack) {
|
|
95
|
+
untrack(() => this.#onNewLocalTracks?.());
|
|
96
|
+
break;
|
|
97
|
+
}
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
syncRemoteTracks(event) {
|
|
101
|
+
if (!this.#cast.isMediaLoaded) return;
|
|
102
|
+
const localAudioTracks = this.#getLocalAudioTracks(), localTextTracks = this.getLocalTextTracks(), remoteAudioTracks = this.#getRemoteTracks(chrome.cast.media.TrackType.AUDIO), remoteTextTracks = this.#getRemoteTracks(chrome.cast.media.TrackType.TEXT);
|
|
103
|
+
for (const remoteAudioTrack of remoteAudioTracks) {
|
|
104
|
+
const hasLocalTrack = this.#findLocalTrack(localAudioTracks, remoteAudioTrack);
|
|
105
|
+
if (hasLocalTrack) continue;
|
|
106
|
+
const localAudioTrack = {
|
|
107
|
+
id: remoteAudioTrack.trackId.toString(),
|
|
108
|
+
label: remoteAudioTrack.name,
|
|
109
|
+
language: remoteAudioTrack.language,
|
|
110
|
+
kind: remoteAudioTrack.subtype ?? "main",
|
|
111
|
+
selected: false
|
|
112
|
+
};
|
|
113
|
+
this.#ctx.audioTracks[ListSymbol.add](localAudioTrack, event);
|
|
114
|
+
}
|
|
115
|
+
for (const remoteTextTrack of remoteTextTracks) {
|
|
116
|
+
const hasLocalTrack = this.#findLocalTrack(localTextTracks, remoteTextTrack);
|
|
117
|
+
if (hasLocalTrack) continue;
|
|
118
|
+
const localTextTrack = {
|
|
119
|
+
id: remoteTextTrack.trackId.toString(),
|
|
120
|
+
src: remoteTextTrack.trackContentId,
|
|
121
|
+
label: remoteTextTrack.name,
|
|
122
|
+
language: remoteTextTrack.language,
|
|
123
|
+
kind: remoteTextTrack.subtype.toLowerCase()
|
|
124
|
+
};
|
|
125
|
+
this.#ctx.textTracks.add(localTextTrack, event);
|
|
126
|
+
}
|
|
127
|
+
}
|
|
128
|
+
syncRemoteActiveIds(event) {
|
|
129
|
+
if (!this.#cast.isMediaLoaded) return;
|
|
130
|
+
const activeIds = this.#getRemoteActiveIds(), editRequest = new chrome.cast.media.EditTracksInfoRequest(activeIds);
|
|
131
|
+
this.#editTracksInfo(editRequest).catch((error) => {
|
|
132
|
+
});
|
|
133
|
+
}
|
|
134
|
+
#editTracksInfo(request) {
|
|
135
|
+
const media = getCastSessionMedia();
|
|
136
|
+
return new Promise((resolve, reject) => media?.editTracksInfo(request, resolve, reject));
|
|
137
|
+
}
|
|
138
|
+
#findLocalTrack(localTracks, remoteTrack) {
|
|
139
|
+
return localTracks.find((localTrack) => this.#isMatch(localTrack, remoteTrack));
|
|
140
|
+
}
|
|
141
|
+
#findRemoteTrack(remoteTracks, localTrack) {
|
|
142
|
+
return remoteTracks.find((remoteTrack) => this.#isMatch(localTrack, remoteTrack));
|
|
143
|
+
}
|
|
144
|
+
// Note: we can't rely on id matching because they will differ between local/remote. A local
|
|
145
|
+
// track id might not even exist.
|
|
146
|
+
#isMatch(localTrack, remoteTrack) {
|
|
147
|
+
return remoteTrack.name === localTrack.label && remoteTrack.language === localTrack.language && remoteTrack.subtype.toLowerCase() === localTrack.kind.toLowerCase();
|
|
148
|
+
}
|
|
149
|
+
}
|
|
150
|
+
|
|
151
|
+
class GoogleCastProvider {
|
|
152
|
+
$$PROVIDER_TYPE = "GOOGLE_CAST";
|
|
153
|
+
scope = createScope();
|
|
154
|
+
#player;
|
|
155
|
+
#ctx;
|
|
156
|
+
#tracks;
|
|
157
|
+
#currentSrc = null;
|
|
158
|
+
#state = "disconnected";
|
|
159
|
+
#currentTime = 0;
|
|
160
|
+
#played = 0;
|
|
161
|
+
#seekableRange = new TimeRange(0, 0);
|
|
162
|
+
#timeRAF = new RAFLoop(this.#onAnimationFrame.bind(this));
|
|
163
|
+
#playerEventHandlers;
|
|
164
|
+
#reloadInfo = null;
|
|
165
|
+
#isIdle = false;
|
|
166
|
+
constructor(player, ctx) {
|
|
167
|
+
this.#player = player;
|
|
168
|
+
this.#ctx = ctx;
|
|
169
|
+
this.#tracks = new GoogleCastTracksManager(player, ctx, this.#onNewLocalTracks.bind(this));
|
|
170
|
+
}
|
|
171
|
+
get type() {
|
|
172
|
+
return "google-cast";
|
|
173
|
+
}
|
|
174
|
+
get currentSrc() {
|
|
175
|
+
return this.#currentSrc;
|
|
176
|
+
}
|
|
177
|
+
/**
|
|
178
|
+
* The Google Cast remote player.
|
|
179
|
+
*
|
|
180
|
+
* @see {@link https://developers.google.com/cast/docs/reference/web_sender/cast.framework.RemotePlayer}
|
|
181
|
+
*/
|
|
182
|
+
get player() {
|
|
183
|
+
return this.#player;
|
|
184
|
+
}
|
|
185
|
+
/**
|
|
186
|
+
* @see {@link https://developers.google.com/cast/docs/reference/web_sender/cast.framework.CastContext}
|
|
187
|
+
*/
|
|
188
|
+
get cast() {
|
|
189
|
+
return getCastContext();
|
|
190
|
+
}
|
|
191
|
+
/**
|
|
192
|
+
* @see {@link https://developers.google.com/cast/docs/reference/web_sender/cast.framework.CastSession}
|
|
193
|
+
*/
|
|
194
|
+
get session() {
|
|
195
|
+
return getCastSession();
|
|
196
|
+
}
|
|
197
|
+
/**
|
|
198
|
+
* @see {@link https://developers.google.com/cast/docs/reference/web_sender/chrome.cast.media.Media}
|
|
199
|
+
*/
|
|
200
|
+
get media() {
|
|
201
|
+
return getCastSessionMedia();
|
|
202
|
+
}
|
|
203
|
+
/**
|
|
204
|
+
* Whether the current Google Cast session belongs to this provider.
|
|
205
|
+
*/
|
|
206
|
+
get hasActiveSession() {
|
|
207
|
+
return hasActiveCastSession(this.#currentSrc);
|
|
208
|
+
}
|
|
209
|
+
setup() {
|
|
210
|
+
this.#attachCastContextEventListeners();
|
|
211
|
+
this.#attachCastPlayerEventListeners();
|
|
212
|
+
this.#tracks.setup();
|
|
213
|
+
this.#ctx.notify("provider-setup", this);
|
|
214
|
+
}
|
|
215
|
+
#attachCastContextEventListeners() {
|
|
216
|
+
listenCastContextEvent(
|
|
217
|
+
cast.framework.CastContextEventType.CAST_STATE_CHANGED,
|
|
218
|
+
this.#onCastStateChange.bind(this)
|
|
219
|
+
);
|
|
220
|
+
}
|
|
221
|
+
#attachCastPlayerEventListeners() {
|
|
222
|
+
const Event2 = cast.framework.RemotePlayerEventType, handlers = {
|
|
223
|
+
[Event2.IS_CONNECTED_CHANGED]: this.#onCastStateChange,
|
|
224
|
+
[Event2.IS_MEDIA_LOADED_CHANGED]: this.#onMediaLoadedChange,
|
|
225
|
+
[Event2.CAN_CONTROL_VOLUME_CHANGED]: this.#onCanControlVolumeChange,
|
|
226
|
+
[Event2.CAN_SEEK_CHANGED]: this.#onCanSeekChange,
|
|
227
|
+
[Event2.DURATION_CHANGED]: this.#onDurationChange,
|
|
228
|
+
[Event2.IS_MUTED_CHANGED]: this.#onVolumeChange,
|
|
229
|
+
[Event2.VOLUME_LEVEL_CHANGED]: this.#onVolumeChange,
|
|
230
|
+
[Event2.IS_PAUSED_CHANGED]: this.#onPausedChange,
|
|
231
|
+
[Event2.LIVE_SEEKABLE_RANGE_CHANGED]: this.#onProgress,
|
|
232
|
+
[Event2.PLAYER_STATE_CHANGED]: this.#onPlayerStateChange
|
|
233
|
+
};
|
|
234
|
+
this.#playerEventHandlers = handlers;
|
|
235
|
+
const handler = this.#onRemotePlayerEvent.bind(this);
|
|
236
|
+
for (const type of keysOf(handlers)) {
|
|
237
|
+
this.#player.controller.addEventListener(type, handler);
|
|
238
|
+
}
|
|
239
|
+
onDispose(() => {
|
|
240
|
+
for (const type of keysOf(handlers)) {
|
|
241
|
+
this.#player.controller.removeEventListener(type, handler);
|
|
242
|
+
}
|
|
243
|
+
});
|
|
244
|
+
}
|
|
245
|
+
async play() {
|
|
246
|
+
if (!this.#player.isPaused && !this.#isIdle) return;
|
|
247
|
+
if (this.#isIdle) {
|
|
248
|
+
await this.#reload(false, 0);
|
|
249
|
+
return;
|
|
250
|
+
}
|
|
251
|
+
this.#player.controller?.playOrPause();
|
|
252
|
+
}
|
|
253
|
+
async pause() {
|
|
254
|
+
if (this.#player.isPaused) return;
|
|
255
|
+
this.#player.controller?.playOrPause();
|
|
256
|
+
}
|
|
257
|
+
getMediaStatus(request) {
|
|
258
|
+
return new Promise((resolve, reject) => {
|
|
259
|
+
this.media?.getStatus(request, resolve, reject);
|
|
260
|
+
});
|
|
261
|
+
}
|
|
262
|
+
setMuted(muted) {
|
|
263
|
+
const hasChanged = muted && !this.#player.isMuted || !muted && this.#player.isMuted;
|
|
264
|
+
if (hasChanged) this.#player.controller?.muteOrUnmute();
|
|
265
|
+
}
|
|
266
|
+
setCurrentTime(time) {
|
|
267
|
+
this.#player.currentTime = time;
|
|
268
|
+
this.#ctx.notify("seeking", time);
|
|
269
|
+
this.#player.controller?.seek();
|
|
270
|
+
}
|
|
271
|
+
setVolume(volume) {
|
|
272
|
+
this.#player.volumeLevel = volume;
|
|
273
|
+
this.#player.controller?.setVolumeLevel();
|
|
274
|
+
}
|
|
275
|
+
async loadSource(src) {
|
|
276
|
+
if (this.#reloadInfo?.src !== src) this.#reloadInfo = null;
|
|
277
|
+
if (hasActiveCastSession(src)) {
|
|
278
|
+
this.#resumeSession();
|
|
279
|
+
this.#currentSrc = src;
|
|
280
|
+
return;
|
|
281
|
+
}
|
|
282
|
+
this.#ctx.notify("load-start");
|
|
283
|
+
const loadRequest = this.#buildLoadRequest(src), errorCode = await this.session.loadMedia(loadRequest);
|
|
284
|
+
if (errorCode) {
|
|
285
|
+
this.#currentSrc = null;
|
|
286
|
+
this.#ctx.notify("error", Error(getCastErrorMessage(errorCode)));
|
|
287
|
+
return;
|
|
288
|
+
}
|
|
289
|
+
this.#currentSrc = src;
|
|
290
|
+
}
|
|
291
|
+
destroy() {
|
|
292
|
+
this.#reset();
|
|
293
|
+
this.#endSession();
|
|
294
|
+
}
|
|
295
|
+
#reset() {
|
|
296
|
+
if (!this.#reloadInfo) {
|
|
297
|
+
this.#played = 0;
|
|
298
|
+
this.#seekableRange = new TimeRange(0, 0);
|
|
299
|
+
}
|
|
300
|
+
this.#timeRAF.stop();
|
|
301
|
+
this.#currentTime = 0;
|
|
302
|
+
this.#reloadInfo = null;
|
|
303
|
+
}
|
|
304
|
+
#resumeSession() {
|
|
305
|
+
const resumeSessionEvent = new DOMEvent("resume-session", { detail: this.session });
|
|
306
|
+
this.#onMediaLoadedChange(resumeSessionEvent);
|
|
307
|
+
const { muted, volume, savedState } = this.#ctx.$state, localState = savedState();
|
|
308
|
+
this.setCurrentTime(Math.max(this.#player.currentTime, localState?.currentTime ?? 0));
|
|
309
|
+
this.setMuted(muted());
|
|
310
|
+
this.setVolume(volume());
|
|
311
|
+
if (localState?.paused === false) this.play();
|
|
312
|
+
}
|
|
313
|
+
#endSession() {
|
|
314
|
+
this.cast.endCurrentSession(true);
|
|
315
|
+
const { remotePlaybackLoader } = this.#ctx.$state;
|
|
316
|
+
remotePlaybackLoader.set(null);
|
|
317
|
+
}
|
|
318
|
+
#disconnectFromReceiver() {
|
|
319
|
+
const { savedState } = this.#ctx.$state;
|
|
320
|
+
savedState.set({
|
|
321
|
+
paused: this.#player.isPaused,
|
|
322
|
+
currentTime: this.#player.currentTime
|
|
323
|
+
});
|
|
324
|
+
this.#endSession();
|
|
325
|
+
}
|
|
326
|
+
#onAnimationFrame() {
|
|
327
|
+
this.#onCurrentTimeChange();
|
|
328
|
+
}
|
|
329
|
+
#onRemotePlayerEvent(event) {
|
|
330
|
+
this.#playerEventHandlers[event.type].call(this, event);
|
|
331
|
+
}
|
|
332
|
+
#onCastStateChange(data) {
|
|
333
|
+
const castState = this.cast.getCastState(), state = castState === cast.framework.CastState.CONNECTED ? "connected" : castState === cast.framework.CastState.CONNECTING ? "connecting" : "disconnected";
|
|
334
|
+
if (this.#state === state) return;
|
|
335
|
+
const detail = { type: "google-cast", state }, trigger = this.#createEvent(data);
|
|
336
|
+
this.#state = state;
|
|
337
|
+
this.#ctx.notify("remote-playback-change", detail, trigger);
|
|
338
|
+
if (state === "disconnected") {
|
|
339
|
+
this.#disconnectFromReceiver();
|
|
340
|
+
}
|
|
341
|
+
}
|
|
342
|
+
#onMediaLoadedChange(event) {
|
|
343
|
+
const hasLoaded = !!this.#player.isMediaLoaded;
|
|
344
|
+
if (!hasLoaded) return;
|
|
345
|
+
const src = peek(this.#ctx.$state.source);
|
|
346
|
+
Promise.resolve().then(() => {
|
|
347
|
+
if (src !== peek(this.#ctx.$state.source) || !this.#player.isMediaLoaded) return;
|
|
348
|
+
this.#reset();
|
|
349
|
+
const duration = this.#player.duration;
|
|
350
|
+
this.#seekableRange = new TimeRange(0, duration);
|
|
351
|
+
const detail = {
|
|
352
|
+
provider: this,
|
|
353
|
+
duration,
|
|
354
|
+
buffered: new TimeRange(0, 0),
|
|
355
|
+
seekable: this.#getSeekableRange()
|
|
356
|
+
}, trigger = this.#createEvent(event);
|
|
357
|
+
this.#ctx.notify("loaded-metadata", void 0, trigger);
|
|
358
|
+
this.#ctx.notify("loaded-data", void 0, trigger);
|
|
359
|
+
this.#ctx.notify("can-play", detail, trigger);
|
|
360
|
+
this.#onCanControlVolumeChange();
|
|
361
|
+
this.#onCanSeekChange(event);
|
|
362
|
+
const { volume, muted } = this.#ctx.$state;
|
|
363
|
+
this.setVolume(volume());
|
|
364
|
+
this.setMuted(muted());
|
|
365
|
+
this.#timeRAF.start();
|
|
366
|
+
this.#tracks.syncRemoteTracks(trigger);
|
|
367
|
+
this.#tracks.syncRemoteActiveIds(trigger);
|
|
368
|
+
});
|
|
369
|
+
}
|
|
370
|
+
#onCanControlVolumeChange() {
|
|
371
|
+
this.#ctx.$state.canSetVolume.set(this.#player.canControlVolume);
|
|
372
|
+
}
|
|
373
|
+
#onCanSeekChange(event) {
|
|
374
|
+
const trigger = this.#createEvent(event);
|
|
375
|
+
this.#ctx.notify("stream-type-change", this.#getStreamType(), trigger);
|
|
376
|
+
}
|
|
377
|
+
#getStreamType() {
|
|
378
|
+
const streamType = this.#player.mediaInfo?.streamType;
|
|
379
|
+
return streamType === chrome.cast.media.StreamType.LIVE ? this.#player.canSeek ? "live:dvr" : "live" : "on-demand";
|
|
380
|
+
}
|
|
381
|
+
#onCurrentTimeChange() {
|
|
382
|
+
if (this.#reloadInfo) return;
|
|
383
|
+
const currentTime = this.#player.currentTime;
|
|
384
|
+
if (currentTime === this.#currentTime) return;
|
|
385
|
+
this.#ctx.notify("time-change", currentTime);
|
|
386
|
+
if (currentTime > this.#played) {
|
|
387
|
+
this.#played = currentTime;
|
|
388
|
+
this.#onProgress();
|
|
389
|
+
}
|
|
390
|
+
if (this.#ctx.$state.seeking()) {
|
|
391
|
+
this.#ctx.notify("seeked", currentTime);
|
|
392
|
+
}
|
|
393
|
+
this.#currentTime = currentTime;
|
|
394
|
+
}
|
|
395
|
+
#onDurationChange(event) {
|
|
396
|
+
if (!this.#player.isMediaLoaded || this.#reloadInfo) return;
|
|
397
|
+
const duration = this.#player.duration, trigger = this.#createEvent(event);
|
|
398
|
+
this.#seekableRange = new TimeRange(0, duration);
|
|
399
|
+
this.#ctx.notify("duration-change", duration, trigger);
|
|
400
|
+
}
|
|
401
|
+
#onVolumeChange(event) {
|
|
402
|
+
if (!this.#player.isMediaLoaded) return;
|
|
403
|
+
const detail = {
|
|
404
|
+
muted: this.#player.isMuted,
|
|
405
|
+
volume: this.#player.volumeLevel
|
|
406
|
+
}, trigger = this.#createEvent(event);
|
|
407
|
+
this.#ctx.notify("volume-change", detail, trigger);
|
|
408
|
+
}
|
|
409
|
+
#onPausedChange(event) {
|
|
410
|
+
const trigger = this.#createEvent(event);
|
|
411
|
+
if (this.#player.isPaused) {
|
|
412
|
+
this.#ctx.notify("pause", void 0, trigger);
|
|
413
|
+
} else {
|
|
414
|
+
this.#ctx.notify("play", void 0, trigger);
|
|
415
|
+
}
|
|
416
|
+
}
|
|
417
|
+
#onProgress(event) {
|
|
418
|
+
const detail = {
|
|
419
|
+
seekable: this.#getSeekableRange(),
|
|
420
|
+
buffered: new TimeRange(0, this.#played)
|
|
421
|
+
}, trigger = event ? this.#createEvent(event) : void 0;
|
|
422
|
+
this.#ctx.notify("progress", detail, trigger);
|
|
423
|
+
}
|
|
424
|
+
#onPlayerStateChange(event) {
|
|
425
|
+
const state = this.#player.playerState, PlayerState = chrome.cast.media.PlayerState;
|
|
426
|
+
this.#isIdle = state === PlayerState.IDLE;
|
|
427
|
+
if (state === PlayerState.PAUSED) return;
|
|
428
|
+
const trigger = this.#createEvent(event);
|
|
429
|
+
switch (state) {
|
|
430
|
+
case PlayerState.PLAYING:
|
|
431
|
+
this.#ctx.notify("playing", void 0, trigger);
|
|
432
|
+
break;
|
|
433
|
+
case PlayerState.BUFFERING:
|
|
434
|
+
this.#ctx.notify("waiting", void 0, trigger);
|
|
435
|
+
break;
|
|
436
|
+
case PlayerState.IDLE:
|
|
437
|
+
this.#timeRAF.stop();
|
|
438
|
+
this.#ctx.notify("pause");
|
|
439
|
+
this.#ctx.notify("end");
|
|
440
|
+
break;
|
|
441
|
+
}
|
|
442
|
+
}
|
|
443
|
+
#getSeekableRange() {
|
|
444
|
+
return this.#player.liveSeekableRange ? new TimeRange(this.#player.liveSeekableRange.start, this.#player.liveSeekableRange.end) : this.#seekableRange;
|
|
445
|
+
}
|
|
446
|
+
#createEvent(detail) {
|
|
447
|
+
return detail instanceof Event ? detail : new DOMEvent(detail.type, { detail });
|
|
448
|
+
}
|
|
449
|
+
#buildMediaInfo(src) {
|
|
450
|
+
const { streamType, title, poster } = this.#ctx.$state;
|
|
451
|
+
return new GoogleCastMediaInfoBuilder(src).setMetadata(title(), poster()).setStreamType(streamType()).setTracks(this.#tracks.getLocalTextTracks()).build();
|
|
452
|
+
}
|
|
453
|
+
#buildLoadRequest(src) {
|
|
454
|
+
const mediaInfo = this.#buildMediaInfo(src), request = new chrome.cast.media.LoadRequest(mediaInfo), savedState = this.#ctx.$state.savedState();
|
|
455
|
+
request.autoplay = (this.#reloadInfo?.paused ?? savedState?.paused) === false;
|
|
456
|
+
request.currentTime = this.#reloadInfo?.time ?? savedState?.currentTime ?? 0;
|
|
457
|
+
return request;
|
|
458
|
+
}
|
|
459
|
+
async #reload(paused, time) {
|
|
460
|
+
const src = peek(this.#ctx.$state.source);
|
|
461
|
+
this.#reloadInfo = { src, paused, time };
|
|
462
|
+
await this.loadSource(src);
|
|
463
|
+
}
|
|
464
|
+
#onNewLocalTracks() {
|
|
465
|
+
this.#reload(this.#player.isPaused, this.#player.currentTime).catch((error) => {
|
|
466
|
+
});
|
|
467
|
+
}
|
|
468
|
+
}
|
|
469
|
+
|
|
470
|
+
export { GoogleCastProvider };
|
|
@@ -0,0 +1,159 @@
|
|
|
1
|
+
"use client"
|
|
2
|
+
|
|
3
|
+
import { IS_CHROME, IS_IOS, canGoogleCastSrc, IS_SERVER, loadScript } from './vidstack-Cb_tNfNU.js';
|
|
4
|
+
import { listenEvent, peek } from './vidstack-D_bWd66h.js';
|
|
5
|
+
|
|
6
|
+
function getCastFrameworkURL() {
|
|
7
|
+
return "https://www.gstatic.com/cv/js/sender/v1/cast_sender.js?loadCastFramework=1";
|
|
8
|
+
}
|
|
9
|
+
function hasLoadedCastFramework() {
|
|
10
|
+
return !!window.cast?.framework;
|
|
11
|
+
}
|
|
12
|
+
function isCastAvailable() {
|
|
13
|
+
return !!window.chrome?.cast?.isAvailable;
|
|
14
|
+
}
|
|
15
|
+
function isCastConnected() {
|
|
16
|
+
return getCastContext().getCastState() === cast.framework.CastState.CONNECTED;
|
|
17
|
+
}
|
|
18
|
+
function getCastContext() {
|
|
19
|
+
return window.cast.framework.CastContext.getInstance();
|
|
20
|
+
}
|
|
21
|
+
function getCastSession() {
|
|
22
|
+
return getCastContext().getCurrentSession();
|
|
23
|
+
}
|
|
24
|
+
function getCastSessionMedia() {
|
|
25
|
+
return getCastSession()?.getSessionObj().media[0];
|
|
26
|
+
}
|
|
27
|
+
function hasActiveCastSession(src) {
|
|
28
|
+
const contentId = getCastSessionMedia()?.media.contentId;
|
|
29
|
+
return contentId === src?.src;
|
|
30
|
+
}
|
|
31
|
+
function getDefaultCastOptions() {
|
|
32
|
+
return {
|
|
33
|
+
language: "en-US",
|
|
34
|
+
autoJoinPolicy: chrome.cast.AutoJoinPolicy.ORIGIN_SCOPED,
|
|
35
|
+
receiverApplicationId: chrome.cast.media.DEFAULT_MEDIA_RECEIVER_APP_ID,
|
|
36
|
+
resumeSavedSession: true,
|
|
37
|
+
androidReceiverCompatible: true
|
|
38
|
+
};
|
|
39
|
+
}
|
|
40
|
+
function getCastErrorMessage(code) {
|
|
41
|
+
const defaultMessage = `Google Cast Error Code: ${code}`;
|
|
42
|
+
return defaultMessage;
|
|
43
|
+
}
|
|
44
|
+
function listenCastContextEvent(type, handler) {
|
|
45
|
+
return listenEvent(getCastContext(), type, handler);
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
class GoogleCastLoader {
|
|
49
|
+
name = "google-cast";
|
|
50
|
+
target;
|
|
51
|
+
#player;
|
|
52
|
+
/**
|
|
53
|
+
* @see {@link https://developers.google.com/cast/docs/reference/web_sender/cast.framework.CastContext}
|
|
54
|
+
*/
|
|
55
|
+
get cast() {
|
|
56
|
+
return getCastContext();
|
|
57
|
+
}
|
|
58
|
+
mediaType() {
|
|
59
|
+
return "video";
|
|
60
|
+
}
|
|
61
|
+
canPlay(src) {
|
|
62
|
+
return IS_CHROME && !IS_IOS && canGoogleCastSrc(src);
|
|
63
|
+
}
|
|
64
|
+
async prompt(ctx) {
|
|
65
|
+
let loadEvent, openEvent, errorEvent;
|
|
66
|
+
try {
|
|
67
|
+
loadEvent = await this.#loadCastFramework(ctx);
|
|
68
|
+
if (!this.#player) {
|
|
69
|
+
this.#player = new cast.framework.RemotePlayer();
|
|
70
|
+
new cast.framework.RemotePlayerController(this.#player);
|
|
71
|
+
}
|
|
72
|
+
openEvent = ctx.player.createEvent("google-cast-prompt-open", {
|
|
73
|
+
trigger: loadEvent
|
|
74
|
+
});
|
|
75
|
+
ctx.player.dispatchEvent(openEvent);
|
|
76
|
+
this.#notifyRemoteStateChange(ctx, "connecting", openEvent);
|
|
77
|
+
await this.#showPrompt(peek(ctx.$props.googleCast));
|
|
78
|
+
ctx.$state.remotePlaybackInfo.set({
|
|
79
|
+
deviceName: getCastSession()?.getCastDevice().friendlyName
|
|
80
|
+
});
|
|
81
|
+
if (isCastConnected()) this.#notifyRemoteStateChange(ctx, "connected", openEvent);
|
|
82
|
+
} catch (code) {
|
|
83
|
+
const error = code instanceof Error ? code : this.#createError(
|
|
84
|
+
(code + "").toUpperCase(),
|
|
85
|
+
"Prompt failed."
|
|
86
|
+
);
|
|
87
|
+
errorEvent = ctx.player.createEvent("google-cast-prompt-error", {
|
|
88
|
+
detail: error,
|
|
89
|
+
trigger: openEvent ?? loadEvent,
|
|
90
|
+
cancelable: true
|
|
91
|
+
});
|
|
92
|
+
ctx.player.dispatch(errorEvent);
|
|
93
|
+
this.#notifyRemoteStateChange(
|
|
94
|
+
ctx,
|
|
95
|
+
isCastConnected() ? "connected" : "disconnected",
|
|
96
|
+
errorEvent
|
|
97
|
+
);
|
|
98
|
+
throw error;
|
|
99
|
+
} finally {
|
|
100
|
+
ctx.player.dispatch("google-cast-prompt-close", {
|
|
101
|
+
trigger: errorEvent ?? openEvent ?? loadEvent
|
|
102
|
+
});
|
|
103
|
+
}
|
|
104
|
+
}
|
|
105
|
+
async load(ctx) {
|
|
106
|
+
if (IS_SERVER) {
|
|
107
|
+
throw Error("[vidstack] can not load google cast provider server-side");
|
|
108
|
+
}
|
|
109
|
+
if (!this.#player) {
|
|
110
|
+
throw Error("[vidstack] google cast player was not initialized");
|
|
111
|
+
}
|
|
112
|
+
return new (await import('./vidstack-Bb44UuL8.js')).GoogleCastProvider(this.#player, ctx);
|
|
113
|
+
}
|
|
114
|
+
async #loadCastFramework(ctx) {
|
|
115
|
+
if (hasLoadedCastFramework()) return;
|
|
116
|
+
const loadStartEvent = ctx.player.createEvent("google-cast-load-start");
|
|
117
|
+
ctx.player.dispatch(loadStartEvent);
|
|
118
|
+
await loadScript(getCastFrameworkURL());
|
|
119
|
+
await customElements.whenDefined("google-cast-launcher");
|
|
120
|
+
const loadedEvent = ctx.player.createEvent("google-cast-loaded", { trigger: loadStartEvent });
|
|
121
|
+
ctx.player.dispatch(loadedEvent);
|
|
122
|
+
if (!isCastAvailable()) {
|
|
123
|
+
throw this.#createError("CAST_NOT_AVAILABLE", "Google Cast not available on this platform.");
|
|
124
|
+
}
|
|
125
|
+
return loadedEvent;
|
|
126
|
+
}
|
|
127
|
+
async #showPrompt(options) {
|
|
128
|
+
this.#setOptions(options);
|
|
129
|
+
const errorCode = await this.cast.requestSession();
|
|
130
|
+
if (errorCode) {
|
|
131
|
+
throw this.#createError(
|
|
132
|
+
errorCode.toUpperCase(),
|
|
133
|
+
getCastErrorMessage(errorCode)
|
|
134
|
+
);
|
|
135
|
+
}
|
|
136
|
+
}
|
|
137
|
+
#setOptions(options) {
|
|
138
|
+
this.cast?.setOptions({
|
|
139
|
+
...getDefaultCastOptions(),
|
|
140
|
+
...options
|
|
141
|
+
});
|
|
142
|
+
}
|
|
143
|
+
#notifyRemoteStateChange(ctx, state, trigger) {
|
|
144
|
+
const detail = { type: "google-cast", state };
|
|
145
|
+
ctx.notify("remote-playback-change", detail, trigger);
|
|
146
|
+
}
|
|
147
|
+
#createError(code, message) {
|
|
148
|
+
const error = Error(message);
|
|
149
|
+
error.code = code;
|
|
150
|
+
return error;
|
|
151
|
+
}
|
|
152
|
+
}
|
|
153
|
+
|
|
154
|
+
var loader = /*#__PURE__*/Object.freeze({
|
|
155
|
+
__proto__: null,
|
|
156
|
+
GoogleCastLoader: GoogleCastLoader
|
|
157
|
+
});
|
|
158
|
+
|
|
159
|
+
export { getCastContext, getCastErrorMessage, getCastSession, getCastSessionMedia, hasActiveCastSession, listenCastContextEvent, loader };
|