diff --git a/index.html b/index.html index eef467a..cd72a14 100644 --- a/index.html +++ b/index.html @@ -9,6 +9,10 @@ +
mode
@@ -30,10 +34,12 @@ mode Made by made by Freepik from www.flaticon.com + >www.flaticon.com + + Sound + -

Icons

+

Icons & sound

diff --git a/src/app.ts b/src/app.ts index f944e9c..b2158b0 100644 --- a/src/app.ts +++ b/src/app.ts @@ -35,6 +35,8 @@ const canvasWrapper = document.getElementsByClassName( "roulette-wheel" )[0]! as HTMLDivElement; +const audio = new Audio("/static/roulette-wheel.mp3"); + const ctx = canvasEl.getContext("2d")!; canvasEl.width = canvasWrapper.offsetWidth; @@ -59,6 +61,7 @@ configure(); function configure() { counterEl.textContent = `0/${MAXIMUM_SIZE}`; + audio.volume = 0.2; LightDarkMode.currentMode = "dark"; IdPool.initializeIdsPool(MAXIMUM_SIZE); @@ -257,6 +260,7 @@ function startRoulette() { if (winnerCleared) { drawRouletteWheel(0); } else { + audio.play(); addButtonEl.style.background = "#C0C0C0"; removeAllItemsButtonEl.style.background = "#C0C0C0"; guessItemIndex = Math.floor(Math.random() * items.length); diff --git a/static/roulette-wheel.mp3 b/static/roulette-wheel.mp3 new file mode 100644 index 0000000..d1a4651 Binary files /dev/null and b/static/roulette-wheel.mp3 differ