diff options
author | Ilion Beyst <ilion.beyst@gmail.com> | 2022-01-02 17:57:40 +0100 |
---|---|---|
committer | Ilion Beyst <ilion.beyst@gmail.com> | 2022-01-02 17:57:40 +0100 |
commit | 1cde40b45916d1f99a4cda7837b516cde761f127 (patch) | |
tree | e74367db95dd4e9200783c78df2b3d811d834ead /web/pw-server/src/lib/components/Visualizer.svelte | |
parent | 69331eb08a6199bfa8378e08cf378803b076eaae (diff) | |
download | planetwars.dev-1cde40b45916d1f99a4cda7837b516cde761f127.tar.xz planetwars.dev-1cde40b45916d1f99a4cda7837b516cde761f127.zip |
basic match views
Diffstat (limited to 'web/pw-server/src/lib/components/Visualizer.svelte')
-rw-r--r-- | web/pw-server/src/lib/components/Visualizer.svelte | 57 |
1 files changed, 57 insertions, 0 deletions
diff --git a/web/pw-server/src/lib/components/Visualizer.svelte b/web/pw-server/src/lib/components/Visualizer.svelte new file mode 100644 index 0000000..d53eb36 --- /dev/null +++ b/web/pw-server/src/lib/components/Visualizer.svelte @@ -0,0 +1,57 @@ +<script lang="ts"> + import { onMount } from "svelte"; + import * as visualizer from "pw-visualizer"; + import init_wasm_module from "planetwars-rs"; + + export let matchLog = null; + + let initialized = false; + + onMount(async () => { + await init_wasm_module(); + + visualizer.init(); + initialized = true; + visualizer.set_loading(false); + }); + + $: if (initialized) { + if (matchLog === null) { + visualizer.set_loading(true); + } else { + visualizer.set_instance(matchLog); + visualizer.set_loading(false); + } + } +</script> + +<div id="main" class="loading"> + <canvas id="canvas" /> + <div id="name" /> + <div id="addbutton" class="button" /> + + <div id="meta"> + <div id="turnCounter">0 / 0</div> + <div> + <span>Ms per frame: </span> + <input type="number" id="speed" value="300" /> + </div> + <div class="slidecontainer"> + <input type="range" min="0" max="1" value="1" class="slider" id="turnSlider" /> + </div> + </div> + <div class="lds-roller"> + <div /> + <div /> + <div /> + <div /> + <div /> + <div /> + <div /> + <div /> + </div> +</div> + +<style scoped> + @import "pw-visualizer/src/style.css"; +</style> |