stormcloud-video-player 0.3.60 → 0.3.62
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/stormcloud-vp.min.js +1 -1
- package/lib/index.cjs +445 -359
- package/lib/index.cjs.map +1 -1
- package/lib/index.d.cts +26 -16
- package/lib/index.d.ts +26 -16
- package/lib/index.js +445 -359
- package/lib/index.js.map +1 -1
- package/lib/player/StormcloudVideoPlayer.cjs +265 -224
- package/lib/player/StormcloudVideoPlayer.cjs.map +1 -1
- package/lib/player/StormcloudVideoPlayer.d.cts +1 -1
- package/lib/players/HlsPlayer.cjs +265 -224
- package/lib/players/HlsPlayer.cjs.map +1 -1
- package/lib/players/HlsPlayer.d.cts +1 -1
- package/lib/players/index.cjs +265 -224
- package/lib/players/index.cjs.map +1 -1
- package/lib/sdk/hlsAdPlayer.d.cts +1 -1
- package/lib/sdk/ima.d.cts +1 -1
- package/lib/{types-Vj55FghO.d.cts → types-BJPNhfLV.d.cts} +14 -4
- package/lib/ui/StormcloudVideoPlayer.cjs +445 -359
- package/lib/ui/StormcloudVideoPlayer.cjs.map +1 -1
- package/lib/ui/StormcloudVideoPlayer.d.cts +1 -1
- package/lib/utils/tracking.cjs +210 -217
- package/lib/utils/tracking.cjs.map +1 -1
- package/lib/utils/tracking.d.cts +11 -13
- package/package.json +1 -1
package/lib/index.js
CHANGED
|
@@ -2659,40 +2659,66 @@ function getBrowserID(clientInfo) {
|
|
|
2659
2659
|
});
|
|
2660
2660
|
})();
|
|
2661
2661
|
}
|
|
2662
|
-
|
|
2662
|
+
var PLAYER_TRACKING_BASE_URL = "https://adstorm.co/api-adstorm-dev/adstorm/player-tracking";
|
|
2663
|
+
var TRACK_URL = "".concat(PLAYER_TRACKING_BASE_URL, "/metrics/ingest");
|
|
2664
|
+
var HEARTBEAT_URL = "".concat(PLAYER_TRACKING_BASE_URL, "/heartbeat");
|
|
2665
|
+
var IMPRESSIONS_URL = "".concat(PLAYER_TRACKING_BASE_URL, "/impressions/ingest");
|
|
2666
|
+
function buildHeaders(licenseKey) {
|
|
2667
|
+
var headers = {
|
|
2668
|
+
"Content-Type": "application/json"
|
|
2669
|
+
};
|
|
2670
|
+
if (licenseKey) {
|
|
2671
|
+
headers["Authorization"] = "Bearer ".concat(licenseKey);
|
|
2672
|
+
}
|
|
2673
|
+
return headers;
|
|
2674
|
+
}
|
|
2675
|
+
function sendTrackRequest(licenseKey, body) {
|
|
2663
2676
|
return _async_to_generator(function() {
|
|
2664
|
-
var
|
|
2677
|
+
var response;
|
|
2665
2678
|
return _ts_generator(this, function(_state) {
|
|
2666
2679
|
switch(_state.label){
|
|
2667
2680
|
case 0:
|
|
2668
|
-
_state.trys.push([
|
|
2669
|
-
0,
|
|
2670
|
-
4,
|
|
2671
|
-
,
|
|
2672
|
-
5
|
|
2673
|
-
]);
|
|
2674
|
-
clientInfo = getClientInfo();
|
|
2675
2681
|
return [
|
|
2676
2682
|
4,
|
|
2677
|
-
|
|
2683
|
+
fetch(TRACK_URL, {
|
|
2684
|
+
method: "POST",
|
|
2685
|
+
headers: buildHeaders(licenseKey),
|
|
2686
|
+
body: JSON.stringify(body)
|
|
2687
|
+
})
|
|
2678
2688
|
];
|
|
2679
2689
|
case 1:
|
|
2680
|
-
|
|
2681
|
-
|
|
2682
|
-
|
|
2683
|
-
}
|
|
2684
|
-
|
|
2685
|
-
|
|
2686
|
-
|
|
2690
|
+
response = _state.sent();
|
|
2691
|
+
if (!response.ok) {
|
|
2692
|
+
throw new Error("HTTP error! status: ".concat(response.status));
|
|
2693
|
+
}
|
|
2694
|
+
return [
|
|
2695
|
+
4,
|
|
2696
|
+
response.json()
|
|
2697
|
+
];
|
|
2698
|
+
case 2:
|
|
2699
|
+
_state.sent();
|
|
2700
|
+
return [
|
|
2701
|
+
2
|
|
2702
|
+
];
|
|
2703
|
+
}
|
|
2704
|
+
});
|
|
2705
|
+
})();
|
|
2706
|
+
}
|
|
2707
|
+
function postJson(url, licenseKey, body) {
|
|
2708
|
+
return _async_to_generator(function() {
|
|
2709
|
+
var response;
|
|
2710
|
+
return _ts_generator(this, function(_state) {
|
|
2711
|
+
switch(_state.label){
|
|
2712
|
+
case 0:
|
|
2687
2713
|
return [
|
|
2688
2714
|
4,
|
|
2689
|
-
fetch(
|
|
2715
|
+
fetch(url, {
|
|
2690
2716
|
method: "POST",
|
|
2691
|
-
headers:
|
|
2692
|
-
body: JSON.stringify(
|
|
2717
|
+
headers: buildHeaders(licenseKey),
|
|
2718
|
+
body: JSON.stringify(body)
|
|
2693
2719
|
})
|
|
2694
2720
|
];
|
|
2695
|
-
case
|
|
2721
|
+
case 1:
|
|
2696
2722
|
response = _state.sent();
|
|
2697
2723
|
if (!response.ok) {
|
|
2698
2724
|
throw new Error("HTTP error! status: ".concat(response.status));
|
|
@@ -2701,35 +2727,63 @@ function sendInitialTracking(licenseKey) {
|
|
|
2701
2727
|
4,
|
|
2702
2728
|
response.json()
|
|
2703
2729
|
];
|
|
2704
|
-
case
|
|
2730
|
+
case 2:
|
|
2705
2731
|
_state.sent();
|
|
2706
2732
|
return [
|
|
2707
|
-
|
|
2708
|
-
5
|
|
2733
|
+
2
|
|
2709
2734
|
];
|
|
2710
|
-
|
|
2711
|
-
|
|
2712
|
-
|
|
2735
|
+
}
|
|
2736
|
+
});
|
|
2737
|
+
})();
|
|
2738
|
+
}
|
|
2739
|
+
function buildPlayerMetricEvent(_0) {
|
|
2740
|
+
return _async_to_generator(function(licenseKey) {
|
|
2741
|
+
var context, flags, _flags_captureAt, clientInfo, browserId, captureAt;
|
|
2742
|
+
var _arguments = arguments;
|
|
2743
|
+
return _ts_generator(this, function(_state) {
|
|
2744
|
+
switch(_state.label){
|
|
2745
|
+
case 0:
|
|
2746
|
+
context = _arguments.length > 1 && _arguments[1] !== void 0 ? _arguments[1] : {}, flags = _arguments.length > 2 && _arguments[2] !== void 0 ? _arguments[2] : {};
|
|
2747
|
+
clientInfo = getClientInfo();
|
|
2713
2748
|
return [
|
|
2714
|
-
|
|
2715
|
-
|
|
2749
|
+
4,
|
|
2750
|
+
getBrowserID(clientInfo)
|
|
2716
2751
|
];
|
|
2717
|
-
case
|
|
2752
|
+
case 1:
|
|
2753
|
+
browserId = _state.sent();
|
|
2754
|
+
captureAt = (_flags_captureAt = flags.captureAt) !== null && _flags_captureAt !== void 0 ? _flags_captureAt : /* @__PURE__ */ new Date().toISOString();
|
|
2718
2755
|
return [
|
|
2719
|
-
2
|
|
2756
|
+
2,
|
|
2757
|
+
{
|
|
2758
|
+
player_id: browserId,
|
|
2759
|
+
browserId: browserId,
|
|
2760
|
+
device_type: clientInfo.deviceType,
|
|
2761
|
+
deviceType: clientInfo.deviceType,
|
|
2762
|
+
input_stream_type: context.inputStreamType,
|
|
2763
|
+
os: clientInfo.os,
|
|
2764
|
+
ad_loaded: flags.adLoaded,
|
|
2765
|
+
ad_detect: flags.adDetect,
|
|
2766
|
+
license_key: licenseKey,
|
|
2767
|
+
capture_at: captureAt,
|
|
2768
|
+
timestamp: captureAt
|
|
2769
|
+
}
|
|
2720
2770
|
];
|
|
2721
2771
|
}
|
|
2722
2772
|
});
|
|
2723
|
-
})();
|
|
2773
|
+
}).apply(this, arguments);
|
|
2724
2774
|
}
|
|
2725
|
-
function
|
|
2726
|
-
return _async_to_generator(function() {
|
|
2727
|
-
var clientInfo, browserId,
|
|
2775
|
+
function sendInitialTracking(_0) {
|
|
2776
|
+
return _async_to_generator(function(licenseKey) {
|
|
2777
|
+
var context, clientInfo, browserId, trackingData, error;
|
|
2778
|
+
var _arguments = arguments;
|
|
2728
2779
|
return _ts_generator(this, function(_state) {
|
|
2729
2780
|
switch(_state.label){
|
|
2730
2781
|
case 0:
|
|
2782
|
+
context = _arguments.length > 1 && _arguments[1] !== void 0 ? _arguments[1] : {};
|
|
2783
|
+
_state.label = 1;
|
|
2784
|
+
case 1:
|
|
2731
2785
|
_state.trys.push([
|
|
2732
|
-
|
|
2786
|
+
1,
|
|
2733
2787
|
4,
|
|
2734
2788
|
,
|
|
2735
2789
|
5
|
|
@@ -2739,35 +2793,29 @@ function sendHeartbeat(licenseKey) {
|
|
|
2739
2793
|
4,
|
|
2740
2794
|
getBrowserID(clientInfo)
|
|
2741
2795
|
];
|
|
2742
|
-
case
|
|
2796
|
+
case 2:
|
|
2743
2797
|
browserId = _state.sent();
|
|
2744
|
-
|
|
2745
|
-
browserId: browserId
|
|
2746
|
-
|
|
2747
|
-
};
|
|
2748
|
-
headers = {
|
|
2749
|
-
"Content-Type": "application/json"
|
|
2750
|
-
};
|
|
2751
|
-
if (licenseKey) {
|
|
2752
|
-
headers["Authorization"] = "Bearer ".concat(licenseKey);
|
|
2753
|
-
}
|
|
2798
|
+
trackingData = _object_spread({
|
|
2799
|
+
browserId: browserId
|
|
2800
|
+
}, clientInfo);
|
|
2754
2801
|
return [
|
|
2755
2802
|
4,
|
|
2756
|
-
|
|
2757
|
-
|
|
2758
|
-
|
|
2759
|
-
|
|
2803
|
+
sendTrackRequest(licenseKey, {
|
|
2804
|
+
events: [
|
|
2805
|
+
{
|
|
2806
|
+
player_id: browserId,
|
|
2807
|
+
device_type: clientInfo.deviceType,
|
|
2808
|
+
input_stream_type: context.inputStreamType,
|
|
2809
|
+
os: clientInfo.os,
|
|
2810
|
+
ad_loaded: false,
|
|
2811
|
+
ad_detect: false,
|
|
2812
|
+
license_key: licenseKey,
|
|
2813
|
+
capture_at: /* @__PURE__ */ new Date().toISOString()
|
|
2814
|
+
}
|
|
2815
|
+
],
|
|
2816
|
+
trackingData: trackingData
|
|
2760
2817
|
})
|
|
2761
2818
|
];
|
|
2762
|
-
case 2:
|
|
2763
|
-
response = _state.sent();
|
|
2764
|
-
if (!response.ok) {
|
|
2765
|
-
throw new Error("HTTP error! status: ".concat(response.status));
|
|
2766
|
-
}
|
|
2767
|
-
return [
|
|
2768
|
-
4,
|
|
2769
|
-
response.json()
|
|
2770
|
-
];
|
|
2771
2819
|
case 3:
|
|
2772
2820
|
_state.sent();
|
|
2773
2821
|
return [
|
|
@@ -2776,7 +2824,7 @@ function sendHeartbeat(licenseKey) {
|
|
|
2776
2824
|
];
|
|
2777
2825
|
case 4:
|
|
2778
2826
|
error = _state.sent();
|
|
2779
|
-
console.error("[StormcloudVideoPlayer] Error sending
|
|
2827
|
+
console.error("[StormcloudVideoPlayer] Error sending initial tracking data:", error);
|
|
2780
2828
|
return [
|
|
2781
2829
|
3,
|
|
2782
2830
|
5
|
|
@@ -2787,95 +2835,74 @@ function sendHeartbeat(licenseKey) {
|
|
|
2787
2835
|
];
|
|
2788
2836
|
}
|
|
2789
2837
|
});
|
|
2790
|
-
})();
|
|
2838
|
+
}).apply(this, arguments);
|
|
2791
2839
|
}
|
|
2792
|
-
|
|
2793
|
-
|
|
2794
|
-
|
|
2795
|
-
|
|
2796
|
-
}
|
|
2797
|
-
if (source === "preload" || source === "ssp") {
|
|
2798
|
-
return source === "ssp" ? "prebid" : "ima";
|
|
2799
|
-
}
|
|
2800
|
-
return adPlayerType === "hls" ? "hls" : "ima";
|
|
2801
|
-
}
|
|
2802
|
-
function postAdTracking(licenseKey, body) {
|
|
2803
|
-
return _async_to_generator(function() {
|
|
2804
|
-
var headers, response;
|
|
2840
|
+
function sendAdDetectTracking(_0, _1) {
|
|
2841
|
+
return _async_to_generator(function(licenseKey, adDetectInfo) {
|
|
2842
|
+
var context, error;
|
|
2843
|
+
var _arguments = arguments;
|
|
2805
2844
|
return _ts_generator(this, function(_state) {
|
|
2806
2845
|
switch(_state.label){
|
|
2807
2846
|
case 0:
|
|
2808
|
-
|
|
2809
|
-
|
|
2810
|
-
};
|
|
2811
|
-
if (licenseKey) {
|
|
2812
|
-
headers["Authorization"] = "Bearer ".concat(licenseKey);
|
|
2813
|
-
}
|
|
2814
|
-
return [
|
|
2815
|
-
4,
|
|
2816
|
-
fetch(TRACK_API_URL, {
|
|
2817
|
-
method: "POST",
|
|
2818
|
-
headers: headers,
|
|
2819
|
-
body: JSON.stringify(body)
|
|
2820
|
-
})
|
|
2821
|
-
];
|
|
2847
|
+
context = _arguments.length > 2 && _arguments[2] !== void 0 ? _arguments[2] : {};
|
|
2848
|
+
_state.label = 1;
|
|
2822
2849
|
case 1:
|
|
2823
|
-
|
|
2824
|
-
|
|
2825
|
-
|
|
2826
|
-
|
|
2850
|
+
_state.trys.push([
|
|
2851
|
+
1,
|
|
2852
|
+
3,
|
|
2853
|
+
,
|
|
2854
|
+
4
|
|
2855
|
+
]);
|
|
2827
2856
|
return [
|
|
2828
2857
|
4,
|
|
2829
|
-
|
|
2858
|
+
sendHeartbeat(licenseKey, context, {
|
|
2859
|
+
adDetect: true,
|
|
2860
|
+
captureAt: adDetectInfo.timestamp
|
|
2861
|
+
})
|
|
2830
2862
|
];
|
|
2831
2863
|
case 2:
|
|
2832
2864
|
_state.sent();
|
|
2865
|
+
return [
|
|
2866
|
+
3,
|
|
2867
|
+
4
|
|
2868
|
+
];
|
|
2869
|
+
case 3:
|
|
2870
|
+
error = _state.sent();
|
|
2871
|
+
console.error("[StormcloudVideoPlayer] Error sending ad detect tracking:", error);
|
|
2872
|
+
return [
|
|
2873
|
+
3,
|
|
2874
|
+
4
|
|
2875
|
+
];
|
|
2876
|
+
case 4:
|
|
2833
2877
|
return [
|
|
2834
2878
|
2
|
|
2835
2879
|
];
|
|
2836
2880
|
}
|
|
2837
2881
|
});
|
|
2838
|
-
})();
|
|
2882
|
+
}).apply(this, arguments);
|
|
2839
2883
|
}
|
|
2840
|
-
function
|
|
2841
|
-
return _async_to_generator(function() {
|
|
2842
|
-
var
|
|
2884
|
+
function sendAdLoadedTracking(_0, _1) {
|
|
2885
|
+
return _async_to_generator(function(licenseKey, adLoadedInfo) {
|
|
2886
|
+
var context, error;
|
|
2887
|
+
var _arguments = arguments;
|
|
2843
2888
|
return _ts_generator(this, function(_state) {
|
|
2844
2889
|
switch(_state.label){
|
|
2845
2890
|
case 0:
|
|
2891
|
+
context = _arguments.length > 2 && _arguments[2] !== void 0 ? _arguments[2] : {};
|
|
2892
|
+
_state.label = 1;
|
|
2893
|
+
case 1:
|
|
2846
2894
|
_state.trys.push([
|
|
2847
|
-
|
|
2895
|
+
1,
|
|
2848
2896
|
3,
|
|
2849
2897
|
,
|
|
2850
2898
|
4
|
|
2851
2899
|
]);
|
|
2852
|
-
clientInfo = getClientInfo();
|
|
2853
2900
|
return [
|
|
2854
2901
|
4,
|
|
2855
|
-
|
|
2856
|
-
|
|
2857
|
-
|
|
2858
|
-
|
|
2859
|
-
adDetectInfo = _object_spread({
|
|
2860
|
-
source: (_payload_source = payload.source) !== null && _payload_source !== void 0 ? _payload_source : "scte35",
|
|
2861
|
-
timestamp: (_payload_timestamp = payload.timestamp) !== null && _payload_timestamp !== void 0 ? _payload_timestamp : /* @__PURE__ */ new Date().toISOString()
|
|
2862
|
-
}, payload.durationSeconds != null && {
|
|
2863
|
-
durationSeconds: payload.durationSeconds
|
|
2864
|
-
}, payload.ptsSeconds != null && {
|
|
2865
|
-
ptsSeconds: payload.ptsSeconds
|
|
2866
|
-
}, payload.detectedAtFragmentSn != null && {
|
|
2867
|
-
detectedAtFragmentSn: payload.detectedAtFragmentSn
|
|
2868
|
-
});
|
|
2869
|
-
body = _object_spread_props(_object_spread({
|
|
2870
|
-
browserId: browserId
|
|
2871
|
-
}, clientInfo, licenseKey && {
|
|
2872
|
-
licenseKey: licenseKey
|
|
2873
|
-
}), {
|
|
2874
|
-
adDetectInfo: adDetectInfo
|
|
2875
|
-
});
|
|
2876
|
-
return [
|
|
2877
|
-
4,
|
|
2878
|
-
postAdTracking(licenseKey, body)
|
|
2902
|
+
sendHeartbeat(licenseKey, context, {
|
|
2903
|
+
adLoaded: true,
|
|
2904
|
+
captureAt: adLoadedInfo.timestamp
|
|
2905
|
+
})
|
|
2879
2906
|
];
|
|
2880
2907
|
case 2:
|
|
2881
2908
|
_state.sent();
|
|
@@ -2885,7 +2912,7 @@ function sendAdDetectTracking(licenseKey, payload) {
|
|
|
2885
2912
|
];
|
|
2886
2913
|
case 3:
|
|
2887
2914
|
error = _state.sent();
|
|
2888
|
-
console.error("[StormcloudVideoPlayer] Error sending ad
|
|
2915
|
+
console.error("[StormcloudVideoPlayer] Error sending ad loaded tracking:", error);
|
|
2889
2916
|
return [
|
|
2890
2917
|
3,
|
|
2891
2918
|
4
|
|
@@ -2896,126 +2923,116 @@ function sendAdDetectTracking(licenseKey, payload) {
|
|
|
2896
2923
|
];
|
|
2897
2924
|
}
|
|
2898
2925
|
});
|
|
2899
|
-
})();
|
|
2926
|
+
}).apply(this, arguments);
|
|
2900
2927
|
}
|
|
2901
|
-
function
|
|
2902
|
-
return _async_to_generator(function() {
|
|
2903
|
-
var
|
|
2928
|
+
function sendAdImpressionTracking(_0, _1) {
|
|
2929
|
+
return _async_to_generator(function(licenseKey, adImpressionInfo) {
|
|
2930
|
+
var context, metricEvent, error;
|
|
2931
|
+
var _arguments = arguments;
|
|
2904
2932
|
return _ts_generator(this, function(_state) {
|
|
2905
2933
|
switch(_state.label){
|
|
2906
2934
|
case 0:
|
|
2935
|
+
context = _arguments.length > 2 && _arguments[2] !== void 0 ? _arguments[2] : {};
|
|
2936
|
+
_state.label = 1;
|
|
2937
|
+
case 1:
|
|
2907
2938
|
_state.trys.push([
|
|
2908
|
-
|
|
2909
|
-
|
|
2939
|
+
1,
|
|
2940
|
+
4,
|
|
2910
2941
|
,
|
|
2911
|
-
|
|
2942
|
+
5
|
|
2912
2943
|
]);
|
|
2913
|
-
clientInfo = getClientInfo();
|
|
2914
2944
|
return [
|
|
2915
2945
|
4,
|
|
2916
|
-
|
|
2946
|
+
buildPlayerMetricEvent(licenseKey, context, {
|
|
2947
|
+
captureAt: adImpressionInfo.timestamp
|
|
2948
|
+
})
|
|
2917
2949
|
];
|
|
2918
|
-
case
|
|
2919
|
-
|
|
2920
|
-
source = mapToAdTrackingSource(payload.source, adPlayerType);
|
|
2921
|
-
adLoadedInfo = _object_spread({
|
|
2922
|
-
source: source,
|
|
2923
|
-
timestamp: /* @__PURE__ */ new Date().toISOString()
|
|
2924
|
-
}, payload.vastUrl != null && {
|
|
2925
|
-
vastUrl: payload.vastUrl
|
|
2926
|
-
}, payload.durationSeconds != null && {
|
|
2927
|
-
durationSeconds: payload.durationSeconds
|
|
2928
|
-
});
|
|
2929
|
-
body = _object_spread_props(_object_spread({
|
|
2930
|
-
browserId: browserId
|
|
2931
|
-
}, clientInfo, licenseKey && {
|
|
2932
|
-
licenseKey: licenseKey
|
|
2933
|
-
}), {
|
|
2934
|
-
adLoadedInfo: adLoadedInfo
|
|
2935
|
-
});
|
|
2950
|
+
case 2:
|
|
2951
|
+
metricEvent = _state.sent();
|
|
2936
2952
|
return [
|
|
2937
2953
|
4,
|
|
2938
|
-
|
|
2954
|
+
Promise.all([
|
|
2955
|
+
postJson(HEARTBEAT_URL, licenseKey, metricEvent),
|
|
2956
|
+
postJson(IMPRESSIONS_URL, licenseKey, {
|
|
2957
|
+
events: [
|
|
2958
|
+
{
|
|
2959
|
+
player_id: metricEvent.player_id,
|
|
2960
|
+
ad_played_count: 1,
|
|
2961
|
+
ad_url: adImpressionInfo.adUrl,
|
|
2962
|
+
license_key: licenseKey,
|
|
2963
|
+
capture_at: adImpressionInfo.timestamp
|
|
2964
|
+
}
|
|
2965
|
+
]
|
|
2966
|
+
})
|
|
2967
|
+
])
|
|
2939
2968
|
];
|
|
2940
|
-
case
|
|
2969
|
+
case 3:
|
|
2941
2970
|
_state.sent();
|
|
2942
2971
|
return [
|
|
2943
2972
|
3,
|
|
2944
|
-
|
|
2973
|
+
5
|
|
2945
2974
|
];
|
|
2946
|
-
case
|
|
2975
|
+
case 4:
|
|
2947
2976
|
error = _state.sent();
|
|
2948
|
-
console.error("[StormcloudVideoPlayer] Error sending ad
|
|
2977
|
+
console.error("[StormcloudVideoPlayer] Error sending ad impression tracking:", error);
|
|
2949
2978
|
return [
|
|
2950
2979
|
3,
|
|
2951
|
-
|
|
2980
|
+
5
|
|
2952
2981
|
];
|
|
2953
|
-
case
|
|
2982
|
+
case 5:
|
|
2954
2983
|
return [
|
|
2955
2984
|
2
|
|
2956
2985
|
];
|
|
2957
2986
|
}
|
|
2958
2987
|
});
|
|
2959
|
-
})();
|
|
2988
|
+
}).apply(this, arguments);
|
|
2960
2989
|
}
|
|
2961
|
-
function
|
|
2962
|
-
return _async_to_generator(function() {
|
|
2963
|
-
var
|
|
2990
|
+
function sendHeartbeat(_0) {
|
|
2991
|
+
return _async_to_generator(function(licenseKey) {
|
|
2992
|
+
var context, flags, heartbeatData, error;
|
|
2993
|
+
var _arguments = arguments;
|
|
2964
2994
|
return _ts_generator(this, function(_state) {
|
|
2965
2995
|
switch(_state.label){
|
|
2966
2996
|
case 0:
|
|
2997
|
+
context = _arguments.length > 1 && _arguments[1] !== void 0 ? _arguments[1] : {}, flags = _arguments.length > 2 && _arguments[2] !== void 0 ? _arguments[2] : {};
|
|
2998
|
+
_state.label = 1;
|
|
2999
|
+
case 1:
|
|
2967
3000
|
_state.trys.push([
|
|
2968
|
-
|
|
2969
|
-
|
|
3001
|
+
1,
|
|
3002
|
+
4,
|
|
2970
3003
|
,
|
|
2971
|
-
|
|
3004
|
+
5
|
|
2972
3005
|
]);
|
|
2973
|
-
clientInfo = getClientInfo();
|
|
2974
3006
|
return [
|
|
2975
3007
|
4,
|
|
2976
|
-
|
|
3008
|
+
buildPlayerMetricEvent(licenseKey, context, flags)
|
|
2977
3009
|
];
|
|
2978
|
-
case
|
|
2979
|
-
|
|
2980
|
-
source = mapToAdTrackingSource(payload.source, adPlayerType);
|
|
2981
|
-
adImpressionInfo = _object_spread({
|
|
2982
|
-
source: source,
|
|
2983
|
-
adIndex: payload.adIndex,
|
|
2984
|
-
timestamp: /* @__PURE__ */ new Date().toISOString()
|
|
2985
|
-
}, payload.durationSeconds != null && {
|
|
2986
|
-
durationSeconds: payload.durationSeconds
|
|
2987
|
-
});
|
|
2988
|
-
body = _object_spread_props(_object_spread({
|
|
2989
|
-
browserId: browserId
|
|
2990
|
-
}, clientInfo, licenseKey && {
|
|
2991
|
-
licenseKey: licenseKey
|
|
2992
|
-
}), {
|
|
2993
|
-
adImpressionInfo: adImpressionInfo
|
|
2994
|
-
});
|
|
3010
|
+
case 2:
|
|
3011
|
+
heartbeatData = _state.sent();
|
|
2995
3012
|
return [
|
|
2996
3013
|
4,
|
|
2997
|
-
|
|
3014
|
+
postJson(HEARTBEAT_URL, licenseKey, heartbeatData)
|
|
2998
3015
|
];
|
|
2999
|
-
case
|
|
3016
|
+
case 3:
|
|
3000
3017
|
_state.sent();
|
|
3001
3018
|
return [
|
|
3002
3019
|
3,
|
|
3003
|
-
|
|
3020
|
+
5
|
|
3004
3021
|
];
|
|
3005
|
-
case
|
|
3022
|
+
case 4:
|
|
3006
3023
|
error = _state.sent();
|
|
3007
|
-
console.error("[StormcloudVideoPlayer] Error sending
|
|
3024
|
+
console.error("[StormcloudVideoPlayer] Error sending heartbeat:", error);
|
|
3008
3025
|
return [
|
|
3009
3026
|
3,
|
|
3010
|
-
|
|
3027
|
+
5
|
|
3011
3028
|
];
|
|
3012
|
-
case
|
|
3029
|
+
case 5:
|
|
3013
3030
|
return [
|
|
3014
3031
|
2
|
|
3015
3032
|
];
|
|
3016
3033
|
}
|
|
3017
3034
|
});
|
|
3018
|
-
})();
|
|
3035
|
+
}).apply(this, arguments);
|
|
3019
3036
|
}
|
|
3020
3037
|
// src/utils/polyfills.ts
|
|
3021
3038
|
function polyfillURLSearchParams() {
|
|
@@ -3374,7 +3391,7 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
3374
3391
|
key: "load",
|
|
3375
3392
|
value: function load() {
|
|
3376
3393
|
return _async_to_generator(function() {
|
|
3377
|
-
var _this, error, _this_config_lowLatencyMode, _this_video_play;
|
|
3394
|
+
var _this, error, _this_config_isLiveStream, _this_config_lowLatencyMode, _this_video_play;
|
|
3378
3395
|
return _ts_generator(this, function(_state) {
|
|
3379
3396
|
switch(_state.label){
|
|
3380
3397
|
case 0:
|
|
@@ -3418,7 +3435,7 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
3418
3435
|
this.nativeHlsMode = true;
|
|
3419
3436
|
this.videoSrcProtection = this.config.src;
|
|
3420
3437
|
this.video.src = this.config.src;
|
|
3421
|
-
this.isLiveStream = (_this_config_lowLatencyMode = this.config.lowLatencyMode) !== null && _this_config_lowLatencyMode !== void 0 ? _this_config_lowLatencyMode : false;
|
|
3438
|
+
this.isLiveStream = (_this_config_isLiveStream = this.config.isLiveStream) !== null && _this_config_isLiveStream !== void 0 ? _this_config_isLiveStream : (_this_config_lowLatencyMode = this.config.lowLatencyMode) !== null && _this_config_lowLatencyMode !== void 0 ? _this_config_lowLatencyMode : false;
|
|
3422
3439
|
if (this.config.debugAdTiming) {
|
|
3423
3440
|
console.log("[StormcloudVideoPlayer] Using native HLS playback - VOD mode:", {
|
|
3424
3441
|
isLive: this.isLiveStream,
|
|
@@ -3469,19 +3486,28 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
3469
3486
|
});
|
|
3470
3487
|
this.hls.on(Hls2.Events.MANIFEST_PARSED, function(_, data) {
|
|
3471
3488
|
return _async_to_generator(function() {
|
|
3472
|
-
var
|
|
3489
|
+
var _this_config_isLiveStream, _ref, _this_config_minSegmentsBeforePlay, _this_hls_levels, _this_hls, prerollKey, adBehavior, minSegments, _this_video_play;
|
|
3473
3490
|
return _ts_generator(this, function(_state) {
|
|
3474
3491
|
switch(_state.label){
|
|
3475
3492
|
case 0:
|
|
3476
|
-
|
|
3477
|
-
|
|
3478
|
-
|
|
3479
|
-
|
|
3480
|
-
|
|
3481
|
-
|
|
3482
|
-
|
|
3483
|
-
|
|
3484
|
-
|
|
3493
|
+
this.isLiveStream = (_this_config_isLiveStream = this.config.isLiveStream) !== null && _this_config_isLiveStream !== void 0 ? _this_config_isLiveStream : (_ref = (_this_hls = this.hls) === null || _this_hls === void 0 ? void 0 : (_this_hls_levels = _this_hls.levels) === null || _this_hls_levels === void 0 ? void 0 : _this_hls_levels.some(function(level) {
|
|
3494
|
+
var _level_details, _level_details1;
|
|
3495
|
+
return (level === null || level === void 0 ? void 0 : (_level_details = level.details) === null || _level_details === void 0 ? void 0 : _level_details.live) === true || (level === null || level === void 0 ? void 0 : (_level_details1 = level.details) === null || _level_details1 === void 0 ? void 0 : _level_details1.type) === "LIVE";
|
|
3496
|
+
})) !== null && _ref !== void 0 ? _ref : false;
|
|
3497
|
+
if (!this.isLiveStream && this.vmapBreaks.length === 0 && this.apiVastTagUrl) {
|
|
3498
|
+
prerollKey = "synthetic-vod-preroll";
|
|
3499
|
+
if (!this.consumedVmapBreakIds.has(prerollKey)) {
|
|
3500
|
+
this.vmapBreaks = [
|
|
3501
|
+
{
|
|
3502
|
+
id: prerollKey,
|
|
3503
|
+
startTimeMs: 0,
|
|
3504
|
+
vastTagUrl: this.apiVastTagUrl
|
|
3505
|
+
}
|
|
3506
|
+
];
|
|
3507
|
+
if (this.config.debugAdTiming) {
|
|
3508
|
+
console.log("[StormcloudVideoPlayer] Injected synthetic VOD preroll from apiVastTagUrl");
|
|
3509
|
+
}
|
|
3510
|
+
}
|
|
3485
3511
|
}
|
|
3486
3512
|
if (this.config.debugAdTiming) {
|
|
3487
3513
|
adBehavior = this.shouldContinueLiveStreamDuringAds() ? "live (main video continues muted during ads)" : "vod (main video pauses during ads)";
|
|
@@ -3811,8 +3837,10 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
3811
3837
|
var _this = this;
|
|
3812
3838
|
this.ima.on("all_ads_completed", function() {
|
|
3813
3839
|
sendAdImpressionTracking(_this.config.licenseKey, {
|
|
3814
|
-
|
|
3815
|
-
|
|
3840
|
+
source: "ima",
|
|
3841
|
+
adIndex: _this.currentAdIndex,
|
|
3842
|
+
timestamp: /* @__PURE__ */ new Date().toISOString()
|
|
3843
|
+
}).catch(function() {});
|
|
3816
3844
|
var remaining = _this.getRemainingAdMs();
|
|
3817
3845
|
_this.consecutiveFailures = 0;
|
|
3818
3846
|
if (_this.config.debugAdTiming) {
|
|
@@ -3873,8 +3901,10 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
3873
3901
|
});
|
|
3874
3902
|
this.ima.on("content_resume", function() {
|
|
3875
3903
|
sendAdImpressionTracking(_this.config.licenseKey, {
|
|
3876
|
-
|
|
3877
|
-
|
|
3904
|
+
source: "ima",
|
|
3905
|
+
adIndex: _this.currentAdIndex,
|
|
3906
|
+
timestamp: /* @__PURE__ */ new Date().toISOString()
|
|
3907
|
+
}).catch(function() {});
|
|
3878
3908
|
if (!_this.video.muted) {
|
|
3879
3909
|
_this.video.muted = true;
|
|
3880
3910
|
_this.video.volume = 0;
|
|
@@ -4508,7 +4538,10 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
4508
4538
|
var detectPayload = {};
|
|
4509
4539
|
if (marker.durationSeconds != null) detectPayload.durationSeconds = marker.durationSeconds;
|
|
4510
4540
|
if (marker.ptsSeconds != null) detectPayload.ptsSeconds = marker.ptsSeconds;
|
|
4511
|
-
sendAdDetectTracking(this.config.licenseKey,
|
|
4541
|
+
sendAdDetectTracking(this.config.licenseKey, _object_spread({
|
|
4542
|
+
source: "scte35",
|
|
4543
|
+
timestamp: /* @__PURE__ */ new Date().toISOString()
|
|
4544
|
+
}, detectPayload)).catch(function() {});
|
|
4512
4545
|
}
|
|
4513
4546
|
var hasPrefetchedAds = this.pendingAdBreak && this.pendingAdBreak.vastUrls.length > 0;
|
|
4514
4547
|
var durationMs = marker.durationSeconds != null ? marker.durationSeconds * 1e3 : ((_this_pendingAdBreak = this.pendingAdBreak) === null || _this_pendingAdBreak === void 0 ? void 0 : _this_pendingAdBreak.marker.durationSeconds) != null ? this.pendingAdBreak.marker.durationSeconds * 1e3 : void 0;
|
|
@@ -5750,7 +5783,10 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
5750
5783
|
if (marker.durationSeconds != null) detectPayload.durationSeconds = marker.durationSeconds;
|
|
5751
5784
|
if (marker.ptsSeconds != null) detectPayload.ptsSeconds = marker.ptsSeconds;
|
|
5752
5785
|
if (fragmentSn !== void 0) detectPayload.detectedAtFragmentSn = fragmentSn;
|
|
5753
|
-
sendAdDetectTracking(this.config.licenseKey,
|
|
5786
|
+
sendAdDetectTracking(this.config.licenseKey, _object_spread({
|
|
5787
|
+
source: "scte35",
|
|
5788
|
+
timestamp: /* @__PURE__ */ new Date().toISOString()
|
|
5789
|
+
}, detectPayload)).catch(function() {});
|
|
5754
5790
|
if (this.config.debugAdTiming) {
|
|
5755
5791
|
console.log("[PREFETCH] \uD83D\uDD04 Starting ad prefetch for upcoming ad break");
|
|
5756
5792
|
console.log("[PREFETCH] \uD83D\uDCCB Pre-generated ".concat(generatedUrls.length, " VAST URLs"));
|
|
@@ -6231,9 +6267,10 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
6231
6267
|
preloadedController = preloaded.imaController;
|
|
6232
6268
|
usePreloadedAd = true;
|
|
6233
6269
|
sendAdLoadedTracking(this.config.licenseKey, {
|
|
6234
|
-
source: "
|
|
6235
|
-
vastUrl: firstAdUrl
|
|
6236
|
-
|
|
6270
|
+
source: "ima",
|
|
6271
|
+
vastUrl: firstAdUrl,
|
|
6272
|
+
timestamp: /* @__PURE__ */ new Date().toISOString()
|
|
6273
|
+
}).catch(function() {});
|
|
6237
6274
|
if (this.config.debugAdTiming) {
|
|
6238
6275
|
console.log("[CONTINUOUS-FETCH] \uD83D\uDE80 Using preloaded ad from pool (preloaded in advance, ready immediately!)");
|
|
6239
6276
|
console.log("[CONTINUOUS-FETCH] Pool still has ".concat(this.preloadPool.length, " preloaded ads ready"));
|
|
@@ -6323,9 +6360,10 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
6323
6360
|
case 5:
|
|
6324
6361
|
_state.sent();
|
|
6325
6362
|
sendAdLoadedTracking(this.config.licenseKey, {
|
|
6326
|
-
source: "
|
|
6327
|
-
vastUrl: firstAdUrl
|
|
6328
|
-
|
|
6363
|
+
source: "ima",
|
|
6364
|
+
vastUrl: firstAdUrl,
|
|
6365
|
+
timestamp: /* @__PURE__ */ new Date().toISOString()
|
|
6366
|
+
}).catch(function() {});
|
|
6329
6367
|
if (this.config.debugAdTiming) {
|
|
6330
6368
|
console.log("[CONTINUOUS-FETCH] \u2705 First ad request successful, starting playback");
|
|
6331
6369
|
}
|
|
@@ -6721,9 +6759,10 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
6721
6759
|
console.log("[CONTINUOUS-FETCH] \uD83C\uDFAF Using preloaded ad from pool (".concat(this.preloadPool.length, " remaining in pool)"));
|
|
6722
6760
|
}
|
|
6723
6761
|
sendAdLoadedTracking(this.config.licenseKey, {
|
|
6724
|
-
source: "
|
|
6725
|
-
vastUrl: preloaded.vastUrl
|
|
6726
|
-
|
|
6762
|
+
source: "ima",
|
|
6763
|
+
vastUrl: preloaded.vastUrl,
|
|
6764
|
+
timestamp: /* @__PURE__ */ new Date().toISOString()
|
|
6765
|
+
}).catch(function() {});
|
|
6727
6766
|
_state.label = 1;
|
|
6728
6767
|
case 1:
|
|
6729
6768
|
_state.trys.push([
|
|
@@ -7475,9 +7514,10 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
7475
7514
|
case 3:
|
|
7476
7515
|
_state.sent();
|
|
7477
7516
|
sendAdLoadedTracking(this.config.licenseKey, {
|
|
7478
|
-
source: "
|
|
7479
|
-
vastUrl: vastTagUrl
|
|
7480
|
-
|
|
7517
|
+
source: "ima",
|
|
7518
|
+
vastUrl: vastTagUrl,
|
|
7519
|
+
timestamp: /* @__PURE__ */ new Date().toISOString()
|
|
7520
|
+
}).catch(function() {});
|
|
7481
7521
|
this.clearAdRequestWatchdog();
|
|
7482
7522
|
if (this.activeAdRequestToken !== requestToken) {
|
|
7483
7523
|
return [
|
|
@@ -7905,7 +7945,8 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
7905
7945
|
continue;
|
|
7906
7946
|
}
|
|
7907
7947
|
var end = breakStartMs + (b.durationMs || 0);
|
|
7908
|
-
|
|
7948
|
+
var effectiveTol = breakStartMs === 0 ? Math.max(tol, 3e4) : tol;
|
|
7949
|
+
if (nowMs >= breakStartMs && (b.durationMs ? nowMs < end : nowMs <= breakStartMs + effectiveTol)) {
|
|
7909
7950
|
return b;
|
|
7910
7951
|
}
|
|
7911
7952
|
}
|
|
@@ -8136,6 +8177,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
|
8136
8177
|
var CRITICAL_PROPS = [
|
|
8137
8178
|
"src",
|
|
8138
8179
|
"allowNativeHls",
|
|
8180
|
+
"isLiveStream",
|
|
8139
8181
|
"licenseKey",
|
|
8140
8182
|
"vmapUrl",
|
|
8141
8183
|
"lowLatencyMode",
|
|
@@ -8145,12 +8187,13 @@ var CRITICAL_PROPS = [
|
|
|
8145
8187
|
var CONTROLS_HIDE_DELAY = 3e3;
|
|
8146
8188
|
var DEFAULT_PLAYER_ASPECT_RATIO = 16 / 9;
|
|
8147
8189
|
var StormcloudVideoPlayerComponent = React.memo(function(props) {
|
|
8148
|
-
var src = props.src, autoplay = props.autoplay, muted = props.muted, lowLatencyMode = props.lowLatencyMode, allowNativeHls = props.allowNativeHls, driftToleranceMs = props.driftToleranceMs, immediateManifestAds = props.immediateManifestAds, debugAdTiming = props.debugAdTiming, showCustomControls = props.showCustomControls, hideLoadingIndicator = props.hideLoadingIndicator, onVolumeToggle = props.onVolumeToggle, onFullscreenToggle = props.onFullscreenToggle, onControlClick = props.onControlClick, onReady = props.onReady, wrapperClassName = props.wrapperClassName, wrapperStyle = props.wrapperStyle, className = props.className, style = props.style, controls = props.controls, playsInline = props.playsInline, preload = props.preload, poster = props.poster, children = props.children, licenseKey = props.licenseKey, vastMode = props.vastMode, vastTagUrl = props.vastTagUrl, vmapUrl = props.vmapUrl, adPlayerType = props.adPlayerType, minSegmentsBeforePlay = props.minSegmentsBeforePlay, restVideoAttrs = _object_without_properties(props, [
|
|
8190
|
+
var src = props.src, autoplay = props.autoplay, muted = props.muted, lowLatencyMode = props.lowLatencyMode, allowNativeHls = props.allowNativeHls, isLiveStream = props.isLiveStream, driftToleranceMs = props.driftToleranceMs, immediateManifestAds = props.immediateManifestAds, debugAdTiming = props.debugAdTiming, showCustomControls = props.showCustomControls, hideLoadingIndicator = props.hideLoadingIndicator, onVolumeToggle = props.onVolumeToggle, onFullscreenToggle = props.onFullscreenToggle, onControlClick = props.onControlClick, onReady = props.onReady, wrapperClassName = props.wrapperClassName, wrapperStyle = props.wrapperStyle, className = props.className, style = props.style, controls = props.controls, playsInline = props.playsInline, preload = props.preload, poster = props.poster, children = props.children, licenseKey = props.licenseKey, vastMode = props.vastMode, vastTagUrl = props.vastTagUrl, vmapUrl = props.vmapUrl, adPlayerType = props.adPlayerType, minSegmentsBeforePlay = props.minSegmentsBeforePlay, restVideoAttrs = _object_without_properties(props, [
|
|
8149
8191
|
"src",
|
|
8150
8192
|
"autoplay",
|
|
8151
8193
|
"muted",
|
|
8152
8194
|
"lowLatencyMode",
|
|
8153
8195
|
"allowNativeHls",
|
|
8196
|
+
"isLiveStream",
|
|
8154
8197
|
"driftToleranceMs",
|
|
8155
8198
|
"immediateManifestAds",
|
|
8156
8199
|
"debugAdTiming",
|
|
@@ -8305,7 +8348,7 @@ var StormcloudVideoPlayerComponent = React.memo(function(props) {
|
|
|
8305
8348
|
setShowSpeedMenu(false);
|
|
8306
8349
|
};
|
|
8307
8350
|
var isHlsStream = (src === null || src === void 0 ? void 0 : src.toLowerCase().includes(".m3u8")) || (src === null || src === void 0 ? void 0 : src.toLowerCase().includes("/hls/"));
|
|
8308
|
-
var shouldShowEnhancedControls = showCustomControls && (isHlsStream ? allowNativeHls : true);
|
|
8351
|
+
var shouldShowEnhancedControls = showCustomControls && (isHlsStream ? allowNativeHls || isLiveStream === false : true);
|
|
8309
8352
|
var criticalPropsKey = useMemo(function() {
|
|
8310
8353
|
return CRITICAL_PROPS.map(function(prop) {
|
|
8311
8354
|
return "".concat(prop, ":").concat(props[prop]);
|
|
@@ -8313,6 +8356,7 @@ var StormcloudVideoPlayerComponent = React.memo(function(props) {
|
|
|
8313
8356
|
}, [
|
|
8314
8357
|
src,
|
|
8315
8358
|
allowNativeHls,
|
|
8359
|
+
isLiveStream,
|
|
8316
8360
|
licenseKey,
|
|
8317
8361
|
vmapUrl,
|
|
8318
8362
|
lowLatencyMode,
|
|
@@ -8347,6 +8391,7 @@ var StormcloudVideoPlayerComponent = React.memo(function(props) {
|
|
|
8347
8391
|
if (muted !== void 0) cfg.muted = muted;
|
|
8348
8392
|
if (lowLatencyMode !== void 0) cfg.lowLatencyMode = lowLatencyMode;
|
|
8349
8393
|
if (allowNativeHls !== void 0) cfg.allowNativeHls = allowNativeHls;
|
|
8394
|
+
if (isLiveStream !== void 0) cfg.isLiveStream = isLiveStream;
|
|
8350
8395
|
if (driftToleranceMs !== void 0) cfg.driftToleranceMs = driftToleranceMs;
|
|
8351
8396
|
if (immediateManifestAds !== void 0) cfg.immediateManifestAds = immediateManifestAds;
|
|
8352
8397
|
if (debugAdTiming !== void 0) cfg.debugAdTiming = debugAdTiming;
|
|
@@ -9186,161 +9231,202 @@ var StormcloudVideoPlayerComponent = React.memo(function(props) {
|
|
|
9186
9231
|
]
|
|
9187
9232
|
})
|
|
9188
9233
|
]
|
|
9189
|
-
}) : showCustomControls && !showLicenseWarning && /* @__PURE__ */ jsxs(
|
|
9190
|
-
className: "sc-controls-bar",
|
|
9191
|
-
style: {
|
|
9192
|
-
position: "absolute",
|
|
9193
|
-
bottom: "".concat(10 * responsiveScale, "px"),
|
|
9194
|
-
right: "".concat(10 * responsiveScale, "px"),
|
|
9195
|
-
display: "flex",
|
|
9196
|
-
flexDirection: isPortrait ? "column" : "row",
|
|
9197
|
-
gap: "".concat(8 * responsiveScale, "px"),
|
|
9198
|
-
zIndex: 10,
|
|
9199
|
-
opacity: controlsVisible ? 1 : 0,
|
|
9200
|
-
transform: controlsVisible ? "translateY(0)" : "translateY(4px)",
|
|
9201
|
-
pointerEvents: controlsVisible ? "auto" : "none"
|
|
9202
|
-
},
|
|
9234
|
+
}) : showCustomControls && !showLicenseWarning && /* @__PURE__ */ jsxs(Fragment, {
|
|
9203
9235
|
children: [
|
|
9204
9236
|
/* @__PURE__ */ jsxs("div", {
|
|
9205
9237
|
style: {
|
|
9238
|
+
position: "absolute",
|
|
9239
|
+
top: "".concat(10 * responsiveScale, "px"),
|
|
9240
|
+
left: "".concat(10 * responsiveScale, "px"),
|
|
9206
9241
|
display: "flex",
|
|
9207
9242
|
alignItems: "center",
|
|
9208
|
-
|
|
9209
|
-
|
|
9210
|
-
|
|
9211
|
-
|
|
9243
|
+
gap: "6px",
|
|
9244
|
+
zIndex: 10,
|
|
9245
|
+
opacity: controlsVisible ? 1 : 0,
|
|
9246
|
+
transition: "opacity 0.35s ease"
|
|
9212
9247
|
},
|
|
9213
|
-
|
|
9214
|
-
|
|
9215
|
-
|
|
9216
|
-
|
|
9217
|
-
|
|
9248
|
+
children: [
|
|
9249
|
+
/* @__PURE__ */ jsx("div", {
|
|
9250
|
+
style: {
|
|
9251
|
+
width: "8px",
|
|
9252
|
+
height: "8px",
|
|
9253
|
+
borderRadius: "50%",
|
|
9254
|
+
background: "#ff3b30",
|
|
9255
|
+
animation: "sc-pulse 1.5s ease-in-out infinite",
|
|
9256
|
+
flexShrink: 0
|
|
9257
|
+
}
|
|
9258
|
+
}),
|
|
9259
|
+
/* @__PURE__ */ jsx("span", {
|
|
9260
|
+
style: {
|
|
9261
|
+
fontSize: "".concat(12 * responsiveScale, "px"),
|
|
9262
|
+
fontFamily: "'SF Pro Display', 'Segoe UI', Arial, sans-serif",
|
|
9263
|
+
fontWeight: 700,
|
|
9264
|
+
letterSpacing: "0.08em",
|
|
9265
|
+
color: "#fff",
|
|
9266
|
+
textShadow: "0 1px 3px rgba(0,0,0,0.6)",
|
|
9267
|
+
userSelect: "none"
|
|
9268
|
+
},
|
|
9269
|
+
children: "LIVE"
|
|
9270
|
+
})
|
|
9271
|
+
]
|
|
9272
|
+
}),
|
|
9273
|
+
/* @__PURE__ */ jsxs("div", {
|
|
9274
|
+
className: "sc-controls-bar",
|
|
9275
|
+
style: {
|
|
9276
|
+
position: "absolute",
|
|
9277
|
+
bottom: "".concat(10 * responsiveScale, "px"),
|
|
9278
|
+
right: "".concat(10 * responsiveScale, "px"),
|
|
9279
|
+
display: "flex",
|
|
9280
|
+
flexDirection: isPortrait ? "column" : "row",
|
|
9281
|
+
gap: "".concat(8 * responsiveScale, "px"),
|
|
9282
|
+
zIndex: 10,
|
|
9283
|
+
opacity: controlsVisible ? 1 : 0,
|
|
9284
|
+
transform: controlsVisible ? "translateY(0)" : "translateY(4px)",
|
|
9285
|
+
pointerEvents: controlsVisible ? "auto" : "none"
|
|
9218
9286
|
},
|
|
9219
9287
|
children: [
|
|
9288
|
+
/* @__PURE__ */ jsxs("div", {
|
|
9289
|
+
style: {
|
|
9290
|
+
display: "flex",
|
|
9291
|
+
alignItems: "center",
|
|
9292
|
+
background: "rgba(0, 0, 0, 0.6)",
|
|
9293
|
+
borderRadius: "".concat(18 * responsiveScale, "px"),
|
|
9294
|
+
padding: "2px",
|
|
9295
|
+
paddingRight: "".concat(8 * responsiveScale, "px")
|
|
9296
|
+
},
|
|
9297
|
+
onMouseEnter: function onMouseEnter() {
|
|
9298
|
+
return setShowVolumeSlider(true);
|
|
9299
|
+
},
|
|
9300
|
+
onMouseLeave: function onMouseLeave() {
|
|
9301
|
+
return setShowVolumeSlider(false);
|
|
9302
|
+
},
|
|
9303
|
+
children: [
|
|
9304
|
+
/* @__PURE__ */ jsx("button", {
|
|
9305
|
+
className: "sc-ctrl-btn",
|
|
9306
|
+
onClick: function onClick() {
|
|
9307
|
+
if (playerRef.current) playerRef.current.toggleMute();
|
|
9308
|
+
onVolumeToggle === null || onVolumeToggle === void 0 ? void 0 : onVolumeToggle();
|
|
9309
|
+
resetControlsTimer();
|
|
9310
|
+
},
|
|
9311
|
+
style: {
|
|
9312
|
+
padding: "".concat(8 * responsiveScale, "px"),
|
|
9313
|
+
borderRadius: "50%",
|
|
9314
|
+
minWidth: "".concat(36 * responsiveScale, "px"),
|
|
9315
|
+
minHeight: "".concat(36 * responsiveScale, "px")
|
|
9316
|
+
},
|
|
9317
|
+
title: isMuted ? "Unmute" : "Mute",
|
|
9318
|
+
children: /* @__PURE__ */ jsx(VolumeIcon, {
|
|
9319
|
+
size: Math.max(14, 18 * responsiveScale)
|
|
9320
|
+
})
|
|
9321
|
+
}),
|
|
9322
|
+
/* @__PURE__ */ jsx("div", {
|
|
9323
|
+
style: {
|
|
9324
|
+
width: showVolumeSlider ? "".concat(68 * responsiveScale, "px") : "0px",
|
|
9325
|
+
overflow: "hidden",
|
|
9326
|
+
transition: "width 0.2s cubic-bezier(0.4, 0, 0.2, 1)",
|
|
9327
|
+
display: "flex",
|
|
9328
|
+
alignItems: "center",
|
|
9329
|
+
paddingLeft: showVolumeSlider ? "".concat(3 * responsiveScale, "px") : "0",
|
|
9330
|
+
paddingRight: showVolumeSlider ? "".concat(10 * responsiveScale, "px") : "0"
|
|
9331
|
+
},
|
|
9332
|
+
children: /* @__PURE__ */ jsxs("div", {
|
|
9333
|
+
style: {
|
|
9334
|
+
position: "relative",
|
|
9335
|
+
width: "".concat(56 * responsiveScale, "px"),
|
|
9336
|
+
height: "3px",
|
|
9337
|
+
cursor: "pointer",
|
|
9338
|
+
borderRadius: "1.5px"
|
|
9339
|
+
},
|
|
9340
|
+
onMouseDown: function onMouseDown(e) {
|
|
9341
|
+
e.preventDefault();
|
|
9342
|
+
var el = e.currentTarget;
|
|
9343
|
+
var move = function move(ev) {
|
|
9344
|
+
var r2 = el.getBoundingClientRect();
|
|
9345
|
+
handleVolumeChange(Math.max(0, Math.min(1, (ev.clientX - r2.left) / r2.width)));
|
|
9346
|
+
};
|
|
9347
|
+
var up = function up1() {
|
|
9348
|
+
document.removeEventListener("mousemove", move);
|
|
9349
|
+
document.removeEventListener("mouseup", up);
|
|
9350
|
+
};
|
|
9351
|
+
document.addEventListener("mousemove", move);
|
|
9352
|
+
document.addEventListener("mouseup", up);
|
|
9353
|
+
var r = el.getBoundingClientRect();
|
|
9354
|
+
handleVolumeChange(Math.max(0, Math.min(1, (e.clientX - r.left) / r.width)));
|
|
9355
|
+
},
|
|
9356
|
+
onClick: function onClick(e) {
|
|
9357
|
+
e.stopPropagation();
|
|
9358
|
+
var r = e.currentTarget.getBoundingClientRect();
|
|
9359
|
+
handleVolumeChange(Math.max(0, Math.min(1, (e.clientX - r.left) / r.width)));
|
|
9360
|
+
},
|
|
9361
|
+
children: [
|
|
9362
|
+
/* @__PURE__ */ jsx("div", {
|
|
9363
|
+
style: {
|
|
9364
|
+
position: "absolute",
|
|
9365
|
+
inset: 0,
|
|
9366
|
+
background: "rgba(255, 255, 255, 0.2)",
|
|
9367
|
+
borderRadius: "1.5px"
|
|
9368
|
+
}
|
|
9369
|
+
}),
|
|
9370
|
+
/* @__PURE__ */ jsx("div", {
|
|
9371
|
+
style: {
|
|
9372
|
+
position: "absolute",
|
|
9373
|
+
top: 0,
|
|
9374
|
+
left: 0,
|
|
9375
|
+
bottom: 0,
|
|
9376
|
+
width: "".concat((isMuted ? 0 : volume) * 100, "%"),
|
|
9377
|
+
background: "#fff",
|
|
9378
|
+
borderRadius: "1.5px",
|
|
9379
|
+
transition: "width 0.1s ease-out"
|
|
9380
|
+
}
|
|
9381
|
+
}),
|
|
9382
|
+
/* @__PURE__ */ jsx("div", {
|
|
9383
|
+
style: {
|
|
9384
|
+
position: "absolute",
|
|
9385
|
+
top: "50%",
|
|
9386
|
+
left: "".concat((isMuted ? 0 : volume) * 100, "%"),
|
|
9387
|
+
transform: "translate(-50%, -50%)",
|
|
9388
|
+
width: "12px",
|
|
9389
|
+
height: "12px",
|
|
9390
|
+
background: "#fff",
|
|
9391
|
+
borderRadius: "50%",
|
|
9392
|
+
boxShadow: "0 0 3px rgba(0, 0, 0, 0.3)",
|
|
9393
|
+
transition: "left 0.1s ease-out"
|
|
9394
|
+
}
|
|
9395
|
+
})
|
|
9396
|
+
]
|
|
9397
|
+
})
|
|
9398
|
+
})
|
|
9399
|
+
]
|
|
9400
|
+
}),
|
|
9220
9401
|
/* @__PURE__ */ jsx("button", {
|
|
9221
9402
|
className: "sc-ctrl-btn",
|
|
9222
9403
|
onClick: function onClick() {
|
|
9223
|
-
if (
|
|
9224
|
-
|
|
9404
|
+
if (onFullscreenToggle) {
|
|
9405
|
+
onFullscreenToggle();
|
|
9406
|
+
} else if (wrapperRef.current) {
|
|
9407
|
+
if (!document.fullscreenElement) {
|
|
9408
|
+
wrapperRef.current.requestFullscreen().catch(function() {});
|
|
9409
|
+
} else {
|
|
9410
|
+
document.exitFullscreen().catch(function() {});
|
|
9411
|
+
}
|
|
9412
|
+
}
|
|
9225
9413
|
resetControlsTimer();
|
|
9226
9414
|
},
|
|
9227
9415
|
style: {
|
|
9228
9416
|
padding: "".concat(8 * responsiveScale, "px"),
|
|
9229
9417
|
borderRadius: "50%",
|
|
9230
9418
|
minWidth: "".concat(36 * responsiveScale, "px"),
|
|
9231
|
-
minHeight: "".concat(36 * responsiveScale, "px")
|
|
9419
|
+
minHeight: "".concat(36 * responsiveScale, "px"),
|
|
9420
|
+
background: "rgba(0, 0, 0, 0.6)"
|
|
9232
9421
|
},
|
|
9233
|
-
title:
|
|
9234
|
-
children: /* @__PURE__ */ jsx(
|
|
9422
|
+
title: isFullscreen ? "Exit Fullscreen" : "Enter Fullscreen",
|
|
9423
|
+
children: isFullscreen ? /* @__PURE__ */ jsx(FaCompress, {
|
|
9424
|
+
size: Math.max(14, 18 * responsiveScale)
|
|
9425
|
+
}) : /* @__PURE__ */ jsx(FaExpand, {
|
|
9235
9426
|
size: Math.max(14, 18 * responsiveScale)
|
|
9236
|
-
})
|
|
9237
|
-
}),
|
|
9238
|
-
/* @__PURE__ */ jsx("div", {
|
|
9239
|
-
style: {
|
|
9240
|
-
width: showVolumeSlider ? "".concat(68 * responsiveScale, "px") : "0px",
|
|
9241
|
-
overflow: "hidden",
|
|
9242
|
-
transition: "width 0.2s cubic-bezier(0.4, 0, 0.2, 1)",
|
|
9243
|
-
display: "flex",
|
|
9244
|
-
alignItems: "center",
|
|
9245
|
-
paddingLeft: showVolumeSlider ? "".concat(3 * responsiveScale, "px") : "0",
|
|
9246
|
-
paddingRight: showVolumeSlider ? "".concat(10 * responsiveScale, "px") : "0"
|
|
9247
|
-
},
|
|
9248
|
-
children: /* @__PURE__ */ jsxs("div", {
|
|
9249
|
-
style: {
|
|
9250
|
-
position: "relative",
|
|
9251
|
-
width: "".concat(56 * responsiveScale, "px"),
|
|
9252
|
-
height: "3px",
|
|
9253
|
-
cursor: "pointer",
|
|
9254
|
-
borderRadius: "1.5px"
|
|
9255
|
-
},
|
|
9256
|
-
onMouseDown: function onMouseDown(e) {
|
|
9257
|
-
e.preventDefault();
|
|
9258
|
-
var el = e.currentTarget;
|
|
9259
|
-
var move = function move(ev) {
|
|
9260
|
-
var r2 = el.getBoundingClientRect();
|
|
9261
|
-
handleVolumeChange(Math.max(0, Math.min(1, (ev.clientX - r2.left) / r2.width)));
|
|
9262
|
-
};
|
|
9263
|
-
var up = function up1() {
|
|
9264
|
-
document.removeEventListener("mousemove", move);
|
|
9265
|
-
document.removeEventListener("mouseup", up);
|
|
9266
|
-
};
|
|
9267
|
-
document.addEventListener("mousemove", move);
|
|
9268
|
-
document.addEventListener("mouseup", up);
|
|
9269
|
-
var r = el.getBoundingClientRect();
|
|
9270
|
-
handleVolumeChange(Math.max(0, Math.min(1, (e.clientX - r.left) / r.width)));
|
|
9271
|
-
},
|
|
9272
|
-
onClick: function onClick(e) {
|
|
9273
|
-
e.stopPropagation();
|
|
9274
|
-
var r = e.currentTarget.getBoundingClientRect();
|
|
9275
|
-
handleVolumeChange(Math.max(0, Math.min(1, (e.clientX - r.left) / r.width)));
|
|
9276
|
-
},
|
|
9277
|
-
children: [
|
|
9278
|
-
/* @__PURE__ */ jsx("div", {
|
|
9279
|
-
style: {
|
|
9280
|
-
position: "absolute",
|
|
9281
|
-
inset: 0,
|
|
9282
|
-
background: "rgba(255, 255, 255, 0.2)",
|
|
9283
|
-
borderRadius: "1.5px"
|
|
9284
|
-
}
|
|
9285
|
-
}),
|
|
9286
|
-
/* @__PURE__ */ jsx("div", {
|
|
9287
|
-
style: {
|
|
9288
|
-
position: "absolute",
|
|
9289
|
-
top: 0,
|
|
9290
|
-
left: 0,
|
|
9291
|
-
bottom: 0,
|
|
9292
|
-
width: "".concat((isMuted ? 0 : volume) * 100, "%"),
|
|
9293
|
-
background: "#fff",
|
|
9294
|
-
borderRadius: "1.5px",
|
|
9295
|
-
transition: "width 0.1s ease-out"
|
|
9296
|
-
}
|
|
9297
|
-
}),
|
|
9298
|
-
/* @__PURE__ */ jsx("div", {
|
|
9299
|
-
style: {
|
|
9300
|
-
position: "absolute",
|
|
9301
|
-
top: "50%",
|
|
9302
|
-
left: "".concat((isMuted ? 0 : volume) * 100, "%"),
|
|
9303
|
-
transform: "translate(-50%, -50%)",
|
|
9304
|
-
width: "12px",
|
|
9305
|
-
height: "12px",
|
|
9306
|
-
background: "#fff",
|
|
9307
|
-
borderRadius: "50%",
|
|
9308
|
-
boxShadow: "0 0 3px rgba(0, 0, 0, 0.3)",
|
|
9309
|
-
transition: "left 0.1s ease-out"
|
|
9310
|
-
}
|
|
9311
|
-
})
|
|
9312
|
-
]
|
|
9313
9427
|
})
|
|
9314
9428
|
})
|
|
9315
9429
|
]
|
|
9316
|
-
}),
|
|
9317
|
-
/* @__PURE__ */ jsx("button", {
|
|
9318
|
-
className: "sc-ctrl-btn",
|
|
9319
|
-
onClick: function onClick() {
|
|
9320
|
-
if (onFullscreenToggle) {
|
|
9321
|
-
onFullscreenToggle();
|
|
9322
|
-
} else if (wrapperRef.current) {
|
|
9323
|
-
if (!document.fullscreenElement) {
|
|
9324
|
-
wrapperRef.current.requestFullscreen().catch(function() {});
|
|
9325
|
-
} else {
|
|
9326
|
-
document.exitFullscreen().catch(function() {});
|
|
9327
|
-
}
|
|
9328
|
-
}
|
|
9329
|
-
resetControlsTimer();
|
|
9330
|
-
},
|
|
9331
|
-
style: {
|
|
9332
|
-
padding: "".concat(8 * responsiveScale, "px"),
|
|
9333
|
-
borderRadius: "50%",
|
|
9334
|
-
minWidth: "".concat(36 * responsiveScale, "px"),
|
|
9335
|
-
minHeight: "".concat(36 * responsiveScale, "px"),
|
|
9336
|
-
background: "rgba(0, 0, 0, 0.6)"
|
|
9337
|
-
},
|
|
9338
|
-
title: isFullscreen ? "Exit Fullscreen" : "Enter Fullscreen",
|
|
9339
|
-
children: isFullscreen ? /* @__PURE__ */ jsx(FaCompress, {
|
|
9340
|
-
size: Math.max(14, 18 * responsiveScale)
|
|
9341
|
-
}) : /* @__PURE__ */ jsx(FaExpand, {
|
|
9342
|
-
size: Math.max(14, 18 * responsiveScale)
|
|
9343
|
-
})
|
|
9344
9430
|
})
|
|
9345
9431
|
]
|
|
9346
9432
|
}),
|