HmCustomRenderBrowser の使い方 (マークダウン用にしてみよう)

最終更新日 2025-03-30

何らかのカスタム解釈をする、という意味で、マークダウンを例にしてみましょう。

HmCustomRenderServer.mac のファイルだけを変更して、test.mac としてみましょう。

まず、「一式をすべてコピー」して、別のディレクトリにコピペしてみましょう。

「HmCustomRenderServer.mac」だけ名前を変更します。
他はそのままです。

test.macを編集

test.mac を以下のように編集してみましょう。
ほとんどソースが無い状態です。

test.mac

hidemaruversion "9.43.99";

jsmode "JScript\\" + currentmacrofilename;

execjs currentmacrodirectory + "\\HmCustomRenderServer.js";

HmCustomRenderBrowser.htmlを編集

マークダウン用にするのに特別なことは必要ありません。
まさに、一般のWeb制作で行われていることと同じことです。
しかもデータは onReceiveObject の引数に、自動的に降ってくるため、とても簡単だと言えるでしょう。

HmCustomRenderBrowser.html

<!DOCTYPE html>
<html lang="ja">
<head>
<title>マークダウン</title>
<script src="./HmCustomRenderBrowser.js"></script>
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
</head>
<body>
<div id="output"></div>
<script>
document.addEventListener('DOMContentLoaded', ()=>{
    HmCustomRenderBrowser.setInterval(onReceiveObject, 1000);
});

let lastText = "";
function onReceiveObject(obj, error) {

    // エラー
    if (!obj) {
        return;
    }

    // テキストが変化していたら
    if (lastText != obj.text) {
        lastText = obj.text;

        // 受信したテキストをマークダウンと解釈してHTMLに
        const html = marked.parse(obj.text);
        output.innerHTML = html;
    }
}
</script>
</body>
</html>

適当にマークダウンを編集エリア上に記述

適当に「かきくけこ」などと書かれたテキストを用意

test.macを実行

このように非常に簡単に「カスタムなレンダリング」が実現できました。
マークダウンだけではなく、他でも要領は同じです。

秀丸上のテキストを何かのフォーマットとして解釈し、個別ブラウザ枠にてレンダリングする、
そういったことが非常に簡単に行えることが理解出来るかと思います。