diff --git a/src/CorrectSound.mp3 b/src/CorrectSound.mp3 new file mode 100644 index 0000000..0a20183 Binary files /dev/null and b/src/CorrectSound.mp3 differ diff --git a/src/IncorrectSound.mp3 b/src/IncorrectSound.mp3 new file mode 100644 index 0000000..5adbf0d Binary files /dev/null and b/src/IncorrectSound.mp3 differ diff --git a/src/Progress.js b/src/Progress.js index 96db6e8..b48c1c6 100644 --- a/src/Progress.js +++ b/src/Progress.js @@ -9,6 +9,8 @@ import Footer from "./Footer"; import LineChart from './LineChart'; import ProgressStats from './ProgressStats'; import ConfirmationDialog from "./ConfirmationDialog"; +import CorrectSound from "./CorrectSound.mp3"; +import IncorrectSound from "./IncorrectSound.mp3"; import "./css/PopUp.css"; import "./css/Progress.css"; @@ -55,6 +57,7 @@ export default withRouter(class Progress extends React.Component { averagePercentage: null, pageLoaded: false, startTime: null, + sound: false, } constructor(props) { @@ -89,6 +92,9 @@ export default withRouter(class Progress extends React.Component { get: () => isMounted, set: (value) => isMounted = value, }); + + this.correctSound = new Audio(CorrectSound); + this.incorrectSound = new Audio(IncorrectSound); } setState = (state, callback=null) => { @@ -350,23 +356,22 @@ export default withRouter(class Progress extends React.Component { canStartTest: true, }; - if (data.correct) { - this.props.logEvent("correct_answer", { - progress_id: this.props.match.params.progressId, - }); - } else { - this.props.logEvent("incorrect_answer", { - progress_id: this.props.match.params.progressId, - }); - } - if (this.state.mode === "lives") newState.lives = data.lives; if (data.correct) { // correct answer given newState.answerInput = ""; + // play sound + if (this.props.sound) { + this.correctSound.currentTime = 0; + this.correctSound.play(); + } // show next question if there are no more answers if (!data.moreAnswers) newState = this.showNextQuestion(newState, newState); + + this.props.logEvent("correct_answer", { + progress_id: this.props.match.params.progressId, + }); } else { // incorrect answer given // store prompt and count=0 @@ -377,6 +382,15 @@ export default withRouter(class Progress extends React.Component { answer: data.lives === 0 ? data.correctAnswers : "", count: 0, }; + // play sound + if (this.props.sound) { + this.incorrectSound.currentTime = 0; + this.incorrectSound.play(); + } + + this.props.logEvent("incorrect_answer", { + progress_id: this.props.match.params.progressId, + }); } if ((data.correct || data.lives === 0) && !data.moreAnswers && this.state.incorrectAnswers[data.currentVocabId]) {