Browse Source

Add chime on duel cutoff

Kirk Trombley 3 years ago
parent
commit
a0183a1184
3 changed files with 15 additions and 1 deletions
  1. 2 0
      README.md
  2. BIN
      client/src/assets/chime.mp3
  3. 13 1
      client/src/components/screens/GamePanel/RaceMode.jsx

+ 2 - 0
README.md

@@ -181,3 +181,5 @@ None currently! Submit ideas!
 ## Attributions
 
 Urban game data is based on the [World Cities Database](https://simplemaps.com/data/world-cities)
+
+Chime sound effect is [Mike Koenig's Japanese Temple Bell Small](https://soundbible.com/1496-Japanese-Temple-Bell-Small.html)

BIN
client/src/assets/chime.mp3


+ 13 - 1
client/src/components/screens/GamePanel/RaceMode.jsx

@@ -1,12 +1,24 @@
+import { useEffect } from "react";
 import ms from "pretty-ms";
 import styles from "./GamePanel.module.css";
 import { useFirstSubmitter, useIsFaded } from "./hooks";
+import chime from "../../../assets/chime.mp3";
+
+const chimeAudio = new Audio(chime);
+chimeAudio.volume = 0.25;
 
 const RaceMode = ({ rate, cutoffTime }) => {
   const first = useFirstSubmitter(rate, cutoffTime);
   const faded = useIsFaded(first);
+  const cutoff = first !== null;
+
+  useEffect(() => {
+    if (cutoff) {
+      chimeAudio.play();
+    }
+  }, [cutoff]);
 
-  if (first === null) {
+  if (!cutoff) {
     return <></>;
   }