[d565449] | 1 | "use strict";
|
---|
| 2 | Object.defineProperty(exports, "__esModule", { value: true });
|
---|
| 3 | var tslib_1 = require("tslib");
|
---|
| 4 | var react_1 = require("react");
|
---|
| 5 | var screenfull_1 = tslib_1.__importDefault(require("screenfull"));
|
---|
| 6 | var useIsomorphicLayoutEffect_1 = tslib_1.__importDefault(require("./useIsomorphicLayoutEffect"));
|
---|
| 7 | var util_1 = require("./misc/util");
|
---|
| 8 | var useFullscreen = function (ref, enabled, options) {
|
---|
| 9 | if (options === void 0) { options = {}; }
|
---|
| 10 | var video = options.video, _a = options.onClose, onClose = _a === void 0 ? util_1.noop : _a;
|
---|
| 11 | var _b = react_1.useState(enabled), isFullscreen = _b[0], setIsFullscreen = _b[1];
|
---|
| 12 | useIsomorphicLayoutEffect_1.default(function () {
|
---|
| 13 | if (!enabled) {
|
---|
| 14 | return;
|
---|
| 15 | }
|
---|
| 16 | if (!ref.current) {
|
---|
| 17 | return;
|
---|
| 18 | }
|
---|
| 19 | var onWebkitEndFullscreen = function () {
|
---|
| 20 | if (video === null || video === void 0 ? void 0 : video.current) {
|
---|
| 21 | util_1.off(video.current, 'webkitendfullscreen', onWebkitEndFullscreen);
|
---|
| 22 | }
|
---|
| 23 | onClose();
|
---|
| 24 | };
|
---|
| 25 | var onChange = function () {
|
---|
| 26 | if (screenfull_1.default.isEnabled) {
|
---|
| 27 | var isScreenfullFullscreen = screenfull_1.default.isFullscreen;
|
---|
| 28 | setIsFullscreen(isScreenfullFullscreen);
|
---|
| 29 | if (!isScreenfullFullscreen) {
|
---|
| 30 | onClose();
|
---|
| 31 | }
|
---|
| 32 | }
|
---|
| 33 | };
|
---|
| 34 | if (screenfull_1.default.isEnabled) {
|
---|
| 35 | try {
|
---|
| 36 | screenfull_1.default.request(ref.current);
|
---|
| 37 | setIsFullscreen(true);
|
---|
| 38 | }
|
---|
| 39 | catch (error) {
|
---|
| 40 | onClose(error);
|
---|
| 41 | setIsFullscreen(false);
|
---|
| 42 | }
|
---|
| 43 | screenfull_1.default.on('change', onChange);
|
---|
| 44 | }
|
---|
| 45 | else if (video && video.current && video.current.webkitEnterFullscreen) {
|
---|
| 46 | video.current.webkitEnterFullscreen();
|
---|
| 47 | util_1.on(video.current, 'webkitendfullscreen', onWebkitEndFullscreen);
|
---|
| 48 | setIsFullscreen(true);
|
---|
| 49 | }
|
---|
| 50 | else {
|
---|
| 51 | onClose();
|
---|
| 52 | setIsFullscreen(false);
|
---|
| 53 | }
|
---|
| 54 | return function () {
|
---|
| 55 | setIsFullscreen(false);
|
---|
| 56 | if (screenfull_1.default.isEnabled) {
|
---|
| 57 | try {
|
---|
| 58 | screenfull_1.default.off('change', onChange);
|
---|
| 59 | screenfull_1.default.exit();
|
---|
| 60 | }
|
---|
| 61 | catch (_a) { }
|
---|
| 62 | }
|
---|
| 63 | else if (video && video.current && video.current.webkitExitFullscreen) {
|
---|
| 64 | util_1.off(video.current, 'webkitendfullscreen', onWebkitEndFullscreen);
|
---|
| 65 | video.current.webkitExitFullscreen();
|
---|
| 66 | }
|
---|
| 67 | };
|
---|
| 68 | }, [enabled, video, ref]);
|
---|
| 69 | return isFullscreen;
|
---|
| 70 | };
|
---|
| 71 | exports.default = useFullscreen;
|
---|