From 53bfd1eec33828a5f2b8fc55a6d02ec1cfa8b5f4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Molero?= Date: Tue, 13 Mar 2018 00:03:47 +0100 Subject: [PATCH 1/6] #4 Card serialization and tests --- src/Card.ts | 23 ++++++++++++++++++++++- src/components/SimpleBlackJack.tsx | 20 ++++++++++++++------ src/index.tsx | 2 +- src/interfaces/Serializable.ts | 4 ++++ src/tests/Card.test.ts | 24 +++++++++++++++++++++++- 5 files changed, 64 insertions(+), 9 deletions(-) create mode 100644 src/interfaces/Serializable.ts diff --git a/src/Card.ts b/src/Card.ts index f2eb1c4..54bcfc5 100644 --- a/src/Card.ts +++ b/src/Card.ts @@ -1,11 +1,32 @@ import Suit from './Suit'; +import Serializable from './interfaces/Serializable'; -export default class Card { +export interface CardJsonInterface { + rank: number; + suit: number; +} + +export default class Card implements Serializable { readonly MIN_RANK = 1; readonly MAX_RANK = 13; private readonly rank: number; private readonly suit: Suit; + public static fromJSON(json: CardJsonInterface): Card { + return new Card(json.rank, json.suit); + } + + public static reviver(key: string, value: CardJsonInterface): Card | CardJsonInterface { + return key === '' ? Card.fromJSON(value) : value; + } + + public toJSON(): CardJsonInterface { + return { + rank: this.getRank(), + suit: this.getSuit(), + }; + } + constructor(rank: number, suit: Suit) { if (typeof(Suit[suit]) !== 'string') { throw new Error('Invalid Suit'); diff --git a/src/components/SimpleBlackJack.tsx b/src/components/SimpleBlackJack.tsx index e7f519d..b89036d 100644 --- a/src/components/SimpleBlackJack.tsx +++ b/src/components/SimpleBlackJack.tsx @@ -1,17 +1,24 @@ import * as React from 'react'; import { BoardComponent, BoardStateInterface, JsonStateInterface } from './BoardComponent'; -class SimpleBlackJack extends React.Component { +interface SimpleBlackJackPropsInterface { + localStorage: Storage | null; +} + +class SimpleBlackJack extends React.Component { private readonly KEY: string = 'blackjack'; setItem(key: string, data: string) { - localStorage.setItem(key, data); + this.props.localStorage && + this.props.localStorage.setItem(key, data); } getItem(key: string): JsonStateInterface { - const jsonState: string | null = localStorage.getItem(key); - if (jsonState !== null) { - return JSON.parse(jsonState); + if (this.props.localStorage) { + const jsonState: string | null = this.props.localStorage.getItem(key); + if (jsonState !== null) { + return JSON.parse(jsonState); + } } return { handNumber: 0, @@ -44,7 +51,8 @@ class SimpleBlackJack extends React.Component { handleResetGame(): boolean { try { - localStorage.clear(); + this.props.localStorage && + this.props.localStorage.clear(); } catch (errorOnSave) { return false; } diff --git a/src/index.tsx b/src/index.tsx index 29e5a34..8e4f164 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -6,7 +6,7 @@ import './css/base.css'; import './css/enhanced.css'; ReactDOM.render( - , + , document.getElementById('root') as HTMLElement ); registerServiceWorker(); diff --git a/src/interfaces/Serializable.ts b/src/interfaces/Serializable.ts new file mode 100644 index 0000000..4b49307 --- /dev/null +++ b/src/interfaces/Serializable.ts @@ -0,0 +1,4 @@ +export default interface Serializable { + toJSON(): object; + // fromJSON(json: string, reviver: Function): Serializable; +} \ No newline at end of file diff --git a/src/tests/Card.test.ts b/src/tests/Card.test.ts index dc4df09..10e0776 100644 --- a/src/tests/Card.test.ts +++ b/src/tests/Card.test.ts @@ -1,5 +1,5 @@ -import Card from './../Card'; import Suit from './../Suit'; +import Card from './../Card'; test('can create a card', () => { let card: Card = new Card(1, Suit.Hearts); @@ -52,4 +52,26 @@ test('Rank is not valid lt MIN', () => { return expect(() => { return new Card(0, Suit.Hearts); }).toThrow('Invalid Rank'); +}); + +test('Serialize Card', () => { + let card: Card = new Card(1, Suit.Spades); + // card.toJSON(); + return expect(JSON.stringify(card)).toEqual( + JSON.stringify({ + rank: 1, + suit: 2 + }) + ); +}); + +test('Deserialize Card', () => { + let card: string = JSON.stringify({ + rank: 1, + suit: 2 + }); + // card.toJSON(); + return expect(JSON.parse(card, Card.reviver)).toEqual( + new Card(1, Suit.Spades) + ); }); \ No newline at end of file From f9ca2c2c4b32153d8decaeec4096c994ef445e5b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Molero?= Date: Tue, 13 Mar 2018 19:00:23 +0100 Subject: [PATCH 2/6] add CardDeck serializable --- src/Card.ts | 5 ++++- src/CardDeck.ts | 32 ++++++++++++++++++++++++++++++-- 2 files changed, 34 insertions(+), 3 deletions(-) diff --git a/src/Card.ts b/src/Card.ts index 54bcfc5..780e833 100644 --- a/src/Card.ts +++ b/src/Card.ts @@ -12,7 +12,10 @@ export default class Card implements Serializable { private readonly rank: number; private readonly suit: Suit; - public static fromJSON(json: CardJsonInterface): Card { + public static fromJSON(json: CardJsonInterface | string): Card { + if (typeof json === 'string') { + return JSON.parse(json, Card.reviver); + } return new Card(json.rank, json.suit); } diff --git a/src/CardDeck.ts b/src/CardDeck.ts index ea411d7..4f52d1a 100644 --- a/src/CardDeck.ts +++ b/src/CardDeck.ts @@ -1,10 +1,38 @@ -import Card from './Card'; +import Card, { CardJsonInterface } from './Card'; import Suit from './Suit'; +import Serializable from './interfaces/Serializable'; -export default class CardDeck { +export interface CardDeckJsonInterface { + deck: Array; +} + +export default class CardDeck implements Serializable { public readonly RANKS = 13; private deck: Array; + public static fromJSON(json: CardDeckJsonInterface | string): CardDeck { + if (typeof json === 'string') { + return JSON.parse(json, CardDeck.reviver); + } + let deck: Array = new Array(); + deck = json.deck.map((card: CardJsonInterface): Card => { + return Card.fromJSON(card); + }); + return new CardDeck(deck); + } + + public static reviver(key: string, value: CardDeckJsonInterface): CardDeck | CardDeckJsonInterface { + return key === '' ? CardDeck.fromJSON(value) : value; + } + + public toJSON(): CardDeckJsonInterface { + return { + deck: this.cards.map((card: Card): CardJsonInterface => { + return card.toJSON(); + }), + }; + } + public get cards(): Array { return this.deck; } From 3cb6437199f3992a292b663b637eaa67b16b9ada Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Molero?= Date: Wed, 14 Mar 2018 15:05:03 +0100 Subject: [PATCH 3/6] Dean and hand serialization --- src/CardDeck.ts | 54 +++++++++++++++--------------- src/Deal.ts | 23 ++++++++++++- src/Hand.ts | 29 +++++++++++++++- src/components/SimpleBlackJack.tsx | 10 +++--- src/index.tsx | 2 +- src/tests/CardDeck.test.ts | 6 ++++ src/tests/Deal.test.ts | 9 +++-- src/tests/Hand.test.ts | 12 +++++++ src/tests/SimpleBlackJack.test.tsx | 2 +- 9 files changed, 110 insertions(+), 37 deletions(-) diff --git a/src/CardDeck.ts b/src/CardDeck.ts index 4f52d1a..b329513 100644 --- a/src/CardDeck.ts +++ b/src/CardDeck.ts @@ -10,33 +10,6 @@ export default class CardDeck implements Serializable { public readonly RANKS = 13; private deck: Array; - public static fromJSON(json: CardDeckJsonInterface | string): CardDeck { - if (typeof json === 'string') { - return JSON.parse(json, CardDeck.reviver); - } - let deck: Array = new Array(); - deck = json.deck.map((card: CardJsonInterface): Card => { - return Card.fromJSON(card); - }); - return new CardDeck(deck); - } - - public static reviver(key: string, value: CardDeckJsonInterface): CardDeck | CardDeckJsonInterface { - return key === '' ? CardDeck.fromJSON(value) : value; - } - - public toJSON(): CardDeckJsonInterface { - return { - deck: this.cards.map((card: Card): CardJsonInterface => { - return card.toJSON(); - }), - }; - } - - public get cards(): Array { - return this.deck; - } - public static createStandard52CardDeck() { let deck: Array = new Array(); for (let suit: Suit = Suit.Clubs; suit <= Suit.Diamonds; suit++) { @@ -64,6 +37,33 @@ export default class CardDeck implements Serializable { } return new CardDeck(randomizedDeck); } + + public static fromJSON(json: CardDeckJsonInterface | string): CardDeck { + if (typeof json === 'string') { + return JSON.parse(json, CardDeck.reviver); + } + let deck: Array = new Array(); + deck = json.deck.map((card: CardJsonInterface): Card => { + return Card.fromJSON(card); + }); + return new CardDeck(deck); + } + + public static reviver(key: string, value: CardDeckJsonInterface): CardDeck | CardDeckJsonInterface { + return key === '' ? CardDeck.fromJSON(value) : value; + } + + public toJSON(): CardDeckJsonInterface { + return { + deck: this.cards.map((card: Card): CardJsonInterface => { + return card.toJSON(); + }), + }; + } + + public get cards(): Array { + return this.deck; + } public getLength(): number { return this.deck.length; diff --git a/src/Deal.ts b/src/Deal.ts index 8f16620..a68b47c 100644 --- a/src/Deal.ts +++ b/src/Deal.ts @@ -1,5 +1,9 @@ import Card from './Card'; -import CardDeck from './CardDeck'; +import CardDeck, { CardDeckJsonInterface } from './CardDeck'; + +export interface DealJsonInterface { + cardDeck: CardDeckJsonInterface +} export default class Deal { private cardDeck: CardDeck; @@ -8,6 +12,23 @@ export default class Deal { this.cardDeck = cardDeck || CardDeck.createStandard52CardDeck(); } + public static fromJSON(json: DealJsonInterface | string): Deal { + if (typeof json === 'string') { + return JSON.parse(json, Deal.reviver); + } + return new Deal(CardDeck.fromJSON(json.cardDeck)); + } + + public static reviver(key: string, value: DealJsonInterface): Deal | DealJsonInterface { + return key === '' ? Deal.fromJSON(value) : value; + } + + public toJSON(): DealJsonInterface { + return { + cardDeck: this.cardDeck.toJSON(), + }; + } + public pullCard(): Card { try { return this.cardDeck.popCard(); diff --git a/src/Hand.ts b/src/Hand.ts index fe9c9d4..7d30867 100644 --- a/src/Hand.ts +++ b/src/Hand.ts @@ -1,8 +1,35 @@ -import Card from './Card'; +import Card, { CardJsonInterface } from './Card'; + +export interface HandJsonInterface { + cards: Array, +} export default class Hand { private cards: Array; + public static fromJSON(json: HandJsonInterface | string): Hand { + if (typeof json === 'string') { + return JSON.parse(json, Hand.reviver); + } + let cards: Array = new Array(); + cards = json.cards.map((card: CardJsonInterface): Card => { + return Card.fromJSON(card); + }); + return new Hand(cards); + } + + public static reviver(key: string, value: HandJsonInterface): Hand | HandJsonInterface { + return key === '' ? Hand.fromJSON(value) : value; + } + + public toJSON(): HandJsonInterface { + return { + cards: this.cards.map((card: Card): CardJsonInterface => { + return card.toJSON(); + }), + }; + } + public constructor(cards?: Array) { this.cards = cards || new Array(); } diff --git a/src/components/SimpleBlackJack.tsx b/src/components/SimpleBlackJack.tsx index b89036d..bdef44e 100644 --- a/src/components/SimpleBlackJack.tsx +++ b/src/components/SimpleBlackJack.tsx @@ -9,8 +9,9 @@ class SimpleBlackJack extends React.Component { private readonly KEY: string = 'blackjack'; setItem(key: string, data: string) { - this.props.localStorage && - this.props.localStorage.setItem(key, data); + if (this.props.localStorage) { + this.props.localStorage.setItem(key, data); + } } getItem(key: string): JsonStateInterface { @@ -51,8 +52,9 @@ class SimpleBlackJack extends React.Component { handleResetGame(): boolean { try { - this.props.localStorage && - this.props.localStorage.clear(); + if (this.props.localStorage) { + this.props.localStorage.clear(); + } } catch (errorOnSave) { return false; } diff --git a/src/index.tsx b/src/index.tsx index 8e4f164..6e11d7b 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -6,7 +6,7 @@ import './css/base.css'; import './css/enhanced.css'; ReactDOM.render( - , + , document.getElementById('root') as HTMLElement ); registerServiceWorker(); diff --git a/src/tests/CardDeck.test.ts b/src/tests/CardDeck.test.ts index b259c3e..b262235 100644 --- a/src/tests/CardDeck.test.ts +++ b/src/tests/CardDeck.test.ts @@ -13,6 +13,12 @@ test('A shuffled deck has no ordered cards', () => { return expect(areCardsInOrder(deck)).toBeFalsy(); }); +test('A deck is serialized', () => { + const deck: CardDeck = CardDeck.createStandard52CardDeck(); + const jsonDeck: string = JSON.stringify(deck); + return expect(JSON.parse(jsonDeck, CardDeck.reviver)).toEqual(deck); +}); + function areCardsInOrder(deck: CardDeck): boolean { let inOrder: boolean = true; for (let suit: Suit = Suit.Diamonds; suit >= Suit.Clubs && inOrder; suit--) { diff --git a/src/tests/Deal.test.ts b/src/tests/Deal.test.ts index b26e617..ad3331a 100644 --- a/src/tests/Deal.test.ts +++ b/src/tests/Deal.test.ts @@ -1,3 +1,8 @@ -test('pass', () => { - return expect(true).toBeTruthy(); +import Deal from "./../Deal"; +import CardDeck from "./../CardDeck"; + +test('A deal is serialized', () => { + const deal: Deal = new Deal(CardDeck.createStandard52CardDeck()); + const jsonDeal: string = JSON.stringify(deal); + return expect(JSON.parse(jsonDeal, Deal.reviver)).toEqual(deal); }); \ No newline at end of file diff --git a/src/tests/Hand.test.ts b/src/tests/Hand.test.ts index e56a594..10dfa0a 100644 --- a/src/tests/Hand.test.ts +++ b/src/tests/Hand.test.ts @@ -47,4 +47,16 @@ test('black jack with 1 Aces and a figure of 10 points', () => { hand.add(card1); hand.add(card2); return expect(hand.getScore()).toBe(21); +}); + +test('A hand is serialized', () => { + let card1: Card = new Card(1, Suit.Hearts); + let card2: Card = new Card(12, Suit.Hearts); + + let hand: Hand = new Hand(); + hand.add(card1); + hand.add(card2); + const jsonHand: string = JSON.stringify(hand); + + return expect(JSON.parse(jsonHand, Hand.reviver)).toEqual(hand); }); \ No newline at end of file diff --git a/src/tests/SimpleBlackJack.test.tsx b/src/tests/SimpleBlackJack.test.tsx index 22b7fb0..55912a0 100644 --- a/src/tests/SimpleBlackJack.test.tsx +++ b/src/tests/SimpleBlackJack.test.tsx @@ -4,5 +4,5 @@ import SimpleBlackJack from '../components/SimpleBlackJack'; it('renders without crashing', () => { const div = document.createElement('div'); - ReactDOM.render(, div); + ReactDOM.render(, div); }); From 80628d3f3b3382a434e06ec6bf78bbe83215d50e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Molero?= Date: Thu, 15 Mar 2018 10:51:47 +0100 Subject: [PATCH 4/6] Player serialization --- src/Player.ts | 23 ++++++++++++++++++++++- 1 file changed, 22 insertions(+), 1 deletion(-) diff --git a/src/Player.ts b/src/Player.ts index a5a1f67..5e766b9 100644 --- a/src/Player.ts +++ b/src/Player.ts @@ -1,9 +1,30 @@ -import Hand from './Hand'; +import Hand, { HandJsonInterface } from './Hand'; import Card from './Card'; +interface PlayerJsonInterface { + hand: HandJsonInterface, +} + export default class Player { private hand: Hand; + public static fromJSON(json: PlayerJsonInterface | string): Player { + if (typeof json === 'string') { + return JSON.parse(json, Player.reviver); + } + return new this(Hand.fromJSON(json.hand)); + } + + public static reviver(key: string, value: PlayerJsonInterface): Player | PlayerJsonInterface { + return key === '' ? this.fromJSON(value) : value; + } + + public toJSON(): PlayerJsonInterface { + return { + hand: this.hand.toJSON(), + }; + } + public constructor(hand: Hand) { this.hand = hand; } From 7d9b331133b8d8ec2ab7c788d5ae9bb263090b0f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Molero?= Date: Thu, 15 Mar 2018 15:57:29 +0100 Subject: [PATCH 5/6] #4 full serialization and local storage to save full state --- src/Board.ts | 70 +++++++++++++++++++++++++----- src/Deal.ts | 10 ++--- src/Hand.ts | 2 +- src/Player.ts | 4 +- src/components/BoardComponent.tsx | 5 ++- src/components/SimpleBlackJack.tsx | 4 ++ src/tests/Board.test.ts | 7 +++ src/tests/Deal.test.ts | 4 +- 8 files changed, 82 insertions(+), 24 deletions(-) create mode 100644 src/tests/Board.test.ts diff --git a/src/Board.ts b/src/Board.ts index a85230d..e13afb3 100644 --- a/src/Board.ts +++ b/src/Board.ts @@ -1,19 +1,50 @@ -import Player from './Player'; -import Deal from './Deal'; +import Player, { PlayerJsonInterface } from './Player'; +import Deal, { DealJsonInterface } from './Deal'; import House from './House'; import Hand from './Hand'; import Card from './Card'; import CardDeck from './CardDeck'; +export interface BoardJsonInterface { + deal: DealJsonInterface; + house: PlayerJsonInterface; + player1: PlayerJsonInterface; +} + export default class Board { + private static playerWins: number = 0; + private static houseWins: number = 0; private readonly SCORE_THRESHOLD: number = 21; private deal: Deal; - private playerWins: number = 0; - private houseWins: number = 0; + private house: House; private player1: Player; + public static get PlayerWins(): number { + return this.playerWins; + } + + public static get HouseWins(): number { + return this.houseWins; + } + + public static set PlayerWins(wins: number) { + this.playerWins = wins; + } + + public static set HouseWins(wins: number) { + this.houseWins = wins; + } + + public static sumPlayerWins(): number { + return ++this.playerWins; + } + + public static sumHouseWins(): number { + return ++this.houseWins; + } + public static newGame(): Board { let deal: Deal = new Deal(CardDeck.createStandard52CardDeck()); let playerHand: Hand = new Hand([]); @@ -24,6 +55,29 @@ export default class Board { return new Board(deal, house, player1); } + public static fromJSON(json: BoardJsonInterface | string): Board { + if (typeof json === 'string') { + return JSON.parse(json, Board.reviver); + } + return new Board( + Deal.fromJSON(json.deal), + House.fromJSON(json.house), + Player.fromJSON(json.player1) + ); + } + + public static reviver(key: string, value: BoardJsonInterface): Board | BoardJsonInterface { + return key === '' ? Board.fromJSON(value) : value; + } + + public toJSON(): BoardJsonInterface { + return { + deal: this.deal.toJSON(), + house: this.house.toJSON(), + player1: this.player1.toJSON() + }; + } + public newDeal(): Board { let deal: Deal = new Deal(CardDeck.createStandard52CardDeck()); let playerHand: Hand = new Hand([deal.pullCard()]); @@ -57,14 +111,6 @@ export default class Board { return this.deal; } - public getPlayerWins(): number { - return this.playerWins; - } - - public getHouseWins(): number { - return this.houseWins; - } - public getHouse(): House { return this.house; } diff --git a/src/Deal.ts b/src/Deal.ts index a68b47c..4eb0f0a 100644 --- a/src/Deal.ts +++ b/src/Deal.ts @@ -2,16 +2,12 @@ import Card from './Card'; import CardDeck, { CardDeckJsonInterface } from './CardDeck'; export interface DealJsonInterface { - cardDeck: CardDeckJsonInterface + cardDeck: CardDeckJsonInterface; } export default class Deal { private cardDeck: CardDeck; - public constructor(cardDeck?: CardDeck) { - this.cardDeck = cardDeck || CardDeck.createStandard52CardDeck(); - } - public static fromJSON(json: DealJsonInterface | string): Deal { if (typeof json === 'string') { return JSON.parse(json, Deal.reviver); @@ -29,6 +25,10 @@ export default class Deal { }; } + public constructor(cardDeck?: CardDeck) { + this.cardDeck = cardDeck || CardDeck.createStandard52CardDeck(); + } + public pullCard(): Card { try { return this.cardDeck.popCard(); diff --git a/src/Hand.ts b/src/Hand.ts index 7d30867..bec28e3 100644 --- a/src/Hand.ts +++ b/src/Hand.ts @@ -1,7 +1,7 @@ import Card, { CardJsonInterface } from './Card'; export interface HandJsonInterface { - cards: Array, + cards: Array; } export default class Hand { diff --git a/src/Player.ts b/src/Player.ts index 5e766b9..ff028b5 100644 --- a/src/Player.ts +++ b/src/Player.ts @@ -1,8 +1,8 @@ import Hand, { HandJsonInterface } from './Hand'; import Card from './Card'; -interface PlayerJsonInterface { - hand: HandJsonInterface, +export interface PlayerJsonInterface { + hand: HandJsonInterface; } export default class Player { diff --git a/src/components/BoardComponent.tsx b/src/components/BoardComponent.tsx index 0e1594c..ecf12bd 100644 --- a/src/components/BoardComponent.tsx +++ b/src/components/BoardComponent.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import DealComponent from './DealComponent'; -import Board from '../Board'; +import Board, { BoardJsonInterface } from '../Board'; export interface BoardStateInterface { board: Board; @@ -20,6 +20,7 @@ interface BoardPropsInterface { } export interface JsonStateInterface { + board: BoardJsonInterface; handNumber: number; playerScore: number; houseScore: number; @@ -42,7 +43,7 @@ export class BoardComponent extends React.Component { return JSON.parse(jsonState); } } + return { + board: Board.newGame().toJSON(), handNumber: 0, playerScore: 0, houseScore: 0, @@ -30,6 +33,7 @@ class SimpleBlackJack extends React.Component { saveGame(state: BoardStateInterface) { let jsonSate: JsonStateInterface = { + board: state.board.toJSON(), handNumber: state.handNumber, playerScore: state.playerScore, houseScore: state.houseScore, diff --git a/src/tests/Board.test.ts b/src/tests/Board.test.ts new file mode 100644 index 0000000..5201c03 --- /dev/null +++ b/src/tests/Board.test.ts @@ -0,0 +1,7 @@ +import Board from './../Board'; + +test('A Board is serialized', () => { + const board: Board = Board.newGame(); + const jsonBoard: string = JSON.stringify(board); + return expect(JSON.parse(jsonBoard, Board.reviver)).toEqual(board); +}); \ No newline at end of file diff --git a/src/tests/Deal.test.ts b/src/tests/Deal.test.ts index ad3331a..3c16a1d 100644 --- a/src/tests/Deal.test.ts +++ b/src/tests/Deal.test.ts @@ -1,5 +1,5 @@ -import Deal from "./../Deal"; -import CardDeck from "./../CardDeck"; +import Deal from './../Deal'; +import CardDeck from './../CardDeck'; test('A deal is serialized', () => { const deal: Deal = new Deal(CardDeck.createStandard52CardDeck()); From 347fd654836e1e964a9d74f200e444766c690c6a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Molero?= Date: Thu, 15 Mar 2018 18:23:47 +0100 Subject: [PATCH 6/6] #4 state object to store buttons and message --- src/components/BoardComponent.tsx | 12 ++++++++---- src/components/SimpleBlackJack.tsx | 8 ++++++++ 2 files changed, 16 insertions(+), 4 deletions(-) diff --git a/src/components/BoardComponent.tsx b/src/components/BoardComponent.tsx index ecf12bd..ab6b44c 100644 --- a/src/components/BoardComponent.tsx +++ b/src/components/BoardComponent.tsx @@ -24,6 +24,10 @@ export interface JsonStateInterface { handNumber: number; playerScore: number; houseScore: number; + btnDealerClass: string; + btnHitClass: string; + btnStandClass: string; + message: string; } export class BoardComponent extends React.Component { @@ -47,10 +51,10 @@ export class BoardComponent extends React.Component { handNumber: 0, playerScore: 0, houseScore: 0, + btnDealerClass: '', + btnHitClass: 'invisible', + btnStandClass: 'invisible', + message: 'Welcome to vmolero\'s BlackJack Game. Press \'Deal!\' to start playing.' }; } @@ -37,6 +41,10 @@ class SimpleBlackJack extends React.Component { handNumber: state.handNumber, playerScore: state.playerScore, houseScore: state.houseScore, + btnDealerClass: state.btnDealerClass, + btnHitClass: state.btnHitClass, + btnStandClass: state.btnStandClass, + message: state.message }; this.setItem(this.KEY, JSON.stringify(jsonSate)); }