前言

今天來寫個簡單的下注狀態吧！一開始進入遊戲時，都會顯示下局才能投注，然後就必須等到下一局猜會解除，並才可以投注。

狀態訊息

以上主要關注的其實就是WaitNextBetNotify這個組件，就是我們那一條訊息，等待下局才能下注的訊息。
其實也就是直接加到Body上而已！

// ... 省略

export default class Body extends WrapperContainerCenter {
    // ... 省略
  private _waitNextBetNotify: WaitNextBetNotify

  constructor() {
    super()

    // ... 省略

    this._waitNextBetNotify = new WaitNextBetNotify()
    this._centerContainer.addChild(this._table)
    this._centerContainer.addChild(this._chipsLayer)
    this._centerContainer.addChild(this._pokersPlayer)
    this._centerContainer.addChild(this._pokersBanker)
    this._centerContainer.addChild(this._betStatusntf)
    this._centerContainer.addChild(this._waitNextBetNotify)
    this._waitNextBetNotify.setPosition(
      { animation: false },
      this.width / 2 - 80,
      this.height / 2
    )

    this.initIO()
    this.initChips()
  }

  public initChips() {
       // ... 省略
  }

  public initIO() {
    $io.on(cmd.MSG_TB_NTF, (reason: any, data: any) => {
      switch (reason) {
        case cst.TB_NTF_COUNTDOWN_START:
          this._betStatusntf.betNotifyStart()
          this._waitNextBetNotify.setAlpha(true, 0)
          setTimeout(() => this._waitNextBetNotify.removeChildren, 1000)
          break
        case cst.TB_NTF_COUNTDOWN_STOP:
         // ... 省略
        case cst.TB_NTF_PI_RESULT:
         // ... 省略
      }
    })
 // ... 省略
}

串接狀態

我們先來思考目前甚麼時候會顯示，其實最簡單的狀況就是一進去遊戲時，預設都是顯示，直到收到下注開始就會關閉這個動畫。

直接等待TB_NTF_COUNTDOWN_START這個指令來，這個指令代表的是開始下注的意思，因此從這邊關閉再好不過。

$io.on(cmd.MSG_TB_NTF, (reason: any, data: any) => {
  switch (reason) {
    case cst.TB_NTF_COUNTDOWN_START:
      this._betStatusntf.betNotifyStart()
      this._waitNextBetNotify.setAlpha(true, 0)
      setTimeout(() => this._waitNextBetNotify.removeChildren, 1000)
      break
    case cst.TB_NTF_COUNTDOWN_STOP:
      // ... 省略
    case cst.TB_NTF_PI_RESULT:
      // ... 省略
  }
})

初始化籌碼

另外順便做一個部分，就是當我們下注完之後，可能重新整理頁面導致籌碼被清除，於是我們需要在進入頁面時，取得目前我的下注內容，以更新目前桌的狀況。

在開始時直接請求下注資訊，並更新到redux，還要通知chipsLayer放上我們的籌碼！

$io.REQ_USER_BET_INFO().then((data: any) => {
  let _betChip = store.getState().betChip
  store.dispatch(
    actions.updateBetChip({ betChip: plusBet(_betChip, data.bet) })
  )
  this._chipsLayer.addBetChip('bcr', 'users', data.bet)
})

結果

後記

明天把撲克牌串接完，應該玩的過程就差不多了！就只差多人遊戲的狀況了。