332 lines
13 KiB
TypeScript
332 lines
13 KiB
TypeScript
// Metro module 14157 (f14158).
|
|
import * as Module19 from "react";
|
|
import { useMemo, useState, useRef, useEffect, useCallback } from "react";
|
|
import VideoQuestUIStore from "../../VideoQuestUIStore";
|
|
import { QuestsExperimentLocations } from "../../QuestConstants";
|
|
import { useVideoQuestModalContext } from "./VideoQuestModalContext";
|
|
import { useQuestTaskDetails } from "../../hooks/QuestHooks";
|
|
import { getQuestAsset, QuestAssetType } from "../../lib/AssetUtils";
|
|
import { shallow } from "../../../../_bundle/Module3802";
|
|
import * as _AdVideoPlayer from "../AdVideoPlayer";
|
|
import { AdVideoPlayer } from "../AdVideoPlayer";
|
|
import useVideoQuestPlayerAnalytics from "./hooks/useVideoQuestPlayerAnalytics";
|
|
import { getDefaultWatchVideoTask } from "../../utils/QuestTaskUtils";
|
|
import { getVideoQoEMetricsConfig, MobileMuxWrapper } from "../../../video-qoe/index";
|
|
import { getConstants } from "../../../../utils/native/ClientInfoUtils";
|
|
import { sendVideoProgress } from "../../utils/VideoQuestUtils";
|
|
import { updateOptimisticProgress } from "../../QuestActionCreators";
|
|
import { VideoQuestCaptions } from "./captions/VideoQuestCaptions";
|
|
const r27 = Module19.memo(function(a0) {
|
|
let memo2, state, setState, targetSeconds, c20962_13, ref, setState2, ref2, handleBufferAnalytics, handleEndAnalytics, handleErrorAnalytics, handleLoadAnalytics, handleLoadStartAnalytics, handlePausePlaybackAnalytics, handleProgressAnalytics, handleReadyForDisplayAnalytics, handleResumePlaybackAnalytics, handleSeekAnalytics, ref3, id, gameTitle, url, videoTitle, videoStreamType, ref4, ref5;
|
|
const { style, onLoad, onEnd, onToggleFullscreen, orientation, contentInsets, handleToggleCaptions, handleOpenTranscript, isFullscreen, externallyPaused, captionsEnabled = false } = a0;
|
|
const visible = captionsEnabled;
|
|
const { sourceQuestContent, hasCaptionAsset = true, hasTranscriptAsset = true } = a0;
|
|
memo2 = void 0;
|
|
state = void 0;
|
|
setState = void 0;
|
|
targetSeconds = void 0;
|
|
c20962_13 = void 0;
|
|
ref = void 0;
|
|
setState2 = void 0;
|
|
ref2 = void 0;
|
|
handleBufferAnalytics = void 0;
|
|
handleEndAnalytics = void 0;
|
|
handleErrorAnalytics = void 0;
|
|
handleLoadAnalytics = void 0;
|
|
handleLoadStartAnalytics = void 0;
|
|
handlePausePlaybackAnalytics = void 0;
|
|
handleProgressAnalytics = void 0;
|
|
handleReadyForDisplayAnalytics = void 0;
|
|
handleResumePlaybackAnalytics = void 0;
|
|
handleSeekAnalytics = void 0;
|
|
ref3 = void 0;
|
|
id = void 0;
|
|
gameTitle = void 0;
|
|
url = void 0;
|
|
videoTitle = void 0;
|
|
videoStreamType = void 0;
|
|
ref4 = void 0;
|
|
ref5 = void 0;
|
|
const videoQuestModalContext = useVideoQuestModalContext();
|
|
const { quest, videoSessionId } = videoQuestModalContext;
|
|
const questTaskDetails = useQuestTaskDetails(quest);
|
|
const isQuestCompleted = quest.userStatus?.completedAt != null;
|
|
const memo = useMemo(() => getQuestAsset(quest, QuestAssetType.VIDEO_PLAYER_VIDEO, void 0, true), [quest]);
|
|
memo2 = useMemo(() => getQuestAsset(quest, QuestAssetType.VIDEO_PLAYER_VIDEO_HLS, void 0, true), [quest]);
|
|
const videoAssetId = memo2?.url != null ? QuestAssetType.VIDEO_PLAYER_VIDEO_HLS : QuestAssetType.VIDEO_PLAYER_VIDEO;
|
|
[state, setState] = useState(questTaskDetails.targetSeconds);
|
|
targetSeconds = questTaskDetails.targetSeconds;
|
|
const r17 = VideoQuestUIStore((a0) => a0.setVideoProgress);
|
|
c20962_13 = r17;
|
|
const initialProgress = VideoQuestUIStore((a0) => {
|
|
let r8 = a0.videoProgress[quest.id];
|
|
if (r8 == null) {
|
|
r8 = {
|
|
timestampSec: questTaskDetails.progressSeconds,
|
|
duration: state,
|
|
maxTimestampSec: questTaskDetails.progressSeconds
|
|
};
|
|
}
|
|
return r8;
|
|
}, shallow);
|
|
ref = useRef(null);
|
|
let playerState;
|
|
[playerState, setState2] = useState(_AdVideoPlayer.PlayerState.LOADING);
|
|
ref2 = useRef(questTaskDetails.progressSeconds);
|
|
const videoQuestPlayerAnalytics = useVideoQuestPlayerAnalytics({
|
|
duration: state,
|
|
isQuestCompleted,
|
|
playerState,
|
|
questId: quest.id,
|
|
videoSessionId,
|
|
videoAssetId,
|
|
sourceQuestContent
|
|
});
|
|
handleBufferAnalytics = videoQuestPlayerAnalytics.handleBufferAnalytics;
|
|
handleEndAnalytics = videoQuestPlayerAnalytics.handleEndAnalytics;
|
|
handleErrorAnalytics = videoQuestPlayerAnalytics.handleErrorAnalytics;
|
|
handleLoadAnalytics = videoQuestPlayerAnalytics.handleLoadAnalytics;
|
|
handleLoadStartAnalytics = videoQuestPlayerAnalytics.handleLoadStartAnalytics;
|
|
handlePausePlaybackAnalytics = videoQuestPlayerAnalytics.handlePausePlaybackAnalytics;
|
|
handleProgressAnalytics = videoQuestPlayerAnalytics.handleProgressAnalytics;
|
|
handleReadyForDisplayAnalytics = videoQuestPlayerAnalytics.handleReadyForDisplayAnalytics;
|
|
handleResumePlaybackAnalytics = videoQuestPlayerAnalytics.handleResumePlaybackAnalytics;
|
|
handleSeekAnalytics = videoQuestPlayerAnalytics.handleSeekAnalytics;
|
|
ref3 = useRef(null);
|
|
id = quest.id;
|
|
gameTitle = quest.config.messages.gameTitle;
|
|
let r46 = memo2?.url;
|
|
if (r46 == null) {
|
|
r46 = memo?.url;
|
|
}
|
|
url = r46;
|
|
const defaultWatchVideoTask = getDefaultWatchVideoTask(quest.config);
|
|
videoTitle = defaultWatchVideoTask == null ? void 0 : defaultWatchVideoTask.messages.videoTitle;
|
|
videoStreamType = memo2?.url != null ? "hls" : "mp4";
|
|
useEffect(() => {
|
|
if (url != null && url.length !== 0 && ref.current != null && getVideoQoEMetricsConfig({
|
|
location: QuestsExperimentLocations.VIDEO_MODAL_MOBILE
|
|
}).externalAnalyticsEnabled) {
|
|
const constants = getConstants();
|
|
ref3.current = new MobileMuxWrapper({
|
|
videoRef: ref.current,
|
|
feature: "quests",
|
|
appVersion: constants.Version,
|
|
releaseChannel: constants.ReleaseChannel,
|
|
contentMetadata: {
|
|
contentId: url,
|
|
videoStreamType,
|
|
contentType: "quests",
|
|
durationMs: 1000 * targetSeconds,
|
|
title: videoTitle,
|
|
questId: id,
|
|
gameName: gameTitle
|
|
}
|
|
});
|
|
ref3.current.initialize();
|
|
return () => {
|
|
if (ref3.current != null) {
|
|
ref3.current.onProgress(ref2.current);
|
|
ref3.current.destroy();
|
|
ref3.current = null;
|
|
}
|
|
};
|
|
}
|
|
}, [id, gameTitle, targetSeconds, url, videoTitle, videoStreamType]);
|
|
const callback = useCallback((a0) => {
|
|
setState2(a0);
|
|
}, []);
|
|
const callback2 = useCallback(() => {
|
|
handleReadyForDisplayAnalytics();
|
|
const current = ref3.current;
|
|
if (current != null) {
|
|
current.onReadyForDisplay();
|
|
}
|
|
}, [handleReadyForDisplayAnalytics]);
|
|
const callback3 = useCallback((a0) => {
|
|
const { duration, videoTracks, trackId, naturalSize } = a0;
|
|
setState(duration);
|
|
handleLoadAnalytics();
|
|
const current = ref3.current;
|
|
if (current != null) {
|
|
current.onLoad(duration);
|
|
}
|
|
if (naturalSize != null) {
|
|
const current2 = ref3.current;
|
|
if (current2 != null) {
|
|
current2.updateVideoSourceDimensions(naturalSize.width, naturalSize.height);
|
|
}
|
|
}
|
|
if (videoTracks != null && videoTracks.length > 0 && trackId != null && trackId.length > 0) {
|
|
const current3 = ref3.current;
|
|
if (current3 != null) {
|
|
current3.onVideoTrackChange(trackId, videoTracks);
|
|
}
|
|
}
|
|
if (onLoad != null) {
|
|
onLoad(a0);
|
|
}
|
|
}, [handleLoadAnalytics, onLoad]);
|
|
const callback4 = useCallback((a0) => {
|
|
const fromTimeSec = a0.fromTimeSec;
|
|
ref2.current = a0.currentTime;
|
|
if (state > 0) {
|
|
c20962_13(quest.id, a0.currentTime, state);
|
|
}
|
|
handleSeekAnalytics(fromTimeSec, a0.currentTime);
|
|
const current = ref3.current;
|
|
if (current != null) {
|
|
current.updatePlayheadTime(a0.currentTime);
|
|
}
|
|
const current2 = ref3.current;
|
|
if (current2 != null) {
|
|
current2.onSeek();
|
|
}
|
|
}, [state, handleSeekAnalytics, quest.id, r17]);
|
|
ref4 = useRef(0);
|
|
ref5 = useRef(0);
|
|
const callback5 = useCallback((a0) => {
|
|
ref2.current = a0.currentTime;
|
|
if (a0.currentTime >= ref4.current) {
|
|
sendVideoProgress(quest, a0.currentTime);
|
|
handleProgressAnalytics(a0.progress, a0.seekableDuration, a0.currentTime);
|
|
ref4.current = a0.currentTime + 6 + 2 * Math.random();
|
|
}
|
|
if (a0.currentTime >= ref5.current) {
|
|
updateOptimisticProgress(quest.id, questTaskDetails.taskType, a0.currentTime);
|
|
ref5.current = a0.currentTime + 1;
|
|
}
|
|
c20962_13(quest.id, a0.currentTime, a0.seekableDuration);
|
|
const current = ref3.current;
|
|
if (current != null) {
|
|
current.onProgress(a0.currentTime);
|
|
}
|
|
}, [quest, questTaskDetails.taskType, handleProgressAnalytics, r17]);
|
|
const callback6 = useCallback(() => {
|
|
sendVideoProgress(quest, state);
|
|
handleEndAnalytics();
|
|
const current = ref3.current;
|
|
if (current != null) {
|
|
current.onProgress(state);
|
|
}
|
|
const current2 = ref3.current;
|
|
if (current2 != null) {
|
|
current2.onEnd();
|
|
}
|
|
if (onEnd != null) {
|
|
onEnd();
|
|
}
|
|
}, [state, quest, handleEndAnalytics, onEnd]);
|
|
const callback7 = useCallback(() => {
|
|
handleLoadStartAnalytics();
|
|
const current = ref3.current;
|
|
if (current != null) {
|
|
current.onLoadStart();
|
|
}
|
|
const current2 = ref3.current;
|
|
if (current2 != null) {
|
|
current2.onPlay();
|
|
}
|
|
}, [handleLoadStartAnalytics]);
|
|
const callback8 = useCallback((a0) => {
|
|
handleErrorAnalytics(a0);
|
|
const current = ref3.current;
|
|
if (current != null) {
|
|
current.onError(a0);
|
|
}
|
|
}, [handleErrorAnalytics]);
|
|
const callback9 = useCallback(({ videoTracks, selectedVideoTrackId }) => {
|
|
if (videoTracks != null && videoTracks.length > 0 && selectedVideoTrackId != null && selectedVideoTrackId.length > 0) {
|
|
const current = ref3.current;
|
|
if (current != null) {
|
|
current.onVideoTrackChange(selectedVideoTrackId, videoTracks);
|
|
}
|
|
}
|
|
}, []);
|
|
const callback10 = useCallback((a0) => {
|
|
if ((a0 == null ? void 0 : a0.nativeEvent?.layout) != null) {
|
|
const layout = a0.nativeEvent.layout;
|
|
const { width, height } = layout;
|
|
if (width > 0 && height > 0) {
|
|
const current = ref3.current;
|
|
if (current != null) {
|
|
current.updateVideoDimensions(width, height);
|
|
}
|
|
}
|
|
}
|
|
}, []);
|
|
const callback11 = useCallback(() => {
|
|
handleResumePlaybackAnalytics();
|
|
const current = ref3.current;
|
|
if (current != null) {
|
|
current.onPlay();
|
|
}
|
|
}, [handleResumePlaybackAnalytics]);
|
|
const callback12 = useCallback(() => {
|
|
handlePausePlaybackAnalytics();
|
|
const current = ref3.current;
|
|
if (current != null) {
|
|
current.onPause();
|
|
}
|
|
}, [handlePausePlaybackAnalytics]);
|
|
const callback13 = useCallback((a0) => {
|
|
handleBufferAnalytics(a0);
|
|
const current = ref3.current;
|
|
if (current != null) {
|
|
current.onBuffer(a0);
|
|
}
|
|
}, [handleBufferAnalytics]);
|
|
const callback14 = useCallback((a0) => {
|
|
let top = contentInsets?.top;
|
|
if (top == null) {
|
|
top = 0;
|
|
}
|
|
let bottom = contentInsets?.bottom;
|
|
if (bottom == null) {
|
|
bottom = 0;
|
|
}
|
|
let left = contentInsets?.left;
|
|
if (left == null) {
|
|
left = 0;
|
|
}
|
|
let right = contentInsets?.right;
|
|
if (right == null) {
|
|
right = 0;
|
|
}
|
|
return <VideoQuestCaptions quest={quest} currentTime={a0} visible={visible} style={{
|
|
top,
|
|
bottom,
|
|
left,
|
|
right
|
|
}} />;
|
|
}, [quest, visible, contentInsets]);
|
|
const memo3 = useMemo(() => {
|
|
const r1 = memo == null;
|
|
let r2 = null;
|
|
if (!r1) {
|
|
let uri = memo2?.url;
|
|
if (uri == null) {
|
|
uri = memo.url;
|
|
}
|
|
r2 = {
|
|
uri
|
|
};
|
|
}
|
|
return r2;
|
|
}, [memo2, memo]);
|
|
const callback15 = useCallback(() => {
|
|
if (onToggleFullscreen != null) {
|
|
onToggleFullscreen({
|
|
orientation
|
|
});
|
|
}
|
|
}, [onToggleFullscreen, orientation]);
|
|
if (memo3 == null) {
|
|
return null;
|
|
}
|
|
const showFullscreenButton = orientation === "landscape";
|
|
return <AdVideoPlayer source={memo3} initialProgress={initialProgress} contentDuration={targetSeconds} allowUnrestrictedSeeking={isQuestCompleted} disableResumeOnLoad={isQuestCompleted} style={style} isFullscreen={isFullscreen} externallyPaused={externallyPaused} contentInsets={contentInsets} renderCaptions={callback14} onLoadStart={callback7} onLoad={callback3} onReadyForDisplay={callback2} onSeek={callback4} onBuffer={callback13} onError={callback8} onEnd={callback6} onPlayerStateChange={callback} onResumePlayback={callback11} onPausePlayback={callback12} onProgress={callback5} onVideoTracks={callback9} onVideoLayout={callback10} videoRef={ref} bufferingSpinnerPlacement={showFullscreenButton ? "center" : "top-left"} captionsEnabled={visible} showCaptionsButton={showFullscreenButton ? hasCaptionAsset : showFullscreenButton} showTranscriptButton={showFullscreenButton && hasTranscriptAsset} showFullscreenButton={showFullscreenButton} showProgress={showFullscreenButton} onToggleCaptions={handleToggleCaptions} onOpenTranscript={handleOpenTranscript} onToggleFullscreen={callback15} />;
|
|
});
|
|
export const PlayerState = _AdVideoPlayer.PlayerState;
|
|
export { r27 as VideoQuestPlayer };
|