introduce debounce on output updates + linked box

codeeditor-app/elements/code-editor/code-editor.ts

@@ -3,6 +3,8 @@ import './code-editor.less';
 import * as monaco from 'monaco-editor';
 import { OutputFrame } from "../output-frame/output-frame";
 import initScript from './injects/editor-init.txt';
+import spiralBoxesSolutionScript from './injects/spiral-boxes-solution.txt';
+import { debounceManager } from "../../../shared/ensure-debounce";
 
 export class CodeEditor extends BaseElement {
 
@@ -90,7 +92,15 @@ export class CodeEditor extends BaseElement {
                             label: 'rand',
                             detail: "gets a random number between two numbers",
                             kind: monaco.languages.CompletionItemKind.Function,
-                            insertText: 'rand(${1:from}, ${1:to})',
+                            insertText: 'rand(${1:from}, ${2:to})',
+                            range: <any>null,
+                            insertTextRules: monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet
+                        },
+                        {
+                            label: 'spiralBoxesSolutionSnippet',
+                            detail: "inserts solution of spiral boxes",
+                            kind: monaco.languages.CompletionItemKind.Function,
+                            insertText: spiralBoxesSolutionScript,
                             range: <any>null,
                             insertTextRules: monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet
                         }
@@ -100,12 +110,16 @@ export class CodeEditor extends BaseElement {
         });
 
 
+        var debounce = debounceManager(1000);
         editor.onDidChangeModelContent((e) => {
             this.input = editor.getValue();
-            this.outputFrame.setScript(this.input);
+            debounce.ensureDebounce(() => {
+                this.outputFrame.setScript(this.input);
+            });
         });
 
         this.waitFor(this.outputFrame, () => {
+            console.log("setting script");
             this.outputFrame.setScript(this.input);
         });