-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
7 changed files
with
230 additions
and
1 deletion.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -2,3 +2,4 @@ | |
| .venv/ | ||
| dist/*.otf | ||
| dist/*.woff2 | ||
| site/catalog.html | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,35 @@ | ||
| const $ = document.querySelector.bind(document); | ||
|
|
||
| const popup = $('#popup'); | ||
|
|
||
| document.addEventListener('click', (event) => { | ||
| if (popup.classList.contains('show')) { | ||
| popup.classList.remove('show'); | ||
| } | ||
| const target = event.target; | ||
| if (target.tagName !== 'TD' || target.classList.contains('blank')) return; | ||
| const text = target.textContent; | ||
| const unicode = [...text].map((c) => | ||
| `U+${c.codePointAt(0).toString(16).padStart(4, 0).toUpperCase()}`).join(' '); | ||
| $('#popup-glyph').textContent = text; | ||
| document.getElementById('popup-info-jis').textContent = target.dataset.jis; | ||
| document.getElementById('popup-info-unicode').textContent = unicode; | ||
| popup.classList.add('show'); | ||
| popup.style.top = event.pageY - popup.offsetHeight / 2 + 'px'; | ||
| popup.style.left = event.pageX - popup.offsetWidth / 2 + 'px'; | ||
| $('#copy-icon').hidden = false; | ||
| $('#copied-icon').hidden = true; | ||
| }); | ||
|
|
||
| document.addEventListener('keydown', (event) => { | ||
| if (event.key === 'Escape') { | ||
| popup.classList.remove('show'); | ||
| } | ||
| }); | ||
|
|
||
| $('#copy-button').addEventListener('click', async (event) => { | ||
| event.stopPropagation(); | ||
| await navigator.clipboard.writeText($('#popup-glyph').textContent); | ||
| $('#copy-icon').hidden = true; | ||
| $('#copied-icon').hidden = false; | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,23 @@ | ||
| from jinja2 import Environment, FileSystemLoader | ||
| from jisx0213 import JISX0213 | ||
|
|
||
| codeconv = JISX0213() | ||
| tables = [] | ||
| for plane in range(1, 3): | ||
| for row in range(1, 95): | ||
| # plane 2 has only characters in rows 1, 3–5, 8, 12–15, 78–94. | ||
| if plane == 2 and row not in (1, *range(3, 6), 8, *range(12, 16), *range(78, 95)): | ||
| continue | ||
| t = [None] * 100 | ||
| for cell in range(1, 95): | ||
| cp = (plane - 1) * 0x8080 | (row + 0x20) << 8 | (cell + 0x20) | ||
| u = codeconv.unicode(cp) | ||
| t[cell] = u | ||
| tables.append({ 'plane': plane, 'row': row, 'table': t }) | ||
|
|
||
| env = Environment(loader=FileSystemLoader('templates')) | ||
| env.trim_blocks = True | ||
| env.lstrip_blocks = True | ||
| template = env.get_template('catalog.html') | ||
| content = template.render(char_table=tables) | ||
| print(content) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,165 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="ja"> | ||
| <head> | ||
| <meta charset="utf-8" /> | ||
| <meta name="viewport" content="width=device-width,initial-scale=1"> | ||
| <title>ワープロ明朝 収録文字一覧</title> | ||
| <style> | ||
| body { | ||
| background-color: #fafafa; | ||
| max-width: 640px; | ||
| margin: 0 auto 10rem; | ||
| } | ||
| @font-face { | ||
| font-family: "ワープロ明朝"; | ||
| src: url("wapuro-mincho.woff2") format("woff2"); | ||
| } | ||
| table { | ||
| border-collapse: collapse; | ||
| margin-top: 2rem; | ||
| } | ||
| th { | ||
| border: solid 1px; | ||
| background-color: #eee; | ||
| &.plane { | ||
| width: 2em; | ||
| } | ||
| &.row { | ||
| width: 2em; | ||
| } | ||
| &.col { | ||
| width: 2em; | ||
| } | ||
| } | ||
| td { | ||
| font-family: "ワープロ明朝"; | ||
| font-size: 24px; | ||
| width: 2em; | ||
| height: 2em; | ||
| text-align: center; | ||
| border: solid 1px; | ||
| &.blank { | ||
| background-color: #ddd; | ||
| } | ||
| } | ||
| #popup { | ||
| border: 1px solid #000; | ||
| background-color: #fff; | ||
| position: absolute; | ||
| display: none; | ||
| &.show { | ||
| display: block; | ||
| } | ||
| } | ||
| #popup-glyph { | ||
| font-family: "ワープロ明朝"; | ||
| font-size: 120px; | ||
| width: 10rem; | ||
| height: 10rem; | ||
| line-height: 10rem; | ||
| text-align: center; | ||
| } | ||
| .popup-info { | ||
| margin-left: 0.5rem; | ||
| } | ||
| #copy-button { | ||
| position: absolute; | ||
| right: 0.5rem; | ||
| top: 9.3rem; | ||
| background-color: #fff; | ||
| border: none; | ||
| #copy-icon { | ||
| color: #33f; | ||
| } | ||
| #copied-icon { | ||
| color: #ccc; | ||
| } | ||
| } | ||
|
|
||
| .tooltip { | ||
| position: relative; | ||
| cursor: pointer; | ||
| } | ||
| .tooltip-text { | ||
| opacity: 0; | ||
| visibility: hidden; | ||
| position: absolute; | ||
| left: 50%; | ||
| transform: translateX(-50%); | ||
| bottom: -30px; | ||
| display: inline-block; | ||
| padding: 5px; | ||
| white-space: nowrap; | ||
| font-size: 0.8rem; | ||
| line-height: 1.3; | ||
| background: #333; | ||
| color: #fff; | ||
| border-radius: 3px; | ||
| transition: 0.3s ease-in; | ||
| } | ||
| .tooltip:hover .tooltip-text { | ||
| opacity: 1; | ||
| visibility: visible; | ||
| } | ||
| </style> | ||
| </head> | ||
| <body> | ||
| <h1>ワープロ明朝 収録文字一覧</h1> | ||
| <p><a href="index.html">トップページへ戻る</a></p> | ||
| {% for tbl in char_table %} | ||
| <table> | ||
| <tr> | ||
| <th scope="col">面</th> | ||
| <th scope="col">区</th> | ||
| <th scope="col">点</th> | ||
| {% for i in range(10) %} | ||
| <th scope="col">{{ i }}</th> | ||
| {% endfor %} | ||
| </tr> | ||
| {% for y in range(10) %} | ||
| <tr> | ||
| {% if y == 0 %} | ||
| <th scope="row" rowspan="10" class="plane">{{ tbl.plane }}</th> | ||
| <th scope="row" rowspan="10" class="row">{{ tbl.row }}</th> | ||
| {% endif %} | ||
| <th scope="row" class="col">{{ y }}0</th> | ||
| {% for x in range(10) %} | ||
| {% if tbl.table[y * 10 + x] is none %} | ||
| <td class="blank"></td> | ||
| {% else %} | ||
| <td data-jis="{{ tbl.plane }}-{{ tbl.row }}-{{ y * 10 + x }}">{{ tbl.table[y * 10 + x] }}</td> | ||
| {% endif %} | ||
| {% endfor %} | ||
| </tr> | ||
| {% endfor %} | ||
| </table> | ||
| {% endfor %} | ||
| <div id="popup"> | ||
| <div id="popup-glyph"></div> | ||
| <button id="copy-button" class="tooltip"> | ||
| <span id="copy-icon"> | ||
| <span class="tooltip-text">コピー</span> | ||
| <!-- https://tabler.io/icons/icon/clipboard --> | ||
| <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-clipboard"> | ||
| <path stroke="none" d="M0 0h24v24H0z" fill="none" /> | ||
| <path d="M9 5h-2a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-12a2 2 0 0 0 -2 -2h-2" /> | ||
| <path d="M9 3m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v0a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z" /> | ||
| </svg> | ||
| </span> | ||
| <span id="copied-icon" hidden> | ||
| <span class="tooltip-text">コピーしました</span> | ||
| <!-- https://tabler.io/icons/icon/clipboard-check --> | ||
| <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-clipboard-check"> | ||
| <path stroke="none" d="M0 0h24v24H0z" fill="none" /> | ||
| <path d="M9 5h-2a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-12a2 2 0 0 0 -2 -2h-2" /> | ||
| <path d="M9 3m0 2a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v0a2 2 0 0 1 -2 2h-2a2 2 0 0 1 -2 -2z" /> | ||
| <path d="M9 14l2 2l4 -4" /> | ||
| </svg> | ||
| </span> | ||
| </button> | ||
| <div class="popup-info">JIS: <span id="popup-info-jis"></span></div> | ||
| <div class="popup-info">Unicode: <span id="popup-info-unicode"></span></div> | ||
| </div> | ||
| <script src="catalog.js" async></script> | ||
| </body> | ||
| </html> |