diff --git a/locales/en.json b/locales/en.json index 97d74c3f..17660984 100644 --- a/locales/en.json +++ b/locales/en.json @@ -73,7 +73,10 @@ "ui_scaling": "UI Scaling", "display_duration": "Display duration", "fadeout_duration": "Fadeout duration", - "tracker": "Tracker" + "tracker": "Tracker", + "overlay_show_only_translated_messages": { + "label": "Show Only Translated Messages" + } }, "config_page": { "config_title": "Settings", diff --git a/src-ui/app/config_page/setting_section/setting_box/vr/Vr.jsx b/src-ui/app/config_page/setting_section/setting_box/vr/Vr.jsx index 0d40346c..8e1eab2d 100644 --- a/src-ui/app/config_page/setting_section/setting_box/vr/Vr.jsx +++ b/src-ui/app/config_page/setting_section/setting_box/vr/Vr.jsx @@ -7,12 +7,19 @@ import { Slider } from "../_components/"; import { RadioButtonContainer, SwitchBoxContainer, + CheckboxContainer, } from "../_templates/Templates"; + +import { + SectionLabelComponent, +} from "../_components/"; + import { useIsEnabledOverlaySmallLog, useOverlaySmallLogSettings, useIsEnabledOverlayLargeLog, useOverlayLargeLogSettings, + useOverlayShowOnlyTranslatedMessages, } from "@logics_configs"; export const Vr = () => { @@ -56,6 +63,7 @@ export const Vr = () => { /> )} + ); }; @@ -311,4 +319,21 @@ const OtherControls = ({settings, onchangeFunction, ui_configs}) => { ); +}; + + +const CommonSettingsContainer = () => { + const { t } = useTranslation(); + const { currentOverlayShowOnlyTranslatedMessages, toggleOverlayShowOnlyTranslatedMessages } = useOverlayShowOnlyTranslatedMessages(); + + return ( +
+ + +
+ ); }; \ No newline at end of file diff --git a/src-ui/app/config_page/setting_section/setting_box/vr/Vr.module.scss b/src-ui/app/config_page/setting_section/setting_box/vr/Vr.module.scss index ba202ee0..e32a0fb2 100644 --- a/src-ui/app/config_page/setting_section/setting_box/vr/Vr.module.scss +++ b/src-ui/app/config_page/setting_section/setting_box/vr/Vr.module.scss @@ -6,6 +6,7 @@ position: relative; padding: 2rem; width: 100%; + gap: 4rem; } .wrapper { @@ -187,4 +188,12 @@ position: absolute; font-size: 1.6rem; width: 100%; +} + +.common_container { + width: 100%; +} + +.common_label { + font-size: 1.4rem; } \ No newline at end of file diff --git a/src-ui/logics/configs/index.js b/src-ui/logics/configs/index.js index c38eda18..aff6b450 100644 --- a/src-ui/logics/configs/index.js +++ b/src-ui/logics/configs/index.js @@ -47,6 +47,7 @@ export { useSelectedCTranslate2ComputeDevice } from "./translation/useSelectedCT export { useIsEnabledOverlaySmallLog } from "./vr/useIsEnabledOverlaySmallLog"; export { useOverlaySmallLogSettings } from "./vr/useOverlaySmallLogSettings"; export { useIsEnabledOverlayLargeLog } from "./vr/useIsEnabledOverlayLargeLog"; +export { useOverlayShowOnlyTranslatedMessages } from "./vr/useOverlayShowOnlyTranslatedMessages"; export { useOverlayLargeLogSettings } from "./vr/useOverlayLargeLogSettings"; export { useOscIpAddress } from "./advanced_settings/useOscIpAddress"; diff --git a/src-ui/logics/configs/vr/useOverlayShowOnlyTranslatedMessages.js b/src-ui/logics/configs/vr/useOverlayShowOnlyTranslatedMessages.js new file mode 100644 index 00000000..895581ae --- /dev/null +++ b/src-ui/logics/configs/vr/useOverlayShowOnlyTranslatedMessages.js @@ -0,0 +1,28 @@ +import { useStore_OverlayShowOnlyTranslatedMessages } from "@store"; +import { useStdoutToPython } from "@logics/useStdoutToPython"; + +export const useOverlayShowOnlyTranslatedMessages = () => { + const { asyncStdoutToPython } = useStdoutToPython(); + const { currentOverlayShowOnlyTranslatedMessages, updateOverlayShowOnlyTranslatedMessages, pendingOverlayShowOnlyTranslatedMessages } = useStore_OverlayShowOnlyTranslatedMessages(); + + const getOverlayShowOnlyTranslatedMessages = () => { + pendingOverlayShowOnlyTranslatedMessages(); + asyncStdoutToPython("/get/data/overlay_show_only_translated_messages"); + }; + + const toggleOverlayShowOnlyTranslatedMessages = () => { + pendingOverlayShowOnlyTranslatedMessages(); + if (currentOverlayShowOnlyTranslatedMessages.data) { + asyncStdoutToPython("/set/disable/overlay_show_only_translated_messages"); + } else { + asyncStdoutToPython("/set/enable/overlay_show_only_translated_messages"); + } + }; + + return { + currentOverlayShowOnlyTranslatedMessages, + getOverlayShowOnlyTranslatedMessages, + updateOverlayShowOnlyTranslatedMessages, + toggleOverlayShowOnlyTranslatedMessages, + }; +}; \ No newline at end of file diff --git a/src-ui/logics/useReceiveRoutes.js b/src-ui/logics/useReceiveRoutes.js index f09c55e6..748b5061 100644 --- a/src-ui/logics/useReceiveRoutes.js +++ b/src-ui/logics/useReceiveRoutes.js @@ -64,6 +64,7 @@ import { useOverlaySmallLogSettings, useIsEnabledOverlayLargeLog, useOverlayLargeLogSettings, + useOverlayShowOnlyTranslatedMessages, useOscIpAddress, useOscPort, } from "@logics_configs"; @@ -161,6 +162,7 @@ export const useReceiveRoutes = () => { const { updateIsEnabledOverlaySmallLog } = useIsEnabledOverlaySmallLog(); const { updateOverlayLargeLogSettings } = useOverlayLargeLogSettings(); const { updateIsEnabledOverlayLargeLog } = useIsEnabledOverlayLargeLog(); + const { updateOverlayShowOnlyTranslatedMessages } = useOverlayShowOnlyTranslatedMessages(); const { updateOscIpAddress } = useOscIpAddress(); const { updateOscPort } = useOscPort(); @@ -414,6 +416,10 @@ export const useReceiveRoutes = () => { "/get/data/overlay_large_log_settings": updateOverlayLargeLogSettings, "/set/data/overlay_large_log_settings": updateOverlayLargeLogSettings, + "/get/data/overlay_show_only_translated_messages": updateOverlayShowOnlyTranslatedMessages, + "/set/enable/overlay_show_only_translated_messages": updateOverlayShowOnlyTranslatedMessages, + "/set/disable/overlay_show_only_translated_messages": updateOverlayShowOnlyTranslatedMessages, + // Others Tab "/get/data/auto_clear_message_box": updateEnableAutoClearMessageInputBox, "/set/enable/auto_clear_message_box": updateEnableAutoClearMessageInputBox, diff --git a/src-ui/store.js b/src-ui/store.js index bdbd17ec..68f8ee78 100644 --- a/src-ui/store.js +++ b/src-ui/store.js @@ -242,6 +242,7 @@ export const { atomInstance: Atom_OverlayLargeLogSettings, useHook: useStore_Ove tracker: "HMD", }, "OverlayLargeLogSettings"); export const { atomInstance: Atom_IsEnabledOverlayLargeLog, useHook: useStore_IsEnabledOverlayLargeLog } = createAtomWithHook(false, "IsEnabledOverlayLargeLog"); +export const { atomInstance: Atom_OverlayShowOnlyTranslatedMessages, useHook: useStore_OverlayShowOnlyTranslatedMessages } = createAtomWithHook(false, "OverlayShowOnlyTranslatedMessages"); // Others export const { atomInstance: Atom_EnableAutoClearMessageInputBox, useHook: useStore_EnableAutoClearMessageInputBox } = createAtomWithHook(true, "EnableAutoClearMessageInputBox");