Textboxでお仲間ページを表示する
フロントマターを利用して、同じtypeを持つページへのリンクを自動的に追加する
下準備
ページにフロントマターを記述する
code:sample.md
---
type: project
---
ページ上部に上記のような記述をしておく
list/*.mdをサーチする
Pythonで/listフォルダを探索して、すべてのファイルの中身を確認し、フロントマターが存在する場合はそれを取得して、全ファイルの情報をもったjson(deepfilelist.json)を作っておく
Textboxでの実装
index.htmlからアクセス
indexから何かしらのページをfetchしたら、まずフロントマターを探し、見つかればその部分のテキストは取り除いてページを描写する
さらに、取り除いたフロントマター部分から、type: hogeという記述を探し、それが見つかればhogeというtypeを持つページを、先ほど作ったjson（deepfilelist.json）から探す
見つかったページでリンクを生成し、ページに追加する
code:sample.js
if ( hasType ){
type = "<span> [+ hasType1 +"]</span>" //同じtypeのページをdeepFilelistsから見つける
//deepFilelistsにはdeepfilelist.jsonからfetchした内容が事前に読み込まれている
const filteredObjects = deepFilelists.filter(object => object.type === hasType1); if (filteredObjects.length > 1){
filteredObjects.forEach(elm=>{
//今表示しているページと同じなら表示しない
if ("list/"+ elm"title" != obj.nowPage){ type = type + "<span> [+ elm"title".replace(".md","") +"]</span>" }
})
}
}
以下はtype: todo を持つページの例
https://gyazo.com/734a66d3b09df6da7ef3493bd171f1ec
https://gyazo.com/827f7a1d2326879e631d50cd4b52e614
全ページのリストからサーチすると、当然「今表示しているページ」も見つかるので、それはif文ではじいておく