"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.Fullscreen = Fullscreen;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const __1 = require("../..");
const ui_1 = require("../../components/ui");
const audio_only_overlay_1 = require("./ui/audio-only-overlay");
const video_1 = tslib_1.__importDefault(require("./video"));
const video_retry_1 = tslib_1.__importDefault(require("./video-retry"));
function Fullscreen(props) {
    const playerId = (0, __1.getFirstPlayerID)();
    const protocol = (0, __1.usePlayerStore)((x) => x.protocol, playerId);
    const fullscreen = (0, __1.usePlayerStore)((x) => x.fullscreen, playerId);
    const setFullscreen = (0, __1.usePlayerStore)((x) => x.setFullscreen, playerId);
    const setSrc = (0, __1.usePlayerStore)((x) => x.setSrc);
    const setAutoplayFailed = (0, __1.usePlayerStore)((x) => x.setAutoplayFailed);
    const danmuEnabled = (0, __1.useDanmuEnabled)();
    const danmuOpacity = (0, __1.useDanmuOpacity)();
    const danmuSpeed = (0, __1.useDanmuSpeed)();
    const danmuLaneCount = (0, __1.useDanmuLaneCount)();
    const danmuMaxMessages = (0, __1.useDanmuMaxMessages)();
    const divRef = (0, react_1.useRef)(null);
    const videoRef = (0, react_1.useRef)(null);
    (0, react_1.useEffect)(() => {
        setSrc(props.src);
        setAutoplayFailed(false);
    }, [props.src]);
    (0, react_1.useEffect)(() => {
        if (!divRef.current) {
            return;
        }
        (async () => {
            if (fullscreen && !document.fullscreenElement) {
                try {
                    const div = divRef.current;
                    if (typeof div.requestFullscreen === "function") {
                        await div.requestFullscreen();
                    }
                    else if (videoRef.current) {
                        if (typeof videoRef.current.webkitEnterFullscreen ===
                            "function") {
                            await videoRef.current.webkitEnterFullscreen();
                        }
                        else if (typeof videoRef.current.requestFullscreen === "function") {
                            await videoRef.current.requestFullscreen();
                        }
                    }
                    setFullscreen(true);
                }
                catch (e) {
                    console.error("fullscreen failed", e.message);
                }
            }
            if (!fullscreen) {
                if (document.fullscreenElement) {
                    try {
                        await document.exitFullscreen();
                    }
                    catch (e) {
                        console.error("fullscreen exit failed", e.message);
                    }
                }
                setFullscreen(false);
            }
        })();
    }, [fullscreen, protocol]);
    (0, react_1.useEffect)(() => {
        const listener = () => {
            console.log("fullscreenchange", document.fullscreenElement);
            setFullscreen(!!document.fullscreenElement);
        };
        document.body.addEventListener("fullscreenchange", listener);
        document.body.addEventListener("webkitfullscreenchange", listener);
        return () => {
            document.body.removeEventListener("fullscreenchange", listener);
            document.body.removeEventListener("webkitfullscreenchange", listener);
        };
    }, []);
    return ((0, jsx_runtime_1.jsxs)(ui_1.View, { ref: divRef, style: { width: "100%", height: "100%", overflow: "hidden" }, children: [(0, jsx_runtime_1.jsx)(video_retry_1.default, { children: (0, jsx_runtime_1.jsx)(video_1.default, { objectFit: props.objectFit, pictureInPictureEnabled: props.pictureInPictureEnabled }) }), (0, jsx_runtime_1.jsx)(audio_only_overlay_1.AudioOnlyOverlay, {}), (0, jsx_runtime_1.jsx)(__1.DanmuOverlay, { enabled: danmuEnabled, opacity: danmuOpacity, speed: danmuSpeed, laneCount: danmuLaneCount, maxMessages: danmuMaxMessages }), props.children] }));
}
//# sourceMappingURL=fullscreen.js.map