small touches
This commit is contained in:
parent
9183b97628
commit
16bccde6e1
@ -97,7 +97,7 @@
|
|||||||
|
|
||||||
.GameBoard {
|
.GameBoard {
|
||||||
padding-left: 30px;
|
padding-left: 30px;
|
||||||
width: 275px;
|
width: 280px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.Message2Opponent {
|
.Message2Opponent {
|
||||||
@ -108,7 +108,7 @@
|
|||||||
|
|
||||||
.BadMove {
|
.BadMove {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
width: 275px;
|
width: 280px;
|
||||||
top: 250px;
|
top: 250px;
|
||||||
cursor: default; /* disable 'I beam' cursor change */
|
cursor: default; /* disable 'I beam' cursor change */
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
@ -2,8 +2,8 @@ import React, { useContext, useEffect } from 'react';
|
|||||||
import { GamesStateContext, GamesGuideContext } from '../context/games';
|
import { GamesStateContext, GamesGuideContext } from '../context/games';
|
||||||
import { NavLink, Routes, Route } from 'react-router-dom';
|
import { NavLink, Routes, Route } from 'react-router-dom';
|
||||||
|
|
||||||
import NewGame from './games/view/NewGame';
|
import NewGame from './games/NewGame';
|
||||||
import { GameProposalSelector, ActiveGameSelector, GameArchiveSelector } from './games/view/GameSelector';
|
import { GameProposalSelector, ActiveGameSelector, GameArchiveSelector } from './games/GameSelector';
|
||||||
import { Create, Accept, Reject, Cancel, DrawRequest, DrawAccept, DrawReject, Surrender, Backward, Forward } from './games/ActionPanel';
|
import { Create, Accept, Reject, Cancel, DrawRequest, DrawAccept, DrawReject, Surrender, Backward, Forward } from './games/ActionPanel';
|
||||||
import GameBoard from './games/GameBoard';
|
import GameBoard from './games/GameBoard';
|
||||||
import { nextStone } from '../components/Checkers';
|
import { nextStone } from '../components/Checkers';
|
||||||
|
@ -13,7 +13,7 @@ export default function GameBoard({ dispatchGuide, username, getGame, onStoneCli
|
|||||||
const optionalOnStoneClick = (typeof onStoneClick !== 'function') ? null :
|
const optionalOnStoneClick = (typeof onStoneClick !== 'function') ? null :
|
||||||
(cellId) => onStoneClick(game.uuid, cellId);
|
(cellId) => onStoneClick(game.uuid, cellId);
|
||||||
|
|
||||||
const optionalOnStoneMove = (typeof onStoneMove !== 'function' || isPushing) ? null :
|
const optionalOnStoneMove = (typeof onStoneMove !== 'function' || isPushing || game.status === 'DRAW_REQUEST_WAIT_FOR_YOU' || game.status === 'DRAW_REQUEST_WAIT_FOR_OPPONENT') ? null :
|
||||||
(move) => {
|
(move) => {
|
||||||
if (move[0] !== move[1] && game.board[move[1]] === undefined)
|
if (move[0] !== move[1] && game.board[move[1]] === undefined)
|
||||||
onStoneMove(game.uuid, move)
|
onStoneMove(game.uuid, move)
|
||||||
|
@ -1,10 +1,10 @@
|
|||||||
import './GameSelector.css';
|
import './GameSelector.css';
|
||||||
import React, { useContext } from 'react';
|
import React, { useContext } from 'react';
|
||||||
import { GamesStateContext, GamesGuideContext } from '../../../context/games';
|
import { GamesStateContext, GamesGuideContext } from '../../context/games';
|
||||||
|
|
||||||
import { Board, Color, Player } from '../../../components/Checkers';
|
import { Board, Color, Player } from '../../components/Checkers';
|
||||||
import Loading from '../../../components/Loading';
|
import Loading from '../../components/Loading';
|
||||||
import Counter from '../../../components/Counter';
|
import Counter from '../../components/Counter';
|
||||||
|
|
||||||
export function GameProposalSelector({ onSelect }) {
|
export function GameProposalSelector({ onSelect }) {
|
||||||
const games = useContext(GamesStateContext);
|
const games = useContext(GamesStateContext);
|
||||||
@ -133,6 +133,12 @@ function Selectable({ game, selected, onClick }) {
|
|||||||
const opponentName = game.opponentName;
|
const opponentName = game.opponentName;
|
||||||
const flipBoard = (game?.myColor === Color.black) ? true : null;
|
const flipBoard = (game?.myColor === Color.black) ? true : null;
|
||||||
|
|
||||||
|
const color = 'red';//game.status === 'DRAW_REQUEST_WAIT_FOR_YOU' || game.status === 'DRAW_REQUEST_WAIT_FOR_OPPONENT';
|
||||||
|
|
||||||
|
// const style = {
|
||||||
|
// border: 1px 'red'
|
||||||
|
// };
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={'Selectable' + (selected ? ' selected' : '')}
|
<div className={'Selectable' + (selected ? ' selected' : '')}
|
||||||
onClick={() => onClick(game.uuid)}
|
onClick={() => onClick(game.uuid)}
|
@ -1,9 +1,9 @@
|
|||||||
import './NewGame.css'
|
import './NewGame.css'
|
||||||
import React, { useContext } from 'react';
|
import React, { useContext } from 'react';
|
||||||
import { GamesGuideContext } from '../../../context/games';
|
import { GamesGuideContext } from '../../context/games';
|
||||||
|
|
||||||
import DropdownList from '../../../components/DropdownList';
|
import DropdownList from '../../components/DropdownList';
|
||||||
import { Color, WhiteStone, BlackStone } from '../../../components/Checkers';
|
import { Color, WhiteStone, BlackStone } from '../../components/Checkers';
|
||||||
|
|
||||||
export default function NewGame({ players, setPlayers }) {
|
export default function NewGame({ players, setPlayers }) {
|
||||||
const newGame = useContext(GamesGuideContext).newGame;
|
const newGame = useContext(GamesGuideContext).newGame;
|
Loading…
Reference in New Issue
Block a user