Notify editor about editor type changes
This commit is contained in:
parent
f46d6df29b
commit
ef2bd4f528
|
@ -26,10 +26,18 @@ export const types = {
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function getCurrentEditor() {
|
export function getCurrentEditor() {
|
||||||
return sessionStorage.getItem('editorType') || 'codemirror'
|
return localStorage.getItem('editorType') || 'codemirror'
|
||||||
}
|
}
|
||||||
|
|
||||||
export function setCurrentEditor(newEditor) {
|
export function setCurrentEditor(newEditor) {
|
||||||
return sessionStorage.setItem('editorType', newEditor)
|
return localStorage.setItem('editorType', newEditor)
|
||||||
|
}
|
||||||
|
|
||||||
|
export function onChange(callback: (createEditor: (textArea: HTMLTextAreaElement, onChange: () => void) => EditorType) => void) {
|
||||||
|
addEventListener('storage', async ({ key, newValue }) => {
|
||||||
|
if (key === 'editorType') {
|
||||||
|
callback(await types[newValue].createView())
|
||||||
|
}
|
||||||
|
})
|
||||||
}
|
}
|
||||||
|
|
|
@ -3,7 +3,7 @@ import './config-page.css'
|
||||||
|
|
||||||
export default async function createSettings(node) {
|
export default async function createSettings(node) {
|
||||||
node.textContent = 'Loading settings\u2026'
|
node.textContent = 'Loading settings\u2026'
|
||||||
const currentEditor = await getCurrentEditor()
|
const currentEditor = getCurrentEditor()
|
||||||
node.textContent = 'Editor type: '
|
node.textContent = 'Editor type: '
|
||||||
for (const id in types) {
|
for (const id in types) {
|
||||||
const label = document.createElement('label')
|
const label = document.createElement('label')
|
||||||
|
|
|
@ -74,6 +74,7 @@ class MonacoEditor {
|
||||||
}
|
}
|
||||||
|
|
||||||
unload() {
|
unload() {
|
||||||
|
this.textarea.value = this.getValue()
|
||||||
this.editor.dispose()
|
this.editor.dispose()
|
||||||
this.container.remove()
|
this.container.remove()
|
||||||
this.textarea.style.display = 'inline'
|
this.textarea.style.display = 'inline'
|
||||||
|
|
|
@ -2,7 +2,7 @@ import createTextareaEditor from '../editor-types/textarea'
|
||||||
import getLanguage from './get-language'
|
import getLanguage from './get-language'
|
||||||
import Output from './output'
|
import Output from './output'
|
||||||
import WrapperButtons from './wrapper-buttons'
|
import WrapperButtons from './wrapper-buttons'
|
||||||
import { EditorType, types, getCurrentEditor } from '../../editor-types'
|
import { EditorType, types, getCurrentEditor, onChange } from '../../editor-types'
|
||||||
|
|
||||||
class Editor {
|
class Editor {
|
||||||
languageSelector: HTMLSelectElement
|
languageSelector: HTMLSelectElement
|
||||||
|
@ -21,6 +21,7 @@ class Editor {
|
||||||
this.wrapperButtons = new WrapperButtons(form.querySelector('#wrapper-buttons'), this.run.bind(this))
|
this.wrapperButtons = new WrapperButtons(form.querySelector('#wrapper-buttons'), this.run.bind(this))
|
||||||
this.codeElement = form.querySelector('#code')
|
this.codeElement = form.querySelector('#code')
|
||||||
this.initializeEditor(createTextareaEditor)
|
this.initializeEditor(createTextareaEditor)
|
||||||
|
onChange(editor => this.changeEditor(editor))
|
||||||
this.initConfiguredEditor()
|
this.initConfiguredEditor()
|
||||||
this.output = new Output(form.querySelector('#output'))
|
this.output = new Output(form.querySelector('#output'))
|
||||||
this.autodeleteText = form.querySelector('#autodelete-text')
|
this.autodeleteText = form.querySelector('#autodelete-text')
|
||||||
|
@ -35,7 +36,7 @@ class Editor {
|
||||||
}
|
}
|
||||||
|
|
||||||
async initConfiguredEditor() {
|
async initConfiguredEditor() {
|
||||||
this.changeEditor(await types[await getCurrentEditor()].createView())
|
this.changeEditor(await types[getCurrentEditor()].createView())
|
||||||
}
|
}
|
||||||
|
|
||||||
changeEditor(createEditor) {
|
changeEditor(createEditor) {
|
||||||
|
|
Loading…
Reference in New Issue
Block a user