/
code-editor.ts
66 lines (54 loc) · 1.92 KB
/
code-editor.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
import { CodeEditor } from 'babylonjs-editor';
import CodeProjectEditor, { Script } from './project-editor';
export default class CodeEdit {
// Public members
public codeEditor: CodeProjectEditor;
public code: CodeEditor = null;
public onClose: () => void = null;
public onChange: () => void = null;
/**
* Constructor
* @param codeEditor the code editor reference
*/
constructor (codeEditor: CodeProjectEditor) {
this.codeEditor = codeEditor;
}
/**
* Creates the code editor
*/
public async create (code: Script): Promise<void> {
// Create tab
this.codeEditor.codeLayout.layout.addPanelToStack('edit-panel', {
type: 'component',
title: code.name,
componentName: code.id,
html: `<div id="${code.id}-editor" style="width: 100%; height: 100%;"></div>`,
onClose: () => {
this.code.dispose();
if (this.onClose)
this.onClose();
}
});
// Create editor
this.code = new CodeEditor('typescript', code.code);
await this.code.build(code.id + '-editor');
// On the user changes the code
let compileTimeoutId = -1;
this.code.onChange = value => {
// Set a timeout before transpilation until the user
// finished typings his code
clearTimeout(compileTimeoutId);
compileTimeoutId = setTimeout(() => {
const config = {
module: 'cjs',
target: 'es5',
experimentalDecorators: true,
};
code.code = value;
code.compiledCode = this.code.transpileTypeScript(code.code, code.name.replace(/ /, ''), config);
if (this.onChange)
this.onChange();
}, 500);
};
}
}