search

Recursion-Group-P / blokee

https://blockee.netlify.app
3 stars 0 forks source link

Feat/game/cpu #57

Closed hiroto0222 closed 2 years ago

hiroto0222 commented 2 years ago

Issue: #50

目的

実装の概要

tkwonn commented 2 years ago

@hiroto0222

ゲーム音いいですね！Macでも聞こえますよ CPUの実装もいい感じです。3点だけ気になった部分があります。

  1. CPUが次の手を決めるまでが早すぎてどこに置いたのかわからない（特に４人プレイ）＋時間をあまり浪費しない

対策 ・setTimeOutの第二引数の値を5秒から10秒くらい取るのはどうでしょうか？ ・新しいピースの場合、どこに置いたのかわかるようにCSSを当てるとか？

  1. ユーザがPassした場合、CPUにプレイヤーチェンジしない＋ユーザの時間切れの場合、処理が止まる

こちらはゲーム判定がまだ完成していなかったということもあると思うので、一旦hayatoさんのとこちらのプルリクをマージしてから修正していただきます。

ちなみに、RoomPageのchangePlayerTurn関数で // ピースを置かずにターンが変わる場合(パス, 時間切れ)場合は実行しない とコメントにありますが、これは意図的にそうしたのでしょうか？

  1. getRandomMoves関数について

src/model/player.js

getRandomMoves() {
    const randomMoves = [];
    for (let row = 0; row < this.totalCells; row++) {
      for (let col = 0; col < this.totalCells; col++) {
        randomMoves.push([row, col]);
      }
    }
    randomMoves.sort(() => Math.random() - 0.5);

    return randomMoves;
  }

getPieceOptions() {
    return Object.keys(this.remainingPieces)
      .reverse()
      .reduce((filtered, pieceId) => {
        if (!this.remainingPieces[pieceId].isUsed) {
          filtered.push(parseInt(pieceId));
        }
        return filtered;
      }, []);
  }

今のランダムプレイヤーの動きは以下のようになっていますよね。

・ボードの座標から一旦すべて洗い出して、それをランダムに並び変える（2人プレイの場合、196通り） ・最大のマスのピースを取得し、それをランダムに置く。3回まで回転したりできる？

これだとかなり計算量が多くなってしまうと思うんですよね。。

僕は、Random アルゴリズムは、まず手元のピースの中からランダムに置くピースを選択し、そのピースが配置可能な位置を取得する。（確かAvailablePlayerMovesみたいな配列を返す関数があった気がする） そして配置可能な座標が入っているその配列からランダムに次の手を選択する 配置可能な座標がない場合、今のピースを候補から除いて、また別のピースをランダムに選択するのを繰り返すというのを想定していましたが、何かしらうまくいかなかったため、14 * 14 = 196個の配列を作成するという方法にしたんでしょうか？

できたらランダムでも貪欲法でも探索範囲をあらかじめ絞れた方が計算量的にいいので。。

tkwonn commented 2 years ago

@hiroto0222 先にhayatoさんが行なってくださったゲームロジックとタイマーの処理が追加されたDevelopブランチにマージしてから修正したほうがやりやすいですか？ もしそうであれば、先にこちらマージしようかと思っています！

hiroto0222 commented 2 years ago

@tkwonn レビューありがとうございます！

  1. CPUが次の手を決めるまでが早すぎてどこに置いたのかわからない（特に４人プレイ）＋時間をあまり浪費しない

対策 ・setTimeOutの第二引数の値を5秒から10秒くらい取るのはどうでしょうか？

10秒ですとかなり長く感じるので、4 - 6 秒だと程良いかも？（相談必要）

新しいピースの場合、どこに置いたのかわかるようにCSSを当てるとか？

新しいピースを置いた際に canvas でボーダー色を濃く入れたりすると分かりやすいかもしれないです。

  1. getRandomMoves関数について 僕は、Random アルゴリズムは、まず手元のピースの中からランダムに置くピースを選択し、そのピースが配置可能な位置を取得する。（確かAvailablePlayerMovesみたいな配列を返す関数があった気がする）そして配置可能な座標が入っているその配列からランダムに次の手を選択する 配置可能な座標がない場合、今のピースを候補から除いて、また別のピースをランダムに選択するのを繰り返すというのを想定していましたが、何かしらうまくいかなかったため、14 * 14 = 196個の配列を作成するという方法にしたんでしょうか？