Gameplay

All of our components are done! We only need to add some gameplay logic for the app to be playable. When the game begins, each players draws their initial hand of cards.

Then, each player's turn follows these steps:

1. The player-turn overlay is displayed so that the player knows it's their turn.
2. The last-play overlay shows them what the other player played during the last run.
3. The player plays a card by clicking on it.
4. The card is removed from their hand and its effects applied.
5. We wait a bit so that the player can see these effects in action.
6. Then, the turn ends, and we switch the current player to the other one.

Drawing cards

Before drawing the cards, we will need to add two properties to the app state in the state.js file:

var state = {
  // ...
drawPile: pile,
discardPile: {},
}

The drawPile property is the pile of cards that can be drawn by the players. It is initialized with the pile object defined in the cards.js file. Each key is the ID of a card definition, and the value is the amount...