Skip to content

Commit

Permalink
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: added gametraker in savannah and fix bugs
Browse files Browse the repository at this point in the history
alexlatypov94 committed Apr 13, 2021
1 parent 3599b5a commit 1f9768f
Showing 10 changed files with 40 additions and 58 deletions.
39 changes: 3 additions & 36 deletions src/components/AudioCallingPage/FinishWindow/FinishWindow.tsx
Original file line number Diff line number Diff line change
@@ -1,16 +1,14 @@
import React, { useEffect } from 'react';
import { useSelector, useDispatch } from 'react-redux';
import { ListItem, List, ListSubheader } from '@material-ui/core';
import {
resetEndGame,
clickStartGame,
resetWordsToStartNewGame,
} from '../../../store/actions/audioCallingActions';
import backendUrl, { playIcon } from '../../../constants';
import { addWordsToUserDictionary } from '../../../store/actions/dictionaryActions';
import { IAppState, IWord } from '../../../store/types';
import { IAudioCallingWords } from '../../../store/reducers/audioCallingReducer/types';
import useStyles from './styles';
import { TableEndGame } from '../../commonComponents';

const FinishGame: React.FC = () => {
const dispatch = useDispatch();
@@ -30,46 +28,15 @@ const FinishGame: React.FC = () => {
};

useEffect(() => {
const copy = audioCallingData.words.map((el) => ({ word: el.word, correct: el.isCorrect }));
const copy = audioCallingData.words.map((el) => ({ word: el.wordObj, correct: el.isCorrect }));
sendWords(copy);
return () => handleExitGame();
}, []);

return (
<div className={styles.wrapper}>
<h2 className={styles.title}>Статистика</h2>
<List className={styles.root} subheader={<li />}>
<ListSubheader>Я знаю:</ListSubheader>
{audioCallingData.words
.filter((el: IAudioCallingWords) => el.isCorrect === true)
.map((el: IAudioCallingWords) => (
<ListItem key={el.word.id} className={styles.li}>
<button
className={styles.play}
type="button"
onClick={() => new Audio(`${backendUrl}/${el.word.audio}`).play()}>
<img className={styles.playIcon} src={playIcon} alt={el.word.word} />
</button>
{`${el.word.word} - ${el.word.wordTranslate}`}
</ListItem>
))}
</List>
<List className={styles.root} subheader={<li />}>
<ListSubheader>Я не знаю:</ListSubheader>
{audioCallingData.words
.filter((el: IAudioCallingWords) => el.isCorrect === false)
.map((el: IAudioCallingWords) => (
<ListItem className={styles.li} key={el.word.id}>
<button
className={styles.play}
type="button"
onClick={() => new Audio(`${backendUrl}/${el.word.audio}`).play()}>
<img className={styles.playIcon} src={playIcon} alt={el.word.word} />
</button>
{` ${el.word.word} - ${el.word.wordTranslate}`}
</ListItem>
))}
</List>
<TableEndGame words={audioCallingData.words} />
<button type="button" className={styles.newGame} onClick={handleExitGame}>
НОВАЯ ИГРА
</button>
Original file line number Diff line number Diff line change
@@ -45,12 +45,14 @@ const SavannahEndGame: React.FC = () => {
}, []);

useEffect(() => {
const arrayForUserDictionary = savannahData.wordsData.map((el) => {
return {
word: el.wordObj,
correct: el.isCorrect,
};
});
const arrayForUserDictionary = savannahData.wordsData
.filter((el) => el.isCorrect !== undefined)
.map((el) => {
return {
word: el.wordObj,
correct: el.isCorrect,
};
});
return () => {
if (user.userId) sendWordsToUserDictionary(arrayForUserDictionary, user);
};
13 changes: 11 additions & 2 deletions src/components/GameSavannah/SavannahGamePlay/SavannahGamePlay.tsx
Original file line number Diff line number Diff line change
@@ -10,6 +10,7 @@ import { SAVANNAH, VOLUME_DIVIDER } from '../../../constants';
import { KEYBOARD_CODE } from '../constants';
import { IAppState, IGameName, ISavannahWord } from '../../../store/types';
import useStyles from '../styles';
import GameTracker from '../../commonComponents/GameTracker';

const SavannahGamePlay: React.FC = () => {
const savannahData = useSelector((state: IAppState) => state?.savannah);
@@ -57,6 +58,7 @@ const SavannahGamePlay: React.FC = () => {
const currentWord = savannahData.isEng
? savannahData?.wordsData?.[startWord]?.word
: savannahData?.wordsData?.[startWord]?.translate;
const isAudioAnswer = startWord >= savannahData?.wordsData.length - 1 || health === 1;

const classes = useStyles();

@@ -98,6 +100,12 @@ const SavannahGamePlay: React.FC = () => {
Math.max(currentSuccessSeries, successSeriesMaxLength)
);
}
if (health === 0) {
onAudioPlay(SAVANNAH.finishAudioFail);
}
if (health > 0 && isEndGame) {
onAudioPlay(SAVANNAH.finishAudioWin);
}
const timeout = setTimeout(() => timeOutFunc(), SAVANNAH.timeOutDelay);
return () => {
clearTimeout(timeout);
@@ -119,12 +127,12 @@ const SavannahGamePlay: React.FC = () => {
const checkAnswer = (word: string) => {
const matchCheck = currentWord.toLocaleLowerCase() === word.toLocaleLowerCase();
if (matchCheck) {
onAudioPlay(SAVANNAH.audioCorrect);
if (!isAudioAnswer) onAudioPlay(SAVANNAH.audioCorrect);
setIsCorrectAnswer(true);
answer(savannahData.wordsData, currentWord, true);
setCurrentSuccessSeries(currentSuccessSeries + 1);
} else {
onAudioPlay(SAVANNAH.audioIncorrect);
if (!isAudioAnswer) onAudioPlay(SAVANNAH.audioIncorrect);
answer(savannahData.wordsData, currentWord, false);
setIsCorrectAnswer(false);
setHealth(health - 1);
@@ -219,6 +227,7 @@ const SavannahGamePlay: React.FC = () => {
{isRenderingFallingWords && renderFallingWords()}
{renderChooseWord()}
<div className={classes.savannahFooter}>
<GameTracker index={startWord + 1} end={savannahData.wordsData.length} />
{startWord > 0 && (
<img
className={`${classes.footerImg}${isFooterImgAnimation}`}
Original file line number Diff line number Diff line change
@@ -79,7 +79,7 @@ const SavannahStartWindow: React.FC = () => {
const wordsForGame =
currentMode === 'hard'
? extraWords.concat(gameWords)?.slice(-wordCount)
: gameWords.slice(wordCount);
: gameWords.slice(-wordCount);

setSelectRound(randomPage);
onReduceArrayWords(wordsForGame);
@@ -94,11 +94,11 @@ const SavannahStartWindow: React.FC = () => {

useEffect(() => {
getGameWords(group, page);
}, [group, page]);
}, [group, page, savannahData.mode]);

useEffect(() => {
getExtraWords(extraWordsValue);
}, [extraWordsValue]);
}, [extraWordsValue, savannahData.mode]);

useEffect(() => {
getUserDictionary();
2 changes: 1 addition & 1 deletion src/components/GameSavannah/styles.ts
Original file line number Diff line number Diff line change
@@ -109,7 +109,7 @@ const useStyles = makeStyles((theme) =>

footerImg: {
position: 'absolute',
left: '50%',
left: '45%',
top: '-50%',
width: '80px',
},
Original file line number Diff line number Diff line change
@@ -8,13 +8,9 @@ import {
TableRow,
Paper,
} from '@material-ui/core';
import { ISavannahWord } from '../../../store/types';
import { ITableEndProps } from '../types';
import { useStyles } from '../styles';

interface ITableEndProps {
words: Array<ISavannahWord>;
}

const TableEndGame: React.FC<ITableEndProps> = ({ words }: ITableEndProps) => {
const classes = useStyles();

6 changes: 6 additions & 0 deletions src/components/commonComponents/types.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
import { FullScreenHandle } from 'react-full-screen';
import { IGroup } from '../../constants';
import { IAudioCallingWords } from '../../store/reducers/audioCallingReducer/types';
import { ISavannahWord } from '../../store/types';

export interface IGameSelectProps {
changeSelectFc: (item: string | number) => void;
@@ -40,3 +42,7 @@ export interface ITimerProps {
export interface IGameModeProps {
changeModeFc: (mode: string) => void;
}

export interface ITableEndProps {
words: Array<ISavannahWord | IAudioCallingWords>;
}
6 changes: 3 additions & 3 deletions src/store/actions/audioCallingActions.ts
Original file line number Diff line number Diff line change
@@ -17,17 +17,17 @@ export function selectRound(value: number) {

export const putIncorrectToStore = (word: IWord) => ({
type: AudioCallingActionTypes.PUT_INCORRECT,
payload: { word, isCorrect: false },
payload: { wordObj: word, isCorrect: false, word: word.word, translate: word.wordTranslate },
});

export const putCorrectToStore = (word: IWord) => ({
type: AudioCallingActionTypes.PUT_CORRECT,
payload: { word, isCorrect: true },
payload: { wordObj: word, isCorrect: true, word: word.word, translate: word.wordTranslate },
});

export const resetWordsToStartNewGame = () => ({
type: AudioCallingActionTypes.RESET,
payload: { word: [] },
payload: { wordObj: [] },
});

export const endGame = () => ({
2 changes: 1 addition & 1 deletion src/store/actions/savannahActions.ts
Original file line number Diff line number Diff line change
@@ -48,7 +48,7 @@ export function reduceArrayWords(wordsArray: Array<IWord>, userWords: Array<IUse
word: el.word,
wordObj: userWord || el,
translate: el.wordTranslate,
isCorrect: false,
isCorrect: undefined,
};
}),
};
4 changes: 3 additions & 1 deletion src/store/reducers/audioCallingReducer/types.ts
Original file line number Diff line number Diff line change
@@ -21,8 +21,10 @@ export interface IAudioCallingGameAction {
}

export interface IAudioCallingWords {
word: IWord;
wordObj: IWord;
isCorrect: boolean;
word: string;
translate: string;
}

export interface IAudioCallingState {

0 comments on commit 1f9768f

Please sign in to comment.