优化 db 尺寸

tools/build_db.py

@@ -0,0 +1,89 @@
+import json
+import shutil
+
+import unidata_blocks
+from character_encoding_utils import gb2312, big5, shiftjis, ksx1001
+
+from tools import data_dir, www_data_dir, font_styles, language_flavors
+
+
+def _build_db() -> dict:
+    tags = []
+
+    for block in unidata_blocks.get_blocks():
+        tags.append(block.name)
+    for category in gb2312.get_categories():
+        tags.append(f'gb2312/{category}')
+    for category in big5.get_categories():
+        tags.append(f'big5/{category}')
+    for category in shiftjis.get_categories():
+        tags.append(f'shiftjis/{category}')
+    for category in ksx1001.get_categories():
+        tags.append(f'ksx1001/{category}')
+
+    ai0 = {}
+
+    for font_style in font_styles:
+        glyph_names = []
+        for line in data_dir.joinpath(font_style, f'AI0-SourceHan{font_style.capitalize()}').read_text('utf-8').splitlines():
+            glyph_names.append(line.split(' ')[3])
+        ai0[font_style] = glyph_names
+
+    mapping = {}
+
+    for (font_style_index, font_style) in enumerate(font_styles):
+        for language_flavor in language_flavors:
+            for line in data_dir.joinpath(font_style, f'utf32-{language_flavor}.map').read_text('utf-8').splitlines():
+                tokens = line.split(' ')
+                code_point = int(tokens[0].removeprefix('<').removesuffix('>'), 16)
+                glyph_id = int(tokens[1])
+
+                if code_point not in mapping:
+                    c = chr(code_point)
+                    tag_indices = [tags.index(unidata_blocks.get_block_by_code_point(code_point).name)]
+
+                    gb2312_category = gb2312.query_category(c)
+                    if gb2312_category is not None:
+                        tag_indices.append(tags.index(f'gb2312/{gb2312_category}'))
+
+                    big5_category = big5.query_category(c)
+                    if big5_category is not None:
+                        tag_indices.append(tags.index(f'big5/{big5_category}'))
+
+                    shiftjis_category = shiftjis.query_category(c)
+                    if shiftjis_category is not None:
+                        tag_indices.append(tags.index(f'shiftjis/{shiftjis_category}'))
+
+                    ksx1001_category = ksx1001.query_category(c)
+                    if ksx1001_category is not None:
+                        tag_indices.append(tags.index(f'ksx1001/{ksx1001_category}'))
+
+                    mapping[code_point] = [
+                        [],
+                        [],
+                        tag_indices,
+                    ]
+
+                mapping[code_point][font_style_index].append(glyph_id)
+
+    return {
+        'tags': tags,
+        'ai0': ai0,
+        'mapping': mapping,
+    }
+
+
+def main():
+    if www_data_dir.exists():
+        shutil.rmtree(www_data_dir)
+    www_data_dir.mkdir(parents=True)
+
+    db = _build_db()
+
+    file_path = www_data_dir.joinpath('db.json')
+    file_path.write_text(json.dumps(db), 'utf-8')
+    print(f"Build: '{file_path}'")
+
+
+if __name__ == '__main__':
+    main()

www/index.html

@@ -14,13 +14,13 @@
         <h1 class="title">思源映射查看器</h1>
     </nav>
     <main class="main">
-        <template v-if="mappingLoadFailed">
+        <template v-if="dbLoadFailed">
             <div class="error-tip">映射数据加载失败，请刷新浏览器重试</div>
         </template>
-        <template v-else-if="!mapping">
+        <template v-else-if="!db">
             <div class="loading-tip">正在加载映射数据，请稍后</div>
         </template>
-        <template v-if="mapping">
+        <template v-if="db">
             <label class="input">
                 <input type="text" placeholder="请在此输入字符" v-model="input">
             </label>
@@ -51,20 +51,20 @@ <h1 class="title">思源映射查看器</h1>
                 <div class="title">
                     <span class="code-point">U+{{ codePoint.toString(16).toUpperCase().padStart(4, '0') }}</span>
                     <span class="char">{{ c === ' ' ? '&nbsp;' : c }}</span>
-                    <span class="tag" v-for="tag in mapping[codePoint].tags" :key="tag">{{ tag }}</span>
+                    <span class="tag" v-for="tagIndex in db.mapping[codePoint][2]" :key="tagIndex">{{ db.tags[tagIndex] }}</span>
                 </div>
                 <div class="glyphs">
-                    <div class="line" v-if="displaySans && 'sans' in mapping[codePoint]">
-                        <div class="glyph" v-for="languageFlavor in languageFlavors" :key="languageFlavor" :set="glyphName = mapping[codePoint]['sans'][languageFlavor]">
+                    <div class="line" v-if="displaySans && db.mapping[codePoint][0].length > 0">
+                        <div class="glyph" v-for="(languageFlavor, languageFlavorIndex) in languageFlavors" :key="languageFlavor" :set="glyphName = db.ai0['sans'][db.mapping[codePoint][0][languageFlavorIndex]]">
                             <div class="info sans-info">
                                 <span class="language-flavor">{{ languageFlavor.toUpperCase() }}</span>
                                 <span class="glyph-name">{{ glyphName }}</span>
                             </div>
                             <span class="char" :style="{ width: fontSize * 1.4 + 'px', color: getGlyphColor(glyphName), fontFamily: 'SourceHanSans-' + languageFlavor.toUpperCase() + ', sans-serif', fontSize: fontSize + 'px', fontWeight: fontWeight }">{{ c === ' ' ? '&nbsp;' : c }}</span>
                         </div>
                     </div>
-                    <div class="line" v-if="displaySerif && 'serif' in mapping[codePoint]">
-                        <div class="glyph" v-for="languageFlavor in languageFlavors" :key="languageFlavor" :set="glyphName = mapping[codePoint]['serif'][languageFlavor]">
+                    <div class="line" v-if="displaySerif && db.mapping[codePoint][1].length > 0">
+                        <div class="glyph" v-for="(languageFlavor, languageFlavorIndex) in languageFlavors" :key="languageFlavor" :set="glyphName = db.ai0['serif'][db.mapping[codePoint][1][languageFlavorIndex]]">
                             <div class="info serif-info">
                                 <span class="language-flavor">{{ languageFlavor.toUpperCase() }}</span>
                                 <span class="glyph-name">{{ glyphName }}</span>

www/js/app.js

@@ -10,8 +10,8 @@ createApp({
                 'jp',
                 'kr',
             ],
-            mapping: null,
-            mappingLoadFailed: false,
+            db: null,
+            dbLoadFailed: false,
             input: '',
             displaySans: true,
             displaySerif: true,
@@ -24,7 +24,7 @@ createApp({
             let query = []
             for (let c of this.input) {
                 let codePoint = c.codePointAt(0)
-                if (codePoint in this.mapping && !query.includes(codePoint)) {
+                if (codePoint in this.db.mapping && !query.includes(codePoint)) {
                     query.push(codePoint)
                 }
             }
@@ -51,16 +51,17 @@ createApp({
     },
     async created() {
         try {
-            let response = await fetch('data/mapping.json')
+            let response = await fetch('data/db.json')
             if (response.ok) {
-                this.mapping = await response.json()
-                console.log('加载映射：', this.mapping)
+                let db = await response.json()
+                console.log('加载映射：', db)
+                this.db = db
             } else {
-                this.mappingLoadFailed = true
+                this.dbLoadFailed = true
                 return
             }
         } catch (e) {
-            this.mappingLoadFailed = true
+            this.dbLoadFailed = true
             return
         }