■dorawii@執筆依頼募集中

もう少ししたら自動ブクマするコードができそうなんだけど、そのうえでコード公開に便利なように事前にpre記法に囲まれた部分はその外部の文字を適切にエスケープするコードをchatgptに指示して作ってもらった。

結構修正指示が大変だった。一時間ぐらい格闘。

ぶっちゃけなんでこれで動くのかはわからないので動くからゴーサインを出したというだけなのが情けない所。flushってなんだ？

使うときはchatgptにこのコード丸ごと書いて「ブックマークレット用に一行にして」と丸投げするのを要推奨。

※ベースにした先人のコード

https://anond.hatelabo.jp/20240820150546#

javascript:(function () {
  function escapeHtml(text) {
    return text.replace(/&/g, '&')
               .replace(/</g, '&#60;')
               .replace(/>/g, '&#62;')
               .replace(/"/g, '&#34;')
               .replace(/'/g, '&#39;');
  }

  var textarea = document.querySelector('textarea#text-body');
  if (!textarea) return;

  var lines = textarea.value.split(/\r?\n/);
  var out = "";
  var inPre = false;
  var preLines = [];

  function flushPre() {
    // pre 範囲の中身を 1 本の文字列にまとめ、\n→<br>（末尾行は <br> なし）
    var raw = preLines.join("\n");                 // ここに物理改行は入るが…
    var escaped = escapeHtml(raw);                 // 先にエスケープ
    var html = escaped.replace(/\n/g, "<br>");     // 物理改行を <br> に置換（末尾に \n が無ければ末尾 <br> は付かない）
    out += html;                                   // out には改行を入れない
    preLines = [];
  }

  for (var i = 0; i < lines.length; i++) {
    var line = lines[i];

    // >> / << だけの行は常にそのまま出力（pre 内に来るケースは想定外だが、念のため pre を閉じてから出力）
    if (/^\s*(>>|<<)\s*$/.test(line)) {
      if (inPre) {
        flushPre();
        inPre = false;
        out += "</pre>";
        if (i < lines.length - 1) out += "\n";     // </pre>\n（次に続きがあるときだけ）
      }
      out += line;
      if (i < lines.length - 1) out += "\n";
      continue;
    }

    // >| 行 → <pre>（直後に改行を入れない）
    if (/^\s*\>\|\s*$/.test(line)) {
      if (inPre) { // ネストは想定しないが、防御的に閉じる
        flushPre();
        inPre = false;
        out += "</pre>";
        if (i < lines.length - 1) out += "\n";
      }
      out += "<pre>";
      inPre = true;
      preLines = [];
      continue;
    }

    // |< 行 → </pre>（直前に改行を入れない）
    if (/^\s*\|\<\s*$/.test(line)) {
      if (inPre) {
        flushPre();
        inPre = false;
      }
      out += "</pre>";
      if (i < lines.length - 1) out += "\n";       // 連続ブロック時は </pre>\n<pre> になる
      continue;
    }

    if (inPre) {
      // pre 内はバッファに貯める（ここでは改行を出力しない）
      preLines.push(line);
    } else {
      // pre 外は escapeHtml + 行末にだけ改行
      out += escapeHtml(line);
      if (i < lines.length - 1) out += "\n";
    }
  }

  // 未閉じの pre が残っていたら閉じる
  if (inPre) {
    flushPre();
    out += "</pre>";
  }

  textarea.value = out;
})();

-----BEGIN PGP SIGNED MESSAGE-----
Hash: SHA512

https://anond.hatelabo.jp/20250819202540# 
-----BEGIN PGP SIGNATURE-----

iHUEARYKAB0WIQTEe8eLwpVRSViDKR5wMdsubs4+SAUCaKRfOwAKCRBwMdsubs4+
SI5UAQDcNiyv5qUuMej1VLkGz4F5WyHeU1AIm7nUVHlx/gicnAEAgP07dK14IuTu
W3ZO7PRR71ENq9lJjYtawIYyMOc2cQk=
=okE4
-----END PGP SIGNATURE-----

Permalink | 記事への反応(0) | 20:25

ツイート シェア