diff --git a/src/App.js b/src/App.js index 661367f..c9c5526 100644 --- a/src/App.js +++ b/src/App.js @@ -25,6 +25,7 @@ import BringTheWords from "./Firebase Querys/BringTheWord"; import SelectRandomWord from "./Firebase Querys/SelectRandomWord"; import getWidthScreenUser from "./General Scripts/getWidthScreenUser"; import LetterInput from "./components/Letter Input/LetterInput"; +import introducedLetterSound from './sound/Letter introduced.mp3' function App() { const [displayApp, setDisplayApp] = useState(false) @@ -114,6 +115,9 @@ function App() { if (alphabet.includes(currentKey)) { setLettersRegistered([...lettersRegistered, currentKey]) + + const audio = document.getElementsByClassName('letterIntroduced-audio-container')[0] + audio.play() if (selectedWord.includes(currentKey)) { @@ -226,6 +230,10 @@ function App() { + + ); } diff --git a/src/components/Victory && Defeat/Defeat.jsx b/src/components/Victory && Defeat/Defeat.jsx index 37217d5..e746e34 100644 --- a/src/components/Victory && Defeat/Defeat.jsx +++ b/src/components/Victory && Defeat/Defeat.jsx @@ -1,10 +1,18 @@ import React from "react" +import defeatSound from './sounds/Defeat Sound.mp3' const Defeat = ({language}) => { const [text, setText] = React.useState('') React.useEffect(() => { + + const playAudio = () => { + + const audio = document.getElementsByClassName('defeat-audio-container')[0] + audio.play() + + } if (language === 'english') { @@ -15,13 +23,20 @@ const Defeat = ({language}) => { setText('PERDISTE') } + + playAudio() }, []) return ( -
-

{text}

-
+ <> +
+

{text}

+
+ + ) } diff --git a/src/components/Victory && Defeat/Victory.jsx b/src/components/Victory && Defeat/Victory.jsx index b7d4ce6..97f4911 100644 --- a/src/components/Victory && Defeat/Victory.jsx +++ b/src/components/Victory && Defeat/Victory.jsx @@ -1,4 +1,5 @@ import React from 'react' +import victorySound from './sounds/Victory sound.mp3' const Victory = ({currentScore, setCurrentScore, language}) => { @@ -6,6 +7,13 @@ const Victory = ({currentScore, setCurrentScore, language}) => { React.useEffect(() => { + const playAudio = () => { + + const audio = document.getElementsByClassName('victory-audio-container')[0] + audio.play() + + } + setCurrentScore(parseInt(currentScore) + 1) if (language === 'english') { @@ -17,13 +25,20 @@ const Victory = ({currentScore, setCurrentScore, language}) => { setText('VICTORIA') } + + playAudio() }, []) return ( -
-

{text}

-
+ <> +
+

{text}

+
+ + ) } diff --git a/src/components/Victory && Defeat/sounds/Defeat Sound.mp3 b/src/components/Victory && Defeat/sounds/Defeat Sound.mp3 new file mode 100644 index 0000000..544fe2b Binary files /dev/null and b/src/components/Victory && Defeat/sounds/Defeat Sound.mp3 differ diff --git a/src/components/Victory && Defeat/sounds/Victory sound.mp3 b/src/components/Victory && Defeat/sounds/Victory sound.mp3 new file mode 100644 index 0000000..22cc58b Binary files /dev/null and b/src/components/Victory && Defeat/sounds/Victory sound.mp3 differ diff --git a/src/sound/Letter introduced.mp3 b/src/sound/Letter introduced.mp3 new file mode 100644 index 0000000..76ac453 Binary files /dev/null and b/src/sound/Letter introduced.mp3 differ