@vplayer/core 0.1.6 → 0.1.7
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/dist/index.js +68 -52
- package/dist/types.d.ts +3 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -726,61 +726,77 @@ function J(e) {
|
|
|
726
726
|
function Y(e) {
|
|
727
727
|
let r = x(), i = { ...e }, o = new t(), s = new j(), c = new a(i.lang);
|
|
728
728
|
i.translations && c.addTranslations(i.lang ?? "en", i.translations);
|
|
729
|
-
let l = new n(), u = i.reconnectMax ?? 3, p = i.reconnectSleep ?? 1500, m = null, h = null, g = null, _ = null, v = null, S = 0, C = null;
|
|
730
|
-
function
|
|
729
|
+
let l = new n(), u = i.reconnectMax ?? 3, p = i.reconnectSleep ?? 1500, m = null, h = null, g = null, _ = null, v = null, S = 0, C = null, w = null;
|
|
730
|
+
function T() {
|
|
731
|
+
w && typeof navigator < "u" && "mediaSession" in navigator && navigator.mediaSession.metadata === w && (navigator.mediaSession.metadata = null), w = null;
|
|
732
|
+
}
|
|
733
|
+
function E() {
|
|
734
|
+
if (typeof navigator > "u" || !("mediaSession" in navigator) || typeof MediaMetadata > "u") return;
|
|
735
|
+
let e = i.title?.trim();
|
|
736
|
+
if (!e) {
|
|
737
|
+
T();
|
|
738
|
+
return;
|
|
739
|
+
}
|
|
740
|
+
let t = new MediaMetadata({
|
|
741
|
+
title: e,
|
|
742
|
+
artwork: i.poster ? [{ src: i.poster }] : []
|
|
743
|
+
});
|
|
744
|
+
navigator.mediaSession.metadata = t, w = t;
|
|
745
|
+
}
|
|
746
|
+
function D() {
|
|
731
747
|
l.register({
|
|
732
748
|
key: "Space",
|
|
733
749
|
description: "Toggle play/pause",
|
|
734
750
|
handler: (e) => {
|
|
735
|
-
e.preventDefault(),
|
|
751
|
+
e.preventDefault(), k.togglePlay();
|
|
736
752
|
}
|
|
737
753
|
}), l.register({
|
|
738
754
|
key: "KeyK",
|
|
739
755
|
description: "Toggle play/pause",
|
|
740
756
|
handler: (e) => {
|
|
741
|
-
e.preventDefault(),
|
|
757
|
+
e.preventDefault(), k.togglePlay();
|
|
742
758
|
}
|
|
743
759
|
}), l.register({
|
|
744
760
|
key: "KeyL",
|
|
745
761
|
description: "Toggle loop",
|
|
746
762
|
handler: (e) => {
|
|
747
|
-
e.preventDefault(),
|
|
763
|
+
e.preventDefault(), k.toggleLoop();
|
|
748
764
|
}
|
|
749
765
|
}), l.register({
|
|
750
766
|
key: "KeyI",
|
|
751
767
|
description: "Toggle info panel",
|
|
752
768
|
handler: (e) => {
|
|
753
|
-
e.preventDefault(),
|
|
769
|
+
e.preventDefault(), k.toggleInfoPanel();
|
|
754
770
|
}
|
|
755
771
|
}), l.register({
|
|
756
772
|
key: "KeyF",
|
|
757
773
|
description: "Toggle fullscreen",
|
|
758
774
|
handler: (e) => {
|
|
759
|
-
e.preventDefault(),
|
|
775
|
+
e.preventDefault(), k.toggleFullscreen();
|
|
760
776
|
}
|
|
761
777
|
}), l.register({
|
|
762
778
|
key: "KeyA",
|
|
763
779
|
description: "Cycle aspect ratio",
|
|
764
780
|
handler: (e) => {
|
|
765
|
-
e.preventDefault(),
|
|
781
|
+
e.preventDefault(), k.cycleAspectRatio();
|
|
766
782
|
}
|
|
767
783
|
}), l.register({
|
|
768
784
|
key: "KeyM",
|
|
769
785
|
description: "Toggle mute",
|
|
770
786
|
handler: (e) => {
|
|
771
|
-
e.preventDefault(),
|
|
787
|
+
e.preventDefault(), k.toggleMute();
|
|
772
788
|
}
|
|
773
789
|
}), l.register({
|
|
774
790
|
key: "ArrowLeft",
|
|
775
791
|
description: "Seek backward 5s",
|
|
776
792
|
handler: (e) => {
|
|
777
|
-
e.preventDefault(),
|
|
793
|
+
e.preventDefault(), k.skip(-5);
|
|
778
794
|
}
|
|
779
795
|
}), l.register({
|
|
780
796
|
key: "ArrowRight",
|
|
781
797
|
description: "Seek forward 5s",
|
|
782
798
|
handler: (e) => {
|
|
783
|
-
e.preventDefault(),
|
|
799
|
+
e.preventDefault(), k.skip(5);
|
|
784
800
|
}
|
|
785
801
|
}), l.register({
|
|
786
802
|
key: "ArrowUp",
|
|
@@ -788,7 +804,7 @@ function Y(e) {
|
|
|
788
804
|
handler: (e) => {
|
|
789
805
|
e.preventDefault();
|
|
790
806
|
let t = Math.min(1, r.state.volume + .1);
|
|
791
|
-
|
|
807
|
+
k.setVolume(t);
|
|
792
808
|
}
|
|
793
809
|
}), l.register({
|
|
794
810
|
key: "ArrowDown",
|
|
@@ -796,12 +812,12 @@ function Y(e) {
|
|
|
796
812
|
handler: (e) => {
|
|
797
813
|
e.preventDefault();
|
|
798
814
|
let t = Math.max(0, r.state.volume - .1);
|
|
799
|
-
|
|
815
|
+
k.setVolume(t);
|
|
800
816
|
}
|
|
801
817
|
});
|
|
802
818
|
}
|
|
803
|
-
i.defaultHotkeys !== !1 &&
|
|
804
|
-
function
|
|
819
|
+
i.defaultHotkeys !== !1 && D();
|
|
820
|
+
function O() {
|
|
805
821
|
if (typeof document > "u") return;
|
|
806
822
|
let e = document;
|
|
807
823
|
r.setState((t) => ({
|
|
@@ -810,7 +826,7 @@ function Y(e) {
|
|
|
810
826
|
capabilities: d(h?.element ?? void 0, m)
|
|
811
827
|
}));
|
|
812
828
|
}
|
|
813
|
-
let
|
|
829
|
+
let k = {
|
|
814
830
|
play: () => {
|
|
815
831
|
h?.play();
|
|
816
832
|
},
|
|
@@ -853,7 +869,7 @@ function Y(e) {
|
|
|
853
869
|
toggleFullscreen: () => {
|
|
854
870
|
if (!m || typeof document > "u") return;
|
|
855
871
|
let e = m, t = document, n = !!(document.fullscreenElement || t.webkitFullscreenElement), r = () => {
|
|
856
|
-
m?.focus({ preventScroll: !0 }),
|
|
872
|
+
m?.focus({ preventScroll: !0 }), O();
|
|
857
873
|
}, i = n ? typeof document.exitFullscreen == "function" ? document.exitFullscreen() : t.webkitExitFullscreen?.() : typeof m.requestFullscreen == "function" ? m.requestFullscreen() : e.webkitRequestFullscreen?.();
|
|
858
874
|
Promise.resolve(i).then(r, r);
|
|
859
875
|
},
|
|
@@ -901,7 +917,7 @@ function Y(e) {
|
|
|
901
917
|
},
|
|
902
918
|
cycleAspectRatio: () => {
|
|
903
919
|
let e = r.state.aspectRatio, t = U[(U.indexOf(e) + 1) % U.length] ?? "default";
|
|
904
|
-
|
|
920
|
+
k.setAspectRatio(t);
|
|
905
921
|
},
|
|
906
922
|
toggleLoop: () => {
|
|
907
923
|
let e = h;
|
|
@@ -917,10 +933,10 @@ function Y(e) {
|
|
|
917
933
|
}));
|
|
918
934
|
}
|
|
919
935
|
};
|
|
920
|
-
function
|
|
936
|
+
function A(e) {
|
|
921
937
|
return [
|
|
922
938
|
e.on("play", () => {
|
|
923
|
-
r.setState((e) => ({
|
|
939
|
+
E(), r.setState((e) => ({
|
|
924
940
|
...e,
|
|
925
941
|
status: "playing",
|
|
926
942
|
isPlaying: !0,
|
|
@@ -1069,8 +1085,8 @@ function Y(e) {
|
|
|
1069
1085
|
})
|
|
1070
1086
|
];
|
|
1071
1087
|
}
|
|
1072
|
-
function
|
|
1073
|
-
|
|
1088
|
+
function N() {
|
|
1089
|
+
P(), _ = setInterval(() => {
|
|
1074
1090
|
let e = h;
|
|
1075
1091
|
e && s.set(M.PLAYBACK_PROGRESS, {
|
|
1076
1092
|
time: e.currentTime,
|
|
@@ -1078,14 +1094,14 @@ function Y(e) {
|
|
|
1078
1094
|
});
|
|
1079
1095
|
}, 5e3);
|
|
1080
1096
|
}
|
|
1081
|
-
function
|
|
1097
|
+
function P() {
|
|
1082
1098
|
_ !== null && (clearInterval(_), _ = null);
|
|
1083
1099
|
}
|
|
1084
|
-
let
|
|
1100
|
+
let F = r.subscribe(() => {
|
|
1085
1101
|
let e = r.state;
|
|
1086
|
-
e.isPlaying && e.duration > 0 ? _ === null &&
|
|
1087
|
-
}),
|
|
1088
|
-
function
|
|
1102
|
+
e.isPlaying && e.duration > 0 ? _ === null && N() : P();
|
|
1103
|
+
}), I = null;
|
|
1104
|
+
function L() {
|
|
1089
1105
|
if (!i.persistPreferences) return;
|
|
1090
1106
|
let e = s.get(M.VOLUME), t = s.get(M.MUTED), n = s.get(M.PLAYBACK_RATE), a = s.get(M.LOOP), o = s.get(M.FLIP), c = s.get(M.ASPECT_RATIO);
|
|
1091
1107
|
r.setState((r) => ({
|
|
@@ -1096,15 +1112,15 @@ function Y(e) {
|
|
|
1096
1112
|
isLooping: a ?? r.isLooping,
|
|
1097
1113
|
flip: o ?? r.flip,
|
|
1098
1114
|
aspectRatio: q(c)
|
|
1099
|
-
})),
|
|
1115
|
+
})), I = r.subscribe(() => {
|
|
1100
1116
|
let e = r.state;
|
|
1101
1117
|
e.volume !== 1 && s.set(M.VOLUME, e.volume), e.isMuted && s.set(M.MUTED, !0), e.playbackRate !== 1 && s.set(M.PLAYBACK_RATE, e.playbackRate), e.isLooping ? s.set(M.LOOP, !0) : s.remove(M.LOOP), e.flip === "normal" ? s.remove(M.FLIP) : s.set(M.FLIP, e.flip), e.aspectRatio === "default" ? s.remove(M.ASPECT_RATIO) : s.set(M.ASPECT_RATIO, e.aspectRatio);
|
|
1102
1118
|
});
|
|
1103
1119
|
}
|
|
1104
|
-
function
|
|
1105
|
-
|
|
1120
|
+
function R() {
|
|
1121
|
+
I &&= (I(), null);
|
|
1106
1122
|
}
|
|
1107
|
-
function
|
|
1123
|
+
function z(e) {
|
|
1108
1124
|
if (C?.abort(), C = null, !e) {
|
|
1109
1125
|
r.setState((e) => ({
|
|
1110
1126
|
...e,
|
|
@@ -1125,11 +1141,11 @@ function Y(e) {
|
|
|
1125
1141
|
})));
|
|
1126
1142
|
});
|
|
1127
1143
|
}
|
|
1128
|
-
function
|
|
1144
|
+
function B(e) {
|
|
1129
1145
|
return {
|
|
1130
1146
|
name: e,
|
|
1131
1147
|
store: r,
|
|
1132
|
-
remote:
|
|
1148
|
+
remote: k,
|
|
1133
1149
|
events: o,
|
|
1134
1150
|
storage: s,
|
|
1135
1151
|
hotkeys: l,
|
|
@@ -1208,15 +1224,15 @@ function Y(e) {
|
|
|
1208
1224
|
}
|
|
1209
1225
|
};
|
|
1210
1226
|
}
|
|
1211
|
-
let
|
|
1212
|
-
function
|
|
1227
|
+
let H = [];
|
|
1228
|
+
function Y() {
|
|
1213
1229
|
v !== null && (clearTimeout(v), v = null), S = 0;
|
|
1214
|
-
for (let e of
|
|
1215
|
-
|
|
1230
|
+
for (let e of H) e();
|
|
1231
|
+
H = [], h && (h.destroy(), h = null, Q.engine = null);
|
|
1216
1232
|
}
|
|
1217
|
-
function
|
|
1233
|
+
function X(e) {
|
|
1218
1234
|
let t = y(i), n = b(e, i);
|
|
1219
|
-
h = n,
|
|
1235
|
+
h = n, Q.engine = n, H = A(n), e.playsInline = !0, e.autoplay = !!i.autoPlay, e.preload = e.preload || "metadata", r.setState((n) => ({
|
|
1220
1236
|
...n,
|
|
1221
1237
|
status: "loading",
|
|
1222
1238
|
source: t,
|
|
@@ -1231,16 +1247,16 @@ function Y(e) {
|
|
|
1231
1247
|
error: null
|
|
1232
1248
|
})), i.autoPlay && n.play();
|
|
1233
1249
|
}
|
|
1234
|
-
function
|
|
1250
|
+
function Z() {
|
|
1235
1251
|
let e = h?.element;
|
|
1236
1252
|
if (e) {
|
|
1237
|
-
for (
|
|
1238
|
-
e.load(),
|
|
1253
|
+
for (Y(), e.pause(), e.removeAttribute("src"); e.firstChild;) e.removeChild(e.firstChild);
|
|
1254
|
+
e.load(), X(e);
|
|
1239
1255
|
}
|
|
1240
1256
|
}
|
|
1241
|
-
let
|
|
1257
|
+
let Q = {
|
|
1242
1258
|
store: r,
|
|
1243
|
-
remote:
|
|
1259
|
+
remote: k,
|
|
1244
1260
|
events: o,
|
|
1245
1261
|
storage: s,
|
|
1246
1262
|
i18n: c,
|
|
@@ -1251,7 +1267,7 @@ function Y(e) {
|
|
|
1251
1267
|
i = {
|
|
1252
1268
|
...i,
|
|
1253
1269
|
...e
|
|
1254
|
-
}, r.setState((t) => {
|
|
1270
|
+
}, (r.state.isPlaying || w) && E(), r.setState((t) => {
|
|
1255
1271
|
let n = e.subtitles ?? t.subtitleTracks, r = e.qualities ?? t.qualities;
|
|
1256
1272
|
return {
|
|
1257
1273
|
...t,
|
|
@@ -1260,18 +1276,18 @@ function Y(e) {
|
|
|
1260
1276
|
activeSubtitle: e.subtitles ? t.activeSubtitle && e.subtitles.some((e) => e.lang === t.activeSubtitle.lang) ? t.activeSubtitle : e.subtitles.find((e) => e.default) ?? e.subtitles[0] ?? null : t.activeSubtitle,
|
|
1261
1277
|
activeQuality: e.qualities ? e.qualities.includes(t.activeQuality) ? t.activeQuality : e.qualities[0] ?? "Auto" : t.activeQuality
|
|
1262
1278
|
};
|
|
1263
|
-
}), (a || o) &&
|
|
1279
|
+
}), (a || o) && z(i.thumbnails), (t || n) && Z();
|
|
1264
1280
|
},
|
|
1265
1281
|
setThumbnails(e) {
|
|
1266
1282
|
i = {
|
|
1267
1283
|
...i,
|
|
1268
1284
|
thumbnails: e
|
|
1269
|
-
},
|
|
1285
|
+
}, z(e);
|
|
1270
1286
|
},
|
|
1271
1287
|
initPlugins(e) {
|
|
1272
1288
|
let t = [];
|
|
1273
1289
|
for (let n of e) {
|
|
1274
|
-
let e =
|
|
1290
|
+
let e = B(n.name);
|
|
1275
1291
|
try {
|
|
1276
1292
|
let r = n.setup?.(e);
|
|
1277
1293
|
typeof r == "function" && t.push(r);
|
|
@@ -1288,10 +1304,10 @@ function Y(e) {
|
|
|
1288
1304
|
};
|
|
1289
1305
|
},
|
|
1290
1306
|
mount(e, t) {
|
|
1291
|
-
h && this.unmount(), m = t,
|
|
1307
|
+
h && this.unmount(), m = t, X(e), g = O, document.addEventListener("fullscreenchange", g), document.addEventListener("webkitfullscreenchange", g), z(i.thumbnails), L(), k.setAspectRatio(r.state.aspectRatio);
|
|
1292
1308
|
},
|
|
1293
1309
|
unmount() {
|
|
1294
|
-
|
|
1310
|
+
Y(), T(), m = null, P(), C?.abort(), C = null, R(), v !== null && (clearTimeout(v), v = null), g &&= (document.removeEventListener("fullscreenchange", g), document.removeEventListener("webkitfullscreenchange", g), null), r.setState((e) => ({
|
|
1295
1311
|
...e,
|
|
1296
1312
|
status: "idle",
|
|
1297
1313
|
isPlaying: !1,
|
|
@@ -1301,10 +1317,10 @@ function Y(e) {
|
|
|
1301
1317
|
}));
|
|
1302
1318
|
},
|
|
1303
1319
|
destroy() {
|
|
1304
|
-
this.unmount(),
|
|
1320
|
+
this.unmount(), F(), o.clear();
|
|
1305
1321
|
}
|
|
1306
1322
|
};
|
|
1307
|
-
return
|
|
1323
|
+
return Q;
|
|
1308
1324
|
}
|
|
1309
1325
|
//#endregion
|
|
1310
1326
|
//#region src/gesture-engine.ts
|
package/dist/types.d.ts
CHANGED
|
@@ -42,6 +42,8 @@ export interface PlayerOptions {
|
|
|
42
42
|
src: string;
|
|
43
43
|
/** MIME/content type hint used by source provider selection. */
|
|
44
44
|
type?: string;
|
|
45
|
+
/** Title exposed to browser and operating-system media controls. */
|
|
46
|
+
title?: string;
|
|
45
47
|
poster?: string;
|
|
46
48
|
subtitles?: SubtitleTrack[];
|
|
47
49
|
qualities?: string[];
|
|
@@ -172,7 +174,7 @@ export interface PlayerInstance {
|
|
|
172
174
|
hotkeys: HotkeyRegistry;
|
|
173
175
|
/** The active media engine. Null before mount and after unmount. */
|
|
174
176
|
engine: MediaEngine | null;
|
|
175
|
-
updateOptions(opts: Partial<Pick<PlayerOptions, 'src' | 'type' | 'poster' | 'autoPlay' | 'subtitles' | 'qualities' | 'thumbnails' | 'transformThumbnailVTT'>>): void;
|
|
177
|
+
updateOptions(opts: Partial<Pick<PlayerOptions, 'src' | 'type' | 'title' | 'poster' | 'autoPlay' | 'subtitles' | 'qualities' | 'thumbnails' | 'transformThumbnailVTT'>>): void;
|
|
176
178
|
setThumbnails(url?: string): void;
|
|
177
179
|
initPlugins(plugins: PlayerPlugin[]): () => void;
|
|
178
180
|
mount(videoEl: HTMLVideoElement, containerEl: HTMLDivElement): void;
|