From d2521fcb32972e98170bc703984fc5a91f14ccb2 Mon Sep 17 00:00:00 2001 From: Freya Murphy Date: Mon, 17 Nov 2025 15:08:59 -0500 Subject: wasm: add options for logs, debug, and seed --- Makefile | 2 +- game/Cargo.toml | 5 +-- game/src/main.rs | 68 +++++++++++------------------ game/www/index.html | 111 +++++++++++++++++++++++++++++++++++------------ game/www/style.css | 121 ++++++++++++++++++++++++++++++++++++++++++++++++++++ 5 files changed, 231 insertions(+), 76 deletions(-) create mode 100644 game/www/style.css diff --git a/Makefile b/Makefile index faf04f3..0451fd2 100644 --- a/Makefile +++ b/Makefile @@ -12,7 +12,7 @@ EMCC_CFLAGS := -O3 \ -sWASM=1 \ -sASYNCIFY \ -sGL_ENABLE_GET_PROC_ADDRESS=1 \ - -sEXPORTED_RUNTIME_METHODS=HEAPF32,ccall,cwrap + -sEXPORTED_RUNTIME_METHODS=HEAPF32,ccall,cwrap,callMain web: dist $(ASSETS_DST) diff --git a/game/Cargo.toml b/game/Cargo.toml index 0e64d0e..5cdf4af 100644 --- a/game/Cargo.toml +++ b/game/Cargo.toml @@ -8,6 +8,7 @@ publish.workspace = true rust-version.workspace = true [dependencies] +argh.workspace = true dungeon.workspace = true graphics.workspace = true @@ -20,7 +21,3 @@ x11 = ["graphics/x11"] wayland = ["graphics/wayland"] sdl = ["graphics/sdl"] static = ["graphics/static"] - -# desktop dependencies -[target.'cfg(any(target_os = "linux", target_os = "macos", target_os = "windows"))'.dependencies] -argh.workspace = true diff --git a/game/src/main.rs b/game/src/main.rs index a44f317..1ab49fe 100644 --- a/game/src/main.rs +++ b/game/src/main.rs @@ -1,49 +1,29 @@ -#[cfg(any(target_os = "linux", target_os = "macos", target_os = "windows"))] -mod arch { - use argh::FromArgs; - use game::Game; - use graphics::WindowBuilder; +use argh::FromArgs; +use game::Game; +use graphics::WindowBuilder; - /// Play a dungeon crawl game - #[derive(FromArgs)] - struct Args { - /// enable vsync - #[argh(switch)] - vsync: bool, - /// enable verbose logging - #[argh(switch, short = 'v')] - verbose: bool, - /// set the map seed - #[argh(option)] - seed: Option, - } - - pub fn main() -> graphics::Result<()> { - // Parse arguments - let args: Args = argh::from_env(); - // Load the window - let window = WindowBuilder::new() - .vsync(args.vsync) - .verbose(args.verbose) - .build()?; - Game::new(window, args.seed).run(); - Ok(()) - } -} - -#[cfg(not(any(target_os = "linux", target_os = "macos", target_os = "windows")))] -mod arch { - use game::Game; - use graphics::WindowBuilder; - - pub fn main() -> graphics::Result<()> { - // Load the window - let window = WindowBuilder::new().build()?; - Game::new(window, None).run(); - Ok(()) - } +/// Play a dungeon crawl game +#[derive(FromArgs)] +struct Args { + /// enable vsync + #[argh(switch)] + vsync: bool, + /// enable verbose logging + #[argh(switch, short = 'v')] + verbose: bool, + /// set the map seed + #[argh(option)] + seed: Option, } pub fn main() -> graphics::Result<()> { - arch::main() + // Parse arguments + let args: Args = argh::from_env(); + // Load the window + let window = WindowBuilder::new() + .vsync(args.vsync) + .verbose(args.verbose) + .build()?; + Game::new(window, args.seed).run(); + Ok(()) } diff --git a/game/www/index.html b/game/www/index.html index 2181c25..123f6a3 100644 --- a/game/www/index.html +++ b/game/www/index.html @@ -7,38 +7,95 @@ Dungeon Crawl - - - - - + diff --git a/game/www/style.css b/game/www/style.css new file mode 100644 index 0000000..3adf108 --- /dev/null +++ b/game/www/style.css @@ -0,0 +1,121 @@ +:root { + /* basic colors */ + --bg: #334; + --fg: #faf9f8; + --error: #f9a; + + /* button */ + --button-bg: #667; + --button-fg: var(--fg); + --button-border: #def; + --button-hover: #556; + + /* surface elements */ + --surface-bg: #445; + --surface-fg: var(--fg); +} + +* { + box-sizing: border-box; + font-family: monospace; + font-size: 16px; +} + +body, html { + height: 100%; + margin: 0; + padding: 0; + overflow: hidden; + background: black; +} + +#canvas { + width: 100%; +} + +#options { + background: var(--bg); + color: var(--fg); + position: relative; + width: 100%; + padding: 10px; + display: flex; + flex-direction: row; + + details, button { + background: var(--button-bg); + color: var(--button-fg); + border: 1px solid var(--button-bg); + width: fit-content; + margin-right: 10px; + + &:hover { + border: 1px solid var(--button-border); + background: var(--button-hover); + cursor: pointer; + } + } + + input { + margin: 0; + background: var(--surface-bg); + color: var(--surface-fg); + boder: none; + outline: none; + box-shadow: none; + } + + details summary, button, input { + padding: 10px; + font-weight: normal; + } + +} + +form { + padding: 0; + margin: 0; +} + +details { + ::marker { + content: ""; + } + + .menu { + pointer-events: all; + position: absolute; + margin: 10px; + padding: 10px; + top: 100%; + height: fit-content; + overflow: auto; + max-height: 40vh; + background: var(--bg); + color: var(--fg); + border-radius: 5px; + box-shadow: 0 0 4px 1px #00000088; + + label { + padding-bottom: 5px; + } + } +} + +#logs { + width: 40vw; + height: 200px; + font-size: 15px; + background-color: var(--surface-bg); + color: var(--surface-fg); + border: none; + padding: 5px; + display: flex; + flex-direction: column; + overflow-y: auto; + border-radius: 5px; + + .error { + color: var(--error); + } +} -- cgit v1.2.3-freya