Make play/pause button toggle shapes

toys/starship/index.md

@@ -8,7 +8,7 @@ headers:
 
 
 <div>
-  <button id="play" class="big">⏯️</button>
+  <button id="play" class="big">▶️</button>
   <span>
     🔉
     <input id="fader" type="range" min="0" max="10" step="0.01" />

toys/starship/starship.js

@@ -40,11 +40,14 @@ function init() {
   document.querySelector("#fader").addEventListener("input", setFade);
   setFade();
 
-  document.querySelector("#play").addEventListener("click", e => {
+  let play = document.querySelector("#play");
+  play.addEventListener("click", e => {
     if (audioCtx.state == "running") {
       audioCtx.suspend();
+      play.textContent = "▶️️";
     } else {
       audioCtx.resume();
+      play.textContent = "⏸️";
     }
   });