Markdown（手作りメニュー）

手作りのメリット

開発環境にPythonを入れるのも無理、客先にサーバを立てるのも、PCにXAMPPを入れてもらうのも無理そう。
そんな場合は、お客様へこう言って下さい。
『お願いですから、ブラウザにプラグイン[Markdown Viewer Enhanced]だけ入れて下さい。』と、

そしてオリジナルBookを手作りしましょう。

実装

○ ディレクトリ構造

[myBook]
           +----- [index.html]
           +----- [README.md]
           +----- [hoge.md]
           +----- [foos/]
                             +----- [foo.md]

完全手作りなので、命名規則なんてものはありません。

○ index.html

ポイント

<!DOCTYPE html>
<html>
    <body>
        <h3>目次</h3>
        <ul>
            <li><a href="#" onclick="openWin('README.md')">トップ</a></li>
            <li><a href="#" onclick="openWin('hoge.md')">第1章</a></li>
                📁画面定義書
            <ul>
                <li><a href="#" onclick="openWin('./foos/foo.md')">詳細設計</a></li>
            </ul>
        </ul>
        <script>
        function openWin(file) {
            const left = window.screenX + 300;
            const top = window.screenY;
            const width = window.outerWidth - 300;
            const height = window.innerHeight + 50;
            window.open(
            file,
            "main_md",
            `left=${left},top=${top},width=${width},height=${height}`
            );
        }
        </script>
    </body>
</html>

以上！目次の内容を自由に作成する事で強引に本の様になります。

強引ポイント

リンクを叩くと、新たな子画面がPOPする仕様です。
ただし、強引に親画面のサイズに合わせて一見左右２画面に見えます。
ターゲット名も固定なので、子画面が増殖する事もありません。

この方法が唯一、ローカル（file://）環境で整理されたmdファイルを管理する方法かも。