mirror/opengist
1
0
Fork 0
mirror of https://github.com/thomiceli/opengist.git synced 2024-12-23 04:52:40 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Wrap editor code in DOMContentLoaded

Browse source
This commit is contained in:
Thomas Miceli 2023-04-03 00:43:23 +02:00
parent 2aee52e06c
commit 0eb1b103d0
No known key found for this signature in database
GPG key ID: D86C6F6390AF050F
1 changed files with 139 additions and 134 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

69
public/editor.js vendored
View file

@ -2,21 +2,22 @@ import {EditorView, gutter, keymap, lineNumbers} from "@codemirror/view"
import {Compartment, EditorState, Facet, SelectionRange} from "@codemirror/state"
import {indentLess} from "@codemirror/commands";
EditorView.theme({}, {dark: true})
document.addEventListener('DOMContentLoaded', () => {
EditorView.theme({}, {dark: true})
let editorsjs = []
let editorsParentdom = document.getElementById('editors')
let allEditorsdom = document.querySelectorAll('#editors > .editor')
let firstEditordom = allEditorsdom[0]
let editorsjs = []
let editorsParentdom = document.getElementById('editors')
let allEditorsdom = document.querySelectorAll('#editors > .editor')
let firstEditordom = allEditorsdom[0]
const txtFacet = Facet.define({
const txtFacet = Facet.define({
combine(values) {
return values[0]
}
})
let indentSize = new Compartment, wrapMode = new Compartment, indentType = new Compartment
})
let indentSize = new Compartment, wrapMode = new Compartment, indentType = new Compartment
const newEditor = (dom, value = '') => {
const newEditor = (dom, value = '') => {
let editor = new EditorView({
doc: value,
parent: dom,
@ -68,16 +69,16 @@ const newEditor = (dom, value = '') => {
});
return editor;
}
}
function getIndentation(state) {
function getIndentation(state) {
if (indentType.get(state).value === 'tab') {
return '\t';
}
return ' '.repeat(indentSize.get(state).value);
}
}
function customIndentMore({state, dispatch}) {
function customIndentMore({state, dispatch}) {
let indentation = getIndentation(state)
dispatch({
...state.update(changeBySelectedLine(state, (line, changes) => {
@ -88,9 +89,9 @@ function customIndentMore({state, dispatch}) {
}
})
return true
}
}
function changeBySelectedLine(state, f) {
function changeBySelectedLine(state, f) {
let atLine = -1
return state.changeByRange(range => {
let changes = []
@ -103,34 +104,37 @@ function changeBySelectedLine(state, f) {
line = state.doc.lineAt(line.number + 1)
}
let changeSet = state.changes(changes)
return {changes, range: new SelectionRange(changeSet.mapPos(range.anchor, 1), changeSet.mapPos(range.head, 1))}
return {
changes,
range: new SelectionRange(changeSet.mapPos(range.anchor, 1), changeSet.mapPos(range.head, 1))
}
})
}
}
function setIndentType(view, type) {
function setIndentType(view, type) {
view.dispatch({effects: indentType.reconfigure(txtFacet.of(type))})
}
}
function setIndentSize(view, size) {
function setIndentSize(view, size) {
view.dispatch({effects: indentSize.reconfigure(EditorState.tabSize.of(size))})
}
}
function setLineWrapping(view, enable) {
function setLineWrapping(view, enable) {
if (enable) {
view.dispatch({effects: wrapMode.reconfigure(EditorView.lineWrapping)})
} else {
view.dispatch({effects: wrapMode.reconfigure([])})
}
}
}
let arr = [...allEditorsdom]
arr.forEach(el => {
let arr = [...allEditorsdom]
arr.forEach(el => {
// in case we edit the gist contents
let currEditor = newEditor(el, el.querySelector('.form-filecontent').value)
editorsjs.push(currEditor)
})
})
document.getElementById('add-file').onclick = () => {
document.getElementById('add-file').onclick = () => {
let newEditorDom = firstEditordom.cloneNode(true)
// reset the filename of the new cloned element
@ -143,15 +147,16 @@ document.getElementById('add-file').onclick = () => {
// creating the new codemirror editor and append it in the editor div
editorsjs.push(newEditor(newEditorDom))
editorsParentdom.append(newEditorDom)
}
}
document.querySelector('form#create').onsubmit = () => {
document.querySelector('form#create').onsubmit = () => {
let j = 0
document.querySelectorAll('.form-filecontent').forEach((e) => {
e.value = encodeURIComponent(editorsjs[j++].state.doc.toString())
})
}
}
document.onsubmit = () => {
document.onsubmit = () => {
window.onbeforeunload = null;
}
}
})