2021-09-05 01:09:30 +02:00
|
|
|
import React, { useState } from "react";
|
|
|
|
import Grid from "@material-ui/core/Grid";
|
2021-06-13 17:05:40 +02:00
|
|
|
import { IMinigameProps } from "./IMinigameProps";
|
|
|
|
import { KeyHandler } from "./KeyHandler";
|
|
|
|
import { GameTimer } from "./GameTimer";
|
|
|
|
import { random, getArrow } from "../utils";
|
|
|
|
import { interpolate } from "./Difficulty";
|
|
|
|
|
|
|
|
interface Difficulty {
|
2021-09-05 01:09:30 +02:00
|
|
|
[key: string]: number;
|
|
|
|
timer: number;
|
|
|
|
min: number;
|
|
|
|
max: number;
|
2021-06-13 17:05:40 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
const difficulties: {
|
2021-09-05 01:09:30 +02:00
|
|
|
Trivial: Difficulty;
|
|
|
|
Normal: Difficulty;
|
|
|
|
Hard: Difficulty;
|
|
|
|
Impossible: Difficulty;
|
2021-06-13 17:05:40 +02:00
|
|
|
} = {
|
2021-09-05 01:09:30 +02:00
|
|
|
Trivial: { timer: 13000, min: 6, max: 8 },
|
|
|
|
Normal: { timer: 7000, min: 7, max: 8 },
|
|
|
|
Hard: { timer: 5000, min: 8, max: 9 },
|
2021-09-05 02:09:22 +02:00
|
|
|
Impossible: { timer: 3000, min: 9, max: 10 },
|
2021-09-05 01:09:30 +02:00
|
|
|
};
|
2021-06-13 17:05:40 +02:00
|
|
|
|
|
|
|
export function CheatCodeGame(props: IMinigameProps): React.ReactElement {
|
2021-09-05 01:09:30 +02:00
|
|
|
const difficulty: Difficulty = { timer: 0, min: 0, max: 0 };
|
|
|
|
interpolate(difficulties, props.difficulty, difficulty);
|
|
|
|
const timer = difficulty.timer;
|
|
|
|
const [code] = useState(generateCode(difficulty));
|
|
|
|
const [index, setIndex] = useState(0);
|
2021-06-13 17:05:40 +02:00
|
|
|
|
2021-09-05 01:09:30 +02:00
|
|
|
function press(event: React.KeyboardEvent<HTMLElement>): void {
|
|
|
|
event.preventDefault();
|
|
|
|
if (code[index] !== getArrow(event)) {
|
|
|
|
props.onFailure();
|
|
|
|
return;
|
2021-06-13 17:05:40 +02:00
|
|
|
}
|
2021-09-05 01:09:30 +02:00
|
|
|
setIndex(index + 1);
|
|
|
|
if (index + 1 >= code.length) props.onSuccess();
|
|
|
|
}
|
2021-06-13 17:05:40 +02:00
|
|
|
|
2021-09-05 01:09:30 +02:00
|
|
|
return (
|
|
|
|
<Grid container spacing={3}>
|
|
|
|
<GameTimer millis={timer} onExpire={props.onFailure} />
|
|
|
|
<Grid item xs={12}>
|
|
|
|
<h1 className={"noselect"}>Enter the Code!</h1>
|
|
|
|
<p style={{ fontSize: "5em" }}>{code[index]}</p>
|
|
|
|
<KeyHandler onKeyDown={press} onFailure={props.onFailure} />
|
|
|
|
</Grid>
|
|
|
|
</Grid>
|
|
|
|
);
|
2021-06-13 17:05:40 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
function generateCode(difficulty: Difficulty): string {
|
2021-09-05 01:09:30 +02:00
|
|
|
const arrows = ["←", "→", "↑", "↓"];
|
|
|
|
let code = "";
|
|
|
|
for (let i = 0; i < random(difficulty.min, difficulty.max); i++) {
|
|
|
|
let arrow = arrows[Math.floor(4 * Math.random())];
|
2021-09-09 05:47:34 +02:00
|
|
|
while (arrow === code[code.length - 1]) arrow = arrows[Math.floor(4 * Math.random())];
|
2021-09-05 01:09:30 +02:00
|
|
|
code += arrow;
|
|
|
|
}
|
2021-06-13 17:05:40 +02:00
|
|
|
|
2021-09-05 01:09:30 +02:00
|
|
|
return code;
|
2021-06-13 17:05:40 +02:00
|
|
|
}
|