You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
75 lines
2.3 KiB
JavaScript
75 lines
2.3 KiB
JavaScript
import { Widget } from '@lumino/widgets';
|
|
|
|
import * as CodeMirror from 'codemirror';
|
|
import 'codemirror/mode/lua/lua.js';
|
|
import 'codemirror/mode/javascript/javascript.js';
|
|
import 'codemirror/addon/fold/foldcode.js';
|
|
import 'codemirror/addon/fold/foldgutter.js';
|
|
// import 'codemirror/lib/codemirror.css';
|
|
// import 'codemirror/theme/monokai.css';
|
|
|
|
const TIC_SPECIALS = ["TIC", "SCN", "OVR", "btn", "btnp", "clip", "cls", "circ", "circb", "exit", "fget", "font", "fset", "key", "keyp", "line", "map", "memcpy", "memset", "mget", "mouse", "mset", "music", "peek", "peek4", "pix", "pmem", "poke", "poke4", "print", "rect", "rectb", "reset", "sfx", "spr", "sync", "time", "tstamp", "trace", "tri", "textri"],
|
|
CM_OPTS = {
|
|
mode: {'name': 'lua', 'specials': TIC_SPECIALS, 'fold': true},
|
|
// mode: {'name': 'lua'},
|
|
theme: 'default',
|
|
lineNumbers: true,
|
|
lineWrapping: true,
|
|
// extraKeys: {"Ctrl-S": function(cm){ save(); }},
|
|
foldGutter: true,
|
|
gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"]
|
|
};
|
|
|
|
export class EditorWidget extends Widget {
|
|
|
|
static createNode() {
|
|
let node = document.createElement('div');
|
|
let editor = document.createElement('div');
|
|
|
|
// let input = document.createElement('input');
|
|
// input.placeholder = 'Placeholder...';
|
|
// content.appendChild(input);
|
|
node.appendChild(editor);
|
|
return node;
|
|
}
|
|
|
|
constructor(name) {
|
|
super({ node: EditorWidget.createNode() });
|
|
// let editor_div = this.node.getElementsByTagName('div')[0];
|
|
this.cm = CodeMirror(this.editorDiv, CM_OPTS);
|
|
// window.code = this.cm;
|
|
this.setFlag(Widget.Flag.DisallowLayout);
|
|
this.addClass('content');
|
|
this.addClass(name.toLowerCase());
|
|
this.title.label = name;
|
|
this.title.closable = false;
|
|
this.title.caption = `Editor: ${name}`;
|
|
}
|
|
|
|
get editorDiv () {
|
|
return this.node.getElementsByTagName('div')[0];
|
|
}
|
|
|
|
get inputNode() {
|
|
return this.node.getElementsByTagName('input')[0];
|
|
}
|
|
setValue (text) {
|
|
this.cm.setValue(text);
|
|
// this.cm.update();
|
|
}
|
|
getValue () {
|
|
return this.cm.getValue();
|
|
}
|
|
// onUpdateRequest (Message) {
|
|
// }
|
|
onAfterShow () {
|
|
//console.log("editor.onAfterShow");
|
|
this.cm.refresh();
|
|
}
|
|
onActivateRequest(Message) {
|
|
// if (this.isAttached) {
|
|
// this.inputNode.focus();
|
|
// }
|
|
}
|
|
}
|