From 10c868fbd31a3b1459143e09f2c934bf51661891 Mon Sep 17 00:00:00 2001
From: Radon Rosborough <radon.neon@gmail.com>
Date: Sat, 6 Jun 2020 15:23:21 -0600
Subject: [PATCH] Per-language syntax highlighting

---
 backend/src/api.ts   |  6 ++++++
 backend/src/langs.ts | 18 ++++++++++++++++++
 frontend/src/app.ts  | 14 +++++++++++++-
 webpack.config.js    |  1 +
 4 files changed, 38 insertions(+), 1 deletion(-)

diff --git a/backend/src/api.ts b/backend/src/api.ts
index e521b6d..00aa8ae 100644
--- a/backend/src/api.ts
+++ b/backend/src/api.ts
@@ -13,6 +13,12 @@ export class Session {
     this.ws = ws;
     this.config = langs[lang];
     this.term = null;
+    this.ws.send(
+      JSON.stringify({
+        event: "setMonacoLanguage",
+        monacoLanguage: this.config.monacoLang,
+      })
+    );
     this.run();
     ws.on("message", this.handleClientMessage);
   }
diff --git a/backend/src/langs.ts b/backend/src/langs.ts
index bc3329a..a364d54 100644
--- a/backend/src/langs.ts
+++ b/backend/src/langs.ts
@@ -1,5 +1,6 @@
 export interface LangConfig {
   cmdline: string[];
+  monacoLang: string;
   name: string;
 }
 
@@ -7,69 +8,86 @@ export const langs = {
   bash: {
     cmdline: ["bash"],
     name: "Bash",
+    monacoLang: "shell",
   },
   c: {
     cmdline: ["echo", "not implemented"],
     name: "C",
+    monacoLang: "c",
   },
   "c++": {
     cmdline: ["echo", "not implemented"],
     name: "C++",
+    monacoLang: "cpp",
   },
   clojure: {
     cmdline: ["clojure"],
     name: "Clojure",
+    monacoLang: "clojure",
   },
   emacs: {
     cmdline: ["emacs"],
     name: "Emacs Lisp",
+    monacoLang: "plaintext",
   },
   fish: {
     cmdline: ["env", "SHELL=/usr/bin/fish", "fish"],
     name: "Fish",
+    monacoLang: "plaintext",
   },
   go: {
     cmdline: ["echo", "not implemented"],
     name: "Go",
+    monacoLang: "go",
   },
   haskell: {
     cmdline: ["ghci"],
     name: "Haskell",
+    monacoLang: "plaintext",
   },
   java: {
     cmdline: ["echo", "not implemented"],
     name: "Java",
+    monacoLang: "java",
   },
   julia: {
     cmdline: ["julia"],
     name: "Julia",
+    monacoLang: "plaintext",
   },
   lua: {
     cmdline: ["lua"],
     name: "Lua",
+    monacoLang: "lua",
   },
   nodejs: {
     cmdline: ["node"],
     name: "Node.js",
+    monacoLang: "javascript",
   },
   python: {
     cmdline: ["python3"],
     name: "Python",
+    monacoLang: "python",
   },
   ruby: {
     cmdline: ["irb"],
     name: "Ruby",
+    monacoLang: "ruby",
   },
   rust: {
     cmdline: ["echo", "not implemented"],
     name: "Rust",
+    monacoLang: "rust",
   },
   vim: {
     cmdline: ["vim"],
     name: "Vimscript",
+    monacoLang: "plaintext",
   },
   zsh: {
     cmdline: ["env", "SHELL=/usr/bin/zsh", "zsh"],
     name: "Zsh",
+    monacoLang: "shell",
   },
 };
diff --git a/frontend/src/app.ts b/frontend/src/app.ts
index d45b689..0fc0f12 100644
--- a/frontend/src/app.ts
+++ b/frontend/src/app.ts
@@ -39,6 +39,13 @@ socket.addEventListener("message", (event) => {
       }
       term.write(message.output);
       return;
+    case "setMonacoLanguage":
+      if (typeof message.monacoLanguage !== "string") {
+        console.error("Unexpected message from server:", message);
+        return;
+      }
+      monaco.editor.setModelLanguage(editor.getModel(), message.monacoLanguage);
+      return;
     default:
       console.error("Unexpected message from server:", message);
       return;
@@ -59,4 +66,9 @@ term.onData((data) =>
   socket.send(JSON.stringify({ event: "terminalInput", input: data }))
 );
 
-monaco.editor.create(document.getElementById("editor"));
+const editor = monaco.editor.create(document.getElementById("editor"));
+window.addEventListener("resize", () => editor.layout());
+
+document.getElementById("runButton").addEventListener("click", () => {
+  socket.send(JSON.stringify({ event: "runCode", code: editor.getValue() }));
+});
diff --git a/webpack.config.js b/webpack.config.js
index 1f47039..4f0d4c1 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -30,6 +30,7 @@ module.exports = (_, argv) => ({
   },
   output: {
     path: path.resolve(__dirname, "frontend/out"),
+    publicPath: "/js/",
     filename: "app.js",
   },
   performance: {