魔改易码网站重构

.github/workflows/deploy.yml

@@ -0,0 +1,50 @@
+name: Deploy to GitHub Pages
+
+on:
+  # Trigger the workflow every time you push to the `main` branch
+  # Using a different branch name? Replace `main` with your branch’s name
+  push:
+    branches: [ main ]
+  # Allows you to run this workflow manually from the Actions tab on GitHub.
+  workflow_dispatch:
+
+# Allow this job to clone the repo and create a page deployment
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+jobs:
+  build:
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout your repository using git
+        uses: actions/checkout@v3
+        with:
+          fetch-depth: 0
+      - name: Prepare PNPM
+        uses: pnpm/action-setup@v2
+        with:
+          version: 8
+
+      - name: Setup Node
+        uses: actions/setup-node@v3
+        with:
+          node-version: 20
+          cache: pnpm
+
+      - run: pnpm i && pnpm build2
+
+      - uses: actions/configure-pages@v2
+
+      - uses: actions/upload-pages-artifact@v2
+        with:
+          path: dist
+
+      - name: Deploy
+        id: deployment
+        uses: actions/deploy-pages@v2
+

.gitignore

@@ -0,0 +1,4 @@
+node_modules
+dist
+___*
+src/.vitepress/cache

README.md

@@ -0,0 +1,16 @@
+# 易码、逸码网站
+逸面是纯形的二码顶汉字输入方案，易码是纯形的42顶，它们的字根布局采用计算机择优程序生成。本仓库是一个静态网站，介绍yima与相关练习。采用[ vitepress ](https://vitepress.dev/zh/)框架。感谢[ 虎码官网](https://www.tiger-code.com/)和[ 声笔系列输入法 ](https://sbxlm.github.io/)。
+
+## 本地运行
+1. 克隆[ 本仓库 ](https://www.github.com/yb6b/yima)到本地。
+2. 执行 `pnpm i` 安装依赖。
+3. 执行 `pnpm dev` 预览网站。
+4. 执行 `pnpm build` 生成最终的网站。
+
+如果要把本网站部署到你的平台上，修改 `docs/.vitepress/config.mts` 里的 `base`。也要留意markdown文件的所有的 `/yima` 开头的地址。
+
+## 参与贡献
+您可加入逸码QQ群（790835977），也可以[ 提交issues](https://github.com/yb6b/yima/issues)。
+
+## 开源协议
+本网站遵守[ GPLv3 ](LICENSE)协议。

components/ime/BaseGracefulCode.vue

@@ -0,0 +1,33 @@
+<script setup lang="ts">
+import FetchInput from "./FetchInput.vue"
+import { ref, computed } from "vue"
+import { ImeRule } from "./share";
+
+const props = defineProps<{
+    /** 每个字的拆分数据，可以包含编码 */
+    chaifenJson: string
+    /** 字根数据的路径。如果省略，则chaifen里必须要有编码信息 */
+    zigenJson?: string
+    /** 方案的ID，用于保存localstorage */
+    id?: string
+    defaultPop?: boolean
+}>()
+
+const usePop = ref(props.defaultPop || false)
+
+const rule: ImeRule = {
+    pop: 0,
+    len: 6,
+    cm1: ' ',
+    cm2: ';',
+    cm3: "'",
+    keys: 26,
+    autoCm: 2,
+}
+
+</script>
+
+<template>
+    <FetchInput :zigenJson :chaifenJson :id :rule>
+    </FetchInput>
+</template>

components/ime/BaseGrandCode.vue

@@ -0,0 +1,51 @@
+<script setup lang="ts">
+import FetchInput from "./FetchInput.vue"
+import { ref, computed } from "vue"
+import { ImeRule } from "./share";
+
+const props = defineProps<{
+    /** 每个字的拆分数据，可以包含编码 */
+    chaifenJson: string
+    /** 字根数据的路径。如果省略，则chaifen里必须要有编码信息 */
+    zigenJson?: string
+    /** 方案的ID，用于保存localstorage */
+    id?: string
+    defaultPop?: boolean
+}>()
+
+const usePop = ref(props.defaultPop || false)
+
+const rule3: ImeRule = {
+    pop: 0,
+    len: 3,
+    cm1: ' ',
+    cm2: ';',
+    cm3: "'",
+    keys: 26,
+    autoCm: 4,
+}
+
+const rule42: ImeRule = {
+    pop: 2,
+    len: 3,
+    cm1: ' ',
+    cm2: ';',
+    cm3: "'",
+    keys: 26,
+    autoCm: 4,
+}
+const rule = computed(() => usePop.value ? rule42 : rule3)
+
+</script>
+
+<template>
+    <FetchInput :zigenJson :chaifenJson :id :rule>
+        <div class="form-control">
+            <label class="label cursor-pointer pt-0">
+                <input type="checkbox" class="checkbox checkbox-sm" style="border: currentColor 2px solid;"
+                    v-model="usePop" />
+                <span>&nbsp;使用四二顶</span>
+            </label>
+        </div>
+    </FetchInput>
+</template>

components/ime/FetchInput.vue

@@ -0,0 +1,48 @@
+<script setup lang="ts">
+import * as utils from './share'
+import { onMounted, shallowRef } from "vue";
+import InputMethod from './InputMethod.vue'
+/** 在线输入法，只打单字 */
+const p = defineProps<{
+    /** 每个字的拆分数据，可以包含编码 */
+    chaifenJson: string
+    /** 字根数据的路径。如果省略，则chaifen里必须要有编码信息 */
+    zigenJson?: string
+    /** 方案的ID，用于保存localstorage */
+    id?: string
+    /** 方案的配置 */
+    rule: utils.ImeRule
+}>()
+
+const id = p.id || p.chaifenJson
+const schemaData = shallowRef<utils.HanziCard[]>()
+
+onMounted(async () => {
+    if (id in utils.cache) {
+        schemaData.value = utils.cache[id]
+        return
+    }
+
+    const chaifenJson: utils.HanziCard[] = await utils.fetchJsonWithCache(p.chaifenJson)
+    if (p.zigenJson) {
+        const zigenJson: utils.ZigenCard[] = await utils.fetchJsonWithCache(p.zigenJson)
+
+        const zigenMap = utils.makeMapFromArray(zigenJson)
+        for (const cf of chaifenJson) {
+            if (cf.key) continue
+            cf.key = [...cf.comp!].map(zg => zigenMap.get(zg)!.key).join('')
+        }
+    }
+    chaifenJson.sort(utils.sortFunc)
+    schemaData.value = chaifenJson
+    utils.cache[id] = chaifenJson
+})
+
+</script>
+
+<template>
+    <div class="text-gray-600 text-center" v-if="!schemaData">加载中……</div>
+    <InputMethod v-else :id :rule :data="schemaData">
+        <slot></slot>
+    </InputMethod>
+</template>