Hotfix for broken install target in Makefile

I didn't check that it also *installs* all of it's components! That's
what I get for not having a list of package contents... although I'd
probably just end up missing something there instead.

Cargo.lock

@@ -242,7 +242,7 @@ dependencies = [
 
 [[package]]
 name = "asteroids"
-version = "0.6.0-dev3"
+version = "0.6.1"
 dependencies = [
  "bevy",
  "bevy-inspector-egui",
@@ -4295,9 +4295,9 @@ dependencies = [
 
 [[package]]
 name = "portable-atomic"
-version = "1.11.1"
+version = "1.12.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "f84267b20a16ea918e43c6a88433c2d54fa145c92a811b5b047ccbe153674483"
+checksum = "f59e70c4aef1e55797c2e8fd94a4f2a973fc972cfde0e0b05f683667b0cd39dd"
 
 [[package]]
 name = "portable-atomic-util"

Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "asteroids"
-version = "0.6.0-dev3"
+version = "0.6.1"
 edition = "2024"
 license = "AGPL-3.0-only"
 

Makefile

@@ -12,23 +12,26 @@ CARGO_PROFILE := tiny
 SRC_DIR = ./src
 SRCS := $(wildcard $(SRC_DIR)/**)
 
+ASSET_SOURCE := $(wildcard assets/**)
+ASSETS := $(patsubst assets/%.ogg, out/assets/%.ogg, $(ASSET_SOURCE))
+
 .PHONY: clean full-clean tarball tarball-standalone web web-standalone
 
 # "Standalone" version. It includes an index.html to serve as-is
-web-standalone: out/asteroids.js out/asteroids_bg.wasm.gz out/index.html
+web-standalone: out/asteroids.js out/asteroids_bg.wasm.gz out/index.html $(ASSETS)
 
 # "Bundle-able" version. It has a page, but no index.html. Consumers are
 # expected to provide their own index.html and link to this page.
-web: out/asteroids.js out/asteroids_bg.wasm.gz out/asteroids.html
+web: out/asteroids.js out/asteroids_bg.wasm.gz out/asteroids.html $(ASSETS)
 
 tarball: asteroids_web_root.tar
 
 tarball_standalone: asteroids_web_root_standalone.tar
 
-asteroids_web_root.tar: out/asteroids.js out/asteroids_bg.wasm.gz out/asteroids.html
+asteroids_web_root.tar: out/asteroids.js out/asteroids_bg.wasm.gz out/asteroids.html $(ASSETS)
 	tar -caf $@ $^
 
-asteroids_web_root_standalone.tar: out/asteroids.js out/asteroids_bg.wasm.gz out/index.html
+asteroids_web_root_standalone.tar: out/asteroids.js out/asteroids_bg.wasm.gz out/index.html $(ASSETS)
 	tar -caf $@ $^
 
 target/$(CARGO_TARGET)/$(CARGO_PROFILE)/asteroids.wasm: $(SRCS) Cargo.lock Cargo.toml
@@ -37,6 +40,12 @@ target/$(CARGO_TARGET)/$(CARGO_PROFILE)/asteroids.wasm: $(SRCS) Cargo.lock Cargo
 out:
 	mkdir $@
 
+out/assets: | out
+	mkdir $@
+
+out/assets/%.ogg: assets/%.ogg | out/assets
+	cp -ar assets/$*.ogg $@
+
 # Both the JS and WASM files are generated by the wasm-bindgen call, so both
 # get to be on the target half of this recipe.
 out/asteroids.js out/asteroids_bg.wasm.gz &: target/$(CARGO_TARGET)/$(CARGO_PROFILE)/asteroids.wasm | out
@@ -67,6 +76,8 @@ full-clean: clean
 # output into the web root. Only supports the "bundle-able" mode.
 install: web
 	install -dm0755 $(DESTDIR)
+	install -dm0755 $(DESTDIR)/assets
 	install -m0644 out/asteroids.js $(DESTDIR)/
 	install -m0644 out/asteroids_bg.wasm.gz $(DESTDIR)/
 	install -m0644 out/asteroids.html $(DESTDIR)/
+	install -m0644 $(ASSETS) $(DESTDIR)/assets/

src/widgets.rs

@@ -180,9 +180,9 @@ fn spawn_get_ready(mut commands: Commands, mut timer: ResMut<ReadySetGoTimer>) {
             height: Val::Percent(30.),
             ..default()
         },
-        BackgroundColor(LIGHT_BLUE.into()),
+        BackgroundColor(Color::NONE),
         children![
-            (Text::new("Get Ready!"), TextColor(BLACK.into())),
+            (Text::new("Get Ready!"), TextColor(WHITE.into())),
             (
                 CountdownBar,
                 Node {

www/index.html

@@ -12,6 +12,7 @@
         margin: auto;
         padding: 0.5em;
       }
+      #prestart-controls,
       canvas {
         margin-top: 1em;
         margin-left: auto;
@@ -22,6 +23,26 @@
         border-radius: 8px;
         background-color: rgb(40%, 40%, 40%);
       }
+      #prestart-controls {
+        width: 800px;
+        height: 600px;
+        text-align: center;
+        align-content: center;
+      }
+      button {
+        font-size: 20px;
+        text-shadow: 0.2em 0.2em 0px rgba(0, 0, 0, 75%);
+        padding: 1em;
+        border-radius: 2em;
+        border-style: solid;
+        border-color: black;
+        color: rgb(90%, 90%, 90%);
+        background-color: rgb(15%, 15%, 15%);
+      }
+      button:hover {
+        background-color: rgb(25%, 25%, 25%);
+        border-color: rgb(90%, 90%, 90%);
+      }
       main {
         margin-left: auto;
         margin-right: auto;
@@ -41,13 +62,21 @@
   <h1>
     Robert's Bad Asteroids Game
   </h1>
-  <canvas id="game-canvas" width="1280" height="720"></canvas>
+  <!-- <canvas id="game-canvas" width="800" height="600"></canvas> -->
+  <div id="prestart-controls">
+    <button id="gameload-button">Load Game</button>
+  </div>
   <main>
     <article>
       <h2>Description</h2>
       <p>
         A (work in progress) version of the Asteroids arcade game.
       </p>
+      <p>
+        <em>Sound Warning!</em> The game now has sound effects, but there are no controls on the page for changing the
+        volume (including to mute them). You can mute the browser tab by pressing <code>ctrl</code> + <code>m</code>.
+        Proper volume controls are coming soon.
+      </p>
     </article>
     <article>
       <h3>Controls</h3>
@@ -90,7 +119,7 @@
         <tr>
           <td>Program Version</td>
           <!-- This version text is completely unchecked. I'll need to do something about that. -->
-          <td><code>v0.5.0</code></td>
+          <td><code>v0.6.1</code></td>
         </tr>
       </table>
     </article>
@@ -98,6 +127,16 @@
   <script type="module">
     import init from './asteroids.js'
     
+    let button = document.getElementById("gameload-button");
+    button.onclick = async function loadGame() {
+      console.log("Game Load button was pressed!");
+      let canvas = document.createElement("canvas");
+      // <canvas id="game-canvas" width="800" height="600"></canvas>
+      canvas.setAttribute("id", "game-canvas");
+      canvas.setAttribute("width", "800");
+      canvas.setAttribute("height", "600");
+      button.parentElement.replaceWith(canvas);
+
       let compressed = await fetch("./asteroids_bg.wasm.gz")
       let wasm_stream = compressed.body.pipeThrough(new DecompressionStream("gzip"))
       let blob = await new Response(wasm_stream).blob();
@@ -107,6 +146,7 @@
           throw error;
         }
       });
+    }
   </script>
 </body>