make key template json file as import

Author: pyj-pd

Diff for: src-tauri/Cargo.toml

@@ -29,7 +29,8 @@ font-kit = "0.14.2"
 incremental = true # Compile your binary in smaller steps.
 
 [profile.release]
+codegen-units = 1 # Allows LLVM to perform better optimization.
 lto = true # Enables link-time-optimizations.
-opt-level = 3 # Prioritizes small binary size. Use `3` if you prefer speed.
+opt-level = "s" # Prioritizes small binary size. Use `3` if you prefer speed.
 panic = "abort" # Higher performance by disabling panic handlers.
 strip = true # Ensures debug symbols are removed.

Diff for: src/components/settings/sections/ColorSettings.vue

@@ -1,14 +1,14 @@
 <script setup lang="ts">
 import { storeToRefs } from "pinia"
 import ColorInput from "../input-components/ColorInput.vue"
-import type { KeyColorOption, KeyTemplate } from "@/types/key-templates"
+import type { KeyColorOption, KeyTemplateStyling } from "@/types/key-templates"
 import { defaultKeyStyling } from "@/constants/key-template"
 import { useKeyTemplateStore } from "@/stores/useKeyTemplateStore"
 
 const { keyTemplate } = storeToRefs(useKeyTemplateStore())
 
 const colorCategoryName: {
-  [key in keyof KeyTemplate["styling"]["keyColor"]]: string
+  [key in keyof KeyTemplateStyling["keyColor"]]: string
 } = { idle: "일반 상태", pressed: "눌린 상태" }
 
 const colorTypeName: {

Diff for: src/constants/key-template.ts

@@ -1,50 +1,8 @@
-import type { KeyTemplate } from "@/types/key-templates"
+import { KeyTemplate, KeyTemplateStyling } from "@/types/key-templates"
+import defaultKeyTemplateJson from "@/bundle-resources/resources/key-templates/speed.json"
 
-export const defaultKeyStyling = {
-  keySize: 10,
-  keyGap: 1,
-  keyBorderRadius: 0.5,
-  keyBorderWidth: 0,
-  keyColor: {
-    idle: {
-      backgroundColor: "#ffffff",
-      textColor: "#0c1236",
-      borderColor: "#0c1236",
-    },
-    pressed: {
-      backgroundColor: "#00d7f8",
-      textColor: "#0c1236",
-      borderColor: "#0c1236",
-    },
-  },
+export const defaultKeyStyling = KeyTemplateStyling.parse(
+  defaultKeyTemplateJson.styling,
+)
 
-  fontSize: 1.9,
-  fontWeight: 570,
-  fontFamily: "Pretendard",
-} as const satisfies KeyTemplate["styling"]
-
-export const defaultKeyTemplate = {
-  templateName: "스피드전",
-
-  keybinds: {
-    a: {
-      description: "드리프트",
-      keyCode: "ShiftLeft",
-      customLabel: "Shift",
-    },
-    b: {
-      description: "부스터",
-      keyCode: "ControlLeft",
-      customLabel: "Ctrl",
-    },
-    c: {
-      description: "앞 방향키",
-      keyCode: "UpArrow",
-    },
-    d: { description: "왼쪽 방향키", keyCode: "LeftArrow" },
-    e: { description: "뒤 방향키", keyCode: "DownArrow" },
-    f: { description: "오른쪽 방향키", keyCode: "RightArrow" },
-  },
-  gridAreas: ["a a . c .", "b b d e f"],
-  styling: defaultKeyStyling,
-} as const satisfies KeyTemplate
+export const defaultKeyTemplate = KeyTemplate.parse(defaultKeyTemplateJson)

Diff for: src/types/key-templates.ts

@@ -18,6 +18,25 @@ export const keyColorOption = z.object({
 
 export type KeyColorOption = z.infer<typeof keyColorOption>
 
+export const KeyTemplateStyling = z.object({
+  keySize: z.number(),
+  keyGap: z.number(),
+  keyBorderRadius: z.number(),
+  keyBorderWidth: z.number(),
+
+  keyColor: z.object({
+    idle: keyColorOption,
+    pressed: keyColorOption,
+  }),
+
+  fontSize: z.number(),
+  /** Absolute number */
+  fontWeight: z.number(),
+  fontFamily: z.string(),
+})
+
+export type KeyTemplateStyling = z.infer<typeof KeyTemplateStyling>
+
 export const KeyTemplate = z.object({
   templateName: z.string(),
 
@@ -27,22 +46,7 @@ export const KeyTemplate = z.object({
   gridAreas: z.array(z.string()),
 
   /** Relative sizes */
-  styling: z.object({
-    keySize: z.number(),
-    keyGap: z.number(),
-    keyBorderRadius: z.number(),
-    keyBorderWidth: z.number(),
-
-    keyColor: z.object({
-      idle: keyColorOption,
-      pressed: keyColorOption,
-    }),
-
-    fontSize: z.number(),
-    /** Absolute number */
-    fontWeight: z.number(),
-    fontFamily: z.string(),
-  }),
+  styling: KeyTemplateStyling,
 })
 
 export type KeyTemplate = z.infer<typeof KeyTemplate>

Diff for: src/utils/keyviewer.ts

@@ -1,4 +1,4 @@
-import type { KeybindData, KeyTemplate } from "@/types/key-templates"
+import type { KeybindData, KeyTemplateStyling } from "@/types/key-templates"
 import { keybindTypeRegex, type KeybindType } from "@/types/keyviewer/keybind"
 import type { AbsoluteSizeData } from "@/types/keyviewer/size"
 import type { PxUnit } from "@/types/unit"
@@ -47,7 +47,7 @@ export const calculateKeyViewerAbsoluteSizes = ({
 
   columnCount: number
   rowCount: number
-} & KeyTemplate["styling"]): AbsoluteSizeData => {
+} & KeyTemplateStyling): AbsoluteSizeData => {
   // Set window size
   const relativeWidth = keySize * columnCount + keyGap * (columnCount - 1)
   const relativeHeight = keySize * rowCount + keyGap * (rowCount - 1)