-
Notifications
You must be signed in to change notification settings - Fork 0
/
CodeEditorClip.js
44 lines (39 loc) · 1.2 KB
/
CodeEditorClip.js
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
import { BrowserClip } from "@donkeyclip/motorcortex";
import CodeFlask from "codeflask";
import darkTheme from "./themes/dark";
export default class CodeEditorClip extends BrowserClip {
get html() {
return `<div id="code-editor"></div>`;
}
get css() {
let toReturn = `
#code-editor{
width: 100%;
height: 100%;
}
`;
if (this.attrs.darkTheme === true) {
const theme = darkTheme;
toReturn += `${theme}`;
}
return toReturn;
}
onAfterRender() {
const flask = new CodeFlask(this.context.getElements("#code-editor")[0], {
language: "js",
lineNumbers: this.attrs.lineNumbers === true,
defaultTheme: this.attrs.darkTheme !== true,
readonly: this.attrs.readOnly === true,
});
const css1 = document.getElementById("codeflask-style");
this.context.rootElement.appendChild(css1.cloneNode(true));
if (this.attrs.darkTheme !== true) {
const css2 = document.getElementById("theme-default");
this.context.rootElement.appendChild(css2.cloneNode(true));
}
this.setCustomEntity("editor", {
flask: flask,
textarea: this.context.getElements("#code-editor > div > textarea")[0],
});
}
}