From 5a78088c6e7604e38938b42d670983b33d159d19 Mon Sep 17 00:00:00 2001 From: Mizanali Panjwani Date: Sun, 14 Feb 2021 20:17:31 +0530 Subject: [PATCH] Added draw new card functionality --- src/components/Game.js | 6 ++- src/store/actions.js | 3 +- src/store/reducer.js | 104 +++++++++++++++++++++++++++++++++++++++-- 3 files changed, 107 insertions(+), 6 deletions(-) diff --git a/src/components/Game.js b/src/components/Game.js index c54d755..0ca53af 100644 --- a/src/components/Game.js +++ b/src/components/Game.js @@ -1,6 +1,6 @@ import React from 'react' import { connect } from 'react-redux' -import { CARD_PLAYED } from '../store/actions' +import { CARD_DRAWN, CARD_PLAYED } from '../store/actions' import './Game.css' @@ -22,6 +22,7 @@ const Game = (props) => {

Current Card: {props.playedCardsPile[props.playedCardsPile.length-1]}

+
@@ -53,7 +54,8 @@ const mapStateToProps = (state) => { const mapDispatchToProps = (dispatch) => { return { - onCardPlayed: (card) => dispatch({type: CARD_PLAYED, payload: {cardPlayed: card}}) + onCardPlayed: (card) => dispatch({type: CARD_PLAYED, payload: {cardPlayed: card}}), + onCardDrawn: () => dispatch({type: CARD_DRAWN}) } } diff --git a/src/store/actions.js b/src/store/actions.js index fa808a2..d221be6 100644 --- a/src/store/actions.js +++ b/src/store/actions.js @@ -1,2 +1,3 @@ export const START_GAME = 'START_GAME' -export const CARD_PLAYED = 'CARD_PLAYED' \ No newline at end of file +export const CARD_PLAYED = 'CARD_PLAYED' +export const CARD_DRAWN = 'CARD_DRAWN' \ No newline at end of file diff --git a/src/store/reducer.js b/src/store/reducer.js index aac43fb..4049de1 100644 --- a/src/store/reducer.js +++ b/src/store/reducer.js @@ -1,4 +1,4 @@ -import { CARD_PLAYED, START_GAME } from "./actions"; +import { CARD_DRAWN, CARD_PLAYED, START_GAME } from "./actions"; //pack of 108 cards const CARDS = [ @@ -429,8 +429,8 @@ const reducer = (state = initialState, action) => { const drawCard4 = copiedDrawCardPileArray.pop() //then update currentColor and currentNumber - turn will remain same - //return new state - return { + //return new state + return { ...state, playedCardsPile: [...state.playedCardsPile.slice(0, state.playedCardsPile.length), action.payload.cardPlayed, ...state.playedCardsPile.slice(state.playedCardsPile.length)], player1Deck: [...state.player1Deck.slice(0, removeIndex), ...state.player1Deck.slice(removeIndex + 1)], @@ -472,6 +472,104 @@ const reducer = (state = initialState, action) => { } } + case CARD_DRAWN: { + //extract player who drew the card + const cardDrawnBy = state.turn + + //check who drew the card and return new state accordingly + if(cardDrawnBy === 'Player 1') { + //remove 1 new card from drawCardPile and add it to player1's deck (immutably) + //make a copy of drawCardPile array + const copiedDrawCardPileArray = [...state.drawCardPile] + //pull out last element from it + const drawCard = copiedDrawCardPileArray.pop() + console.log(drawCard); + + //extract number and color of drawn card + const colorOfDrawnCard = drawCard.charAt(drawCard.length - 1) + let numberOfDrawnCard = drawCard.charAt(0) + if(drawCard === 'skipR' || drawCard === 'skipG' || drawCard === 'skipB' || drawCard === 'skipY') { + numberOfDrawnCard = 404 + } + if(drawCard === 'D2R' || drawCard === 'D2G' || drawCard === 'D2B' || drawCard === 'D2Y') { + numberOfDrawnCard = 252 + } + if(drawCard === 'W') { + numberOfDrawnCard = 300 + } + if(drawCard === 'D4W') { + numberOfDrawnCard = 600 + } + + //check if drawn card is playable + if(numberOfDrawnCard === state.currentNumber || colorOfDrawnCard === state.currentColor) { + //return new state + return { + ...state, + turn: 'Player 2', + playedCardsPile: [...state.playedCardsPile.slice(0, state.playedCardsPile.length), drawCard, ...state.playedCardsPile.slice(state.playedCardsPile.length)], + currentColor: colorOfDrawnCard, + currentNumber: numberOfDrawnCard + } + } + + //else add the drawn card to player1's deck + //return new state + return { + ...state, + turn: 'Player 2', + player1Deck: [...state.player1Deck.slice(0, state.player1Deck.length), drawCard, ...state.player1Deck.slice(state.player1Deck.length)], + drawCardPile: [...copiedDrawCardPileArray] + } + + } + else { + //remove 1 new card from drawCardPile and add it to player2's deck (immutably) + //make a copy of drawCardPile array + const copiedDrawCardPileArray = [...state.drawCardPile] + //pull out last element from it + const drawCard = copiedDrawCardPileArray.pop() + console.log(drawCard); + + //extract number and color of drawn card + const colorOfDrawnCard = drawCard.charAt(drawCard.length - 1) + let numberOfDrawnCard = drawCard.charAt(0) + if(drawCard === 'skipR' || drawCard === 'skipG' || drawCard === 'skipB' || drawCard === 'skipY') { + numberOfDrawnCard = 404 + } + if(drawCard === 'D2R' || drawCard === 'D2G' || drawCard === 'D2B' || drawCard === 'D2Y') { + numberOfDrawnCard = 252 + } + if(drawCard === 'W') { + numberOfDrawnCard = 300 + } + if(drawCard === 'D4W') { + numberOfDrawnCard = 600 + } + + //check if drawn card is playable + if(numberOfDrawnCard === state.currentNumber || colorOfDrawnCard === state.currentColor) { + //return new state + return { + ...state, + turn: 'Player 1', + playedCardsPile: [...state.playedCardsPile.slice(0, state.playedCardsPile.length), drawCard, ...state.playedCardsPile.slice(state.playedCardsPile.length)], + currentColor: colorOfDrawnCard, + currentNumber: numberOfDrawnCard + } + } + + //else add the drawn card to player2's deck + //return new state + return { + ...state, + turn: 'Player 1', + player2Deck: [...state.player2Deck.slice(0, state.player2Deck.length), drawCard, ...state.player2Deck.slice(state.player2Deck.length)], + drawCardPile: [...copiedDrawCardPileArray] + } + } + } + default: return state }