From a39f57bac157fabb9681e2eb9b8de4f213cb8b04 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Thea=20Sch=C3=B6bl?= <dev@theaninova.de>
Date: Thu, 7 Sep 2023 17:39:33 +0200
Subject: [PATCH] feat: apply setting changes and add commit feature

---
 .github/workflows/build.yml  |  7 ++--
 README.md                    |  8 +++++
 package.json                 |  2 +-
 src-tauri/Cargo.lock         |  2 +-
 src-tauri/Cargo.toml         |  2 +-
 src-tauri/tauri.conf.json    |  2 +-
 src/i18n/de/index.ts         |  1 +
 src/i18n/en/index.ts         |  1 +
 src/lib/serial/connection.ts |  2 +-
 src/lib/setting.ts           | 29 +++++++++++++++--
 src/routes/Navigation.svelte | 63 ++++++++++++++++++++++++++++--------
 11 files changed, 93 insertions(+), 26 deletions(-)

diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
index a23ec3a7..b6736225 100644
--- a/.github/workflows/build.yml
+++ b/.github/workflows/build.yml
@@ -2,9 +2,9 @@ name: Build
 
 on:
   push:
-    branches: ["master"]
-  pull_request:
-    branches: ["master"]
+    tags:
+      - 'v*'
+  workflow_dispatch:
 
 jobs:
   build:
@@ -41,7 +41,6 @@ jobs:
           path: build
   deploy:
     name: 🚀 Deploy
-    if: github.event_name == 'push' && contains(github.event.head_commit.message, '[deploy]')
     runs-on: ubuntu-latest
     needs: build
     environment:
diff --git a/README.md b/README.md
index ce1b29aa..c24effb3 100644
--- a/README.md
+++ b/README.md
@@ -57,3 +57,11 @@ To double-check, make sure your private key starts with
 
 After that, add the `SSH_SERVER`, `SSH_PORT`, `SSH_PRIVATE_KEY` and `SSH_USER`
 environment secrets to your environment in GitHub.
+
+## Releases
+
+Change the version in
+
+- [package.json](package.json)
+- [tauri.conf.json](src-tauri/tauri.conf.json)
+- [Cargo.toml](src-tauri/Cargo.toml)
diff --git a/package.json b/package.json
index d09ea72b..2a48e111 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "amacc1ng",
-  "version": "0.4.2",
+  "version": "0.5.0",
   "license": "AGPL-3.0-or-later",
   "private": true,
   "scripts": {
diff --git a/src-tauri/Cargo.lock b/src-tauri/Cargo.lock
index 05a002f3..1cd3d88a 100644
--- a/src-tauri/Cargo.lock
+++ b/src-tauri/Cargo.lock
@@ -85,7 +85,7 @@ checksum = "3b13c32d80ecc7ab747b80c3784bce54ee8a7a0cc4fbda9bf4cda2cf6fe90854"
 
 [[package]]
 name = "app"
-version = "0.4.1"
+version = "0.4.2"
 dependencies = [
  "serde",
  "serde_json",
diff --git a/src-tauri/Cargo.toml b/src-tauri/Cargo.toml
index aa02d635..884c8834 100644
--- a/src-tauri/Cargo.toml
+++ b/src-tauri/Cargo.toml
@@ -1,6 +1,6 @@
 [package]
 name = "app"
-version = "0.4.2"
+version = "0.5.0"
 description = "A Tauri App"
 authors = ["Thea Schöbl <dev@theaninova.de>"]
 license = "AGPL-3"
diff --git a/src-tauri/tauri.conf.json b/src-tauri/tauri.conf.json
index 102afc05..94ebcecb 100644
--- a/src-tauri/tauri.conf.json
+++ b/src-tauri/tauri.conf.json
@@ -8,7 +8,7 @@
   },
   "package": {
     "productName": "amacc1ng",
-    "version": "0.4.2"
+    "version": "0.5.0"
   },
   "tauri": {
     "allowlist": {
diff --git a/src/i18n/de/index.ts b/src/i18n/de/index.ts
index ce7db8e5..618251e9 100644
--- a/src/i18n/de/index.ts
+++ b/src/i18n/de/index.ts
@@ -25,6 +25,7 @@ const de = {
     CONNECT: "Verbinden",
     DISCONNECT: "Entfernen",
     TERMINAL: "Konsole",
+    APPLY_SETTINGS: "Änderungen auf das Gerät brennen",
     bootMenu: {
       TITLE: "Bootmenü",
       REBOOT: "Neustarten",
diff --git a/src/i18n/en/index.ts b/src/i18n/en/index.ts
index c2c16889..2a57147a 100644
--- a/src/i18n/en/index.ts
+++ b/src/i18n/en/index.ts
@@ -24,6 +24,7 @@ const en = {
     CONNECT: "Connect",
     DISCONNECT: "Disconnect",
     TERMINAL: "Terminal",
+    APPLY_SETTINGS: "Flash changes to device",
     bootMenu: {
       TITLE: "Boot Menu",
       REBOOT: "Reboot",
diff --git a/src/lib/serial/connection.ts b/src/lib/serial/connection.ts
index 87bb33b3..b657c1ba 100644
--- a/src/lib/serial/connection.ts
+++ b/src/lib/serial/connection.ts
@@ -25,7 +25,7 @@ export const layout = persistentWritable<CharaLayout>(
 
 export const settings = writable({})
 
-export const unsavedChanges = writable(0)
+export const unsavedChanges = writable(new Map<number, number>())
 
 export const highlightActions: Writable<number[]> = writable([])
 
diff --git a/src/lib/setting.ts b/src/lib/setting.ts
index 42b9eb2a..b3288bea 100644
--- a/src/lib/setting.ts
+++ b/src/lib/setting.ts
@@ -1,15 +1,16 @@
 import type {Action} from "svelte/action"
-import {serialPort} from "$lib/serial/connection"
+import {serialPort, unsavedChanges} from "$lib/serial/connection"
+import {get} from "svelte/store"
 
 export const setting: Action<HTMLInputElement, {id: number; inverse?: number; scale?: number}> = function (
   node: HTMLInputElement,
   {id, inverse, scale},
 ) {
   node.setAttribute("disabled", "")
+  const type = node.getAttribute("type") as "number" | "checkbox"
 
   const unsubscribe = serialPort.subscribe(async port => {
     if (port) {
-      const type = node.getAttribute("type") as "number" | "checkbox"
       if (type === "number") {
         const value = Number(await port.getSetting(id).then(it => it.toString()))
         node.value = (
@@ -23,7 +24,29 @@ export const setting: Action<HTMLInputElement, {id: number; inverse?: number; sc
       node.setAttribute("disabled", "")
     }
   })
-  function listener() {}
+
+  async function listener(event: Event) {
+    const currentValue = await get(serialPort)!.getSetting(id)
+    let value = 0
+    if (type === "number") {
+      value = Number((event as InputEvent).data)
+      if (Number.isNaN(value)) return
+      value = inverse !== undefined ? inverse / value : scale !== undefined ? value / scale : value
+    } else {
+      value = node.checked ? 1 : 0
+    }
+    await get(serialPort)!.setSetting(id, value)
+
+    const originalValue = get(unsavedChanges).get(id)
+    unsavedChanges.update(it => {
+      if (originalValue === value) {
+        it.delete(id)
+      } else if (!it.has(id)) {
+        it.set(id, currentValue)
+      }
+      return it
+    })
+  }
   node.addEventListener("input", listener)
 
   return {
diff --git a/src/routes/Navigation.svelte b/src/routes/Navigation.svelte
index 39a9b035..3a3d0a86 100644
--- a/src/routes/Navigation.svelte
+++ b/src/routes/Navigation.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-  import {serialPort, syncStatus} from "$lib/serial/connection"
+  import {serialPort, syncStatus, unsavedChanges} from "$lib/serial/connection"
   import {page} from "$app/stores"
   import {slide, fly} from "svelte/transition"
   import {canShare, triggerShare} from "$lib/share"
@@ -21,6 +21,26 @@
     {slug: "cm", title: "CM - Concepts Mastered", icon: "cognition"},
   ]
 
+  let placeboProgress = false
+
+  async function flashChanges() {
+    $syncStatus = "uploading"
+    // Yes, this is a completely arbitrary and unnecessary delay.
+    // The only purpose of it is to create a sense of weight,
+    // aka make it more "energy intensive" to click.
+    // The only conceivable way users could reach the commit limit in this case
+    // would be if they click it every time they change a setting.
+    // Because of that, we don't need to show a fearmongering message such as
+    // "Your device will break after you click this 10,000 times!"
+    await new Promise(resolve => setTimeout(resolve, 6000))
+    $serialPort.commit()
+    unsavedChanges.update(it => {
+      it.clear()
+      return it
+    })
+    $syncStatus = "done"
+  }
+
   $: if (browser && !canAutoConnect()) {
     connectButton?.click()
   }
@@ -32,12 +52,12 @@
   <a href="/" class="title">{$LL.TITLE()}</a>
 
   <div class="steps">
-    {#each training as { slug, title, icon }}
+    {#each training as {slug, title, icon}}
       <a
-        href="/train/{slug}/"
-        {title}
-        class="icon train {slug}"
-        class:active={$page.url.pathname === `/train/${slug}/`}>{icon}</a
+              href="/train/{slug}/"
+              {title}
+              class="icon train {slug}"
+              class:active={$page.url.pathname === `/train/${slug}/`}>{icon}</a
       >
     {/each}
   </div>
@@ -45,13 +65,19 @@
   <div class="actions">
     {#if $canShare}
       <button transition:fly={{x: -8}} class="icon" on:click={triggerShare}>share</button>
-      <div transition:slide class="separator" />
+      <div transition:slide class="separator"/>
     {/if}
     {#if import.meta.env.TAURI_FAMILY === undefined}
-      {#await import("$lib/components/PwaStatus.svelte") then { default: PwaStatus }}
-        <PwaStatus />
+      {#await import("$lib/components/PwaStatus.svelte") then {default: PwaStatus}}
+        <PwaStatus/>
       {/await}
     {/if}
+    {#if $unsavedChanges.size > 0}
+      <button disabled={$syncStatus === 'uploading'} on:click={flashChanges} transition:fly={{x: -8}}
+              title={$LL.deviceManager.APPLY_SETTINGS()} class="icon">save
+      </button>
+      <div transition:slide class="separator"/>
+    {/if}
     {#if $serialPort}
       <button title={$LL.backup.TITLE()} use:popup={BackupPopup} class="icon {$syncStatus}">
         {#if $syncStatus === "downloading"}
@@ -66,11 +92,11 @@
       </button>
     {/if}
     <button
-      bind:this={connectButton}
-      title="Devices"
-      use:popup={ConnectionPopup}
-      class="icon connect"
-      class:error={$serialPort === undefined}
+            bind:this={connectButton}
+            title="Devices"
+            use:popup={ConnectionPopup}
+            class="icon connect"
+            class:error={$serialPort === undefined}
     >
       cable
     </button>
@@ -119,6 +145,10 @@
     animation: sync 1s linear infinite;
   }
 
+  .uploading::after {
+    transform-origin: bottom;
+  }
+
   .downloading.active::after,
   .uploading.active::after {
     background: var(--md-sys-color-primary);
@@ -230,4 +260,9 @@
     color: var(--md-sys-color-on-secondary-container);
     background: var(--md-sys-color-secondary-container);
   }
+  
+  :disabled {
+    pointer-events: none;
+    opacity: 0.5;
+  }
 </style>