49 lines
2.5 KiB
JavaScript
49 lines
2.5 KiB
JavaScript
"use strict";
|
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
exports.FullScreenToggle = void 0;
|
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
const react_1 = require("react");
|
|
const remotion_1 = require("remotion");
|
|
const no_react_1 = require("remotion/no-react");
|
|
const use_keybinding_1 = require("../helpers/use-keybinding");
|
|
const canvas_ref_1 = require("../state/canvas-ref");
|
|
const ControlButton_1 = require("./ControlButton");
|
|
const accessibilityLabel = [
|
|
'Enter fullscreen preview',
|
|
(0, use_keybinding_1.areKeyboardShortcutsDisabled)() ? null : '(F)',
|
|
]
|
|
.filter(no_react_1.NoReactInternals.truthy)
|
|
.join(' ');
|
|
const FullScreenToggle = () => {
|
|
const keybindings = (0, use_keybinding_1.useKeybinding)();
|
|
const { setSize } = (0, react_1.useContext)(remotion_1.Internals.PreviewSizeContext);
|
|
const onClick = (0, react_1.useCallback)(() => {
|
|
var _a;
|
|
(_a = canvas_ref_1.drawRef.current) === null || _a === void 0 ? void 0 : _a.requestFullscreen();
|
|
if (document.fullscreenElement)
|
|
setSize(() => ({
|
|
size: 'auto',
|
|
translation: {
|
|
x: 0,
|
|
y: 0,
|
|
},
|
|
}));
|
|
}, [setSize]);
|
|
(0, react_1.useEffect)(() => {
|
|
const f = keybindings.registerKeybinding({
|
|
event: 'keydown',
|
|
key: 'f',
|
|
callback: onClick,
|
|
commandCtrlKey: false,
|
|
preventDefault: true,
|
|
triggerIfInputFieldFocused: false,
|
|
keepRegisteredWhenNotHighestContext: false,
|
|
});
|
|
return () => {
|
|
f.unregister();
|
|
};
|
|
}, [keybindings, onClick]);
|
|
return ((0, jsx_runtime_1.jsx)(ControlButton_1.ControlButton, { title: accessibilityLabel, "aria-label": accessibilityLabel, onClick: onClick, children: (0, jsx_runtime_1.jsx)("svg", { style: { width: 18, height: 18 }, viewBox: "0 0 448 512", fill: "#fff", children: (0, jsx_runtime_1.jsx)("path", { d: "M0 180V56c0-13.3 10.7-24 24-24h124c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12H64v84c0 6.6-5.4 12-12 12H12c-6.6 0-12-5.4-12-12zM288 44v40c0 6.6 5.4 12 12 12h84v84c0 6.6 5.4 12 12 12h40c6.6 0 12-5.4 12-12V56c0-13.3-10.7-24-24-24H300c-6.6 0-12 5.4-12 12zm148 276h-40c-6.6 0-12 5.4-12 12v84h-84c-6.6 0-12 5.4-12 12v40c0 6.6 5.4 12 12 12h124c13.3 0 24-10.7 24-24V332c0-6.6-5.4-12-12-12zM160 468v-40c0-6.6-5.4-12-12-12H64v-84c0-6.6-5.4-12-12-12H12c-6.6 0-12 5.4-12 12v124c0 13.3 10.7 24 24 24h124c6.6 0 12-5.4 12-12z" }) }) }));
|
|
};
|
|
exports.FullScreenToggle = FullScreenToggle;
|