aboutsummaryrefslogtreecommitdiff
path: root/web
diff options
context:
space:
mode:
authorIlion Beyst <ilion.beyst@gmail.com>2022-02-02 23:15:55 +0100
committerIlion Beyst <ilion.beyst@gmail.com>2022-02-02 23:21:08 +0100
commitaf7627d346725c974b012df8eb6ebc2a630adf4c (patch)
tree43002e58445afe7274a2217ef6ebda481024e54b /web
parentdb45cea37e8070e1572cdc25121c46022780f51d (diff)
downloadplanetwars.dev-af7627d346725c974b012df8eb6ebc2a630adf4c.tar.xz
planetwars.dev-af7627d346725c974b012df8eb6ebc2a630adf4c.zip
use ace editor for code editing
Diffstat (limited to 'web')
-rw-r--r--web/pw-server/package.json5
-rw-r--r--web/pw-server/src/app.html34
-rw-r--r--web/pw-server/src/routes/index.svelte25
3 files changed, 40 insertions, 24 deletions
diff --git a/web/pw-server/package.json b/web/pw-server/package.json
index eafc63f..53a4492 100644
--- a/web/pw-server/package.json
+++ b/web/pw-server/package.json
@@ -31,10 +31,11 @@
"vite-plugin-wasm-pack": "^0.1.9"
},
"dependencies": {
+ "ace-builds": "^1.4.14",
"dayjs": "^1.10.7",
- "svelte-select": "^4.4.7",
+ "planetwars-rs": "file:../planetwars-rs/pkg",
"pw-visualizer": "file:../pw-visualizer",
- "planetwars-rs": "file:../planetwars-rs/pkg"
+ "svelte-select": "^4.4.7"
},
"type": "module"
}
diff --git a/web/pw-server/src/app.html b/web/pw-server/src/app.html
index 3193582..7460227 100644
--- a/web/pw-server/src/app.html
+++ b/web/pw-server/src/app.html
@@ -1,22 +1,20 @@
<!DOCTYPE html>
<html lang="en">
+ <head>
+ <!-- polyfill global -->
+ <script>
+ const global = globalThis;
+ </script>
+ <!-- end polyfill -->
-<head>
- <!-- polyfill global -->
- <script>
- const global = globalThis;
- </script>
- <!-- end polyfill -->
+ <meta charset="utf-8" />
+ <meta name="description" content="" />
+ <link rel="icon" href="/favicon.ico" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ %svelte.head%
+ </head>
- <meta charset="utf-8" />
- <meta name="description" content="" />
- <link rel="icon" href="/favicon.ico" />
- <meta name="viewport" content="width=device-width, initial-scale=1" />
- %svelte.head%
-</head>
-
-<body>
- <div id="svelte">%svelte.body%</div>
-</body>
-
-</html> \ No newline at end of file
+ <body>
+ <div id="svelte">%svelte.body%</div>
+ </body>
+</html>
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>