Skip to content

Instantly share code, notes, and snippets.

@TakamiChie
Last active July 3, 2018 17:22
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save TakamiChie/da7b2a616a0e6e13c0bd8aa2c3db74fe to your computer and use it in GitHub Desktop.
Save TakamiChie/da7b2a616a0e6e13c0bd8aa2c3db74fe to your computer and use it in GitHub Desktop.
// note用 プロパティ表示ツール
// noteの編集画面において、文字数や段落数、マークダウン記法版文章を表示します。
// ==ClosureCompiler==
// @output_file_name default.js
// @compilation_level ADVANCED_OPTIMIZATIONS
// ==/ClosureCompiler==
(function() {
let nb = (document.getElementById("note-body") ||
document.querySelector("note-body div"));
if(!nb){
alert("ノードが見つかりません。Noteのテキストページが正しく表示されているかどうか確認してください");
return;
}
const ID_DLG = "noteex_detail_dialog";
const ID_MDV = ID_DLG + "_mdview";
const ID_LEN = ID_DLG + "_txtlen";
const ID_PARA = ID_DLG + "_txtpara";
var dialog;
dialog = document.getElementById(ID_DLG);
if(!dialog){
/* ダイアログ作成 */
dialog = document.createElement("dialog");
let mdview = document.createElement("textarea");
let lenview = document.createElement("div");
let paraview = document.createElement("div");
let mdlabel = document.createElement("label");
let close = document.createElement("button");
dialog.id = ID_DLG;
dialog.style.width = "90%";
dialog.style.height = "90%";
lenview.id = ID_LEN;
lenview.style.marginLeft = "1em";
paraview.id = ID_PARA;
paraview.style.marginLeft = "1em";
mdview.id = ID_MDV;
mdview.readonly = true;
mdview.style.display = "block";
mdview.style.width = "100%";
mdview.style.minHeight = "20em";
mdview.addEventListener("focus", () => {
mdview.select();
});
mdlabel.textContent = "マークダウン書式";
mdlabel.appendChild(mdview);
close.textContent = "閉じる";
close.addEventListener("click", () => { dialog.close(); });
dialog.appendChild(lenview);
dialog.appendChild(paraview);
dialog.appendChild(mdlabel);
dialog.appendChild(close);
document.body.appendChild(dialog);
}
/* テキスト取得 */
var lines = [];
nb.childNodes.forEach((item) => {
let text = item.innerHTML.split("<br>").join("\n");
switch(item.nodeName){
case "P":
if(item.childNodes && item.childNodes[0] && item.childNodes[0].nodeName == "IMG"){
let src = item.childNodes[0].src;
lines.push(`![画像](${src})`);
}else{
text = text.replace(/<a.[^>]*href="([^"]+)"[^>]*>(.*?)<\/a>/g, "[$2]($1)");
text = text.replace(/<b>(.*?)<\/b>/g, "**$1**");
lines.push(text);
}
break;
case "H3":
lines.push("### " + text);
break;
case "BLOCKQUOTE":
lines.push("> " + text.split("\n").join("\n> "));
break;
case "PRE":
lines.push("```\n" + text + "\n```");
break;
case "FIGURE":
let href = item.querySelector("a").href;
let title = item.querySelector("a strong").textContent;
lines.push(`[${title}](${href})`);
break;
}
});
dialog.querySelector("#" + ID_MDV).value = lines.join("\n\n");
dialog.querySelector("#" + ID_LEN).textContent =
"文字数:" + nb.textContent.length + "文字";
dialog.querySelector("#" + ID_PARA).textContent =
"段落数:" + nb.querySelectorAll("p").length + "段落";
dialog.showModal();
})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment