Private
Public Access
1
0
Files
MineSeeker/assets/js/mine-seeker/components/grid/GridControl.jsx

76 lines
2.1 KiB
JavaScript

/**
* This file is part of the SplendidBear Websites' projects.
*
* Copyright (c) 2026 @ www.splendidbear.org
*
* For the full copyright and license information, please view the LICENSE
* file that was distributed with this source code.
*/
import React, { Fragment } from 'react';
import { useGame } from '@mine-contexts';
import GridField from './GridField';
import UserControl from '../user/UserControl';
import GameTimer from '../GameTimer';
import { BOMB_SYMBOLS, bombRadius } from '@mine-utils';
const GridControl = ({ onClick, resign }) => {
const {
overlay, overlayTitle, overlaySubTitle,
webPlayer, activePlayer, bombSelected,
cells, setCells,
} = useGame();
const handleHover = (row, col) => {
if (!bombSelected) return;
const activeColor = activePlayer ? 'blue' : 'red';
if (activeColor !== webPlayer) return;
setCells(prev => {
const next = prev.map(r => r.map(c =>
null !== c.bombTargetArea ? { ...c, bombTargetArea: null } : c,
));
bombRadius(row, col, prev.length, prev[0]?.length ?? 0).forEach(([r, c], i) => {
if (!next[r]?.[c]) return;
next[r] = [...next[r]];
next[r][c] = { ...next[r][c], bombTargetArea: BOMB_SYMBOLS[i] };
});
return next;
});
};
return (
<Fragment>
<GameTimer />
<div className="game-wrapper">
<div className={`game-overlay${overlay ? '' : ' hide'}`}>
<div className="game-overlay-window">
<h1>{overlayTitle}</h1>
<h2>{overlaySubTitle}</h2>
</div>
</div>
<UserControl
resign={resign}
/>
<div className="grid-container">
<div className="grid">
{cells.flatMap((row, r) =>
row.map((cell, c) => (
<GridField
key={`${r}_${c}`}
cell={cell}
onClick={() => onClick([r, c])}
onMouseEnter={() => handleHover(r, c)}
/>
)),
)}
</div>
</div>
</div>
</Fragment>
);
};
export default GridControl;