[Update] Config Page: VR Tab. Add EnabledOverlaySmallLog Switch and connect to backend.
This commit is contained in:
@@ -1,9 +1,13 @@
|
|||||||
import React, { useState } from "react";
|
import React, { useState } from "react";
|
||||||
import { useTranslation } from "react-i18next";
|
import { useTranslation } from "react-i18next";
|
||||||
|
import { clsx } from "clsx";
|
||||||
import styles from "./Vr.module.scss";
|
import styles from "./Vr.module.scss";
|
||||||
import { Slider } from "../_components/";
|
import { Slider } from "../_components/";
|
||||||
import { clsx } from "clsx";
|
|
||||||
import {
|
import {
|
||||||
|
SwitchBoxContainer,
|
||||||
|
} from "../_templates/Templates";
|
||||||
|
import {
|
||||||
|
useIsEnabledOverlaySmallLog,
|
||||||
useOverlaySettings,
|
useOverlaySettings,
|
||||||
useOverlaySmallLogSettings,
|
useOverlaySmallLogSettings,
|
||||||
} from "@logics_configs";
|
} from "@logics_configs";
|
||||||
@@ -58,6 +62,7 @@ export const Vr = () => {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={styles.container}>
|
<div className={styles.container}>
|
||||||
|
<EnableOverlaySmallLogContainer />
|
||||||
<CommonControls />
|
<CommonControls />
|
||||||
<div className={styles.controller_type_switch} onClick={toggleController}>
|
<div className={styles.controller_type_switch} onClick={toggleController}>
|
||||||
<div className={toggle_button_class_names__position}>
|
<div className={toggle_button_class_names__position}>
|
||||||
@@ -78,6 +83,19 @@ export const Vr = () => {
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const EnableOverlaySmallLogContainer = () => {
|
||||||
|
const { t } = useTranslation();
|
||||||
|
const { currentIsEnabledOverlaySmallLog, toggleIsEnabledOverlaySmallLog } = useIsEnabledOverlaySmallLog();
|
||||||
|
|
||||||
|
return (
|
||||||
|
<SwitchBoxContainer
|
||||||
|
label={t("config_page.enable_overlay_small_log.label")}
|
||||||
|
variable={currentIsEnabledOverlaySmallLog}
|
||||||
|
toggleFunction={toggleIsEnabledOverlaySmallLog}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
const CommonControls = () => {
|
const CommonControls = () => {
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
const { currentOverlaySettings, setOverlaySettings } = useOverlaySettings();
|
const { currentOverlaySettings, setOverlaySettings } = useOverlaySettings();
|
||||||
|
|||||||
@@ -6,7 +6,7 @@ export const useIsEnabledOverlaySmallLog = () => {
|
|||||||
const { currentIsEnabledOverlaySmallLog, updateIsEnabledOverlaySmallLog, pendingIsEnabledOverlaySmallLog } = useStore_IsEnabledOverlaySmallLog();
|
const { currentIsEnabledOverlaySmallLog, updateIsEnabledOverlaySmallLog, pendingIsEnabledOverlaySmallLog } = useStore_IsEnabledOverlaySmallLog();
|
||||||
|
|
||||||
const getIsEnabledOverlaySmallLog = () => {
|
const getIsEnabledOverlaySmallLog = () => {
|
||||||
// pendingIsEnabledOverlaySmallLog();
|
pendingIsEnabledOverlaySmallLog();
|
||||||
asyncStdoutToPython("/get/data/overlay_settings");
|
asyncStdoutToPython("/get/data/overlay_settings");
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@@ -46,6 +46,7 @@ import {
|
|||||||
useSpeakerPhraseTimeout,
|
useSpeakerPhraseTimeout,
|
||||||
useSpeakerMaxWords,
|
useSpeakerMaxWords,
|
||||||
useOverlaySettings,
|
useOverlaySettings,
|
||||||
|
useIsEnabledOverlaySmallLog,
|
||||||
useOverlaySmallLogSettings,
|
useOverlaySmallLogSettings,
|
||||||
useOscIpAddress,
|
useOscIpAddress,
|
||||||
useOscPort,
|
useOscPort,
|
||||||
@@ -117,6 +118,7 @@ export const useReceiveRoutes = () => {
|
|||||||
|
|
||||||
const { updateOverlaySettings } = useOverlaySettings();
|
const { updateOverlaySettings } = useOverlaySettings();
|
||||||
const { updateOverlaySmallLogSettings } = useOverlaySmallLogSettings();
|
const { updateOverlaySmallLogSettings } = useOverlaySmallLogSettings();
|
||||||
|
const { updateIsEnabledOverlaySmallLog } = useIsEnabledOverlaySmallLog();
|
||||||
|
|
||||||
const { updateOscIpAddress } = useOscIpAddress();
|
const { updateOscIpAddress } = useOscIpAddress();
|
||||||
const { updateOscPort } = useOscPort();
|
const { updateOscPort } = useOscPort();
|
||||||
@@ -320,6 +322,10 @@ export const useReceiveRoutes = () => {
|
|||||||
"/get/data/overlay_settings": updateOverlaySettings,
|
"/get/data/overlay_settings": updateOverlaySettings,
|
||||||
"/set/data/overlay_settings": updateOverlaySettings,
|
"/set/data/overlay_settings": updateOverlaySettings,
|
||||||
|
|
||||||
|
"/get/data/overlay_small_log": updateIsEnabledOverlaySmallLog,
|
||||||
|
"/set/enable/overlay_small_log": updateIsEnabledOverlaySmallLog,
|
||||||
|
"/set/disable/overlay_small_log": updateIsEnabledOverlaySmallLog,
|
||||||
|
|
||||||
"/get/data/overlay_small_log_settings": updateOverlaySmallLogSettings,
|
"/get/data/overlay_small_log_settings": updateOverlaySmallLogSettings,
|
||||||
"/set/data/overlay_small_log_settings": updateOverlaySmallLogSettings,
|
"/set/data/overlay_small_log_settings": updateOverlaySmallLogSettings,
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user