プラグインを設計する
① Font Awesomeのアイコンを⾒つけて名前を変更する
• 編集中のページの⼦ノード→孫ノード…
と下に辿ってTextノードを⾒つける
• Textノードがアイコンかどうかを判定
• フォントがFont Awesome
• 1⽂字だけ
• ⾒つかったアイコンを表⽰して
ユーザーに名前を変更してよいか確認
• その⽂字のコード(Unicode)から
アイコン名を調べて名前に反映する
Slide 13
Slide 13 text
プラグインを設計する
① Font Awesomeのアイコンを⾒つけて名前を変更する
• 編集中のページの⼦ノード→孫ノード…
と下に辿ってTextノードを⾒つける
• Textノードがアイコンかどうかを判定
• フォントがFont Awesome
• 1⽂字だけ
• ⾒つかったアイコンを表⽰して
ユーザーに名前を変更してよいか確認
• その⽂字のコード(Unicode)から
アイコン名を調べて名前に反映する
Slide 14
Slide 14 text
プラグインを設計する
① Font Awesomeのアイコンを⾒つけて名前を変更する
• 編集中のページの⼦ノード→孫ノード…
と下に辿ってTextノードを⾒つける
• Textノードがアイコンかどうかを判定
• フォントがFont Awesome
• 1⽂字だけ
• ⾒つかったアイコンを表⽰して
ユーザーに名前を変更してよいか確認
• その⽂字のコード(Unicode)から
アイコン名を調べて名前に反映する
Slide 15
Slide 15 text
プラグインを設計する
② ⽂字コードからFont Awesomeのアイコン名を引くには?
• Font AwesomeのGitHubリポジトリに
公開されているアイコン情報を使⽤
• ⽂字コードからアイコン名を引くための
辞書を作ってプラグインに組み込む
https://github.com/FortAwesome/Font-Awesome/tree/
d
3
a
7
8
1
8
c
2
5
3
fcba
ff
f
9
ebd
1
d
4
abb
2
8
6
6
c
1
9
2
e
1
d
7
/metadata