feat: ccos emulator

src/lib/ccos/attachment.ts

@@ -1,26 +1,35 @@
 import type { Attachment } from "svelte/attachments";
-import { browser } from "$app/environment";
-import { persistentWritable } from "$lib/storage";
+import type { CharaDevice } from "$lib/serial/device";
+import type { CCOS, CCOSKeyboardEvent } from "./ccos";
+import type { ReplayRecorder } from "$lib/charrecorder/core/recorder";
 
-export const emulatedCCOS = persistentWritable("emulatedCCOS", false);
-
-export function ccosKeyInterceptor() {
-  return ((element: Window) => {
-    const ccos = browser
-      ? import("./ccos").then((module) => module.fetchCCOS(".test"))
-      : Promise.resolve(undefined);
+export function ccosKeyInterceptor(
+  port: CharaDevice | undefined,
+  recorder: ReplayRecorder,
+) {
+  return ((element: HTMLElement) => {
+    const ccos =
+      port?.port && "handleKeyEvent" in port?.port
+        ? (port.port as CCOS)
+        : undefined;
+    console.log("Attaching CCOS key interceptor", ccos);
 
     function onEvent(event: KeyboardEvent) {
-      ccos.then((it) => it?.handleKeyEvent(event));
+      ccos?.handleKeyEvent(event);
+      if (!event.defaultPrevented) {
+        recorder.next(event);
+      }
     }
 
-    element.addEventListener("keydown", onEvent, true);
-    element.addEventListener("keyup", onEvent, true);
+    if (ccos) {
+      element.addEventListener("keydown", onEvent, true);
+      element.addEventListener("keyup", onEvent, true);
+      element.add;
+    }
 
     return () => {
-      ccos.then((it) => it?.destroy());
       element.removeEventListener("keydown", onEvent, true);
       element.removeEventListener("keyup", onEvent, true);
     };
-  }) satisfies Attachment<Window>;
+  }) satisfies Attachment<HTMLElement>;
 }

src/lib/ccos/ccos.ts

@@ -1,7 +1,6 @@
 import { getMeta } from "$lib/meta/meta-storage";
 import type { SerialPortLike } from "$lib/serial/device";
 import type {
-  CCOSInEvent,
   CCOSInitEvent,
   CCOSKeyPressEvent,
   CCOSKeyReleaseEvent,
@@ -11,7 +10,7 @@ import { KEYCODE_TO_SCANCODE, SCANCODE_TO_KEYCODE } from "./ccos-interop";
 
 const device = "zero_wasm";
 
-class CCOSKeyboardEvent extends KeyboardEvent {
+export class CCOSKeyboardEvent extends KeyboardEvent {
   constructor(...params: ConstructorParameters<typeof KeyboardEvent>) {
     super(...params);
   }
@@ -26,7 +25,46 @@ const MASK_GUI = 0b1000_1000;
 export class CCOS implements SerialPortLike {
   private readonly currKeys = new Set<number>();
 
-  private readonly layout = new Map<string, string>();
+  private readonly layout = new Map<string, string>([
+    ...Array.from(
+      { length: 26 },
+      (_, i) =>
+        [
+          JSON.stringify([`Key${String.fromCharCode(65 + i)}`, "Shift"]),
+          String.fromCharCode(65 + i),
+        ] as const,
+    ),
+    ...Array.from(
+      { length: 10 },
+      (_, i) => [JSON.stringify([`Key${i}`]), i.toString()] as const,
+    ),
+
+    [JSON.stringify(["Space"]), " "],
+    [JSON.stringify(["Backquote"]), "`"],
+    [JSON.stringify(["Minus"]), "-"],
+    [JSON.stringify(["Comma"]), ","],
+    [JSON.stringify(["Period"]), "."],
+    [JSON.stringify(["Semicolon"]), ";"],
+    [JSON.stringify(["Equal"]), "="],
+
+    [JSON.stringify(["Backquote", "Shift"]), "~"],
+    [JSON.stringify(["Minus", "Shift"]), "_"],
+    [JSON.stringify(["Comma", "Shift"]), "<"],
+    [JSON.stringify(["Period", "Shift"]), ">"],
+    [JSON.stringify(["Semicolon", "Shift"]), ":"],
+    [JSON.stringify(["Equal", "Shift"]), "+"],
+
+    [JSON.stringify(["Digit0", "Shift"]), ")"],
+    [JSON.stringify(["Digit1", "Shift"]), "!"],
+    [JSON.stringify(["Digit2", "Shift"]), "@"],
+    [JSON.stringify(["Digit3", "Shift"]), "#"],
+    [JSON.stringify(["Digit4", "Shift"]), "$"],
+    [JSON.stringify(["Digit5", "Shift"]), "%"],
+    [JSON.stringify(["Digit6", "Shift"]), "^"],
+    [JSON.stringify(["Digit7", "Shift"]), "&"],
+    [JSON.stringify(["Digit8", "Shift"]), "*"],
+    [JSON.stringify(["Digit9", "Shift"]), "("],
+  ]);
 
   private readonly worker = new Worker("/ccos-worker.js", { type: "module" });
 
@@ -126,7 +164,6 @@ export class CCOS implements SerialPortLike {
           this.controller?.enqueue(event.data);
           return;
         }
-        console.log("CCOS worker message", event.data);
         switch (event.data.type) {
           case "ready": {
             this.resolveReady();
@@ -220,7 +257,7 @@ export class CCOS implements SerialPortLike {
 }
 
 export async function fetchCCOS(
-  version = ".2.2.0-beta.12+266bdda",
+  version = "3.0.0-rc.0",
   fetch: typeof window.fetch = window.fetch,
 ): Promise<CCOS | undefined> {
   const meta = await getMeta(device, version, fetch);

src/lib/serial/device.ts

@@ -147,7 +147,7 @@ export class CharaDevice {
   version!: string;
   company!: "CHARACHORDER" | "FORGE";
   device!: "ONE" | "TWO" | "LITE" | "X" | "M4G" | "ENGINE" | "ZERO";
-  chipset!: "M0" | "S2" | "S3";
+  chipset!: "M0" | "S2" | "S3" | "WASM";
   keyCount!: 90 | 67 | 256;
   layerCount = 3;
   profileCount = 1;
@@ -157,7 +157,7 @@ export class CharaDevice {
   }
 
   constructor(
-    private readonly port: SerialPortLike,
+    readonly port: SerialPortLike,
     public baudRate = 115200,
   ) {}