stub Menu, add showMenu value to Game

This commit is contained in:
sorrelbri 2020-06-21 18:20:03 -07:00
parent f14c0ce087
commit 3955f940e2
5 changed files with 18 additions and 7 deletions

View file

@ -1,14 +1,10 @@
import React from "react"; import React from "react";
import "./Kifu.scss"; import "./Kifu.scss";
const Kifu = () => { const Kifu = ({ clickKifu }) => {
const handleClick = (e) => {
console.log("clicked");
};
return ( return (
<div className="Kifu"> <div className="Kifu">
<p className="Kifu__show-menu" onClick={handleClick}> <p className="Kifu__show-menu" onClick={clickKifu}>
Show Menu? Show Menu?
</p> </p>
<div className="Kifu__board"></div> <div className="Kifu__board"></div>

View file

@ -9,6 +9,7 @@ div.Kifu {
p.Kifu__show-menu { p.Kifu__show-menu {
display: none; display: none;
margin: 3vh auto;
position: absolute; position: absolute;
transform: rotate(20deg); transform: rotate(20deg);
width: fit-content; width: fit-content;

View file

@ -0,0 +1,7 @@
import React from "react";
const Menu = ({ ...props }) => {
return <></>;
};
export default Menu;

View file

@ -6,12 +6,14 @@ import Logo from "../../components/Display/Logo/Logo";
import Board from "../../components/GameUI/Board/Board"; import Board from "../../components/GameUI/Board/Board";
import PlayerArea from "../../components/GameUI/PlayerArea/PlayerArea"; import PlayerArea from "../../components/GameUI/PlayerArea/PlayerArea";
import Kifu from "../../components/GameUI/Kifu/Kifu"; import Kifu from "../../components/GameUI/Kifu/Kifu";
import Menu from "../../components/GameUI/Menu/Menu";
const Game = (props) => { const Game = (props) => {
const { state, dispatch } = props; const { state, dispatch } = props;
const gameId = parseInt(useParams().id) || 0; const gameId = parseInt(useParams().id) || 0;
const [playerBlackMeta, setPlayerBlackMeta] = useState({}); const [playerBlackMeta, setPlayerBlackMeta] = useState({});
const [playerWhiteMeta, setPlayerWhiteMeta] = useState({}); const [playerWhiteMeta, setPlayerWhiteMeta] = useState({});
const [showMenu, setShowMenu] = useState(false);
const playerState = state?.meta?.playerState; const playerState = state?.meta?.playerState;
const game = state.active?.game; const game = state.active?.game;
@ -91,6 +93,11 @@ const Game = (props) => {
return ( return (
<div className="Game" data-testid="Game"> <div className="Game" data-testid="Game">
<Menu
showMenu={showMenu}
clickClose={() => setShowMenu(false)}
{...props}
/>
<div className="Game__meta-container"> <div className="Game__meta-container">
<span className="Game__socket-flag">{state.socket ? "✓" : " ⃠"}</span> <span className="Game__socket-flag">{state.socket ? "✓" : " ⃠"}</span>
<Logo /> <Logo />
@ -140,7 +147,7 @@ const Game = (props) => {
? playerWhiteMeta ? playerWhiteMeta
: playerBlackMeta : playerBlackMeta
} }
Kifu={<Kifu />} Kifu={<Kifu clickKifu={() => setShowMenu(true)} />}
turn={state?.meta?.turn} turn={state?.meta?.turn}
/> />
</div> </div>