1
0
forked from mico/idle_moloch
idle_moloch/app/src/components/Tower.tsx
2024-10-31 03:37:31 +01:00

46 lines
1.3 KiB
TypeScript

import { useEffect, useReducer, useRef } from 'react';
import { BossLevel, usePlayer } from '../providers/PlayerProvider';
import styles from '../styles/Background.module.css';
const onCooldown = (lastRaidedAt: bigint) => (
((new Date()).getTime()
- (parseInt(lastRaidedAt.toString()) * 1000 /* convert block time to seconds */))
/ 1000 /* convert milliseconds back to seconds*/
) <= 15
const emptyFn = () => { }
const bossLevelToClass: Record<BossLevel, string> = {
0: styles.tower0,
1: styles.tower1,
2: styles.tower2,
3: styles.tower3,
4: styles.tower4,
5: styles.tower5,
6: styles.tower6,
}
const Tower = () => {
const { raid, player, boss } = usePlayer();
const isOnCooldown = useRef(false);
const [, render] = useReducer(p => !p, false);
const variant = boss?.variants[boss.level] ?? 0;
useEffect(() => {
const checkCooldownInterval = setInterval(() => {
isOnCooldown.current = onCooldown(player?.last_raided_at ?? BigInt(0))
render()
}, 1000);
return () => clearInterval(checkCooldownInterval)
}, [player?.last_raided_at])
return <div onClick={isOnCooldown.current ? emptyFn : raid} className={`
${styles.tower}
${bossLevelToClass[variant]}
${styles.background_asset}
${isOnCooldown.current ? styles.cooldown : ""}
`} />
}
export default Tower