feat: bigger config rows; leave on short and long press; micro configs

FreeYourStream · Aug 17, 2022 · 080b389 · 080b389
1 parent 04b6deb
commit 080b389
Show file tree

Hide file tree

Showing 25 changed files with 193 additions and 118 deletions.
diff --git a/.gitignore b/.gitignore
@@ -22,4 +22,6 @@ npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 
-.eslintcache
+.eslintcache
+
+.vscode/arduino.json
diff --git a/package.json b/package.json
@@ -1,7 +1,8 @@
 {
   "name": "freedeck-configurator",
   "version": "2.7.15",
-  "configFileVersion": "1.2.0",
+  "configFileVersion": "1.3.0",
+  "minFWVersion": "2.7.0",
   "private": true,
   "homepage": "./",
   "type": "commonjs",

diff --git a/src/containers/DeveloperSettings.tsx b/src/containers/DeveloperSettings.tsx
@@ -1,5 +1,6 @@
+import { invoke } from "@tauri-apps/api";
 import React, { useContext } from "react";
-import {invoke} from "@tauri-apps/api"
+
 import { FDButton } from "../lib/components/Button";
 import { Label } from "../lib/components/LabelValue";
 import { Row } from "../lib/components/Row";
@@ -19,10 +20,10 @@ export const DeveloperSettings: React.FC = () => {
           <TextInput onChange={(val) => serialApi?.writeToScreen(val)} />
         </Row>
         <Row>
-          <Label>Get current page:</Label>
+          <Label>Get has json:</Label>
           <FDButton
             onClick={() =>
-              serialApi?.getCurrentPage().then((a) =>
+              serialApi?.getHasJson().then((a) =>
                 appDispatch.openAlert({
                   text: a.toString(),
                   title: "Debug message",
@@ -44,7 +45,11 @@ export const DeveloperSettings: React.FC = () => {
         <Row>
           <Label>call get_current_window</Label>
           <FDButton
-            onClick={() => invoke<string>("get_current_window").then(value => appDispatch.openAlert({text: value, title: "debug"}))}
+            onClick={() =>
+              invoke<string>("get_current_window").then((value) =>
+                appDispatch.openAlert({ text: value, title: "debug" })
+              )
+            }
           >
             invoke
           </FDButton>

diff --git a/src/containers/Device.tsx b/src/containers/Device.tsx
@@ -5,6 +5,7 @@ import { Divider } from "../lib/components/Divider";
 import { Label, Value } from "../lib/components/LabelValue";
 import { Row } from "../lib/components/Row";
 import { FDSelect } from "../lib/components/SelectInput";
+import { FDSwitch } from "../lib/components/Switch";
 import { TitleBox } from "../lib/components/Title";
 import { AppStateContext } from "../states/appState";
 import {
@@ -96,6 +97,15 @@ export const Device: React.FC<{}> = () => {
             />
           </div>
         </Row>
+        <Row>
+          <Label hint="Disable this to massively reduce save times but you will not be able to 'load from freedeck'">
+            Save JSON:
+          </Label>
+          <FDSwitch
+            onChange={(val) => configDispatch.setSaveJson(val)}
+            value={configState.saveJson}
+          />
+        </Row>
       </TitleBox>
 
       <Divider />

diff --git a/src/containers/DisplayButton/ButtonSettings/Action.tsx b/src/containers/DisplayButton/ButtonSettings/Action.tsx
@@ -107,26 +107,25 @@ export const Action: React.FC<{
               setValues={(values) => setValues(values)}
             />
           )}
-          {buttonSettings.mode !== EAction.text &&
-            buttonSettings.mode !== EAction.changePage &&
-            primary && (
-              <LeavePage
-                primary={primary}
-                value={
-                  configState.pages.byId[pageId].displayButtons[buttonIndex]
-                    .button.leavePage
-                }
-                pages={configState.pages}
-                setValue={(value) =>
-                  configDispatch.setLeavePage({
-                    buttonIndex,
-                    pageId,
-                    targetPageId: value.pageId,
-                    enabled: value.enabled,
-                  })
-                }
-              />
-            )}
+          {buttonSettings.mode !== EAction.changePage && (
+            <LeavePage
+              primary={primary}
+              value={
+                configState.pages.byId[pageId].displayButtons[buttonIndex]
+                  .button[primary ? "primary" : "secondary"].leavePage
+              }
+              pages={configState.pages}
+              setValue={(value) =>
+                configDispatch.setLeavePage({
+                  buttonIndex,
+                  pageId,
+                  targetPageId: value.pageId,
+                  enabled: value.enabled,
+                  primary: primary,
+                })
+              }
+            />
+          )}
         </>
       </TitleBox>
     </div>

diff --git a/src/containers/DisplayButton/ButtonSettings/Hotkeys.tsx b/src/containers/DisplayButton/ButtonSettings/Hotkeys.tsx
@@ -7,6 +7,7 @@ import { FDButton } from "../../../lib/components/Button";
 import { Label } from "../../../lib/components/LabelValue";
 import { Row } from "../../../lib/components/Row";
 import { FDSelect } from "../../../lib/components/SelectInput";
+import { ROW_SIZE } from "../../../lib/configFile/consts";
 import { useTranslateKeyboardLayout } from "../../../lib/localisation/keyboard";
 
 const HotkeyKeys: React.FC<{
@@ -43,7 +44,7 @@ export const Hotkeys: React.FC<{
   setValues: (values: ButtonSetting["values"]) => void;
 }> = ({ setValues, values }) => {
   const setKeys = (newValues: number[]) =>
-    newValues.length < 7 &&
+    newValues.length <= ROW_SIZE / 2 - 3 &&
     setValues({
       ...values,
       [EAction.hotkeys]: newValues,
@@ -54,11 +55,6 @@ export const Hotkeys: React.FC<{
       (key) => keys[key]?.js === e.nativeEvent.code
     );
     if (!key) return;
-    if (
-      !!values[EAction.hotkeys].find((k) => k === keys[key]?.hid) &&
-      keys[key]!.hid >= 0xe0
-    )
-      return;
     //ignore backspace
     if (keys[key]!.hid === 42 && values[EAction.hotkeys].length > 0) {
       setKeys([

diff --git a/src/containers/DisplayButton/ButtonSettings/LeavePage.tsx b/src/containers/DisplayButton/ButtonSettings/LeavePage.tsx
@@ -1,22 +1,22 @@
 import React from "react";
 
-import { Button, Pages } from "../../../generated";
+import { ButtonSetting, Pages } from "../../../generated";
 import { Label } from "../../../lib/components/LabelValue";
 import { Row } from "../../../lib/components/Row";
 import { FDSelect } from "../../../lib/components/SelectInput";
 import { FDSwitch } from "../../../lib/components/Switch";
 import { getPageName } from "../../../lib/misc/util";
 
 export const LeavePage: React.FC<{
-  value: Button["leavePage"];
+  value: ButtonSetting["leavePage"];
   pages: Pages;
   primary: boolean;
-  setValue: (value: Button["leavePage"]) => void;
+  setValue: (value: ButtonSetting["leavePage"]) => void;
 }> = ({ value, pages, setValue, primary }) => {
   const startPage = pages.sorted[0];
   return (
     <>
-      {pages.sorted.length && primary ? (
+      {pages.sorted.length ? (
         <>
           <Row>
             <Label>Change Page after press</Label>

diff --git a/src/containers/DisplayButton/ButtonSettings/index.tsx b/src/containers/DisplayButton/ButtonSettings/index.tsx
@@ -22,15 +22,13 @@ export const ButtonSettingsContainer: React.FC<{
           />
         </div>
         <div className="relative flex flex-col">
-          {!button.leavePage.enabled && (
-            <Action
-              primary={false}
-              title="Long press"
-              pageId={pageId}
-              buttonIndex={displayIndex}
-              buttonSettings={button.secondary}
-            />
-          )}
+          <Action
+            primary={false}
+            title="Long press"
+            pageId={pageId}
+            buttonIndex={displayIndex}
+            buttonSettings={button.secondary}
+          />
         </div>
       </div>
       {(button.primary.mode === "hotkeys" ||

diff --git a/src/containers/Header.tsx b/src/containers/Header.tsx
@@ -17,7 +17,7 @@ import { createConfigBuffer } from "../lib/configFile/createBuffer";
 import { loadConfigFile } from "../lib/configFile/loadConfigFile";
 import { download } from "../lib/file/download";
 import { isMacOS } from "../lib/misc/util";
-import { AppStateContext } from "../states/appState";
+import { AppDispatchContext, AppStateContext } from "../states/appState";
 import {
   ConfigDispatchContext,
   ConfigStateContext,
@@ -26,6 +26,8 @@ import { LoginLogoutButtons } from "./LoginButton";
 
 export const Header: React.FC<{}> = () => {
   const configState = useContext(ConfigStateContext);
+  const { hasJson } = useContext(AppStateContext);
+  const { setHasJson, openAlert } = useContext(AppDispatchContext);
   const { pages } = configState;
   const { setState } = useContext(ConfigDispatchContext);
   const { serialApi, ctrlDown, availablePorts, connectedPortIndex } =
@@ -35,7 +37,7 @@ export const Header: React.FC<{}> = () => {
   const loadConfigRef = useRef<HTMLInputElement | null>(null);
   const saveConfigFile = () => {
     if (Object.keys(pages.byId).length === 0) return;
-    const completeBuffer = createConfigBuffer(configState);
+    const completeBuffer = createConfigBuffer(configState, true);
 
     completeBuffer && download(completeBuffer);
   };
@@ -85,12 +87,24 @@ export const Header: React.FC<{}> = () => {
                 <FDButton
                   prefix={<UploadIcon className={iconSize} />}
                   size={3}
+                  disabled={!hasJson}
+                  title={
+                    hasJson
+                      ? "Load config over serial"
+                      : "Cannot load config. FreeDeck stores no JSON. Change it in Settings -> Device"
+                  }
                   onClick={() =>
                     serialApi!
                       .readConfigFromSerial((rec, size) =>
                         setProgress(rec / size)
                       )
                       .then((data) => loadConfigFile(data, setState))
+                      .catch((e) =>
+                        openAlert({
+                          title: "Attention: Error",
+                          text: e.message,
+                        })
+                      )
                   }
                 >
                   Load from FreeDeck
@@ -99,10 +113,18 @@ export const Header: React.FC<{}> = () => {
                   prefix={<SaveIcon className={iconSize} />}
                   size={3}
                   onClick={async () =>
-                    serialApi!.writeConfigOverSerial(
-                      createConfigBuffer(configState),
-                      (rec, size) => setProgress(rec / size)
-                    )
+                    serialApi!
+                      .writeConfigOverSerial(
+                        createConfigBuffer(configState, false),
+                        (rec, size) => setProgress(rec / size)
+                      )
+                      .then(() => setHasJson(configState.saveJson))
+                      .catch((e) =>
+                        openAlert({
+                          title: "Attention: Error",
+                          text: e.message,
+                        })
+                      )
                   }
                 >
                   Save to FreeDeck

diff --git a/src/definitions/defaultPage.ts b/src/definitions/defaultPage.ts
@@ -7,7 +7,6 @@ import { EAction, EImageMode, ETextPosition } from "./modes";
 
 const createDefaultButton: () => Button = () => {
   const button: Button = {
-    leavePage: { enabled: false },
     primary: {
       mode: EAction.noop,
       values: {
@@ -20,6 +19,7 @@ const createDefaultButton: () => Button = () => {
         [EAction.special_keys]: 0,
         [EAction.text]: "",
       },
+      leavePage: { enabled: false },
     },
     secondary: {
       mode: EAction.noop,
@@ -30,6 +30,7 @@ const createDefaultButton: () => Button = () => {
         [EAction.special_keys]: 0,
         [EAction.text]: "",
       },
+      leavePage: { enabled: false },
     },
   };
   return button;

diff --git a/src/generated/button.ts b/src/generated/button.ts
@@ -4,12 +4,12 @@
  */
 
 export interface Button {
-  leavePage: LeavePage;
   primary: ButtonSetting;
   secondary: ButtonSetting;
 }
 
 export interface ButtonSetting {
+  leavePage: LeavePage;
   mode: 'changePage' | 'hotkeys' | 'noop' | 'settings' | 'special_keys' | 'text';
   values: ButtonValues;
 }

diff --git a/src/generated/config.ts b/src/generated/config.ts
@@ -34,6 +34,7 @@ export interface Config {
   oledSpeed: number;
   pages: Pages;
   preChargePeriod: number;
+  saveJson: boolean;
   screenSaverTimeout: number;
   width: number;
 }

diff --git a/src/lib/components/Button.tsx b/src/lib/components/Button.tsx
@@ -50,7 +50,7 @@ export const FDButton = ({
 
   return (
     <div
-      onClick={onClick}
+      onClick={disabled ? () => {} : onClick}
       title={title}
       className={`cursor-pointer inline-flex items-center text-lg font-normal tracking-wider rounded-md select-none min-w-0 ${sizeClasses} ${typeClasses} ${className}`}
     >

diff --git a/src/lib/configFile/consts.ts b/src/lib/configFile/consts.ts
@@ -0,0 +1 @@
+export const ROW_SIZE = 128;