david/code-editor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added canvas renderer

Browse Source
This commit is contained in:
David Meincke
2022-03-22 21:13:56 +01:00
parent b4762ccfed
commit 4e9d0393ec
13 changed files with 212 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
codeeditor-app/elements/code-editor/code-editor.ts
+55 -7
View File
@@ -1,4 +1,4 @@
import { BaseElement } from "../_base";
import { BaseElement } from "../../../shared/_base";
import './code-editor.less';
import * as monaco from 'monaco-editor';
import { OutputFrame } from "../output-frame/output-frame";
@@ -10,7 +10,7 @@ export class CodeEditor extends BaseElement {
onInit(): void {
this.initWorkers();
@@ -32,24 +32,72 @@ export class CodeEditor extends BaseElement {
suggestions: [
{
label: 'for',
kind: monaco.languages.CompletionItemKind.Function,
insertText: 'for (let i = 0; i < array.length; i++) {\n\n}',
kind: monaco.languages.CompletionItemKind.Snippet,
insertText: 'for (let i = 0; i < ${1:array}.length; i++) {\n\t$0\n}',
range: <any>null,
insertTextRules: monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet
},
{
label: 'forr',
kind: monaco.languages.CompletionItemKind.Snippet,
insertText: 'for (var i = ${1:array}.length - 1; i >= 0; i--) {\n\t$0\n}',
range: <any>null,
insertTextRules: monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet
},
{
label: 'rect',
detail: "details",
kind: monaco.languages.CompletionItemKind.Function,
insertText: 'for (var i = array.length - 1; i >= 0; i--) {\n\n}',
insertText: 'rect(${1:x}, ${2:y}, ${3:width}, ${4:height})',
range: <any>null,
insertTextRules: monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet
},
{
label: 'box',
detail: "details",
kind: monaco.languages.CompletionItemKind.Function,
insertText: 'box(${1:x}, ${2:y}, ${3:width}, ${4:height})',
range: <any>null,
insertTextRules: monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet
},
{
label: 'width',
detail: "gets the width of the canvas",
kind: monaco.languages.CompletionItemKind.Function,
insertText: 'width()',
range: <any>null,
insertTextRules: monaco.languages.CompletionItemInsertTextRule.KeepWhitespace
},
{
label: 'height',
detail: "gets the height of the canvas",
kind: monaco.languages.CompletionItemKind.Function,
insertText: 'height()',
range: <any>null,
insertTextRules: monaco.languages.CompletionItemInsertTextRule.KeepWhitespace
},
{
label: 'center',
detail: "gets the center of the canvas",
kind: monaco.languages.CompletionItemKind.Function,
insertText: 'center()',
range: <any>null,
insertTextRules: monaco.languages.CompletionItemInsertTextRule.KeepWhitespace
},
{
label: 'rand',
detail: "gets a random number between two numbers",
kind: monaco.languages.CompletionItemKind.Function,
insertText: 'rand(${1:from}, ${1:to})',
range: <any>null,
insertTextRules: monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet
}
]
}
)
});
});
editor.onDidChangeModelContent((e) => {
this.input = editor.getValue();
this.outputFrame.setScript(this.input);