From a76ea77d5dbfedb99eaaffbc78fa8e631549c7af Mon Sep 17 00:00:00 2001 From: Sakamoto Shiina <68018796+ShiinaSakamoto@users.noreply.github.com> Date: Sun, 12 Jan 2025 22:56:00 +0900 Subject: [PATCH] [Refactor] Refactor. --- .../GlobalHotKeyController.jsx | 19 ++- .../hotkeys_entry/HotkeysEntry.jsx | 114 +++++++----------- 2 files changed, 52 insertions(+), 81 deletions(-) diff --git a/src-ui/app/_app_controllers/GlobalHotKeyController.jsx b/src-ui/app/_app_controllers/GlobalHotKeyController.jsx index 0387f3be..e3b8474a 100644 --- a/src-ui/app/_app_controllers/GlobalHotKeyController.jsx +++ b/src-ui/app/_app_controllers/GlobalHotKeyController.jsx @@ -27,15 +27,12 @@ export const GlobalHotKeyController = () => { const shortcut_raw = currentHotkeys.data.toggle_active_vrct; console.log(shortcut_raw); - if (!shortcut_raw) { console.warn("No hotkey defined."); return; } - // 入力文字列をTauriで使える形式に変換 const shortcut = parseHotkey(shortcut_raw); - // const shortcut = "F9"; try { // 既存のショートカットをすべて解除 @@ -46,14 +43,14 @@ export const GlobalHotKeyController = () => { if (!isAlreadyRegistered) { await register(shortcut, async () => { console.log(`Shortcut "${shortcut}" triggered, setting focus.`); - // const minimized = await appWindow.isMinimized(); - // if (minimized === true) { - // appWindow.unminimize(); - // await appWindow.setFocus(); - // store.text_area_ref.current?.focus(); - // } else { - // appWindow.minimize(); - // } + const minimized = await appWindow.isMinimized(); + if (minimized === true) { + appWindow.unminimize(); + await appWindow.setFocus(); + store.text_area_ref.current?.focus(); + } else { + appWindow.minimize(); + } }); console.log(`Registered global shortcut: ${shortcut}`); } diff --git a/src-ui/app/config_page/setting_section/setting_box/_components/hotkeys_entry/HotkeysEntry.jsx b/src-ui/app/config_page/setting_section/setting_box/_components/hotkeys_entry/HotkeysEntry.jsx index 48ebeb11..ae5bc2a8 100644 --- a/src-ui/app/config_page/setting_section/setting_box/_components/hotkeys_entry/HotkeysEntry.jsx +++ b/src-ui/app/config_page/setting_section/setting_box/_components/hotkeys_entry/HotkeysEntry.jsx @@ -3,130 +3,104 @@ import { _Entry } from "../_atoms/_entry/_Entry"; import { useState, useRef } from "react"; export const HotkeysEntry = (props) => { - const [is_accepting_input, setIsAcceptingInput] = useState(false); // キー入力受付中かどうか - const lastKeyRef = useRef(null); // 直前のキーを保持 - const [displayValue, setDisplayValue] = useState(props.value[props.hotkey_id]); // 表示用の値 - const isModifierOnlyRef = useRef(false); // 修飾キー単体かどうかのフラグ + const [isAcceptingInput, setIsAcceptingInput] = useState(false); + const [displayValue, setDisplayValue] = useState(props.value[props.hotkey_id]); + const lastKeyRef = useRef(null); + const isModifierOnlyRef = useRef(false); const entryRef = useRef(null); + const pressedKeys = useRef(new Set()); + const keysRef = useRef([]); - const pressedKeys = useRef(new Set()); // 押されているキーを追跡 - const keysRef = useRef([]); // 最新のkeysを保存 - - const setHotkeys = (keys) => { + const updateHotkeys = (keys) => { entryRef.current.blur(); props.setHotkeys({ [props.hotkey_id]: keys }); }; + const processKey = (key) => { + if (/^[a-zA-Z]$/.test(key)) return key.toUpperCase(); + if (key === "Meta") return "Super"; + return key; + }; + const handleKeyInput = (event) => { const keys = []; - const nonModifierKeys = []; // 修飾キー以外を追跡する配列 + const nonModifierKeys = []; - // 修飾キーを判定して追加（重複防止） - if (event.ctrlKey && !keys.includes("Ctrl")) keys.push("Ctrl"); - if (event.shiftKey && !keys.includes("Shift")) keys.push("Shift"); - if (event.altKey && !keys.includes("Alt")) keys.push("Alt"); - if (event.metaKey && !keys.includes("Super")) keys.push("Super"); + ["Ctrl", "Shift", "Alt", "Super"].forEach((modKey) => { + if (event[`${modKey.toLowerCase()}Key`] && !keys.includes(modKey)) { + keys.push(modKey); + } + }); - let register_key = event.key === "Meta" ? "Super" : event.key; - // アルファベットの場合は大文字に変換 - if (/^[a-zA-Z]$/.test(register_key)) { - register_key = register_key.toUpperCase(); - } - - // 修飾キー以外を追加 + const key = processKey(event.key); if (!["Control", "Shift", "Alt", "Meta"].includes(event.key)) { - keys.push(register_key); - nonModifierKeys.push(register_key); // 修飾キー以外のキーを追跡 + keys.push(key); + nonModifierKeys.push(key); } - // キーが既に追跡されていない場合のみ追加 - if (!pressedKeys.current.has(register_key)) { - pressedKeys.current.add(register_key); + if (!pressedKeys.current.has(key)) { + pressedKeys.current.add(key); } - // 最新のキー構成を保存 - keysRef.current = [...keys]; - - // 表示用の値を更新 + keysRef.current = keys; setDisplayValue(keys.join(" + ")); - - // 修飾キー単体かどうかを更新 isModifierOnlyRef.current = nonModifierKeys.length === 0; - - // 修飾キーのみの場合は登録処理をスキップ - if (isModifierOnlyRef.current) return; }; const handleKeyDown = (event) => { - event.preventDefault(); // デフォルト動作を防ぐ + event.preventDefault(); + if (lastKeyRef.current === event.key) return; - // 直前のキーと同じならスキップ - const currentKey = event.key; - if (lastKeyRef.current === currentKey) { - return; - } - - lastKeyRef.current = currentKey; // 今回のキーを記録 + lastKeyRef.current = event.key; handleKeyInput(event); }; const handleKeyUp = (event) => { - lastKeyRef.current = null; // キーが離されたらリセット + lastKeyRef.current = null; + + const key = processKey(event.key); + pressedKeys.current.delete(key); - // 修飾キーのみの場合でも表示は維持 if (isModifierOnlyRef.current) { - setDisplayValue(""); // 非修飾キーが含まれていた場合リセット + setDisplayValue(""); } - let register_key = event.key === "Meta" ? "Super" : event.key; - // アルファベットの場合は大文字に変換 - if (/^[a-zA-Z]$/.test(register_key)) { - register_key = register_key.toUpperCase(); - } - // 押されているキーから削除 - pressedKeys.current.delete(register_key); - - // 全てのキーが放された場合 if (pressedKeys.current.size === 0) { - - // 修飾キーのみの場合はスキップ const hasNonModifierKeys = keysRef.current.some( (key) => !["Ctrl", "Shift", "Alt", "Super"].includes(key) ); - if (!hasNonModifierKeys) { - return; + if (hasNonModifierKeys) { + updateHotkeys(keysRef.current); } - - // 保存されたキー構成を使用して登録 - setHotkeys(keysRef.current); } }; - const handleBlur = () => { setIsAcceptingInput(false); pressedKeys.current.clear(); }; + const handleDelete = () => { + updateHotkeys(null); + setDisplayValue(""); + }; + return (
<_Entry ref={entryRef} type="text" placeholder="Press hotkeys keys" - onFocus={() => [setIsAcceptingInput(true)]} + onFocus={() => setIsAcceptingInput(true)} onBlur={handleBlur} onKeyDown={handleKeyDown} onKeyUp={handleKeyUp} - value={displayValue} // 表示用の値を設定 + value={displayValue} width="20rem" - is_activated={is_accepting_input} + is_activated={isAcceptingInput} readOnly /> -