From af7627d346725c974b012df8eb6ebc2a630adf4c Mon Sep 17 00:00:00 2001
From: Ilion Beyst <ilion.beyst@gmail.com>
Date: Wed, 2 Feb 2022 23:15:55 +0100
Subject: use ace editor for code editing

---
 web/pw-server/src/routes/index.svelte | 25 +++++++++++++++++++++----
 1 file changed, 21 insertions(+), 4 deletions(-)

(limited to 'web/pw-server/src/routes/index.svelte')

diff --git a/web/pw-server/src/routes/index.svelte b/web/pw-server/src/routes/index.svelte
index a2a2e61..0db994c 100644
--- a/web/pw-server/src/routes/index.svelte
+++ b/web/pw-server/src/routes/index.svelte
@@ -1,17 +1,26 @@
 <script lang="ts">
   import { goto } from "$app/navigation";
+  import { onMount } from "svelte";
 
-  let code = "";
+  let editor;
+
+  onMount(async () => {
+    const ace = await import("ace-builds");
+    editor = ace.edit("editor");
+  });
 
   async function submitCode() {
-    console.log("click");
+    if (editor === undefined) {
+      return;
+    }
+
     let response = await fetch("/api/submit_bot", {
       method: "POST",
       headers: {
         "Content-Type": "application/json",
       },
       body: JSON.stringify({
-        code: code,
+        code: editor.getValue(),
       }),
     });
 
@@ -26,5 +35,13 @@
 </script>
 
 <h1>Planetwars</h1>
-<textarea bind:value={code} />
+<div id="editor" />
 <button on:click={submitCode}>Submit</button>
+
+<style scoped>
+  #editor {
+    width: 100%;
+    max-width: 800px;
+    height: 600px;
+  }
+</style>
-- 
cgit v1.2.3

