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.cjs
CHANGED
|
@@ -2834,40 +2834,66 @@ function getBrowserID(clientInfo) {
|
|
|
2834
2834
|
});
|
|
2835
2835
|
})();
|
|
2836
2836
|
}
|
|
2837
|
-
|
|
2837
|
+
var PLAYER_TRACKING_BASE_URL = "https://adstorm.co/api-adstorm-dev/adstorm/player-tracking";
|
|
2838
|
+
var TRACK_URL = "".concat(PLAYER_TRACKING_BASE_URL, "/metrics/ingest");
|
|
2839
|
+
var HEARTBEAT_URL = "".concat(PLAYER_TRACKING_BASE_URL, "/heartbeat");
|
|
2840
|
+
var IMPRESSIONS_URL = "".concat(PLAYER_TRACKING_BASE_URL, "/impressions/ingest");
|
|
2841
|
+
function buildHeaders(licenseKey) {
|
|
2842
|
+
var headers = {
|
|
2843
|
+
"Content-Type": "application/json"
|
|
2844
|
+
};
|
|
2845
|
+
if (licenseKey) {
|
|
2846
|
+
headers["Authorization"] = "Bearer ".concat(licenseKey);
|
|
2847
|
+
}
|
|
2848
|
+
return headers;
|
|
2849
|
+
}
|
|
2850
|
+
function sendTrackRequest(licenseKey, body) {
|
|
2838
2851
|
return _async_to_generator(function() {
|
|
2839
|
-
var
|
|
2852
|
+
var response;
|
|
2840
2853
|
return _ts_generator(this, function(_state) {
|
|
2841
2854
|
switch(_state.label){
|
|
2842
2855
|
case 0:
|
|
2843
|
-
_state.trys.push([
|
|
2844
|
-
0,
|
|
2845
|
-
4,
|
|
2846
|
-
,
|
|
2847
|
-
5
|
|
2848
|
-
]);
|
|
2849
|
-
clientInfo = getClientInfo();
|
|
2850
2856
|
return [
|
|
2851
2857
|
4,
|
|
2852
|
-
|
|
2858
|
+
fetch(TRACK_URL, {
|
|
2859
|
+
method: "POST",
|
|
2860
|
+
headers: buildHeaders(licenseKey),
|
|
2861
|
+
body: JSON.stringify(body)
|
|
2862
|
+
})
|
|
2853
2863
|
];
|
|
2854
2864
|
case 1:
|
|
2855
|
-
|
|
2856
|
-
|
|
2857
|
-
|
|
2858
|
-
}
|
|
2859
|
-
|
|
2860
|
-
|
|
2861
|
-
|
|
2865
|
+
response = _state.sent();
|
|
2866
|
+
if (!response.ok) {
|
|
2867
|
+
throw new Error("HTTP error! status: ".concat(response.status));
|
|
2868
|
+
}
|
|
2869
|
+
return [
|
|
2870
|
+
4,
|
|
2871
|
+
response.json()
|
|
2872
|
+
];
|
|
2873
|
+
case 2:
|
|
2874
|
+
_state.sent();
|
|
2875
|
+
return [
|
|
2876
|
+
2
|
|
2877
|
+
];
|
|
2878
|
+
}
|
|
2879
|
+
});
|
|
2880
|
+
})();
|
|
2881
|
+
}
|
|
2882
|
+
function postJson(url, licenseKey, body) {
|
|
2883
|
+
return _async_to_generator(function() {
|
|
2884
|
+
var response;
|
|
2885
|
+
return _ts_generator(this, function(_state) {
|
|
2886
|
+
switch(_state.label){
|
|
2887
|
+
case 0:
|
|
2862
2888
|
return [
|
|
2863
2889
|
4,
|
|
2864
|
-
fetch(
|
|
2890
|
+
fetch(url, {
|
|
2865
2891
|
method: "POST",
|
|
2866
|
-
headers:
|
|
2867
|
-
body: JSON.stringify(
|
|
2892
|
+
headers: buildHeaders(licenseKey),
|
|
2893
|
+
body: JSON.stringify(body)
|
|
2868
2894
|
})
|
|
2869
2895
|
];
|
|
2870
|
-
case
|
|
2896
|
+
case 1:
|
|
2871
2897
|
response = _state.sent();
|
|
2872
2898
|
if (!response.ok) {
|
|
2873
2899
|
throw new Error("HTTP error! status: ".concat(response.status));
|
|
@@ -2876,35 +2902,63 @@ function sendInitialTracking(licenseKey) {
|
|
|
2876
2902
|
4,
|
|
2877
2903
|
response.json()
|
|
2878
2904
|
];
|
|
2879
|
-
case
|
|
2905
|
+
case 2:
|
|
2880
2906
|
_state.sent();
|
|
2881
2907
|
return [
|
|
2882
|
-
|
|
2883
|
-
5
|
|
2908
|
+
2
|
|
2884
2909
|
];
|
|
2885
|
-
|
|
2886
|
-
|
|
2887
|
-
|
|
2910
|
+
}
|
|
2911
|
+
});
|
|
2912
|
+
})();
|
|
2913
|
+
}
|
|
2914
|
+
function buildPlayerMetricEvent(_0) {
|
|
2915
|
+
return _async_to_generator(function(licenseKey) {
|
|
2916
|
+
var context, flags, _flags_captureAt, clientInfo, browserId, captureAt;
|
|
2917
|
+
var _arguments = arguments;
|
|
2918
|
+
return _ts_generator(this, function(_state) {
|
|
2919
|
+
switch(_state.label){
|
|
2920
|
+
case 0:
|
|
2921
|
+
context = _arguments.length > 1 && _arguments[1] !== void 0 ? _arguments[1] : {}, flags = _arguments.length > 2 && _arguments[2] !== void 0 ? _arguments[2] : {};
|
|
2922
|
+
clientInfo = getClientInfo();
|
|
2888
2923
|
return [
|
|
2889
|
-
|
|
2890
|
-
|
|
2924
|
+
4,
|
|
2925
|
+
getBrowserID(clientInfo)
|
|
2891
2926
|
];
|
|
2892
|
-
case
|
|
2927
|
+
case 1:
|
|
2928
|
+
browserId = _state.sent();
|
|
2929
|
+
captureAt = (_flags_captureAt = flags.captureAt) !== null && _flags_captureAt !== void 0 ? _flags_captureAt : /* @__PURE__ */ new Date().toISOString();
|
|
2893
2930
|
return [
|
|
2894
|
-
2
|
|
2931
|
+
2,
|
|
2932
|
+
{
|
|
2933
|
+
player_id: browserId,
|
|
2934
|
+
browserId: browserId,
|
|
2935
|
+
device_type: clientInfo.deviceType,
|
|
2936
|
+
deviceType: clientInfo.deviceType,
|
|
2937
|
+
input_stream_type: context.inputStreamType,
|
|
2938
|
+
os: clientInfo.os,
|
|
2939
|
+
ad_loaded: flags.adLoaded,
|
|
2940
|
+
ad_detect: flags.adDetect,
|
|
2941
|
+
license_key: licenseKey,
|
|
2942
|
+
capture_at: captureAt,
|
|
2943
|
+
timestamp: captureAt
|
|
2944
|
+
}
|
|
2895
2945
|
];
|
|
2896
2946
|
}
|
|
2897
2947
|
});
|
|
2898
|
-
})();
|
|
2948
|
+
}).apply(this, arguments);
|
|
2899
2949
|
}
|
|
2900
|
-
function
|
|
2901
|
-
return _async_to_generator(function() {
|
|
2902
|
-
var clientInfo, browserId,
|
|
2950
|
+
function sendInitialTracking(_0) {
|
|
2951
|
+
return _async_to_generator(function(licenseKey) {
|
|
2952
|
+
var context, clientInfo, browserId, trackingData, error;
|
|
2953
|
+
var _arguments = arguments;
|
|
2903
2954
|
return _ts_generator(this, function(_state) {
|
|
2904
2955
|
switch(_state.label){
|
|
2905
2956
|
case 0:
|
|
2957
|
+
context = _arguments.length > 1 && _arguments[1] !== void 0 ? _arguments[1] : {};
|
|
2958
|
+
_state.label = 1;
|
|
2959
|
+
case 1:
|
|
2906
2960
|
_state.trys.push([
|
|
2907
|
-
|
|
2961
|
+
1,
|
|
2908
2962
|
4,
|
|
2909
2963
|
,
|
|
2910
2964
|
5
|
|
@@ -2914,35 +2968,29 @@ function sendHeartbeat(licenseKey) {
|
|
|
2914
2968
|
4,
|
|
2915
2969
|
getBrowserID(clientInfo)
|
|
2916
2970
|
];
|
|
2917
|
-
case
|
|
2971
|
+
case 2:
|
|
2918
2972
|
browserId = _state.sent();
|
|
2919
|
-
|
|
2920
|
-
browserId: browserId
|
|
2921
|
-
|
|
2922
|
-
};
|
|
2923
|
-
headers = {
|
|
2924
|
-
"Content-Type": "application/json"
|
|
2925
|
-
};
|
|
2926
|
-
if (licenseKey) {
|
|
2927
|
-
headers["Authorization"] = "Bearer ".concat(licenseKey);
|
|
2928
|
-
}
|
|
2973
|
+
trackingData = _object_spread({
|
|
2974
|
+
browserId: browserId
|
|
2975
|
+
}, clientInfo);
|
|
2929
2976
|
return [
|
|
2930
2977
|
4,
|
|
2931
|
-
|
|
2932
|
-
|
|
2933
|
-
|
|
2934
|
-
|
|
2978
|
+
sendTrackRequest(licenseKey, {
|
|
2979
|
+
events: [
|
|
2980
|
+
{
|
|
2981
|
+
player_id: browserId,
|
|
2982
|
+
device_type: clientInfo.deviceType,
|
|
2983
|
+
input_stream_type: context.inputStreamType,
|
|
2984
|
+
os: clientInfo.os,
|
|
2985
|
+
ad_loaded: false,
|
|
2986
|
+
ad_detect: false,
|
|
2987
|
+
license_key: licenseKey,
|
|
2988
|
+
capture_at: /* @__PURE__ */ new Date().toISOString()
|
|
2989
|
+
}
|
|
2990
|
+
],
|
|
2991
|
+
trackingData: trackingData
|
|
2935
2992
|
})
|
|
2936
2993
|
];
|
|
2937
|
-
case 2:
|
|
2938
|
-
response = _state.sent();
|
|
2939
|
-
if (!response.ok) {
|
|
2940
|
-
throw new Error("HTTP error! status: ".concat(response.status));
|
|
2941
|
-
}
|
|
2942
|
-
return [
|
|
2943
|
-
4,
|
|
2944
|
-
response.json()
|
|
2945
|
-
];
|
|
2946
2994
|
case 3:
|
|
2947
2995
|
_state.sent();
|
|
2948
2996
|
return [
|
|
@@ -2951,7 +2999,7 @@ function sendHeartbeat(licenseKey) {
|
|
|
2951
2999
|
];
|
|
2952
3000
|
case 4:
|
|
2953
3001
|
error = _state.sent();
|
|
2954
|
-
console.error("[StormcloudVideoPlayer] Error sending
|
|
3002
|
+
console.error("[StormcloudVideoPlayer] Error sending initial tracking data:", error);
|
|
2955
3003
|
return [
|
|
2956
3004
|
3,
|
|
2957
3005
|
5
|
|
@@ -2962,95 +3010,74 @@ function sendHeartbeat(licenseKey) {
|
|
|
2962
3010
|
];
|
|
2963
3011
|
}
|
|
2964
3012
|
});
|
|
2965
|
-
})();
|
|
3013
|
+
}).apply(this, arguments);
|
|
2966
3014
|
}
|
|
2967
|
-
|
|
2968
|
-
|
|
2969
|
-
|
|
2970
|
-
|
|
2971
|
-
}
|
|
2972
|
-
if (source === "preload" || source === "ssp") {
|
|
2973
|
-
return source === "ssp" ? "prebid" : "ima";
|
|
2974
|
-
}
|
|
2975
|
-
return adPlayerType === "hls" ? "hls" : "ima";
|
|
2976
|
-
}
|
|
2977
|
-
function postAdTracking(licenseKey, body) {
|
|
2978
|
-
return _async_to_generator(function() {
|
|
2979
|
-
var headers, response;
|
|
3015
|
+
function sendAdDetectTracking(_0, _1) {
|
|
3016
|
+
return _async_to_generator(function(licenseKey, adDetectInfo) {
|
|
3017
|
+
var context, error;
|
|
3018
|
+
var _arguments = arguments;
|
|
2980
3019
|
return _ts_generator(this, function(_state) {
|
|
2981
3020
|
switch(_state.label){
|
|
2982
3021
|
case 0:
|
|
2983
|
-
|
|
2984
|
-
|
|
2985
|
-
};
|
|
2986
|
-
if (licenseKey) {
|
|
2987
|
-
headers["Authorization"] = "Bearer ".concat(licenseKey);
|
|
2988
|
-
}
|
|
2989
|
-
return [
|
|
2990
|
-
4,
|
|
2991
|
-
fetch(TRACK_API_URL, {
|
|
2992
|
-
method: "POST",
|
|
2993
|
-
headers: headers,
|
|
2994
|
-
body: JSON.stringify(body)
|
|
2995
|
-
})
|
|
2996
|
-
];
|
|
3022
|
+
context = _arguments.length > 2 && _arguments[2] !== void 0 ? _arguments[2] : {};
|
|
3023
|
+
_state.label = 1;
|
|
2997
3024
|
case 1:
|
|
2998
|
-
|
|
2999
|
-
|
|
3000
|
-
|
|
3001
|
-
|
|
3025
|
+
_state.trys.push([
|
|
3026
|
+
1,
|
|
3027
|
+
3,
|
|
3028
|
+
,
|
|
3029
|
+
4
|
|
3030
|
+
]);
|
|
3002
3031
|
return [
|
|
3003
3032
|
4,
|
|
3004
|
-
|
|
3033
|
+
sendHeartbeat(licenseKey, context, {
|
|
3034
|
+
adDetect: true,
|
|
3035
|
+
captureAt: adDetectInfo.timestamp
|
|
3036
|
+
})
|
|
3005
3037
|
];
|
|
3006
3038
|
case 2:
|
|
3007
3039
|
_state.sent();
|
|
3040
|
+
return [
|
|
3041
|
+
3,
|
|
3042
|
+
4
|
|
3043
|
+
];
|
|
3044
|
+
case 3:
|
|
3045
|
+
error = _state.sent();
|
|
3046
|
+
console.error("[StormcloudVideoPlayer] Error sending ad detect tracking:", error);
|
|
3047
|
+
return [
|
|
3048
|
+
3,
|
|
3049
|
+
4
|
|
3050
|
+
];
|
|
3051
|
+
case 4:
|
|
3008
3052
|
return [
|
|
3009
3053
|
2
|
|
3010
3054
|
];
|
|
3011
3055
|
}
|
|
3012
3056
|
});
|
|
3013
|
-
})();
|
|
3057
|
+
}).apply(this, arguments);
|
|
3014
3058
|
}
|
|
3015
|
-
function
|
|
3016
|
-
return _async_to_generator(function() {
|
|
3017
|
-
var
|
|
3059
|
+
function sendAdLoadedTracking(_0, _1) {
|
|
3060
|
+
return _async_to_generator(function(licenseKey, adLoadedInfo) {
|
|
3061
|
+
var context, error;
|
|
3062
|
+
var _arguments = arguments;
|
|
3018
3063
|
return _ts_generator(this, function(_state) {
|
|
3019
3064
|
switch(_state.label){
|
|
3020
3065
|
case 0:
|
|
3066
|
+
context = _arguments.length > 2 && _arguments[2] !== void 0 ? _arguments[2] : {};
|
|
3067
|
+
_state.label = 1;
|
|
3068
|
+
case 1:
|
|
3021
3069
|
_state.trys.push([
|
|
3022
|
-
|
|
3070
|
+
1,
|
|
3023
3071
|
3,
|
|
3024
3072
|
,
|
|
3025
3073
|
4
|
|
3026
3074
|
]);
|
|
3027
|
-
clientInfo = getClientInfo();
|
|
3028
3075
|
return [
|
|
3029
3076
|
4,
|
|
3030
|
-
|
|
3031
|
-
|
|
3032
|
-
|
|
3033
|
-
|
|
3034
|
-
adDetectInfo = _object_spread({
|
|
3035
|
-
source: (_payload_source = payload.source) !== null && _payload_source !== void 0 ? _payload_source : "scte35",
|
|
3036
|
-
timestamp: (_payload_timestamp = payload.timestamp) !== null && _payload_timestamp !== void 0 ? _payload_timestamp : /* @__PURE__ */ new Date().toISOString()
|
|
3037
|
-
}, payload.durationSeconds != null && {
|
|
3038
|
-
durationSeconds: payload.durationSeconds
|
|
3039
|
-
}, payload.ptsSeconds != null && {
|
|
3040
|
-
ptsSeconds: payload.ptsSeconds
|
|
3041
|
-
}, payload.detectedAtFragmentSn != null && {
|
|
3042
|
-
detectedAtFragmentSn: payload.detectedAtFragmentSn
|
|
3043
|
-
});
|
|
3044
|
-
body = _object_spread_props(_object_spread({
|
|
3045
|
-
browserId: browserId
|
|
3046
|
-
}, clientInfo, licenseKey && {
|
|
3047
|
-
licenseKey: licenseKey
|
|
3048
|
-
}), {
|
|
3049
|
-
adDetectInfo: adDetectInfo
|
|
3050
|
-
});
|
|
3051
|
-
return [
|
|
3052
|
-
4,
|
|
3053
|
-
postAdTracking(licenseKey, body)
|
|
3077
|
+
sendHeartbeat(licenseKey, context, {
|
|
3078
|
+
adLoaded: true,
|
|
3079
|
+
captureAt: adLoadedInfo.timestamp
|
|
3080
|
+
})
|
|
3054
3081
|
];
|
|
3055
3082
|
case 2:
|
|
3056
3083
|
_state.sent();
|
|
@@ -3060,7 +3087,7 @@ function sendAdDetectTracking(licenseKey, payload) {
|
|
|
3060
3087
|
];
|
|
3061
3088
|
case 3:
|
|
3062
3089
|
error = _state.sent();
|
|
3063
|
-
console.error("[StormcloudVideoPlayer] Error sending ad
|
|
3090
|
+
console.error("[StormcloudVideoPlayer] Error sending ad loaded tracking:", error);
|
|
3064
3091
|
return [
|
|
3065
3092
|
3,
|
|
3066
3093
|
4
|
|
@@ -3071,126 +3098,116 @@ function sendAdDetectTracking(licenseKey, payload) {
|
|
|
3071
3098
|
];
|
|
3072
3099
|
}
|
|
3073
3100
|
});
|
|
3074
|
-
})();
|
|
3101
|
+
}).apply(this, arguments);
|
|
3075
3102
|
}
|
|
3076
|
-
function
|
|
3077
|
-
return _async_to_generator(function() {
|
|
3078
|
-
var
|
|
3103
|
+
function sendAdImpressionTracking(_0, _1) {
|
|
3104
|
+
return _async_to_generator(function(licenseKey, adImpressionInfo) {
|
|
3105
|
+
var context, metricEvent, error;
|
|
3106
|
+
var _arguments = arguments;
|
|
3079
3107
|
return _ts_generator(this, function(_state) {
|
|
3080
3108
|
switch(_state.label){
|
|
3081
3109
|
case 0:
|
|
3110
|
+
context = _arguments.length > 2 && _arguments[2] !== void 0 ? _arguments[2] : {};
|
|
3111
|
+
_state.label = 1;
|
|
3112
|
+
case 1:
|
|
3082
3113
|
_state.trys.push([
|
|
3083
|
-
|
|
3084
|
-
|
|
3114
|
+
1,
|
|
3115
|
+
4,
|
|
3085
3116
|
,
|
|
3086
|
-
|
|
3117
|
+
5
|
|
3087
3118
|
]);
|
|
3088
|
-
clientInfo = getClientInfo();
|
|
3089
3119
|
return [
|
|
3090
3120
|
4,
|
|
3091
|
-
|
|
3121
|
+
buildPlayerMetricEvent(licenseKey, context, {
|
|
3122
|
+
captureAt: adImpressionInfo.timestamp
|
|
3123
|
+
})
|
|
3092
3124
|
];
|
|
3093
|
-
case
|
|
3094
|
-
|
|
3095
|
-
source = mapToAdTrackingSource(payload.source, adPlayerType);
|
|
3096
|
-
adLoadedInfo = _object_spread({
|
|
3097
|
-
source: source,
|
|
3098
|
-
timestamp: /* @__PURE__ */ new Date().toISOString()
|
|
3099
|
-
}, payload.vastUrl != null && {
|
|
3100
|
-
vastUrl: payload.vastUrl
|
|
3101
|
-
}, payload.durationSeconds != null && {
|
|
3102
|
-
durationSeconds: payload.durationSeconds
|
|
3103
|
-
});
|
|
3104
|
-
body = _object_spread_props(_object_spread({
|
|
3105
|
-
browserId: browserId
|
|
3106
|
-
}, clientInfo, licenseKey && {
|
|
3107
|
-
licenseKey: licenseKey
|
|
3108
|
-
}), {
|
|
3109
|
-
adLoadedInfo: adLoadedInfo
|
|
3110
|
-
});
|
|
3125
|
+
case 2:
|
|
3126
|
+
metricEvent = _state.sent();
|
|
3111
3127
|
return [
|
|
3112
3128
|
4,
|
|
3113
|
-
|
|
3129
|
+
Promise.all([
|
|
3130
|
+
postJson(HEARTBEAT_URL, licenseKey, metricEvent),
|
|
3131
|
+
postJson(IMPRESSIONS_URL, licenseKey, {
|
|
3132
|
+
events: [
|
|
3133
|
+
{
|
|
3134
|
+
player_id: metricEvent.player_id,
|
|
3135
|
+
ad_played_count: 1,
|
|
3136
|
+
ad_url: adImpressionInfo.adUrl,
|
|
3137
|
+
license_key: licenseKey,
|
|
3138
|
+
capture_at: adImpressionInfo.timestamp
|
|
3139
|
+
}
|
|
3140
|
+
]
|
|
3141
|
+
})
|
|
3142
|
+
])
|
|
3114
3143
|
];
|
|
3115
|
-
case
|
|
3144
|
+
case 3:
|
|
3116
3145
|
_state.sent();
|
|
3117
3146
|
return [
|
|
3118
3147
|
3,
|
|
3119
|
-
|
|
3148
|
+
5
|
|
3120
3149
|
];
|
|
3121
|
-
case
|
|
3150
|
+
case 4:
|
|
3122
3151
|
error = _state.sent();
|
|
3123
|
-
console.error("[StormcloudVideoPlayer] Error sending ad
|
|
3152
|
+
console.error("[StormcloudVideoPlayer] Error sending ad impression tracking:", error);
|
|
3124
3153
|
return [
|
|
3125
3154
|
3,
|
|
3126
|
-
|
|
3155
|
+
5
|
|
3127
3156
|
];
|
|
3128
|
-
case
|
|
3157
|
+
case 5:
|
|
3129
3158
|
return [
|
|
3130
3159
|
2
|
|
3131
3160
|
];
|
|
3132
3161
|
}
|
|
3133
3162
|
});
|
|
3134
|
-
})();
|
|
3163
|
+
}).apply(this, arguments);
|
|
3135
3164
|
}
|
|
3136
|
-
function
|
|
3137
|
-
return _async_to_generator(function() {
|
|
3138
|
-
var
|
|
3165
|
+
function sendHeartbeat(_0) {
|
|
3166
|
+
return _async_to_generator(function(licenseKey) {
|
|
3167
|
+
var context, flags, heartbeatData, error;
|
|
3168
|
+
var _arguments = arguments;
|
|
3139
3169
|
return _ts_generator(this, function(_state) {
|
|
3140
3170
|
switch(_state.label){
|
|
3141
3171
|
case 0:
|
|
3172
|
+
context = _arguments.length > 1 && _arguments[1] !== void 0 ? _arguments[1] : {}, flags = _arguments.length > 2 && _arguments[2] !== void 0 ? _arguments[2] : {};
|
|
3173
|
+
_state.label = 1;
|
|
3174
|
+
case 1:
|
|
3142
3175
|
_state.trys.push([
|
|
3143
|
-
|
|
3144
|
-
|
|
3176
|
+
1,
|
|
3177
|
+
4,
|
|
3145
3178
|
,
|
|
3146
|
-
|
|
3179
|
+
5
|
|
3147
3180
|
]);
|
|
3148
|
-
clientInfo = getClientInfo();
|
|
3149
3181
|
return [
|
|
3150
3182
|
4,
|
|
3151
|
-
|
|
3183
|
+
buildPlayerMetricEvent(licenseKey, context, flags)
|
|
3152
3184
|
];
|
|
3153
|
-
case
|
|
3154
|
-
|
|
3155
|
-
source = mapToAdTrackingSource(payload.source, adPlayerType);
|
|
3156
|
-
adImpressionInfo = _object_spread({
|
|
3157
|
-
source: source,
|
|
3158
|
-
adIndex: payload.adIndex,
|
|
3159
|
-
timestamp: /* @__PURE__ */ new Date().toISOString()
|
|
3160
|
-
}, payload.durationSeconds != null && {
|
|
3161
|
-
durationSeconds: payload.durationSeconds
|
|
3162
|
-
});
|
|
3163
|
-
body = _object_spread_props(_object_spread({
|
|
3164
|
-
browserId: browserId
|
|
3165
|
-
}, clientInfo, licenseKey && {
|
|
3166
|
-
licenseKey: licenseKey
|
|
3167
|
-
}), {
|
|
3168
|
-
adImpressionInfo: adImpressionInfo
|
|
3169
|
-
});
|
|
3185
|
+
case 2:
|
|
3186
|
+
heartbeatData = _state.sent();
|
|
3170
3187
|
return [
|
|
3171
3188
|
4,
|
|
3172
|
-
|
|
3189
|
+
postJson(HEARTBEAT_URL, licenseKey, heartbeatData)
|
|
3173
3190
|
];
|
|
3174
|
-
case
|
|
3191
|
+
case 3:
|
|
3175
3192
|
_state.sent();
|
|
3176
3193
|
return [
|
|
3177
3194
|
3,
|
|
3178
|
-
|
|
3195
|
+
5
|
|
3179
3196
|
];
|
|
3180
|
-
case
|
|
3197
|
+
case 4:
|
|
3181
3198
|
error = _state.sent();
|
|
3182
|
-
console.error("[StormcloudVideoPlayer] Error sending
|
|
3199
|
+
console.error("[StormcloudVideoPlayer] Error sending heartbeat:", error);
|
|
3183
3200
|
return [
|
|
3184
3201
|
3,
|
|
3185
|
-
|
|
3202
|
+
5
|
|
3186
3203
|
];
|
|
3187
|
-
case
|
|
3204
|
+
case 5:
|
|
3188
3205
|
return [
|
|
3189
3206
|
2
|
|
3190
3207
|
];
|
|
3191
3208
|
}
|
|
3192
3209
|
});
|
|
3193
|
-
})();
|
|
3210
|
+
}).apply(this, arguments);
|
|
3194
3211
|
}
|
|
3195
3212
|
// src/utils/polyfills.ts
|
|
3196
3213
|
function polyfillURLSearchParams() {
|
|
@@ -3546,7 +3563,7 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
3546
3563
|
key: "load",
|
|
3547
3564
|
value: function load() {
|
|
3548
3565
|
return _async_to_generator(function() {
|
|
3549
|
-
var _this, error, _this_config_lowLatencyMode, _this_video_play;
|
|
3566
|
+
var _this, error, _this_config_isLiveStream, _this_config_lowLatencyMode, _this_video_play;
|
|
3550
3567
|
return _ts_generator(this, function(_state) {
|
|
3551
3568
|
switch(_state.label){
|
|
3552
3569
|
case 0:
|
|
@@ -3590,7 +3607,7 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
3590
3607
|
this.nativeHlsMode = true;
|
|
3591
3608
|
this.videoSrcProtection = this.config.src;
|
|
3592
3609
|
this.video.src = this.config.src;
|
|
3593
|
-
this.isLiveStream = (_this_config_lowLatencyMode = this.config.lowLatencyMode) !== null && _this_config_lowLatencyMode !== void 0 ? _this_config_lowLatencyMode : false;
|
|
3610
|
+
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;
|
|
3594
3611
|
if (this.config.debugAdTiming) {
|
|
3595
3612
|
console.log("[StormcloudVideoPlayer] Using native HLS playback - VOD mode:", {
|
|
3596
3613
|
isLive: this.isLiveStream,
|
|
@@ -3641,19 +3658,28 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
3641
3658
|
});
|
|
3642
3659
|
this.hls.on(import_hls2.default.Events.MANIFEST_PARSED, function(_, data) {
|
|
3643
3660
|
return _async_to_generator(function() {
|
|
3644
|
-
var
|
|
3661
|
+
var _this_config_isLiveStream, _ref, _this_config_minSegmentsBeforePlay, _this_hls_levels, _this_hls, prerollKey, adBehavior, minSegments, _this_video_play;
|
|
3645
3662
|
return _ts_generator(this, function(_state) {
|
|
3646
3663
|
switch(_state.label){
|
|
3647
3664
|
case 0:
|
|
3648
|
-
|
|
3649
|
-
|
|
3650
|
-
|
|
3651
|
-
|
|
3652
|
-
|
|
3653
|
-
|
|
3654
|
-
|
|
3655
|
-
|
|
3656
|
-
|
|
3665
|
+
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) {
|
|
3666
|
+
var _level_details, _level_details1;
|
|
3667
|
+
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";
|
|
3668
|
+
})) !== null && _ref !== void 0 ? _ref : false;
|
|
3669
|
+
if (!this.isLiveStream && this.vmapBreaks.length === 0 && this.apiVastTagUrl) {
|
|
3670
|
+
prerollKey = "synthetic-vod-preroll";
|
|
3671
|
+
if (!this.consumedVmapBreakIds.has(prerollKey)) {
|
|
3672
|
+
this.vmapBreaks = [
|
|
3673
|
+
{
|
|
3674
|
+
id: prerollKey,
|
|
3675
|
+
startTimeMs: 0,
|
|
3676
|
+
vastTagUrl: this.apiVastTagUrl
|
|
3677
|
+
}
|
|
3678
|
+
];
|
|
3679
|
+
if (this.config.debugAdTiming) {
|
|
3680
|
+
console.log("[StormcloudVideoPlayer] Injected synthetic VOD preroll from apiVastTagUrl");
|
|
3681
|
+
}
|
|
3682
|
+
}
|
|
3657
3683
|
}
|
|
3658
3684
|
if (this.config.debugAdTiming) {
|
|
3659
3685
|
adBehavior = this.shouldContinueLiveStreamDuringAds() ? "live (main video continues muted during ads)" : "vod (main video pauses during ads)";
|
|
@@ -3983,8 +4009,10 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
3983
4009
|
var _this = this;
|
|
3984
4010
|
this.ima.on("all_ads_completed", function() {
|
|
3985
4011
|
sendAdImpressionTracking(_this.config.licenseKey, {
|
|
3986
|
-
|
|
3987
|
-
|
|
4012
|
+
source: "ima",
|
|
4013
|
+
adIndex: _this.currentAdIndex,
|
|
4014
|
+
timestamp: /* @__PURE__ */ new Date().toISOString()
|
|
4015
|
+
}).catch(function() {});
|
|
3988
4016
|
var remaining = _this.getRemainingAdMs();
|
|
3989
4017
|
_this.consecutiveFailures = 0;
|
|
3990
4018
|
if (_this.config.debugAdTiming) {
|
|
@@ -4045,8 +4073,10 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
4045
4073
|
});
|
|
4046
4074
|
this.ima.on("content_resume", function() {
|
|
4047
4075
|
sendAdImpressionTracking(_this.config.licenseKey, {
|
|
4048
|
-
|
|
4049
|
-
|
|
4076
|
+
source: "ima",
|
|
4077
|
+
adIndex: _this.currentAdIndex,
|
|
4078
|
+
timestamp: /* @__PURE__ */ new Date().toISOString()
|
|
4079
|
+
}).catch(function() {});
|
|
4050
4080
|
if (!_this.video.muted) {
|
|
4051
4081
|
_this.video.muted = true;
|
|
4052
4082
|
_this.video.volume = 0;
|
|
@@ -4680,7 +4710,10 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
4680
4710
|
var detectPayload = {};
|
|
4681
4711
|
if (marker.durationSeconds != null) detectPayload.durationSeconds = marker.durationSeconds;
|
|
4682
4712
|
if (marker.ptsSeconds != null) detectPayload.ptsSeconds = marker.ptsSeconds;
|
|
4683
|
-
sendAdDetectTracking(this.config.licenseKey,
|
|
4713
|
+
sendAdDetectTracking(this.config.licenseKey, _object_spread({
|
|
4714
|
+
source: "scte35",
|
|
4715
|
+
timestamp: /* @__PURE__ */ new Date().toISOString()
|
|
4716
|
+
}, detectPayload)).catch(function() {});
|
|
4684
4717
|
}
|
|
4685
4718
|
var hasPrefetchedAds = this.pendingAdBreak && this.pendingAdBreak.vastUrls.length > 0;
|
|
4686
4719
|
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;
|
|
@@ -5922,7 +5955,10 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
5922
5955
|
if (marker.durationSeconds != null) detectPayload.durationSeconds = marker.durationSeconds;
|
|
5923
5956
|
if (marker.ptsSeconds != null) detectPayload.ptsSeconds = marker.ptsSeconds;
|
|
5924
5957
|
if (fragmentSn !== void 0) detectPayload.detectedAtFragmentSn = fragmentSn;
|
|
5925
|
-
sendAdDetectTracking(this.config.licenseKey,
|
|
5958
|
+
sendAdDetectTracking(this.config.licenseKey, _object_spread({
|
|
5959
|
+
source: "scte35",
|
|
5960
|
+
timestamp: /* @__PURE__ */ new Date().toISOString()
|
|
5961
|
+
}, detectPayload)).catch(function() {});
|
|
5926
5962
|
if (this.config.debugAdTiming) {
|
|
5927
5963
|
console.log("[PREFETCH] \uD83D\uDD04 Starting ad prefetch for upcoming ad break");
|
|
5928
5964
|
console.log("[PREFETCH] \uD83D\uDCCB Pre-generated ".concat(generatedUrls.length, " VAST URLs"));
|
|
@@ -6403,9 +6439,10 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
6403
6439
|
preloadedController = preloaded.imaController;
|
|
6404
6440
|
usePreloadedAd = true;
|
|
6405
6441
|
sendAdLoadedTracking(this.config.licenseKey, {
|
|
6406
|
-
source: "
|
|
6407
|
-
vastUrl: firstAdUrl
|
|
6408
|
-
|
|
6442
|
+
source: "ima",
|
|
6443
|
+
vastUrl: firstAdUrl,
|
|
6444
|
+
timestamp: /* @__PURE__ */ new Date().toISOString()
|
|
6445
|
+
}).catch(function() {});
|
|
6409
6446
|
if (this.config.debugAdTiming) {
|
|
6410
6447
|
console.log("[CONTINUOUS-FETCH] \uD83D\uDE80 Using preloaded ad from pool (preloaded in advance, ready immediately!)");
|
|
6411
6448
|
console.log("[CONTINUOUS-FETCH] Pool still has ".concat(this.preloadPool.length, " preloaded ads ready"));
|
|
@@ -6495,9 +6532,10 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
6495
6532
|
case 5:
|
|
6496
6533
|
_state.sent();
|
|
6497
6534
|
sendAdLoadedTracking(this.config.licenseKey, {
|
|
6498
|
-
source: "
|
|
6499
|
-
vastUrl: firstAdUrl
|
|
6500
|
-
|
|
6535
|
+
source: "ima",
|
|
6536
|
+
vastUrl: firstAdUrl,
|
|
6537
|
+
timestamp: /* @__PURE__ */ new Date().toISOString()
|
|
6538
|
+
}).catch(function() {});
|
|
6501
6539
|
if (this.config.debugAdTiming) {
|
|
6502
6540
|
console.log("[CONTINUOUS-FETCH] \u2705 First ad request successful, starting playback");
|
|
6503
6541
|
}
|
|
@@ -6893,9 +6931,10 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
6893
6931
|
console.log("[CONTINUOUS-FETCH] \uD83C\uDFAF Using preloaded ad from pool (".concat(this.preloadPool.length, " remaining in pool)"));
|
|
6894
6932
|
}
|
|
6895
6933
|
sendAdLoadedTracking(this.config.licenseKey, {
|
|
6896
|
-
source: "
|
|
6897
|
-
vastUrl: preloaded.vastUrl
|
|
6898
|
-
|
|
6934
|
+
source: "ima",
|
|
6935
|
+
vastUrl: preloaded.vastUrl,
|
|
6936
|
+
timestamp: /* @__PURE__ */ new Date().toISOString()
|
|
6937
|
+
}).catch(function() {});
|
|
6899
6938
|
_state.label = 1;
|
|
6900
6939
|
case 1:
|
|
6901
6940
|
_state.trys.push([
|
|
@@ -7647,9 +7686,10 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
7647
7686
|
case 3:
|
|
7648
7687
|
_state.sent();
|
|
7649
7688
|
sendAdLoadedTracking(this.config.licenseKey, {
|
|
7650
|
-
source: "
|
|
7651
|
-
vastUrl: vastTagUrl
|
|
7652
|
-
|
|
7689
|
+
source: "ima",
|
|
7690
|
+
vastUrl: vastTagUrl,
|
|
7691
|
+
timestamp: /* @__PURE__ */ new Date().toISOString()
|
|
7692
|
+
}).catch(function() {});
|
|
7653
7693
|
this.clearAdRequestWatchdog();
|
|
7654
7694
|
if (this.activeAdRequestToken !== requestToken) {
|
|
7655
7695
|
return [
|
|
@@ -8077,7 +8117,8 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
8077
8117
|
continue;
|
|
8078
8118
|
}
|
|
8079
8119
|
var end = breakStartMs + (b.durationMs || 0);
|
|
8080
|
-
|
|
8120
|
+
var effectiveTol = breakStartMs === 0 ? Math.max(tol, 3e4) : tol;
|
|
8121
|
+
if (nowMs >= breakStartMs && (b.durationMs ? nowMs < end : nowMs <= breakStartMs + effectiveTol)) {
|
|
8081
8122
|
return b;
|
|
8082
8123
|
}
|
|
8083
8124
|
}
|
|
@@ -8308,6 +8349,7 @@ var import_jsx_runtime = require("react/jsx-runtime");
|
|
|
8308
8349
|
var CRITICAL_PROPS = [
|
|
8309
8350
|
"src",
|
|
8310
8351
|
"allowNativeHls",
|
|
8352
|
+
"isLiveStream",
|
|
8311
8353
|
"licenseKey",
|
|
8312
8354
|
"vmapUrl",
|
|
8313
8355
|
"lowLatencyMode",
|
|
@@ -8317,12 +8359,13 @@ var CRITICAL_PROPS = [
|
|
|
8317
8359
|
var CONTROLS_HIDE_DELAY = 3e3;
|
|
8318
8360
|
var DEFAULT_PLAYER_ASPECT_RATIO = 16 / 9;
|
|
8319
8361
|
var StormcloudVideoPlayerComponent = import_react.default.memo(function(props) {
|
|
8320
|
-
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, [
|
|
8362
|
+
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, [
|
|
8321
8363
|
"src",
|
|
8322
8364
|
"autoplay",
|
|
8323
8365
|
"muted",
|
|
8324
8366
|
"lowLatencyMode",
|
|
8325
8367
|
"allowNativeHls",
|
|
8368
|
+
"isLiveStream",
|
|
8326
8369
|
"driftToleranceMs",
|
|
8327
8370
|
"immediateManifestAds",
|
|
8328
8371
|
"debugAdTiming",
|
|
@@ -8477,7 +8520,7 @@ var StormcloudVideoPlayerComponent = import_react.default.memo(function(props) {
|
|
|
8477
8520
|
setShowSpeedMenu(false);
|
|
8478
8521
|
};
|
|
8479
8522
|
var isHlsStream = (src === null || src === void 0 ? void 0 : src.toLowerCase().includes(".m3u8")) || (src === null || src === void 0 ? void 0 : src.toLowerCase().includes("/hls/"));
|
|
8480
|
-
var shouldShowEnhancedControls = showCustomControls && (isHlsStream ? allowNativeHls : true);
|
|
8523
|
+
var shouldShowEnhancedControls = showCustomControls && (isHlsStream ? allowNativeHls || isLiveStream === false : true);
|
|
8481
8524
|
var criticalPropsKey = (0, import_react.useMemo)(function() {
|
|
8482
8525
|
return CRITICAL_PROPS.map(function(prop) {
|
|
8483
8526
|
return "".concat(prop, ":").concat(props[prop]);
|
|
@@ -8485,6 +8528,7 @@ var StormcloudVideoPlayerComponent = import_react.default.memo(function(props) {
|
|
|
8485
8528
|
}, [
|
|
8486
8529
|
src,
|
|
8487
8530
|
allowNativeHls,
|
|
8531
|
+
isLiveStream,
|
|
8488
8532
|
licenseKey,
|
|
8489
8533
|
vmapUrl,
|
|
8490
8534
|
lowLatencyMode,
|
|
@@ -8519,6 +8563,7 @@ var StormcloudVideoPlayerComponent = import_react.default.memo(function(props) {
|
|
|
8519
8563
|
if (muted !== void 0) cfg.muted = muted;
|
|
8520
8564
|
if (lowLatencyMode !== void 0) cfg.lowLatencyMode = lowLatencyMode;
|
|
8521
8565
|
if (allowNativeHls !== void 0) cfg.allowNativeHls = allowNativeHls;
|
|
8566
|
+
if (isLiveStream !== void 0) cfg.isLiveStream = isLiveStream;
|
|
8522
8567
|
if (driftToleranceMs !== void 0) cfg.driftToleranceMs = driftToleranceMs;
|
|
8523
8568
|
if (immediateManifestAds !== void 0) cfg.immediateManifestAds = immediateManifestAds;
|
|
8524
8569
|
if (debugAdTiming !== void 0) cfg.debugAdTiming = debugAdTiming;
|
|
@@ -9358,161 +9403,202 @@ var StormcloudVideoPlayerComponent = import_react.default.memo(function(props) {
|
|
|
9358
9403
|
]
|
|
9359
9404
|
})
|
|
9360
9405
|
]
|
|
9361
|
-
}) : showCustomControls && !showLicenseWarning && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
9362
|
-
className: "sc-controls-bar",
|
|
9363
|
-
style: {
|
|
9364
|
-
position: "absolute",
|
|
9365
|
-
bottom: "".concat(10 * responsiveScale, "px"),
|
|
9366
|
-
right: "".concat(10 * responsiveScale, "px"),
|
|
9367
|
-
display: "flex",
|
|
9368
|
-
flexDirection: isPortrait ? "column" : "row",
|
|
9369
|
-
gap: "".concat(8 * responsiveScale, "px"),
|
|
9370
|
-
zIndex: 10,
|
|
9371
|
-
opacity: controlsVisible ? 1 : 0,
|
|
9372
|
-
transform: controlsVisible ? "translateY(0)" : "translateY(4px)",
|
|
9373
|
-
pointerEvents: controlsVisible ? "auto" : "none"
|
|
9374
|
-
},
|
|
9406
|
+
}) : showCustomControls && !showLicenseWarning && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
|
|
9375
9407
|
children: [
|
|
9376
9408
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
|
|
9377
9409
|
style: {
|
|
9410
|
+
position: "absolute",
|
|
9411
|
+
top: "".concat(10 * responsiveScale, "px"),
|
|
9412
|
+
left: "".concat(10 * responsiveScale, "px"),
|
|
9378
9413
|
display: "flex",
|
|
9379
9414
|
alignItems: "center",
|
|
9380
|
-
|
|
9381
|
-
|
|
9382
|
-
|
|
9383
|
-
|
|
9415
|
+
gap: "6px",
|
|
9416
|
+
zIndex: 10,
|
|
9417
|
+
opacity: controlsVisible ? 1 : 0,
|
|
9418
|
+
transition: "opacity 0.35s ease"
|
|
9384
9419
|
},
|
|
9385
|
-
|
|
9386
|
-
|
|
9387
|
-
|
|
9388
|
-
|
|
9389
|
-
|
|
9420
|
+
children: [
|
|
9421
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
|
9422
|
+
style: {
|
|
9423
|
+
width: "8px",
|
|
9424
|
+
height: "8px",
|
|
9425
|
+
borderRadius: "50%",
|
|
9426
|
+
background: "#ff3b30",
|
|
9427
|
+
animation: "sc-pulse 1.5s ease-in-out infinite",
|
|
9428
|
+
flexShrink: 0
|
|
9429
|
+
}
|
|
9430
|
+
}),
|
|
9431
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
|
|
9432
|
+
style: {
|
|
9433
|
+
fontSize: "".concat(12 * responsiveScale, "px"),
|
|
9434
|
+
fontFamily: "'SF Pro Display', 'Segoe UI', Arial, sans-serif",
|
|
9435
|
+
fontWeight: 700,
|
|
9436
|
+
letterSpacing: "0.08em",
|
|
9437
|
+
color: "#fff",
|
|
9438
|
+
textShadow: "0 1px 3px rgba(0,0,0,0.6)",
|
|
9439
|
+
userSelect: "none"
|
|
9440
|
+
},
|
|
9441
|
+
children: "LIVE"
|
|
9442
|
+
})
|
|
9443
|
+
]
|
|
9444
|
+
}),
|
|
9445
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
|
|
9446
|
+
className: "sc-controls-bar",
|
|
9447
|
+
style: {
|
|
9448
|
+
position: "absolute",
|
|
9449
|
+
bottom: "".concat(10 * responsiveScale, "px"),
|
|
9450
|
+
right: "".concat(10 * responsiveScale, "px"),
|
|
9451
|
+
display: "flex",
|
|
9452
|
+
flexDirection: isPortrait ? "column" : "row",
|
|
9453
|
+
gap: "".concat(8 * responsiveScale, "px"),
|
|
9454
|
+
zIndex: 10,
|
|
9455
|
+
opacity: controlsVisible ? 1 : 0,
|
|
9456
|
+
transform: controlsVisible ? "translateY(0)" : "translateY(4px)",
|
|
9457
|
+
pointerEvents: controlsVisible ? "auto" : "none"
|
|
9390
9458
|
},
|
|
9391
9459
|
children: [
|
|
9460
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
|
|
9461
|
+
style: {
|
|
9462
|
+
display: "flex",
|
|
9463
|
+
alignItems: "center",
|
|
9464
|
+
background: "rgba(0, 0, 0, 0.6)",
|
|
9465
|
+
borderRadius: "".concat(18 * responsiveScale, "px"),
|
|
9466
|
+
padding: "2px",
|
|
9467
|
+
paddingRight: "".concat(8 * responsiveScale, "px")
|
|
9468
|
+
},
|
|
9469
|
+
onMouseEnter: function onMouseEnter() {
|
|
9470
|
+
return setShowVolumeSlider(true);
|
|
9471
|
+
},
|
|
9472
|
+
onMouseLeave: function onMouseLeave() {
|
|
9473
|
+
return setShowVolumeSlider(false);
|
|
9474
|
+
},
|
|
9475
|
+
children: [
|
|
9476
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", {
|
|
9477
|
+
className: "sc-ctrl-btn",
|
|
9478
|
+
onClick: function onClick() {
|
|
9479
|
+
if (playerRef.current) playerRef.current.toggleMute();
|
|
9480
|
+
onVolumeToggle === null || onVolumeToggle === void 0 ? void 0 : onVolumeToggle();
|
|
9481
|
+
resetControlsTimer();
|
|
9482
|
+
},
|
|
9483
|
+
style: {
|
|
9484
|
+
padding: "".concat(8 * responsiveScale, "px"),
|
|
9485
|
+
borderRadius: "50%",
|
|
9486
|
+
minWidth: "".concat(36 * responsiveScale, "px"),
|
|
9487
|
+
minHeight: "".concat(36 * responsiveScale, "px")
|
|
9488
|
+
},
|
|
9489
|
+
title: isMuted ? "Unmute" : "Mute",
|
|
9490
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(VolumeIcon, {
|
|
9491
|
+
size: Math.max(14, 18 * responsiveScale)
|
|
9492
|
+
})
|
|
9493
|
+
}),
|
|
9494
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
|
9495
|
+
style: {
|
|
9496
|
+
width: showVolumeSlider ? "".concat(68 * responsiveScale, "px") : "0px",
|
|
9497
|
+
overflow: "hidden",
|
|
9498
|
+
transition: "width 0.2s cubic-bezier(0.4, 0, 0.2, 1)",
|
|
9499
|
+
display: "flex",
|
|
9500
|
+
alignItems: "center",
|
|
9501
|
+
paddingLeft: showVolumeSlider ? "".concat(3 * responsiveScale, "px") : "0",
|
|
9502
|
+
paddingRight: showVolumeSlider ? "".concat(10 * responsiveScale, "px") : "0"
|
|
9503
|
+
},
|
|
9504
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
|
|
9505
|
+
style: {
|
|
9506
|
+
position: "relative",
|
|
9507
|
+
width: "".concat(56 * responsiveScale, "px"),
|
|
9508
|
+
height: "3px",
|
|
9509
|
+
cursor: "pointer",
|
|
9510
|
+
borderRadius: "1.5px"
|
|
9511
|
+
},
|
|
9512
|
+
onMouseDown: function onMouseDown(e) {
|
|
9513
|
+
e.preventDefault();
|
|
9514
|
+
var el = e.currentTarget;
|
|
9515
|
+
var move = function move(ev) {
|
|
9516
|
+
var r2 = el.getBoundingClientRect();
|
|
9517
|
+
handleVolumeChange(Math.max(0, Math.min(1, (ev.clientX - r2.left) / r2.width)));
|
|
9518
|
+
};
|
|
9519
|
+
var up = function up1() {
|
|
9520
|
+
document.removeEventListener("mousemove", move);
|
|
9521
|
+
document.removeEventListener("mouseup", up);
|
|
9522
|
+
};
|
|
9523
|
+
document.addEventListener("mousemove", move);
|
|
9524
|
+
document.addEventListener("mouseup", up);
|
|
9525
|
+
var r = el.getBoundingClientRect();
|
|
9526
|
+
handleVolumeChange(Math.max(0, Math.min(1, (e.clientX - r.left) / r.width)));
|
|
9527
|
+
},
|
|
9528
|
+
onClick: function onClick(e) {
|
|
9529
|
+
e.stopPropagation();
|
|
9530
|
+
var r = e.currentTarget.getBoundingClientRect();
|
|
9531
|
+
handleVolumeChange(Math.max(0, Math.min(1, (e.clientX - r.left) / r.width)));
|
|
9532
|
+
},
|
|
9533
|
+
children: [
|
|
9534
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
|
9535
|
+
style: {
|
|
9536
|
+
position: "absolute",
|
|
9537
|
+
inset: 0,
|
|
9538
|
+
background: "rgba(255, 255, 255, 0.2)",
|
|
9539
|
+
borderRadius: "1.5px"
|
|
9540
|
+
}
|
|
9541
|
+
}),
|
|
9542
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
|
9543
|
+
style: {
|
|
9544
|
+
position: "absolute",
|
|
9545
|
+
top: 0,
|
|
9546
|
+
left: 0,
|
|
9547
|
+
bottom: 0,
|
|
9548
|
+
width: "".concat((isMuted ? 0 : volume) * 100, "%"),
|
|
9549
|
+
background: "#fff",
|
|
9550
|
+
borderRadius: "1.5px",
|
|
9551
|
+
transition: "width 0.1s ease-out"
|
|
9552
|
+
}
|
|
9553
|
+
}),
|
|
9554
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
|
9555
|
+
style: {
|
|
9556
|
+
position: "absolute",
|
|
9557
|
+
top: "50%",
|
|
9558
|
+
left: "".concat((isMuted ? 0 : volume) * 100, "%"),
|
|
9559
|
+
transform: "translate(-50%, -50%)",
|
|
9560
|
+
width: "12px",
|
|
9561
|
+
height: "12px",
|
|
9562
|
+
background: "#fff",
|
|
9563
|
+
borderRadius: "50%",
|
|
9564
|
+
boxShadow: "0 0 3px rgba(0, 0, 0, 0.3)",
|
|
9565
|
+
transition: "left 0.1s ease-out"
|
|
9566
|
+
}
|
|
9567
|
+
})
|
|
9568
|
+
]
|
|
9569
|
+
})
|
|
9570
|
+
})
|
|
9571
|
+
]
|
|
9572
|
+
}),
|
|
9392
9573
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", {
|
|
9393
9574
|
className: "sc-ctrl-btn",
|
|
9394
9575
|
onClick: function onClick() {
|
|
9395
|
-
if (
|
|
9396
|
-
|
|
9576
|
+
if (onFullscreenToggle) {
|
|
9577
|
+
onFullscreenToggle();
|
|
9578
|
+
} else if (wrapperRef.current) {
|
|
9579
|
+
if (!document.fullscreenElement) {
|
|
9580
|
+
wrapperRef.current.requestFullscreen().catch(function() {});
|
|
9581
|
+
} else {
|
|
9582
|
+
document.exitFullscreen().catch(function() {});
|
|
9583
|
+
}
|
|
9584
|
+
}
|
|
9397
9585
|
resetControlsTimer();
|
|
9398
9586
|
},
|
|
9399
9587
|
style: {
|
|
9400
9588
|
padding: "".concat(8 * responsiveScale, "px"),
|
|
9401
9589
|
borderRadius: "50%",
|
|
9402
9590
|
minWidth: "".concat(36 * responsiveScale, "px"),
|
|
9403
|
-
minHeight: "".concat(36 * responsiveScale, "px")
|
|
9591
|
+
minHeight: "".concat(36 * responsiveScale, "px"),
|
|
9592
|
+
background: "rgba(0, 0, 0, 0.6)"
|
|
9404
9593
|
},
|
|
9405
|
-
title:
|
|
9406
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
9594
|
+
title: isFullscreen ? "Exit Fullscreen" : "Enter Fullscreen",
|
|
9595
|
+
children: isFullscreen ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_fa.FaCompress, {
|
|
9596
|
+
size: Math.max(14, 18 * responsiveScale)
|
|
9597
|
+
}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_fa.FaExpand, {
|
|
9407
9598
|
size: Math.max(14, 18 * responsiveScale)
|
|
9408
|
-
})
|
|
9409
|
-
}),
|
|
9410
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
|
9411
|
-
style: {
|
|
9412
|
-
width: showVolumeSlider ? "".concat(68 * responsiveScale, "px") : "0px",
|
|
9413
|
-
overflow: "hidden",
|
|
9414
|
-
transition: "width 0.2s cubic-bezier(0.4, 0, 0.2, 1)",
|
|
9415
|
-
display: "flex",
|
|
9416
|
-
alignItems: "center",
|
|
9417
|
-
paddingLeft: showVolumeSlider ? "".concat(3 * responsiveScale, "px") : "0",
|
|
9418
|
-
paddingRight: showVolumeSlider ? "".concat(10 * responsiveScale, "px") : "0"
|
|
9419
|
-
},
|
|
9420
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
|
|
9421
|
-
style: {
|
|
9422
|
-
position: "relative",
|
|
9423
|
-
width: "".concat(56 * responsiveScale, "px"),
|
|
9424
|
-
height: "3px",
|
|
9425
|
-
cursor: "pointer",
|
|
9426
|
-
borderRadius: "1.5px"
|
|
9427
|
-
},
|
|
9428
|
-
onMouseDown: function onMouseDown(e) {
|
|
9429
|
-
e.preventDefault();
|
|
9430
|
-
var el = e.currentTarget;
|
|
9431
|
-
var move = function move(ev) {
|
|
9432
|
-
var r2 = el.getBoundingClientRect();
|
|
9433
|
-
handleVolumeChange(Math.max(0, Math.min(1, (ev.clientX - r2.left) / r2.width)));
|
|
9434
|
-
};
|
|
9435
|
-
var up = function up1() {
|
|
9436
|
-
document.removeEventListener("mousemove", move);
|
|
9437
|
-
document.removeEventListener("mouseup", up);
|
|
9438
|
-
};
|
|
9439
|
-
document.addEventListener("mousemove", move);
|
|
9440
|
-
document.addEventListener("mouseup", up);
|
|
9441
|
-
var r = el.getBoundingClientRect();
|
|
9442
|
-
handleVolumeChange(Math.max(0, Math.min(1, (e.clientX - r.left) / r.width)));
|
|
9443
|
-
},
|
|
9444
|
-
onClick: function onClick(e) {
|
|
9445
|
-
e.stopPropagation();
|
|
9446
|
-
var r = e.currentTarget.getBoundingClientRect();
|
|
9447
|
-
handleVolumeChange(Math.max(0, Math.min(1, (e.clientX - r.left) / r.width)));
|
|
9448
|
-
},
|
|
9449
|
-
children: [
|
|
9450
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
|
9451
|
-
style: {
|
|
9452
|
-
position: "absolute",
|
|
9453
|
-
inset: 0,
|
|
9454
|
-
background: "rgba(255, 255, 255, 0.2)",
|
|
9455
|
-
borderRadius: "1.5px"
|
|
9456
|
-
}
|
|
9457
|
-
}),
|
|
9458
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
|
9459
|
-
style: {
|
|
9460
|
-
position: "absolute",
|
|
9461
|
-
top: 0,
|
|
9462
|
-
left: 0,
|
|
9463
|
-
bottom: 0,
|
|
9464
|
-
width: "".concat((isMuted ? 0 : volume) * 100, "%"),
|
|
9465
|
-
background: "#fff",
|
|
9466
|
-
borderRadius: "1.5px",
|
|
9467
|
-
transition: "width 0.1s ease-out"
|
|
9468
|
-
}
|
|
9469
|
-
}),
|
|
9470
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
|
9471
|
-
style: {
|
|
9472
|
-
position: "absolute",
|
|
9473
|
-
top: "50%",
|
|
9474
|
-
left: "".concat((isMuted ? 0 : volume) * 100, "%"),
|
|
9475
|
-
transform: "translate(-50%, -50%)",
|
|
9476
|
-
width: "12px",
|
|
9477
|
-
height: "12px",
|
|
9478
|
-
background: "#fff",
|
|
9479
|
-
borderRadius: "50%",
|
|
9480
|
-
boxShadow: "0 0 3px rgba(0, 0, 0, 0.3)",
|
|
9481
|
-
transition: "left 0.1s ease-out"
|
|
9482
|
-
}
|
|
9483
|
-
})
|
|
9484
|
-
]
|
|
9485
9599
|
})
|
|
9486
9600
|
})
|
|
9487
9601
|
]
|
|
9488
|
-
}),
|
|
9489
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", {
|
|
9490
|
-
className: "sc-ctrl-btn",
|
|
9491
|
-
onClick: function onClick() {
|
|
9492
|
-
if (onFullscreenToggle) {
|
|
9493
|
-
onFullscreenToggle();
|
|
9494
|
-
} else if (wrapperRef.current) {
|
|
9495
|
-
if (!document.fullscreenElement) {
|
|
9496
|
-
wrapperRef.current.requestFullscreen().catch(function() {});
|
|
9497
|
-
} else {
|
|
9498
|
-
document.exitFullscreen().catch(function() {});
|
|
9499
|
-
}
|
|
9500
|
-
}
|
|
9501
|
-
resetControlsTimer();
|
|
9502
|
-
},
|
|
9503
|
-
style: {
|
|
9504
|
-
padding: "".concat(8 * responsiveScale, "px"),
|
|
9505
|
-
borderRadius: "50%",
|
|
9506
|
-
minWidth: "".concat(36 * responsiveScale, "px"),
|
|
9507
|
-
minHeight: "".concat(36 * responsiveScale, "px"),
|
|
9508
|
-
background: "rgba(0, 0, 0, 0.6)"
|
|
9509
|
-
},
|
|
9510
|
-
title: isFullscreen ? "Exit Fullscreen" : "Enter Fullscreen",
|
|
9511
|
-
children: isFullscreen ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_fa.FaCompress, {
|
|
9512
|
-
size: Math.max(14, 18 * responsiveScale)
|
|
9513
|
-
}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_fa.FaExpand, {
|
|
9514
|
-
size: Math.max(14, 18 * responsiveScale)
|
|
9515
|
-
})
|
|
9516
9602
|
})
|
|
9517
9603
|
]
|
|
9518
9604
|
}),
|