58 lines
1.8 KiB
JavaScript
58 lines
1.8 KiB
JavaScript
|
let text = document.querySelector("#plain-editor textarea").value;
|
||
|
|
let format = document.getElementById("format").value;
|
||
|
|
|
||
|
|
const modes = {
|
||
|
|
markdown: "ace/mode/markdown",
|
||
|
|
html: "ace/mode/html",
|
||
|
|
plain: "ace/mode/text",
|
||
|
|
mono: "ace/mode/text"
|
||
|
|
}
|
||
|
|
|
||
|
|
function updatePreview(raw) {
|
||
|
|
document.getElementById("preview").innerHTML = toHTML(format, raw);
|
||
|
|
document.getElementById("character-count").innerText = (new Intl.NumberFormat).format(raw.length);
|
||
|
|
|
||
|
|
if (raw.length > 500_000) {
|
||
|
|
document.getElementById("character-count").classList.add("error");
|
||
|
|
document.getElementById("character-count").classList.remove("warning");
|
||
|
|
} else if (raw.length >= 498_000) {
|
||
|
|
document.getElementById("character-count").classList.remove("error");
|
||
|
|
document.getElementById("character-count").classList.add("warning");
|
||
|
|
} else {
|
||
|
|
document.getElementById("character-count").classList.remove("error");
|
||
|
|
document.getElementById("character-count").classList.remove("warning");
|
||
|
|
}
|
||
|
|
|
||
|
|
text = raw;
|
||
|
|
}
|
||
|
|
|
||
|
|
let editor = createEditor("ace-editor", text, format, (raw) => {
|
||
|
|
updatePreview(raw);
|
||
|
|
document.querySelector("#plain-editor textarea").value = raw;
|
||
|
|
});
|
||
|
|
|
||
|
|
document.querySelector("#plain-editor textarea").addEventListener("input", function() {
|
||
|
|
updatePreview(this.value);
|
||
|
|
});
|
||
|
|
|
||
|
|
document.getElementById("use-plain-editor").addEventListener("input", function() {
|
||
|
|
if (this.checked) {
|
||
|
|
document.getElementById("editor-area").dataset.editor = "plain";
|
||
|
|
} else {
|
||
|
|
document.getElementById("editor-area").dataset.editor = "ace";
|
||
|
|
editor.setValue(text);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
document.getElementById("format").addEventListener("change", function() {
|
||
|
|
format = this.value;
|
||
|
|
editor.getSession().setMode(modes[format]);
|
||
|
|
updatePreview(text);
|
||
|
|
});
|
||
|
|
|
||
|
|
updatePreview(text);
|
||
|
|
|
||
|
|
window.onbeforeunload = (event) => {
|
||
|
|
return "Your changes won't be saved.";
|
||
|
|
}
|