diff --git a/assets/css/app.scss b/assets/css/app.scss index 4fa994d..37ebdc0 100644 --- a/assets/css/app.scss +++ b/assets/css/app.scss @@ -47,6 +47,7 @@ @import "components/game-list"; @import "components/game-grid"; @import "components/game-info"; +@import "components/graveyard"; @import "components/move-list"; @import "components/game-state"; @import "components/player-finder"; diff --git a/assets/css/components/_graveyard.scss b/assets/css/components/_graveyard.scss new file mode 100644 index 0000000..cdbe5c1 --- /dev/null +++ b/assets/css/components/_graveyard.scss @@ -0,0 +1,5 @@ + +.graveyard__stones { + display: flex; + flex-direction: row; +} \ No newline at end of file diff --git a/assets/js/components/game.js b/assets/js/components/game.js index d2cb8cb..a000846 100644 --- a/assets/js/components/game.js +++ b/assets/js/components/game.js @@ -14,6 +14,7 @@ import Listeners from "../store/listeners"; import ChessBoard from "./chess-board"; import MoveList from "./move-list"; import GameInfo from "./game-info"; +import Graveyard from "./graveyard"; const notifications = new Notifications(); @@ -57,6 +58,7 @@ class Game extends React.Component { + ); } diff --git a/assets/js/components/graveyard.js b/assets/js/components/graveyard.js new file mode 100644 index 0000000..689a10e --- /dev/null +++ b/assets/js/components/graveyard.js @@ -0,0 +1,35 @@ +import React from 'react'; +import { connect } from "react-redux"; + +const Graveyard = props => { + return ( +
+ + +
+ ) +}; + +const mapStateToProps = state => { + return { + graveyard: state.graveyard + }; +}; + +export default connect(mapStateToProps)(Graveyard); + +const GraveStones = ({ colour, pieces}) => { + return ( +
    + {pieces.map(({colour, type}, index) => { + return + })} +
+ ) +} + +const GraveStone = ({ colour, type }) => { + return
  • + +
  • +} \ No newline at end of file diff --git a/assets/js/reducers/chess-board.js b/assets/js/reducers/chess-board.js index 0b4f130..9eae6b6 100644 --- a/assets/js/reducers/chess-board.js +++ b/assets/js/reducers/chess-board.js @@ -25,6 +25,7 @@ const chessBoardReducer = (state = defaultState, action) => { .set("selectedSquare", null) .set("availableMoves", []) .set("moves", action.moves) + .set("graveyard", action.graveyard) .toJS(); case "SET_AVAILABLE_MOVES": diff --git a/assets/js/store/actions.js b/assets/js/store/actions.js index 152e9f7..f04ccaf 100644 --- a/assets/js/store/actions.js +++ b/assets/js/store/actions.js @@ -5,6 +5,7 @@ const SET_AVAILABLE_MOVES = "SET_AVAILABLE_MOVES"; const SET_GAME_ID = "SET_GAME_ID"; const SELECT_PIECE = "SELECT_PIECE"; const SET_OPPONENT_STATUS = "SET_OPPONENT_STATUS"; +const SET_GRAVEYARD = "SET_GRAVEYARD"; export const setUserId = (user_id) => { return { @@ -29,6 +30,7 @@ export const setGame = (data) => { board: data.board, turn: data.turn, moves: data.moves, + graveyard: data.graveyard, state: data.state, }; }; @@ -60,3 +62,10 @@ export const setOpponentStatus = (opponentStatus) => { opponentStatus, }; }; + +export const setGraveyard = (graveyard) => { + return { + type: SET_GRAVEYARD, + graveyard, + }; +}; diff --git a/assets/js/store/default-state.js b/assets/js/store/default-state.js index 801d13c..04516c1 100644 --- a/assets/js/store/default-state.js +++ b/assets/js/store/default-state.js @@ -25,6 +25,7 @@ const defaultState = { 2: { a: null, b: null, c: null, d: null, e: null, f: null, g: null, h: null }, 1: { a: null, b: null, c: null, d: null, e: null, f: null, g: null, h: null }, }, + graveyard: { "white": [], "black": [] } }; export default defaultState; diff --git a/lib/chess/store/move.ex b/lib/chess/store/move.ex index 28a19e7..2d5e931 100644 --- a/lib/chess/store/move.ex +++ b/lib/chess/store/move.ex @@ -8,6 +8,7 @@ defmodule Chess.Store.Move do import Ecto.Query alias Chess.Store.Game + alias Chess.Store.Move schema "moves" do field :from, :map @@ -39,6 +40,7 @@ defmodule Chess.Store.Move do def captures_for_colour(query, colour) do from move in query, + select: move.piece_captured, where: fragment("(piece_captured -> 'colour')::jsonb = ?", ^colour) end