FumeNodes/ox_lib
1
0
Fork 0
mirror of https://github.com/CommunityOx/ox_lib.git synced 2026-08-18 07:26:02 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat(web/skillcheck): random skill check key from inputs table

Browse Source
This commit is contained in:
Luke
2023-02-12 19:26:09 +01:00
parent 7c2e894b67
commit f166c1675e
4 changed files with 42 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
web/src/features/skillcheck/index.tsx
View File

@@ -15,6 +15,7 @@ export interface SkillCheckProps {
angle: number;
difficultyOffset: number;
difficulty: GameDifficulty;
key: string;
}
export const circleCircumference = 2 * 50 * Math.PI;
@@ -65,49 +66,56 @@ const useStyles = createStyles((theme) => ({
}));
const SkillCheck: React.FC = () => {
const theme = useMantineTheme();
const { classes } = useStyles();
const [visible, setVisible] = useState(false);
const dataRef = useRef<GameDifficulty | GameDifficulty[] | null>(null);
const dataRef = useRef<{ difficulty: GameDifficulty | GameDifficulty[]; inputs?: string[] } | null>(null);
const dataIndexRef = useRef<number>(0);
const [skillCheck, setSkillCheck] = useState<SkillCheckProps>({
angle: 0,
difficultyOffset: 50,
difficulty: 'easy',
key: 'e',
});
useNuiEvent('startSkillCheck', (data: GameDifficulty | GameDifficulty[]) => {
useNuiEvent('startSkillCheck', (data: { difficulty: GameDifficulty | GameDifficulty[]; inputs?: string[] }) => {
dataRef.current = data;
dataIndexRef.current = 0;
const gameData = Array.isArray(data) ? data[0] : data;
const gameData = Array.isArray(data.difficulty) ? data.difficulty[0] : data.difficulty;
const offset = typeof gameData === 'object' ? gameData.areaSize : difficultyOffsets[gameData];
const randomKey = data.inputs ? data.inputs[Math.floor(Math.random() * data.inputs.length)] : 'e';
setSkillCheck({
angle: -90 + getRandomAngle(120, 360 - offset),
difficultyOffset: offset,
difficulty: gameData,
key: randomKey,
});
setVisible(true);
});
const handleComplete = (success: boolean) => {
if (!success || !Array.isArray(dataRef.current)) {
if (!dataRef.current) return;
if (!success || !Array.isArray(dataRef.current.difficulty)) {
setVisible(false);
return fetchNui('skillCheckOver', success);
}
if (dataIndexRef.current >= dataRef.current.length - 1) {
if (dataIndexRef.current >= dataRef.current.difficulty.length - 1) {
setVisible(false);
return fetchNui('skillCheckOver', success);
}
dataIndexRef.current++;
const data = dataRef.current[dataIndexRef.current];
const data = dataRef.current.difficulty[dataIndexRef.current];
const key = dataRef.current.inputs
? dataRef.current.inputs[Math.floor(Math.random() * dataRef.current.inputs.length)]
: 'e';
const offset = typeof data === 'object' ? data.areaSize : difficultyOffsets[data];
setSkillCheck({
angle: -90 + getRandomAngle(120, 360 - offset),
difficultyOffset: offset,
difficulty: data,
key,
});
};
@@ -145,7 +153,7 @@ const SkillCheck: React.FC = () => {
skillCheck={skillCheck}
/>
</svg>
<Box className={classes.button}>E</Box>
<Box className={classes.button}>{skillCheck.key.toUpperCase()}</Box>
</>
)}
</>