Merge pull request #213 from oskarrough/feat/mute-button

Add a sound mute button to the menu

src/ui/components/menu.js

@@ -1,6 +1,7 @@
-import {html} from '../lib.js'
+import {html, useState} from '../lib.js'
 import History from './history.js'
 import {saveToUrl} from '../save-load.js'
+import {toggleMute} from '../sounds.js'
 
 // @ts-ignore
 const abandonGame = () => (window.location.href = window.location.origin)
@@ -17,6 +18,13 @@ const abandonGame = () => (window.location.href = window.location.origin)
  * @returns {import('preact').VNode}
  */
 export default function Menu({game, gameState, onUndo}) {
+	const [muted, setMuted] = useState(false)
+
+	function toggleSound() {
+		toggleMute(!muted)
+		setMuted(!muted)
+	}
+
 	return html`
 		<div class="Container">
 			<h1 center>Slay the Web</h1>
@@ -34,6 +42,7 @@ export default function Menu({game, gameState, onUndo}) {
 					<li>
 						<button onclick=${() => abandonGame()}>Abandon Game</button>
 					</li>
+					<li><label>Sound <input type="checkbox" checked=${!muted} onClick=${() => toggleSound()}/></label></li>
 				</ul>
 			</div>
 

src/ui/sounds.js

@@ -130,6 +130,10 @@ const playDefenseCard = () => {
 	amSynth.triggerAttackRelease('G#2', 0.02)
 }
 
+export const toggleMute = (shouldMute) => {
+	Tone.Master.mute = shouldMute
+}
+
 export default {
 	startGame,
 	startTurn,