danbarber/chess
1
0
Fork 0
mirror of https://github.com/danbee/chess synced 2025-03-04 08:39:06 +00:00
Code Issues Releases Wiki Activity

Store chess board as objects instead of arrays

Browse Source
This commit is contained in:
Daniel Barber 2016-12-08 12:48:04 +00:00
parent a2fa4ec53b
commit 87b2a2d5c9
4 changed files with 60 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/components/chess-board-square.js
View File

@ -9,7 +9,7 @@ class ChessBoardSquare extends React.Component {
} }
selectSquare() { selectSquare() {
console.log(`Clicked: ${this.props.rank}, ${this.props.file}`); console.log(`Clicked: ${this.props.file}${this.props.rank}`);
}; };
render() { render() {

14
app/components/chess-board.js
View File

@ -12,13 +12,11 @@ class ChessBoard extends React.Component {
return store.getState().board; return store.getState().board;
} }
chessBoardRow(row, i) { chessBoardRow(row, rank) {
return ( return (
<div className="board-rank" key={i}> <div className="board-rank" key={rank}>
{row.map( {Object.keys(row).map(
(square, j) => ( (file) => <ChessBoardSquare key={file} rank={rank} file={file} square={row[file]} />
<ChessBoardSquare key={j} rank={i} file={j} square={square} />
)
)} )}
</div> </div>
) )
@ -27,7 +25,9 @@ class ChessBoard extends React.Component {
render() { render() {
return ( return (
<div className="board"> <div className="board">
{this.chessBoardRows().map((row, i) => this.chessBoardRow(row, i))} {Object.keys(this.chessBoardRows()).reverse().map(
(rank) => this.chessBoardRow(this.chessBoardRows()[rank], rank)
)}
</div> </div>
); );
} }

6
app/reducers/chess-board.js
View File

@ -8,6 +8,12 @@ const chessBoardReducer = (state = defaultState, action) => {
state.board[from.rank][from.file] = null; state.board[from.rank][from.file] = null;
return state; return state;
var newBoard = state.board.map((item, index) => {
});
return Object.assign({}, state, {
board: newBoard
});
case "SELECT_PIECE": case "SELECT_PIECE":
return Object.assign({}, state, { selectedSquare: action.coords }); return Object.assign({}, state, { selectedSquare: action.coords });

92
app/store/default-state.js
View File

@ -1,52 +1,52 @@
const defaultState = { const defaultState = {
selectedSquare: null, selectedSquare: null,
board: [ board: {
[ 8: {
{ type: "rook", colour: "black" }, a: { type: "rook", colour: "black" },
{ type: "knight", colour: "black" }, b: { type: "knight", colour: "black" },
{ type: "bishop", colour: "black" }, c: { type: "bishop", colour: "black" },
{ type: "queen", colour: "black" }, d: { type: "queen", colour: "black" },
{ type: "king", colour: "black" }, e: { type: "king", colour: "black" },
{ type: "bishop", colour: "black" }, f: { type: "bishop", colour: "black" },
{ type: "knight", colour: "black" }, g: { type: "knight", colour: "black" },
{ type: "rook", colour: "black" }, h: { type: "rook", colour: "black" }
], },
[ 7: {
{ type: "pawn", colour: "black" }, a: { type: "pawn", colour: "black" },
{ type: "pawn", colour: "black" }, b: { type: "pawn", colour: "black" },
{ type: "pawn", colour: "black" }, c: { type: "pawn", colour: "black" },
{ type: "pawn", colour: "black" }, d: { type: "pawn", colour: "black" },
{ type: "pawn", colour: "black" }, e: { type: "pawn", colour: "black" },
{ type: "pawn", colour: "black" }, f: { type: "pawn", colour: "black" },
{ type: "pawn", colour: "black" }, g: { type: "pawn", colour: "black" },
{ type: "pawn", colour: "black" }, h: { type: "pawn", colour: "black" }
], },
[null, null, null, null, null, null, null, null], 6: { a: null, b: null, c: null, d: null, e: null, f: null, g: null, h: null },
[null, null, null, null, null, null, null, null], 5: { a: null, b: null, c: null, d: null, e: null, f: null, g: null, h: null },
[null, null, null, null, null, null, null, null], 4: { a: null, b: null, c: null, d: null, e: null, f: null, g: null, h: null },
[null, null, null, null, null, null, null, null], 3: { a: null, b: null, c: null, d: null, e: null, f: null, g: null, h: null },
[ 2: {
{ type: "pawn", colour: "white" }, a: { type: "pawn", colour: "white" },
{ type: "pawn", colour: "white" }, b: { type: "pawn", colour: "white" },
{ type: "pawn", colour: "white" }, c: { type: "pawn", colour: "white" },
{ type: "pawn", colour: "white" }, d: { type: "pawn", colour: "white" },
{ type: "pawn", colour: "white" }, e: { type: "pawn", colour: "white" },
{ type: "pawn", colour: "white" }, f: { type: "pawn", colour: "white" },
{ type: "pawn", colour: "white" }, g: { type: "pawn", colour: "white" },
{ type: "pawn", colour: "white" }, h: { type: "pawn", colour: "white" }
], },
[ 1: {
{ type: "rook", colour: "white" }, a: { type: "rook", colour: "white" },
{ type: "knight", colour: "white" }, b: { type: "knight", colour: "white" },
{ type: "bishop", colour: "white" }, c: { type: "bishop", colour: "white" },
{ type: "queen", colour: "white" }, d: { type: "queen", colour: "white" },
{ type: "king", colour: "white" }, e: { type: "king", colour: "white" },
{ type: "bishop", colour: "white" }, f: { type: "bishop", colour: "white" },
{ type: "knight", colour: "white" }, g: { type: "knight", colour: "white" },
{ type: "rook", colour: "white" }, h: { type: "rook", colour: "white" }
], }
], }
}; };
export default defaultState; export default defaultState;