Refactoring: cleaning up main.ts file

src/EditorSetup.ts

@@ -1,5 +1,9 @@
+import { Prec } from "@codemirror/state";
+import { indentWithTab } from "@codemirror/commands";
 import {
   keymap,
+  ViewUpdate,
+  lineNumbers,
   highlightSpecialChars,
   drawSelection,
   highlightActiveLine,
@@ -9,6 +13,7 @@ import {
   highlightActiveLineGutter,
 } from "@codemirror/view";
 import { Extension, EditorState } from "@codemirror/state";
+import { vim } from "@replit/codemirror-vim";
 import {
   defaultHighlightStyle,
   syntaxHighlighting,
@@ -23,6 +28,12 @@ import {
   closeBracketsKeymap,
 } from "@codemirror/autocomplete";
 import { lintKeymap } from "@codemirror/lint";
+import { Compartment } from "@codemirror/state";
+import { Editor } from "./main";
+import { EditorView } from "codemirror";
+import { toposTheme } from "./themes/toposTheme";
+import { javascript } from "@codemirror/lang-javascript";
+import { inlineHoveringTips } from "./documentation/inlineHelp";
 
 export const editorSetup: Extension = (() => [
   highlightActiveLineGutter(),
@@ -47,3 +58,63 @@ export const editorSetup: Extension = (() => [
     ...lintKeymap,
   ]),
 ])();
+
+export const installEditor = (app: Editor) => {
+  app.vimModeCompartment = new Compartment();
+  app.hoveringCompartment = new Compartment();
+  app.withLineNumbers = new Compartment();
+  app.chosenLanguage = new Compartment();
+  app.fontSize = new Compartment();
+  const vimPlugin = app.settings.vimMode ? vim() : [];
+  const lines = app.settings.line_numbers ? lineNumbers() : [];
+
+  const fontModif = EditorView.theme({
+    "&": {
+      fontSize: `${app.settings.font_size}px`,
+    },
+    $content: {
+      fontFamily: `${app.settings.font}, Menlo, Monaco, Lucida Console, monospace`,
+      fontSize: `${app.settings.font_size}px`,
+    },
+    ".cm-gutters": {
+      fontSize: `${app.settings.font_size}px`,
+    },
+  });
+
+  app.editorExtensions = [
+    app.vimModeCompartment.of(vimPlugin),
+    app.withLineNumbers.of(lines),
+    app.fontSize.of(fontModif),
+    app.hoveringCompartment.of(app.settings.tips ? inlineHoveringTips : []),
+    editorSetup,
+    toposTheme,
+    app.chosenLanguage.of(javascript()),
+    EditorView.updateListener.of((v: ViewUpdate) => {
+      v;
+    }),
+  ];
+  app.dynamicPlugins = new Compartment();
+  app.state = EditorState.create({
+    extensions: [
+      ...app.editorExtensions,
+      EditorView.lineWrapping,
+      app.dynamicPlugins.of(app.userPlugins),
+      Prec.highest(
+        keymap.of([
+          {
+            key: "Ctrl-Enter",
+            run: () => {
+              return true;
+            },
+          },
+        ])
+      ),
+      keymap.of([indentWithTab]),
+    ],
+    doc: app.universes[app.selected_universe].global.candidate,
+  });
+  app.view = new EditorView({
+    parent: document.getElementById("editor") as HTMLElement,
+    state: app.state,
+  });
+};