ブラウザのタイトルや URL をコピーするブックマークレット

copy-formatted-title-and-url-bookmarklet.js

// タイトルをコピーするモーダルダイアログを表示させる
(() => {
    // フレームを使っている場合は、先頭のフレームのドキュメントを対象とする
    let d = "FRAMESET" === top.document.body.tagName ? top.frames[0].document : document, g = k => d.getElementById(k), c = d.createElement("div"), i = "modalBMId_key";
    // モーダルダイアログを表示させるエレメントの作成
    c.innerHTML = `<div id=${i}m style="position:fixed;width:100%;height:100%;top:0;left:0;text-align:center;background:rgba(0,0,0,.5);padding:16px 20px;z-index:2147483640"><div style="display:inline-block;background:#fff"><div style="padding:8px"><div id=${i}b></div><div><label for=${i}i style="color:#000">copied:</label><input id=${i}i style="width:400px" readonly/></div></div></div></div>`;
    let m = g(i + "m");
    if (!m) {
        d.body.prepend(c.firstChild);
        // 変換テンプレートの宣言
        Object.entries({
            TitleOnly: "{{title}}",
            Text: "{{title}}\n{{url}}",
            Markdown: String.raw`[{{title/\\/\\/(?=[\[\]])/\}}]({{url/\)/%29}})`,
            HTML: String.raw`<a href="{{url/&/&amp;/"/&quot;}}">{{title/</&lt;}}</a>`,
            Textile: String.raw`"{{title/&/&amp;/"/&quot;/\]/&#93;}}":{{url/\]/%5D}}`,
            AsciiDoc: String.raw`link:++{{url}}++[{{title/\[/&#91;/\]/&#93;}}]`,
            Jira: String.raw`[{{title/&/&amp;/\[/&#91;/\]/&#93;/\|/&#124;}}|{{url/\[/%5B/\]/%5D/\|/%7C}}]`,
            LaTeX: String.raw`\href{{{url/\\/\backslash/(?=[&%$#_{}])/\}}}{{{title/\\/\backslash/(?=[&%$#_{}])/\}}}`
        }).map(([k, v]) => {
            // フォーマット済みリンクをクリップボードにコピーするボタンを宣言
            let b = d.createElement("button");
            b.style.color = "#000";
            b.style.margin = "2px";
            b.style.padding = "2px 4px";
            b.textContent = `[copy - ${k}]`;
            b.onclick = () => {
                let t = v.replace(/{{((title|url)(?:\/(.*?)\/(.*?))?(?:\/(.*?)\/(.*?))?(?:\/(.*?)\/(.*?))?(?:\/(.*?)\/(.*?))?)}}/ig, function (m, n, t) {
                    let a = "title" == t.toLowerCase() ? d.title : location.href;
                    for (let c = 3; c < 10; c += 2) {
                        // String.prototype.replace で置換関数を与えた場合は、第二変数以降キャプチャグループの数だけ引数に文字列が与えられ、その後 offset の数値が与えられる。
                        // https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/String/replace#%E7%BD%AE%E6%8F%9B%E6%96%87%E5%AD%97%E5%88%97%E3%81%A8%E3%81%97%E3%81%A6%E3%81%AE%E9%96%A2%E6%95%B0%E3%81%AE%E6%8C%87%E5%AE%9A
                        // このため、文字列以外（undefined か数字）が来るまでループして /{正規表現}/{置換後文字}/ の文字列置換を繰り返す。
                        let e = arguments[c];
                        if (e && "string" == typeof e) {
                            a = a.replace(RegExp(e, "g"), arguments[c + 1] ?? "");
                        } else break;
                    }
                    return a;
                });
                navigator.clipboard.writeText(t);
                g(i + "i").value = t;
            };
            g(i + "b").append(b);
        });
        // モーダル部分がクリックされたらダイアログを消す
        m = g(i + "m");
        d.addEventListener("click", e => {
            if (e.target == m) {
                m.remove();
            }
        });
    }
})();