Mirrors/stash
1
0
Fork 0
mirror of https://github.com/stashapp/stash.git synced 2025-12-17 20:34:37 +03:00
Code Issues Packages Projects Releases Wiki Activity

Improve Handy integration (#2555)

Browse Source 
* Refactor interactive into context
* Stop the interactive device when leaving page
* Show interactive state if not ready
* Handle navigation and looping
This commit is contained in:
WithoutPants
2022-05-10 16:38:34 +10:00
committed by GitHub
parent bc85614ff9
commit ea2fcd9d7f
10 changed files with 575 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

83
ui/v2.5/src/components/Settings/SettingsInterfacePanel/SettingsInterfacePanel.tsx
View File

@@ -1,6 +1,6 @@
import React from "react";
import { Form } from "react-bootstrap";
import { useIntl } from "react-intl";
import { Button, Form } from "react-bootstrap";
import { FormattedMessage, useIntl } from "react-intl";
import { DurationInput, LoadingIndicator } from "src/components/Shared";
import { CheckboxGroup } from "./CheckboxGroup";
import { SettingSection } from "../SettingSection";
@@ -19,6 +19,11 @@ import {
imageLightboxScrollModeIntlMap,
} from "src/core/enums";
import { useInterfaceLocalForage } from "src/hooks";
import {
ConnectionState,
connectionStateLabel,
InteractiveContext,
} from "src/hooks/Interactive/context";
const allMenuItems = [
{ id: "scenes", headingID: "scenes" },
@@ -38,6 +43,16 @@ export const SettingsInterfacePanel: React.FC = () => {
SettingStateContext
);
const {
interactive,
state: interactiveState,
error: interactiveError,
serverOffset: interactiveServerOffset,
initialised: interactiveInitialised,
initialise: initialiseInteractive,
sync: interactiveSync,
} = React.useContext(InteractiveContext);
const [, setInterfaceLocalForage] = useInterfaceLocalForage();
function saveLightboxSettings(v: Partial<GQL.ConfigImageLightboxInput>) {
@@ -397,6 +412,70 @@ export const SettingsInterfacePanel: React.FC = () => {
value={iface.handyKey ?? undefined}
onChange={(v) => saveInterface({ handyKey: v })}
/>
{interactive.handyKey && (
<>
<div className="setting" id="handy-status">
<div>
<h3>
{intl.formatMessage({
id: "config.ui.handy_connection.status.heading",
})}
</h3>
<div className="value">
<FormattedMessage
id={connectionStateLabel(interactiveState)}
/>
{interactiveError && <span>: {interactiveError}</span>}
</div>
</div>
<div>
{!interactiveInitialised && (
<Button
disabled={
interactiveState === ConnectionState.Connecting ||
interactiveState === ConnectionState.Syncing
}
onClick={() => initialiseInteractive()}
>
{intl.formatMessage({
id: "config.ui.handy_connection.connect",
})}
</Button>
)}
</div>
</div>
<div className="setting" id="handy-server-offset">
<div>
<h3>
{intl.formatMessage({
id: "config.ui.handy_connection.server_offset.heading",
})}
</h3>
<div className="value">
{interactiveServerOffset.toFixed()}ms
</div>
</div>
<div>
{interactiveInitialised && (
<Button
disabled={
!interactiveInitialised ||
interactiveState === ConnectionState.Syncing
}
onClick={() => interactiveSync()}
>
{intl.formatMessage({
id: "config.ui.handy_connection.sync",
})}
</Button>
)}
</div>
</div>
</>
)}
<NumberSetting
headingID="config.ui.funscript_offset.heading"
subHeadingID="config.ui.funscript_offset.description"