Merge pull request #146 from osutcj/CSS-48-All-sounds-should-be-playe…

…d-from-the-dashboard game x sound to come from admin panel like the other sounds
osutcj · Sep 29, 2023 · 2f3e6dd · 2f3e6dd
2 parents 392d101 + dc1ff89
commit 2f3e6dd
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 9 deletions.
diff --git a/src/screens/Game.tsx b/src/screens/Game.tsx
@@ -10,10 +10,9 @@ import '../static/styles/home.css';
 import { useParams } from 'react-router-dom';
 import useGame from '../hooks/useGame';
 import QuestionsService from '../services/questions.service';
-import wrongAnswerSound from '../static/x.mp3';
 import wrongAnswerPng from '../static/x.png';
 import { truncateQuestion } from '../helpers/truncate-question';
-import { useSounds } from '../hooks/useSounds.hook';
+import { WRONG_ANSWER_TIME } from '../utils/contants';
 
 const Game = () => {
  const [currentQuestion, setCurrentQuestion] = useState<DBQuestion>();
@@ -37,15 +36,11 @@ const Game = () => {
  if (game?.wrongAnswer === 0) {
  return;
  }
- const audio = new Audio(wrongAnswerSound);
- const { play, stop } = useSounds(audio);
- play(audio);
  setWrongAnswers(Math.min(3, game.wrongAnswer));
 
  setTimeout(() => {
  setWrongAnswers(0);
- stop(audio);
- }, 2000);
+ }, WRONG_ANSWER_TIME);
  }, [game?.wrongAnswer]);
 
  useEffect(() => {

diff --git a/src/shared/GameRound/GameRoundAdmin.tsx b/src/shared/GameRound/GameRoundAdmin.tsx
@@ -20,6 +20,8 @@ import { NormalGame } from '../../types/game';
 import { useSounds } from '../../hooks/useSounds.hook';
 import round_start from '../../static/round_start.mp3';
 import correct_answer from '../../static/correct_answer.mp3';
+import wrongAnswerSound from '../../static/x.mp3';
+import { WRONG_ANSWER_TIME } from '../../utils/contants';
 
 const GameRoundAdmin = (props: any) => {
  const [questions, setQuestions] = useState<DBQuestion[]>([]);
@@ -101,6 +103,9 @@ const GameRoundAdmin = (props: any) => {
  };
 
  const setAllWrong = () => {
+ if (counterWrongAnswers != 3){
+ playSound(wrongAnswerSound, WRONG_ANSWER_TIME);
+ }
  GamesService.update(selectedGame, {
  ...game,
  wrongAnswer: 3
@@ -380,12 +385,20 @@ const GameRoundAdmin = (props: any) => {
  </div>
  <div style={{ marginTop: 10, width: '100%' }}>
  <p style={{ textAlign: 'center' }}>Wrong answers</p>
- <Button variant="outlined" onClick={() => setAllWrong()} style={{ marginRight: 10 }}>
+ <Button variant="outlined" onClick={() => {
+ setAllWrong();
+ }} 
+ style={{ marginRight: 10 }}>
  Set All wrong
  </Button>
  <Button
  variant="outlined"
- onClick={() => setCounterWrongAnswers((prevState) => Math.min(prevState + 1, 3))}
+ onClick={() => {
+ setCounterWrongAnswers((prevState) => Math.min(prevState + 1, 3))
+ if (counterWrongAnswers <= 3){
+ playSound(wrongAnswerSound, WRONG_ANSWER_TIME);
+ }
+ }}
  style={{ marginRight: 10 }}
  >
  {counterWrongAnswers} wrong (click for +1)

diff --git a/src/utils/contants.ts b/src/utils/contants.ts
@@ -9,3 +9,4 @@ export enum environmentType {
 
 export const TIMER_LENGTH = 20;
 export const TIMER_BONUS = 5;
+export const WRONG_ANSWER_TIME = 3000;