Merge pull request #61 from floptheworld/dev

Merging dev into Master

src/common/game/game-play.ts

@@ -173,6 +173,7 @@ export class GamePlay implements GamePlayType {
         this.board.push(this.deck!.pop()!);
         break;
       default:
+        this.players.map((player) => (player.isTurn = false));
         this.isGameOver = true;
         break;
     }

src/common/player/player.ts

@@ -48,16 +48,18 @@ export class Player implements PlayerType {
 
   public setBigBlind(blind: number): void {
     this.isBigBlind = true;
-    this.bet = blind.toFixed(2);
-    this.stackAmount -= blind;
-    this.invested += blind;
+    const amount = this.stackAmount < blind ? this.stackAmount : blind;
+    this.bet = amount.toFixed(2);
+    this.stackAmount -= amount;
+    this.invested += amount;
   }
 
   public setLittleBlind(blind: number): void {
     this.isLittleBlind = true;
-    this.bet = blind.toFixed(2);
-    this.stackAmount -= blind;
-    this.invested += blind;
+    const amount = this.stackAmount < blind ? this.stackAmount : blind;
+    this.bet = amount.toFixed(2);
+    this.stackAmount -= amount;
+    this.invested += amount;
   }
 
   public cleanPlayer(): void {

src/components/action.ts

@@ -6,6 +6,7 @@ import {
   LitElement,
   property,
   TemplateResult,
+  PropertyValues,
 } from "lit-element";
 import { classMap } from "lit-html/directives/class-map";
 import { GameState, PlayerState } from "../common/types";
@@ -16,6 +17,7 @@ import {
   leaveGame,
   callClock,
 } from "../data/connection";
+import { turnActions } from "../common/const";
 
 interface BetTarget extends EventTarget {
   multiplier: number;
@@ -33,7 +35,8 @@ interface ActionTarget extends EventTarget {
 export class Action extends LitElement {
   @property() public game!: GameState;
   @property() public socket!: SocketIOClient.Socket;
-  @property() private player?: PlayerState;
+  @property() private bet?: string;
+  private player?: PlayerState;
 
   protected render(): TemplateResult {
     if (!this.game) {
@@ -44,30 +47,32 @@ export class Action extends LitElement {
       (player) => player.playerID === this.game.currentPlayerID
     );
 
+    this.bet = this.bet || "";
+
     if (!this.player) {
       return html``;
     }
 
-    // if (this.player.bet === "" && this.player.isTurn && !this.game.isGameOver) {
-    //   this.player.bet = (this.game.currentBet !== 0
-    //     ? this.game.currentBet + this.game.bigBlind
-    //     : this.game.bigBlind + this.game.littleBlind
-    //   ).toFixed(2);
-    // }
+    if (this.bet === "" && this.player.isTurn && !this.game.isGameOver) {
+      this.bet = (this.game.currentBet !== 0
+        ? this.game.currentBet + this.game.bigBlind
+        : this.game.bigBlind + this.game.littleBlind
+      ).toFixed(2);
+    }
 
-    const playerBetNum = roundToPrecision(parseFloat(this.player.bet), 0.01);
+    const playerBetNum = roundToPrecision(parseFloat(this.bet), 0.01);
     const playerStackRounded = roundToPrecision(this.player.stackAmount, 0.01);
 
     const raiseDisabled =
       (playerBetNum < this.game.currentBet + this.game.bigBlind ||
         playerBetNum > playerStackRounded ||
-        this.player.bet === "") &&
+        this.bet === "") &&
       playerBetNum !== playerStackRounded;
 
     const betDisabled =
       (playerBetNum < this.game.bigBlind ||
         playerBetNum > playerStackRounded ||
-        this.player.bet === "") &&
+        this.bet === "") &&
       playerBetNum !== playerStackRounded;
 
     return html`
@@ -131,10 +136,10 @@ export class Action extends LitElement {
         <div>
           <input
             @keyup=${this._setBetFromText}
-            .value=${this.player.bet}
+            .value=${this.bet}
             class="bet-text input"
             type="number"
-            step="0.1"
+            step="${this.game.bigBlind.toFixed(2)}"
             min="0"
           />
         </div>
@@ -247,6 +252,14 @@ export class Action extends LitElement {
     `;
   }
 
+  protected shouldUpdate(changedProps: PropertyValues): boolean {
+    if (!changedProps.has("game")) {
+      return this.bet !== "";
+    }
+
+    return true;
+  }
+
   static get styles(): CSSResult {
     return css`
       :host {
@@ -366,21 +379,23 @@ export class Action extends LitElement {
       return;
     }
 
-    this.player.bet = roundToPrecision(
-      (e.target! as BetTarget).multiplier *
-        (this.game.pot + this.game.currentPot),
+    let pot: number = 0;
+    this.game.pots.map((p) => (pot += p));
+
+    this.bet = roundToPrecision(
+      (e.target! as BetTarget).multiplier * (pot + this.game.currentPot),
       0.01
-    ).toString();
-    this.requestUpdate();
+    )
+      .toFixed(2)
+      .toString();
   }
 
   private _setBetFromText(e: KeyboardEvent) {
     if (!this.player) {
       return;
     }
 
-    this.player.bet = (e.target! as TextBetTarget).value.toString();
-    this.requestUpdate();
+    this.bet = (e.target! as TextBetTarget).value.toString();
   }
 
   private _callPlayerAction(e: MouseEvent): void {
@@ -391,17 +406,21 @@ export class Action extends LitElement {
     const action: string = (e.target! as ActionTarget).action;
 
     if (
-      parseFloat(this.player.bet) > this.player.stackAmount &&
+      parseFloat(this.bet!) > this.player.stackAmount &&
       (action === "raise" || action === "bet")
     ) {
       return;
     }
 
     const amount: string =
-      action !== "rebuy" ? this.player.bet : this._rebuyInput.value;
+      action !== "rebuy" ? this.bet! : this._rebuyInput.value;
 
     sendPlayerAction(this.socket, this.game.gameID, action, amount);
 
+    if (turnActions.has(action)) {
+      this.bet = "";
+    }
+
     if (action === "rebuy") {
       alert(
         `You bought $${this._rebuyInput.value} that will be added after this hand`

src/components/seat.ts

@@ -48,7 +48,12 @@ export class Seat extends LitElement {
             `
           )}
         </div>
-        <div class="player-box" ?data-player-turn=${this.player.isTurn}>
+        <div
+          class="player-box"
+          ?data-player-turn=${this.player.isTurn}
+          ?data-current-player-turn=${this.player.playerID ===
+            this.currentPlayerID && this.player.isTurn}
+        >
           ${!this.player.dealer
             ? ""
             : html`
@@ -126,6 +131,9 @@ export class Seat extends LitElement {
       .player-box[data-player-turn] {
         background-color: #152642;
       }
+      .player-box[data-current-player-turn] {
+        box-shadow: 0 0 0 2pt white;
+      }
       .card-box {
         text-align: center;
         height: 94px;

src/data/connection.ts

@@ -4,7 +4,7 @@ import { GameState, User } from "../common/types";
 export async function createConnection(
   setState: (state: GameState) => void
 ): Promise<SocketIOClient.Socket> {
-  const socket = io("", { transports: ["websocket"], upgrade: false });
+  const socket = io("/", { transports: ["polling"] });
 
   socket.on("gameUpdate", (state: GameState) => {
     setState(state);
@@ -32,7 +32,6 @@ export function findOrCreatePlayer(
     localStorage.name = player.userName;
 
     socket.emit("subscribeToGame", "asdf1234", localStorage.playerID);
-    socket.emit("gameStart", "asdf1234");
   });
 }