diff options
Diffstat (limited to 'web/pw-server')
| -rw-r--r-- | web/pw-server/package.json | 5 | ||||
| -rw-r--r-- | web/pw-server/src/app.html | 34 | ||||
| -rw-r--r-- | web/pw-server/src/routes/index.svelte | 25 |
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> |