From 8664ecfef8df4c1e2103a52d628f2693eefb6f89 Mon Sep 17 00:00:00 2001 From: pommicket Date: Wed, 14 Aug 2024 11:20:22 -0400 Subject: index.html --- TODO.txt | 1 + game.html | 1 + game.js | 1 - index.html | 18 ++++++++++++++---- index.js | 19 ++++++++++++++++++- server/src/main.rs | 4 +++- style.css | 11 +++++++++++ 7 files changed, 48 insertions(+), 7 deletions(-) diff --git a/TODO.txt b/TODO.txt index 4fc37dc..c2a19e8 100644 --- a/TODO.txt +++ b/TODO.txt @@ -2,3 +2,4 @@ - congratualations - handle server errors on the client side - link to wikimedia File: page rather than image +- let user select piece size diff --git a/game.html b/game.html index 666f018..c435b59 100644 --- a/game.html +++ b/game.html @@ -11,6 +11,7 @@ diff --git a/game.js b/game.js index aed0da3..a30b985 100644 --- a/game.js +++ b/game.js @@ -372,7 +372,6 @@ window.addEventListener('load', function () { console.assert(puzzleWidth === data[8]); console.assert(puzzleHeight === data[9]); } - console.log(data); const nibTypesOffset = 10; const nibTypeCount = 2 * puzzleWidth * puzzleHeight - puzzleWidth - puzzleHeight; const nibTypes = new Uint16Array(payload, nibTypesOffset, nibTypeCount); diff --git a/index.html b/index.html index 5f1d8de..04ad189 100644 --- a/index.html +++ b/index.html @@ -9,9 +9,19 @@ - - - - + +

jigsaw

+ diff --git a/index.js b/index.js index 4a7fbd3..7ad57f0 100644 --- a/index.js +++ b/index.js @@ -1,5 +1,22 @@ window.addEventListener('load', function () { const getById = (id) => document.getElementById(id); - getById("host").addEventListener("click", async function () { + const customImageRadio = getById("custom-image"); + const customImageURL = getById("image-url"); + function onImageTypeChange() { + customImageURL.disabled = customImageRadio.checked ? '' : 'disabled'; + } + onImageTypeChange(); + for (const radio of document.querySelectorAll('input[name=image]')) { + radio.addEventListener("change", onImageTypeChange); + } + const hostForm = getById("host-form"); + hostForm.addEventListener("submit", function () { + const formData = new FormData(hostForm); + const pieceCount = formData.get('pieces'); + const image = formData.get('image') === 'custom' ? formData.get('image-url') : formData.get('image'); + const search = new URLSearchParams(); + search.set('image', image); + search.set('pieces', pieceCount); + location.href = `game.html?${search}`; }); }); diff --git a/server/src/main.rs b/server/src/main.rs index 2c33174..03ae435 100644 --- a/server/src/main.rs +++ b/server/src/main.rs @@ -369,9 +369,10 @@ async fn handle_websocket( ) .await?; server.player_counts.lock().await.insert(id, 1); + *puzzle_id = Some(id); ws.send(Message::Text(format!( "id: {}", - std::str::from_utf8(&id).expect("puzzle ID has bad utf-8???") + std::str::from_utf8(&id)? ))) .await?; let info = get_puzzle_info(server, &id).await?; @@ -577,6 +578,7 @@ async fn main() { tokio::time::sleep(std::time::Duration::from_secs(3600)).await; } }); + println!("Server initialized! Waiting for connections..."); loop { let (mut stream, addr) = match listener.accept().await { Ok(result) => result, diff --git a/style.css b/style.css index b4f66c0..47e9f71 100644 --- a/style.css +++ b/style.css @@ -8,6 +8,13 @@ body { margin: 0; position: relative; } +body.margined { + margin: 0.5em; +} +.form-line { + display: block; + margin: 0.5em 0; +} #header { height: 1.5em; @@ -21,6 +28,10 @@ a, a:visited { text-decoration: none; } +#header a { + padding: 0 0.5em; +} + #play-area { width: 100vw; /* annoyingly, firefox ESR 115 still doesn't support lh */ -- cgit v1.2.3