の作業記録

ブックカタリストゲスト回の木曜日

10:00

おはようございます。本日はブックカタリストのゲスト臨時回の収録があります。

あと、妻の職場で出勤していた人に陽性反応が出たらしく、だいぶ慌ただしくなっているようです。

とりあえず、私は原稿を進めましょう。

Textbox:

slider.mdを作っていきます。

＊　＊　＊

とりあえず、左右の矢印画像を配置。

Image from Gyazo

＊　＊　＊

div要素を生成する必要はなく、既存のdivのinnerを置き換えればいい。

となると、主要な課題は、mdファイルからタイトルと本文を抽出する過程。

＊　＊　＊

できました。

Image from Gyazo

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

//見出し3と本文で構成されたmdファイルから連想配列を含む配列を生成する
function convertMdtoList(text){
    const lines = text.split(/\n/);
    const regex = new RegExp('^###');
    let contens = []
    let title="";
    let body="";
    let flag = false;
    for(item of lines){
        if(regex.test(item)){
            if (flag == false){
                flag = true;
            }else{
                contens.push({"title":title,"body":body.trim()});
                body="";
            }
            title = item;
        }else{
            body = body + "\n" +item;
        }
    }
    if (body != ""){
        contens.push({"title":title,"body":body.trim()});
         body="";
    }
    return contens
}

コードはだいぶやぼったいですが、とりあえず動くのでOKとしましょう。

マークダウン記法でかいているので、タイトルに###が入っていますが、今は気にしないことに。###を削除するか、マークダウンの変換を噛ませてから使うかのどちらかとします。変換を噛ませる場合は、HTML側でh3を設置する必要がなくなりますが、そうなるとIDを振るのが面倒かもしれません。なので、中身だけを取り出すほうが懸命でしょう。DOMの生成をする場合は、逆にマークダウン変換したほうがいいでしょう。この辺、微妙なところです。