mirror of
https://github.com/OpenCut-app/OpenCut.git
synced 2026-07-13 21:52:53 +02:00
77 lines
2.1 KiB
TypeScript
77 lines
2.1 KiB
TypeScript
import { useEffect } from "react";
|
|||
|
|
import { ActionWithOptionalArgs, invokeAction } from "../constants/actions";
|
||
|
|
import { useKeybindingsStore } from "@/stores/keybindings-store";
|
||
|
|
|
||
|
|
/**
|
||
|
|
* This variable keeps track whether keybindings are being accepted
|
||
|
|
* true -> Keybindings are checked
|
||
|
|
* false -> Key presses are ignored (Keybindings are not checked)
|
||
|
|
*/
|
||
|
|
let keybindingsEnabled = true;
|
||
|
|
|
||
|
|
/**
|
||
|
|
* A composable that hooks to the caller component's
|
||
|
|
* lifecycle and hooks to the keyboard events to fire
|
||
|
|
* the appropriate actions based on keybindings
|
||
|
|
*/
|
||
|
|
export function useKeybindingsListener() {
|
||
|
|
const { keybindings, getKeybindingString } = useKeybindingsStore();
|
||
|
|
|
||
|
|
useEffect(() => {
|
||
|
|
const handleKeyDown = (ev: KeyboardEvent) => {
|
||
|
|
// Do not check keybinds if the mode is disabled
|
||
|
|
if (!keybindingsEnabled) return;
|
||
|
|
|
||
|
|
const binding = getKeybindingString(ev);
|
||
|
|
if (!binding) return;
|
||
|
|
|
||
|
|
const boundAction = keybindings[binding];
|
||
|
|
if (!boundAction) return;
|
||
|
|
|
||
|
|
ev.preventDefault();
|
||
|
|
|
||
|
|
// Handle actions with default arguments
|
||
|
|
let actionArgs: any = undefined;
|
||
|
|
|
||
|
|
if (boundAction === "seek-forward") {
|
||
|
|
actionArgs = { seconds: 1 };
|
||
|
|
} else if (boundAction === "seek-backward") {
|
||
|
|
actionArgs = { seconds: 1 };
|
||
|
|
} else if (boundAction === "jump-forward") {
|
||
|
|
actionArgs = { seconds: 5 };
|
||
|
|
} else if (boundAction === "jump-backward") {
|
||
|
|
actionArgs = { seconds: 5 };
|
||
|
|
}
|
||
|
|
|
||
|
|
invokeAction(boundAction, actionArgs, "keypress");
|
||
|
|
};
|
||
|
|
|
||
|
|
document.addEventListener("keydown", handleKeyDown);
|
||
|
|
|
||
|
|
return () => {
|
||
|
|
document.removeEventListener("keydown", handleKeyDown);
|
||
|
|
};
|
||
|
|
}, [keybindings, getKeybindingString]);
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* This composable allows for the UI component to be disabled if the component in question is mounted
|
||
|
|
*/
|
||
|
|
export function useKeybindingDisabler() {
|
||
|
|
const disableKeybindings = () => {
|
||
|
|
keybindingsEnabled = false;
|
||
|
|
};
|
||
|
|
|
||
|
|
const enableKeybindings = () => {
|
||
|
|
keybindingsEnabled = true;
|
||
|
|
};
|
||
|
|
|
||
|
|
return {
|
||
|
|
disableKeybindings,
|
||
|
|
enableKeybindings,
|
||
|
|
};
|
||
|
|
}
|
||
|
|
|
||
|
|
// Export the bindings for backward compatibility
|
||
|
|
export const bindings = {};
|