2.1.0

.github/workflows/build.yml

@@ -41,7 +41,7 @@ jobs:
           echo "${{ secrets.DEPLOY_KNOWN_HOSTS }}" > ~/.ssh/known_hosts
 
       - name: Publish Stable
-        if: ${{ github.ref == 'refs/heads/v*' }}
+        if: ${{ github.ref == 'refs/tags/v*' }}
         run: rsync -rav --mkpath --delete build/ deploy@charachorder.io:/home/deploy/www/
 
       - name: Publish Branch

package.json

@@ -1,6 +1,6 @@
 {
   "name": "charachorder-device-manager",
-  "version": "2.0.0",
+  "version": "2.1.0",
   "license": "AGPL-3.0-or-later",
   "private": true,
   "engines": {

src-tauri/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "app"
-version = "2.0.0"
+version = "2.1.0"
 description = "A Tauri App"
 authors = ["Thea Schöbl <dev@theaninova.de>"]
 license = "AGPL-3"

src-tauri/tauri.conf.json

@@ -6,7 +6,7 @@
     "devPath": "http://localhost:5173",
     "distDir": "../build"
   },
-  "package": { "productName": "amacc1ng", "version": "2.0.0" },
+  "package": { "productName": "amacc1ng", "version": "2.1.0" },
   "tauri": {
     "allowlist": { "all": false },
     "bundle": {

src/lib/assets/layouts/m4g.yml

@@ -3,35 +3,22 @@ col:
   # Ring / Middle
   - offset: [2, 0]
     row:
-      - switch: { d: 25, e: 26, n: 27, w: 28, s: 29 }
-      - switch: { d: 20, e: 21, n: 22, w: 23, s: 24 }
-      - offset: [4, 0]
-        switch: { d: 65, w: 66, n: 67, e: 68, s: 69 }
-      - switch: { d: 70, w: 71, n: 72, e: 73, s: 74 }
+      - switch: { e: 26, n: 27, w: 28, s: 29 }
+      - switch: { e: 21, n: 22, w: 23, s: 24 }
   - offset: [2, 0]
     row:
-      - switch: { d: 40, e: 41, n: 42, w: 43, s: 44 }
-      - switch: { d: 35, e: 36, n: 37, w: 38, s: 39 }
-      - offset: [4, 0]
-        switch: { d: 80, w: 81, n: 82, e: 83, s: 84 }
-      - switch: { d: 85, w: 86, n: 87, e: 88, s: 89 }
+      - switch: { e: 41, n: 42, w: 43, s: 44 }
+      - switch: { e: 36, n: 37, w: 38, s: 39 }
   # Pinkie / Index
   - offset: [0, -3]
     row:
-      - switch: { d: 30, e: 31, n: 32, w: 33, s: 34 }
+      - switch: { e: 31, n: 32, w: 33, s: 34 }
       - offset: [4, 0]
-        switch: { d: 15, e: 16, n: 17, w: 18, s: 19 }
-      - switch: { d: 60, w: 61, n: 62, e: 63, s: 64 }
-      - offset: [4, 0]
-        switch: { d: 75, w: 76, n: 77, e: 78, s: 79 }
+        switch: { e: 16, n: 17, w: 18, s: 19 }
   # Thumbs
   - row:
       - offset: [5.5, 0.5]
-        switch: { d: 10, e: 11, n: 12, w: 13, s: 14 }
-      - offset: [1, 0.5]
-        switch: { d: 55, w: 56, n: 57, e: 58, s: 59 }
+        switch: { e: 11, n: 12, w: 13, s: 14 }
   - row:
       - offset: [4.5, -0.25]
-        switch: { d: 5, e: 6, n: 7, w: 8, s: 9 }
-      - offset: [3, -0.25]
-        switch: { d: 50, w: 51, n: 52, e: 53, s: 54 }
+        switch: { e: 6, n: 7, w: 8, s: 9 }

src/lib/assets/layouts/m4gr.yml

@@ -0,0 +1,24 @@
+name: M4GR
+col:
+  # Ring / Middle
+  - offset: [2, 0]
+    row:
+      - switch: { e: 23, n: 22, w: 21, s: 24 }
+      - switch: { e: 28, n: 27, w: 26, s: 29 }
+  - offset: [2, 0]
+    row:
+      - switch: { e: 38, n: 37, w: 36, s: 39 }
+      - switch: { e: 43, n: 42, w: 41, s: 44 }
+  # Pinkie / Index
+  - offset: [0, -3]
+    row:
+      - switch: { e: 18, n: 17, w: 16, s: 19 }
+      - offset: [4, 0]
+        switch: { e: 33, n: 32, w: 31, s: 34 }
+  # Thumbs
+  - row:
+      - offset: [0.5, 0.5]
+        switch: { e: 13, n: 12, w: 11, s: 14 }
+  - row:
+      - offset: [1.5, -0.25]
+        switch: { e: 8, n: 7, w: 6, s: 9 }

src/lib/components/layout/Layout.svelte

@@ -37,6 +37,10 @@
       import("$lib/assets/layouts/m4g.yml").then(
         (it) => it.default as VisualLayout,
       ),
+    M4GR: () =>
+      import("$lib/assets/layouts/m4gr.yml").then(
+        (it) => it.default as VisualLayout,
+      ),
   };
 </script>
 
@@ -70,6 +74,7 @@
 
     width: 100%;
     height: 100%;
+    max-height: 20cm;
   }
 
   fieldset {

src/lib/serial/device.ts

@@ -12,7 +12,7 @@ import { browser } from "$app/environment";
 
 const PORT_FILTERS: Map<string, SerialPortFilter> = new Map([
   ["ONE M0", { usbProductId: 32783, usbVendorId: 9114 }],
-  ["TWO S3", { usbProductId: 0x8252, usbVendorId: 0x303a }], // TODO: remove this after everyone has migrated
+  ["TWO S3 (pre-production)", { usbProductId: 0x8252, usbVendorId: 0x303a }], // TODO: remove this after everyone has migrated
   ["TWO S3", { usbProductId: 0x8253, usbVendorId: 0x303a }],
   ["LITE S2", { usbProductId: 33070, usbVendorId: 12346 }],
   ["LITE M0", { usbProductId: 32796, usbVendorId: 9114 }],
@@ -25,7 +25,8 @@ const KEY_COUNTS = {
   TWO: 90,
   LITE: 67,
   X: 256,
-  M4G: 90,
+  M4G: 64,
+  M4GR: 64,
 } as const;
 
 if (
@@ -513,11 +514,11 @@ export class CharaDevice {
 
       const writer2 = this.port.writable!.getWriter();
       try {
-        await writer2.write(new TextEncoder().encode(`RST REBOOT\r\n`));
+        await writer2.write(new TextEncoder().encode(`RST RESTART\r\n`));
         serialLog.update((it) => {
           it.push({
             type: "input",
-            value: "RST REBOOT",
+            value: "RST RESTART",
           });
           return it;
         });

src/routes/(app)/Footer.svelte

@@ -82,7 +82,7 @@
     </li>
     <li>
       <a
-        href="/firmware/{currentDevice ? `${currentDevice}/` : ''}"
+        href="/ccos/{currentDevice ? `${currentDevice}/` : ''}"
         use:action={{ title: "Updates" }}
       >
         CCOS {$serialPort?.version ?? "Updates"}

src/routes/(app)/Sidebar.svelte

@@ -27,9 +27,9 @@
         external: true,
       },
       { href: "/editor", icon: "edit_document", title: "Editor", wip: true },
+      { href: "https://chat.dev.charachorder.io", icon: "chat", title: "Chat", wip: true },
     ],
     /*[
-      { href: "/chat", icon: "chat", title: "Chat", wip: true },
       { href: "/plugin", icon: "code", title: "Plugin", wip: true },
     ],*/
   ] satisfies {

src/routes/(app)/ccos/+layout.svelte

@@ -2,7 +2,7 @@
   let { children } = $props();
 </script>
 
-<h1><a href="/firmware">Firmware Updates</a></h1>
+<h1><a href="/ccos">Firmware Updates</a></h1>
 
 {@render children()}
 

src/routes/(app)/ccos/[device]/[version]/+page.svelte

@@ -104,14 +104,16 @@
   }
 </script>
 
-<div>
+<div class="container">
   <h2>
-    Update <em
-      class="device"
+    <a class="inline-link" href="/ccos">CCOS</a> /
+    <a
+      href="/ccos/{data.device}"
+      class="device inline-link"
       class:correct-device={isCorrectDevice === true}
-      class:incorrect-device={isCorrectDevice === false}>{data.device}</em
+      class:incorrect-device={isCorrectDevice === false}>{data.device}</a
     >
-    to <em class="version">{data.version}</em>
+    / <em class="version">{data.version}</em>
   </h2>
 
   {#if data.ota && !data.device.endsWith("m0")}
@@ -127,8 +129,14 @@
       >
       {#if $serialPort && isCorrectDevice}
         <div transition:slide>
-          Your device is ready and compatible. Click the button to perform the
-          update.
+          Your
+          <b
+            >{$serialPort.company}
+            {$serialPort.device}
+            {$serialPort.chipset}</b
+          >
+          will be updated from <b class="version">{$serialPort.version}</b> to
+          <b class="version">{data.version}</b>
         </div>
       {:else if $serialPort && isCorrectDevice === false}
         <div class="error" transition:slide>
@@ -147,8 +155,6 @@
       {/if}
     </section>
 
-    <hr />
-
     <h3>Manual Update</h3>
   {/if}
 
@@ -229,6 +235,10 @@
     transition: color 200ms ease;
   }
 
+  h3 {
+    margin-block-start: 4em;
+  }
+
   .primary {
     color: var(--md-sys-color-primary);
   }
@@ -237,6 +247,10 @@
     color: var(--md-sys-color-error);
   }
 
+  .container {
+    width: calc(min(100%, 16cm));
+  }
+
   @keyframes rotate {
     0% {
       transform: rotate(120deg);
@@ -375,6 +389,11 @@
     opacity: 0.6;
   }
 
+  .inline-link {
+    display: inline;
+    padding: 0;
+  }
+
   .correct-device {
     color: var(--md-sys-color-primary);
     opacity: 1;

src/routes/(app)/config/settings/confirm-challenge.ts

@@ -1,12 +1,13 @@
 import type { Action } from "svelte/action";
 import ConfirmChallenge from "./ConfirmChallenge.svelte";
 import tippy from "tippy.js";
+import { mount, unmount } from "svelte";
 
 export const confirmChallenge: Action<
   HTMLElement,
   { onConfirm: () => void; challenge: string }
 > = (node, { onConfirm, challenge }) => {
-  let component: ConfirmChallenge | undefined;
+  let component: {} | undefined;
   let target: HTMLElement | undefined;
   const edit = tippy(node, {
     interactive: true,
@@ -15,15 +16,22 @@ export const confirmChallenge: Action<
       target = instance.popper.querySelector(".tippy-content") as HTMLElement;
       target.classList.add("active");
       if (component === undefined) {
-        component = new ConfirmChallenge({ target, props: { challenge } });
-        component.$on("confirm", () => {
-          edit.hide();
-          onConfirm();
+        component = mount(ConfirmChallenge, {
+          target,
+          props: {
+            challenge,
+            onconfirm() {
+              edit.hide();
+              onConfirm();
+            },
+          },
         });
       }
     },
     onHidden() {
-      component?.$destroy();
+      if (component) {
+        unmount(component);
+      }
       target?.classList.remove("active");
       component = undefined;
     },

vite.config.ts

@@ -58,6 +58,7 @@ export default defineConfig({
                 "client/**/*.{js,css,ico,woff2,csv,png,webp,svg,webmanifest}",
                 "prerendered/**/*.html",
               ],
+              globIgnores: ["prerendered/pages/ccos/**/*"],
               ignoreURLParametersMatching: [/^import|redirectUrl|loginToken$/],
               maximumFileSizeToCacheInBytes: 10 * 1024 * 1024,
             },