feat: layout url import

feat: backup import (except chords)
feat: legacy layout import
feat: separate layout, chord & setting backup downloads

src/lib/backup/backup.ts

@@ -0,0 +1,145 @@
+import type {
+  CharaBackupFile,
+  CharaChordFile,
+  CharaSettingsFile,
+  CharaLayoutFile,
+  CharaFile,
+} from "$lib/share/chara-file.js"
+import {changes, ChangeType, chords, layout, settings} from "$lib/undo-redo.js"
+import type {Change} from "$lib/undo-redo.js"
+import {get} from "svelte/store"
+import {serialPort} from "../serial/connection"
+import {csvLayoutToJson, isCsvLayout} from "$lib/backup/compat/legacy-layout"
+
+export function downloadFile<T extends CharaFile<string>>(contents: T) {
+  const downloadUrl = URL.createObjectURL(new Blob([JSON.stringify(contents)], {type: "application/json"}))
+  const element = document.createElement("a")
+  element.setAttribute(
+    "download",
+    `${contents.type}-${get(serialPort)?.device}-${new Date().toISOString()}.json`,
+  )
+  element.href = downloadUrl
+  element.setAttribute("target", "_blank")
+  element.click()
+  URL.revokeObjectURL(downloadUrl)
+}
+
+export function downloadBackup() {
+  downloadFile<CharaBackupFile>({
+    charaVersion: 1,
+    type: "backup",
+    history: [[createChordBackup(), createLayoutBackup(), createSettingsBackup()]],
+  })
+}
+
+export function createLayoutBackup(): CharaLayoutFile {
+  return {
+    charaVersion: 1,
+    type: "layout",
+    device: get(serialPort)?.device,
+    layout: get(layout).map(it => it.map(it => it.action)) as [number[], number[], number[]],
+  }
+}
+
+export function createChordBackup(): CharaChordFile {
+  return {charaVersion: 1, type: "chords", chords: get(chords).map(it => [it.actions, it.phrase])}
+}
+
+export function createSettingsBackup(): CharaSettingsFile {
+  return {charaVersion: 1, type: "settings", settings: get(settings).map(it => it.value)}
+}
+
+export async function restoreBackup(event: Event) {
+  const input = (event.target as HTMLInputElement).files![0]
+  if (!input) return
+  const text = await input.text()
+  if (input.name.endsWith(".json")) {
+    restoreFromFile(JSON.parse(text))
+  } else if (isCsvLayout(text)) {
+    restoreFromFile(csvLayoutToJson(text))
+  }
+}
+
+export function restoreFromFile(
+  file: CharaBackupFile | CharaSettingsFile | CharaLayoutFile | CharaChordFile,
+) {
+  if (file.charaVersion !== 1) throw new Error("Incompatible backup")
+  switch (file.type) {
+    case "backup": {
+      const recent = file.history[0]
+      if (recent[1].device !== get(serialPort)?.device)
+        throw new Error("Backup is incompatible with this device")
+
+      changes.update(changes => {
+        changes.push(
+          ...getChangesFromChordFile(recent[0]),
+          ...getChangesFromLayoutFile(recent[1]),
+          ...getChangesFromSettingsFile(recent[2]),
+        )
+        return changes
+      })
+      break
+    }
+    case "chords": {
+      changes.update(changes => {
+        changes.push(...getChangesFromChordFile(file))
+        return changes
+      })
+      break
+    }
+    case "layout": {
+      changes.update(changes => {
+        changes.push(...getChangesFromLayoutFile(file))
+        return changes
+      })
+      break
+    }
+    case "settings": {
+      changes.update(changes => {
+        changes.push(...getChangesFromSettingsFile(file))
+        return changes
+      })
+      break
+    }
+    default: {
+      throw new Error(`Unknown backup type "${(file as CharaFile<string>).type}"`)
+    }
+  }
+}
+
+export function getChangesFromChordFile(file: CharaChordFile) {
+  const changes: Change[] = []
+  // TODO...
+  return changes
+}
+
+export function getChangesFromSettingsFile(file: CharaSettingsFile) {
+  const changes: Change[] = []
+  for (const [id, value] of file.settings.entries()) {
+    if (get(settings)[id].value !== value) {
+      changes.push({
+        type: ChangeType.Setting,
+        id,
+        setting: value,
+      })
+    }
+  }
+  return changes
+}
+
+export function getChangesFromLayoutFile(file: CharaLayoutFile) {
+  const changes: Change[] = []
+  for (const [layer, keys] of file.layout.entries()) {
+    for (const [id, action] of keys.entries()) {
+      if (get(layout)[layer][id].action !== action) {
+        changes.push({
+          type: ChangeType.Layout,
+          layer,
+          id,
+          action,
+        })
+      }
+    }
+  }
+  return changes
+}

src/lib/backup/compat/legacy-layout-converted.sample.json

@@ -0,0 +1,24 @@
+{
+  "charaVersion": 1,
+  "type": "layout",
+  "device": "one",
+  "layout": [
+    [
+      309, 304, 312, 303, 306, 290, 282, 301, 266, 285, 289, 270, 281, 272, 262, 288, 277, 298, 307, 264, 287,
+      268, 332, 311, 274, 286, 308, 329, 310, 280, 358, 512, 515, 513, 514, 313, 319, 318, 321, 320, 326, 315,
+      314, 317, 316, 312, 330, 331, 333, 334, 291, 261, 283, 536, 276, 292, 265, 275, 267, 263, 293, 260, 296,
+      544, 279, 294, 271, 299, 269, 273, 295, 284, 297, 302, 278, 357, 516, 519, 517, 518, 327, 336, 338, 335,
+      337, 328, 325, 322, 323, 324
+    ],
+    [
+      0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
+      0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
+      0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0
+    ],
+    [
+      0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
+      0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
+      0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0
+    ]
+  ]
+}

src/lib/backup/compat/legacy-layout.sample.csv

@@ -0,0 +1,270 @@
+A1,0,309
+A1,1,304
+A1,2,312
+A1,3,303
+A1,4,306
+A1,5,290
+A1,6,282
+A1,7,301
+A1,8,266
+A1,9,285
+A1,10,289
+A1,11,270
+A1,12,281
+A1,13,272
+A1,14,262
+A1,15,288
+A1,16,277
+A1,17,298
+A1,18,307
+A1,19,264
+A1,20,287
+A1,21,268
+A1,22,332
+A1,23,311
+A1,24,274
+A1,25,286
+A1,26,308
+A1,27,329
+A1,28,310
+A1,29,280
+A1,30,358
+A1,31,512
+A1,32,515
+A1,33,513
+A1,34,514
+A1,35,313
+A1,36,319
+A1,37,318
+A1,38,321
+A1,39,320
+A1,40,326
+A1,41,315
+A1,42,314
+A1,43,317
+A1,44,316
+A1,45,312
+A1,46,330
+A1,47,331
+A1,48,333
+A1,49,334
+A1,50,291
+A1,51,261
+A1,52,283
+A1,53,536
+A1,54,276
+A1,55,292
+A1,56,265
+A1,57,275
+A1,58,267
+A1,59,263
+A1,60,293
+A1,61,260
+A1,62,296
+A1,63,544
+A1,64,279
+A1,65,294
+A1,66,271
+A1,67,299
+A1,68,269
+A1,69,273
+A1,70,295
+A1,71,284
+A1,72,297
+A1,73,302
+A1,74,278
+A1,75,357
+A1,76,516
+A1,77,519
+A1,78,517
+A1,79,518
+A1,80,327
+A1,81,336
+A1,82,338
+A1,83,335
+A1,84,337
+A1,85,328
+A1,86,325
+A1,87,322
+A1,88,323
+A1,89,324
+A2,0,0
+A2,1,0
+A2,2,0
+A2,3,0
+A2,4,0
+A2,5,0
+A2,6,0
+A2,7,0
+A2,8,0
+A2,9,0
+A2,10,0
+A2,11,0
+A2,12,0
+A2,13,0
+A2,14,0
+A2,15,0
+A2,16,0
+A2,17,0
+A2,18,0
+A2,19,0
+A2,20,0
+A2,21,0
+A2,22,0
+A2,23,0
+A2,24,0
+A2,25,0
+A2,26,0
+A2,27,0
+A2,28,0
+A2,29,0
+A2,30,0
+A2,31,0
+A2,32,0
+A2,33,0
+A2,34,0
+A2,35,0
+A2,36,0
+A2,37,0
+A2,38,0
+A2,39,0
+A2,40,0
+A2,41,0
+A2,42,0
+A2,43,0
+A2,44,0
+A2,45,0
+A2,46,0
+A2,47,0
+A2,48,0
+A2,49,0
+A2,50,0
+A2,51,0
+A2,52,0
+A2,53,0
+A2,54,0
+A2,55,0
+A2,56,0
+A2,57,0
+A2,58,0
+A2,59,0
+A2,60,0
+A2,61,0
+A2,62,0
+A2,63,0
+A2,64,0
+A2,65,0
+A2,66,0
+A2,67,0
+A2,68,0
+A2,69,0
+A2,70,0
+A2,71,0
+A2,72,0
+A2,73,0
+A2,74,0
+A2,75,0
+A2,76,0
+A2,77,0
+A2,78,0
+A2,79,0
+A2,80,0
+A2,81,0
+A2,82,0
+A2,83,0
+A2,84,0
+A2,85,0
+A2,86,0
+A2,87,0
+A2,88,0
+A2,89,0
+A3,0,0
+A3,1,0
+A3,2,0
+A3,3,0
+A3,4,0
+A3,5,0
+A3,6,0
+A3,7,0
+A3,8,0
+A3,9,0
+A3,10,0
+A3,11,0
+A3,12,0
+A3,13,0
+A3,14,0
+A3,15,0
+A3,16,0
+A3,17,0
+A3,18,0
+A3,19,0
+A3,20,0
+A3,21,0
+A3,22,0
+A3,23,0
+A3,24,0
+A3,25,0
+A3,26,0
+A3,27,0
+A3,28,0
+A3,29,0
+A3,30,0
+A3,31,0
+A3,32,0
+A3,33,0
+A3,34,0
+A3,35,0
+A3,36,0
+A3,37,0
+A3,38,0
+A3,39,0
+A3,40,0
+A3,41,0
+A3,42,0
+A3,43,0
+A3,44,0
+A3,45,0
+A3,46,0
+A3,47,0
+A3,48,0
+A3,49,0
+A3,50,0
+A3,51,0
+A3,52,0
+A3,53,0
+A3,54,0
+A3,55,0
+A3,56,0
+A3,57,0
+A3,58,0
+A3,59,0
+A3,60,0
+A3,61,0
+A3,62,0
+A3,63,0
+A3,64,0
+A3,65,0
+A3,66,0
+A3,67,0
+A3,68,0
+A3,69,0
+A3,70,0
+A3,71,0
+A3,72,0
+A3,73,0
+A3,74,0
+A3,75,0
+A3,76,0
+A3,77,0
+A3,78,0
+A3,79,0
+A3,80,0
+A3,81,0
+A3,82,0
+A3,83,0
+A3,84,0
+A3,85,0
+A3,86,0
+A3,87,0
+A3,88,0
+A3,89,0

src/lib/backup/compat/legacy-layout.spec.ts

@@ -0,0 +1,18 @@
+import {describe, expect, it} from "vitest"
+import legacyLayout from "./legacy-layout.sample.csv?raw"
+import legacyLayoutConverted from "./legacy-layout-converted.sample.json"
+import {csvLayoutToJson, isCsvLayout} from "./legacy-layout"
+
+describe("legacy layout", () => {
+  it("should detect a legacy layout", () => {
+    expect(isCsvLayout(legacyLayout)).to.be.true
+  })
+
+  it("should not detect chord maps as layouts", () => {
+    expect(isCsvLayout("e + h + t,the")).to.be.false
+  })
+
+  it("should convert legacy layouts", () => {
+    expect(csvLayoutToJson(legacyLayout)).to.deep.equal(legacyLayoutConverted)
+  })
+})

src/lib/backup/compat/legacy-layout.ts

@@ -0,0 +1,25 @@
+import type {CharaLayoutFile} from "$lib/share/chara-file"
+
+/**
+ * Converts a legacy CSV-based layout to the modern JSON-based format
+ */
+export function csvLayoutToJson(csv: string, device: CharaLayoutFile["device"] = "one"): CharaLayoutFile {
+  const layout: CharaLayoutFile = {
+    charaVersion: 1,
+    type: "layout",
+    device,
+    layout: [[], [], []],
+  }
+
+  for (const layer of csv.split("\n")) {
+    const [layerId, key, action] = layer.substring(1).split(",").map(Number)
+
+    layout.layout[Number(layerId) - 1][Number(key)] = Number(action)
+  }
+
+  return layout
+}
+
+export function isCsvLayout(csv: string): boolean {
+  return /^(A[123],\d+,\d+\n?)+$/.test(csv)
+}