|
import {EditorState, EditorView, basicSetup} from "@codemirror/basic-setup"
|
|
import {markdown} from "@codemirror/lang-markdown"
|
|
import {tagExtension} from "@codemirror/state"
|
|
import {oneDark, oneDarkHighlightStyle} from "@codemirror/theme-one-dark"
|
|
|
|
let editableTag = Symbol();
|
|
|
|
let editor = new EditorView({
|
|
state: EditorState.create({
|
|
extensions: [basicSetup, markdown(), oneDark, oneDarkHighlightStyle, tagExtension(editableTag, EditorView.editable.of(document.getElementById('submit') != null))]
|
|
}),
|
|
parent: document.querySelector("#editor")
|
|
});
|
|
|
|
const setEditorContents = (text) => {
|
|
editor.dispatch({
|
|
changes: {from: 0, to: editor.state.doc.length, insert: text}
|
|
})
|
|
};
|
|
|
|
const syncEditor = (event) => {
|
|
event.preventDefault();
|
|
const successAlert = document.querySelector('#success-alert');
|
|
const errorAlert = document.querySelector('#error-alert');
|
|
|
|
fetch('/save', {
|
|
method: 'POST',
|
|
headers: { "Content-Type": "application/json; charset=utf-8" },
|
|
body: editor.state.sliceDoc()
|
|
})
|
|
.then(res => res.json()) // parse response as JSON (can be res.text() for plain response)
|
|
.then(response => {
|
|
// here you do what you want with response
|
|
console.log(response);
|
|
|
|
successAlert.innerHTML = response.msg;
|
|
successAlert.style.display = "block";
|
|
errorAlert.style.display = "none";
|
|
})
|
|
.catch(err => {
|
|
console.log(err);
|
|
|
|
errorAlert.innerHTML = err.msg;
|
|
errorAlert.style.display = "block";
|
|
successAlert.style.display = "none";
|
|
});
|
|
};
|
|
|
|
// If we're on the create paste page, set up the submit listener
|
|
if (document.getElementById('submit') != null) {
|
|
const submitButton = document.querySelector("#submit");
|
|
submitButton.addEventListener("click", syncEditor);
|
|
}
|
|
|
|
// If we're on the public paste display page, copy the text from the contents div and then delete it
|
|
if (document.getElementById('contents') != null) {
|
|
const contentsDiv = document.querySelector("#contents");
|
|
setEditorContents(contentsDiv.textContent);
|
|
contentsDiv.remove();
|
|
}
|