diff --git a/src/components/Game.js b/src/components/Game.js index 45bb018..7db9c36 100644 --- a/src/components/Game.js +++ b/src/components/Game.js @@ -1,12 +1,40 @@ import React from 'react' +import { connect } from 'react-redux' -const Game = () => { +const Game = (props) => { return (

Game

- +
+ {props.player1Deck.map((item) => { + return
{item}
+ })} +
+
+
+

Current Card: {props.playedCardsPile[0]}

+
+
+
+ {props.player2Deck.map((item) => { + return
{item}
+ })} +
) } -export default Game +const mapStateToProps = (state) => { + return { + gameOver: state.gameOver, + turn: state.turn, + player1Deck: state.player1Deck, + player2Deck: state.player2Deck, + currentColor: state.currentColor, + currentNumber: state.currentNumber, + playedCardsPile: state.playedCardsPile, + drawCardPile: state.drawCardPile + } +} + +export default connect(mapStateToProps)(Game) diff --git a/src/components/Homepage.js b/src/components/Homepage.js index bb89455..ad841bb 100644 --- a/src/components/Homepage.js +++ b/src/components/Homepage.js @@ -1,11 +1,21 @@ import React from 'react' +import { Link } from 'react-router-dom' +import { START_GAME } from '../store/actions' +import { connect } from 'react-redux' -const Homepage = () => { +const Homepage = (props) => { return (

Homepage

+
) } -export default Homepage +const mapDispatchToProps = (dispatch) => { + return { + onStartGame: () => dispatch({type: START_GAME}) + } +} + +export default connect(null, mapDispatchToProps)(Homepage) diff --git a/src/store/actions.js b/src/store/actions.js index e69de29..09addcb 100644 --- a/src/store/actions.js +++ b/src/store/actions.js @@ -0,0 +1 @@ +export const START_GAME = 'START_GAME' \ No newline at end of file diff --git a/src/store/reducer.js b/src/store/reducer.js index 1f07e8c..64c4e4b 100644 --- a/src/store/reducer.js +++ b/src/store/reducer.js @@ -1,6 +1,81 @@ -const initialState = {} +import { START_GAME } from "./actions"; + +//pack of 108 cards +const CARDS = [ + '0R', '1R', '1R', '2R', '2R', '3R', '3R', '4R', '4R', '5R', '5R', '6R', '6R', '7R', '7R', '8R', '8R', '9R', '9R', 'skipR', 'skipR', 'revR', 'revR', 'D2R', 'D2R', + '0G', '1G', '1G', '2G', '2G', '3G', '3G', '4G', '4G', '5G', '5G', '6G', '6G', '7G', '7G', '8G', '8G', '9G', '9G', 'skipG', 'skipG', 'revG', 'revG', 'D2G', 'D2G', + '0B', '1B', '1B', '2B', '2B', '3B', '3B', '4B', '4B', '5B', '5B', '6B', '6B', '7B', '7B', '8B', '8B', '9B', '9B', 'skipB', 'skipB', 'revB', 'revB', 'D2B', 'D2B', + '0Y', '1Y', '1Y', '2Y', '2Y', '3Y', '3Y', '4Y', '4Y', '5Y', '5Y', '6Y', '6Y', '7Y', '7Y', '8Y', '8Y', '9Y', '9Y', 'skipY', 'skipY', 'revY', 'revY', 'D2Y', 'D2Y', + 'W', 'W', 'W', 'W', 'D4W', 'D4W', 'D4W', 'D4W' +] + +const initialState = { + gameOver: true, + turn: '', + player1Deck: [], + player2Deck: [], + currentColor: '', + currentNumber: '', + playedCardsPile: [], + drawCardPile: [] +} const reducer = (state = initialState, action) => { + switch(action.type) { + case START_GAME: { + //shuffle array function + function shuffleArray(array) { + for (var i = array.length - 1; i > 0; i--) { + var j = Math.floor(Math.random() * (i + 1)) + var temp = array[i] + array[i] = array[j] + array[j] = temp; + } + return array + } + + //shuffle CARDS array + const shuffledCards = shuffleArray(CARDS) + + //extract first 7 elements to player1Deck + const player1Deck = shuffledCards.splice(0, 7) + + //extract first 7 elements to player2Deck + const player2Deck = shuffledCards.splice(0, 7) + + //extract random card from shuffledCards and check if its not an action card + let startingCardIndex = Math.floor(Math.random() * 94) + while(true) { + startingCardIndex = Math.floor(Math.random() * 94) + if(shuffledCards[startingCardIndex]==='skipR' || shuffledCards[startingCardIndex]==='revR' || shuffledCards[startingCardIndex]==='D2R' || + shuffledCards[startingCardIndex]==='skipG' || shuffledCards[startingCardIndex]==='revG' || shuffledCards[startingCardIndex]==='D2G' || + shuffledCards[startingCardIndex]==='skipB' || shuffledCards[startingCardIndex]==='revB' || shuffledCards[startingCardIndex]==='D2B' || + shuffledCards[startingCardIndex]==='skipY' || shuffledCards[startingCardIndex]==='revY' || shuffledCards[startingCardIndex]==='D2Y' || + shuffledCards[startingCardIndex]==='W' || shuffledCards[startingCardIndex]==='D4W') { + continue; + } + else + break; + } + + //extract the card from that startingCardIndex into the playedCardsPile + const playedCardsPile = shuffledCards.splice(startingCardIndex, 1) + + //store all remaining cards into drawCardPile + const drawCardPile = shuffledCards + + return { + gameOver: false, + turn: 'Player 1', + player1Deck: [...player1Deck], + player2Deck: [...player2Deck], + currentColor: playedCardsPile[0].charAt(1), + currentNumber: playedCardsPile[0].charAt(0), + playedCardsPile: [...playedCardsPile], + drawCardPile: [...drawCardPile], + } + } + } return state }