diff options
| author | Ilion Beyst <ilion.beyst@gmail.com> | 2022-02-02 23:15:55 +0100 |
|---|---|---|
| committer | Ilion Beyst <ilion.beyst@gmail.com> | 2022-02-02 23:21:08 +0100 |
| commit | af7627d346725c974b012df8eb6ebc2a630adf4c (patch) | |
| tree | 43002e58445afe7274a2217ef6ebda481024e54b /web/pw-server/src | |
| parent | db45cea37e8070e1572cdc25121c46022780f51d (diff) | |
| download | planetwars.dev-af7627d346725c974b012df8eb6ebc2a630adf4c.tar.xz planetwars.dev-af7627d346725c974b012df8eb6ebc2a630adf4c.zip | |
use ace editor for code editing
Diffstat (limited to 'web/pw-server/src')
| -rw-r--r-- | web/pw-server/src/app.html | 34 | ||||
| -rw-r--r-- | web/pw-server/src/routes/index.svelte | 25 |
2 files changed, 37 insertions, 22 deletions
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> |