連続対戦最適化

Author: claw88

src/components/Junanaho.vue

@@ -1,77 +1,99 @@
 <template>
   <div>
     <div>
-      <h3>P2の手牌（{{p2Hand.length}}）</h3>
+      <h3>P2の手牌（{{ p2Hand.length }}）</h3>
       <draggable v-model="p2Hand" group="myGroup" :options="options">
         <div
           class="tile"
           v-for="tile in p2Hand"
           :key="tile.id"
           :class="isFixed(false)"
-        >{{tile.name}}</div>
+        >
+          {{ tile.name }}
+        </div>
       </draggable>
     </div>
     <div>
-      <h3>P2の打牌候補（{{p2Pool.length}}）</h3>
+      <h3>P2の打牌候補（{{ p2Pool.length }}）</h3>
       <draggable v-model="p2Pool" group="myGroup" :options="options">
         <div
           class="tile"
           v-for="tile in p2Pool"
           :key="tile.id"
           :class="isFixed(false)"
-        >{{tile.name}}</div>
+        >
+          {{ tile.name }}
+        </div>
       </draggable>
     </div>
     <div>
-      <h3>P2の河（{{p2River.length - 1}}）</h3>
-      <draggable v-model="p2River" group="myGroup" :options="options" @add="onP2Add">
+      <h3>P2の河（{{ p2River.length - 1 }}）</h3>
+      <draggable
+        v-model="p2River"
+        group="myGroup"
+        :options="options"
+        @add="onP2Add"
+      >
         <div
           class="tile"
           v-for="tile in p2River"
           :key="tile.id"
           :class="isFixed(true)"
-        >{{tile.name}}</div>
+        >
+          {{ tile.name }}
+        </div>
       </draggable>
     </div>
     <div class="dora">
       <h3>ドラ表</h3>
-      <div class="tile">{{dora}}</div>
+      <div class="tile">{{ dora }}</div>
     </div>
     <div class="dora">
       <h3>裏ドラ表</h3>
-      <div class="tile">{{uradora}}</div>
+      <div class="tile">{{ uradora }}</div>
     </div>
     <div>
-      <h3>P1の河（{{p1River.length - 1}}）</h3>
-      <draggable v-model="p1River" group="myGroup" :options="options" @add="onP1Add">
+      <h3>P1の河（{{ p1River.length - 1 }}）</h3>
+      <draggable
+        v-model="p1River"
+        group="myGroup"
+        :options="options"
+        @add="onP1Add"
+      >
         <div
           class="tile"
           v-for="tile in p1River"
           :key="tile.id"
           :class="isFixed(true)"
-        >{{tile.name}}</div>
+        >
+          {{ tile.name }}
+        </div>
       </draggable>
     </div>
     <div>
-      <h3>P1の打牌候補 （{{p1Pool.length}}）</h3>
+      <h3>P1の打牌候補 （{{ p1Pool.length }}）</h3>
       <draggable v-model="p1Pool" group="myGroup" :options="options">
         <div
           class="tile"
           v-for="tile in p1Pool"
           :key="tile.id"
           :class="isFixed(false)"
-        >{{tile.name}}</div>
+        >
+          {{ tile.name }}
+        </div>
       </draggable>
     </div>
     <div>
-      <h3>P1の手牌（{{p1Hand.length}}）</h3>
+      <h3>P1の手牌（{{ p1Hand.length }}）</h3>
       <draggable v-model="p1Hand" group="myGroup" :options="options">
         <div
           class="tile"
           v-for="tile in p1Hand"
           :key="tile.id"
           :class="isFixed(false)"
-        >{{tile.name}}</div>
+        >
+          {{ tile.name }}
+        </div>
       </draggable>
     </div>
 
@@ -267,6 +289,8 @@ export default {
       console.log("test");
     },
     initialize() {
+      resetRef();
+
       const mm = ["m1", "m2", "m3", "m4", "m5", "m6", "m7", "m8", "m9"];
       const pp = ["p1", "p2", "p3", "p4", "p5", "p6", "p7", "p8", "p9"];
       const ss = ["s1", "s2", "s3", "s4", "s5", "s6", "s7", "s8", "s9"];
@@ -307,16 +331,23 @@ export default {
         p2Hand: p2Tiles.slice(21),
         p2River: this.initialRiver,
       });
+
       console.log("initialize finish.");
     },
     p1Start() {
+      resetRef();
+
       const gameRef = firebase.database().ref("/game");
       gameRef.once("value", (snapshot) => {
         this.dora = snapshot.val()["dora"];
         this.p1Pool = snapshot.val()["p1Pool"];
         this.p1Hand = snapshot.val()["p1Hand"];
       });
-      this.riverConnect();
+
+      p2Ref.on("value", (snapshot) => {
+        this.p2River = snapshot.val();
+        console.log("p2RiverRef");
+      });
 
       this.p2Pool = this.initialPool;
       this.p2Hand = this.initialHand;
@@ -325,52 +356,58 @@ export default {
       console.log("start as p1.");
     },
     p2Start() {
+      resetRef();
+
       const gameRef = firebase.database().ref("/game");
       gameRef.once("value", (snapshot) => {
         this.dora = snapshot.val()["dora"];
         this.p2Pool = snapshot.val()["p2Pool"];
         this.p2Hand = snapshot.val()["p2Hand"];
       });
-      this.riverConnect();
+
+      const p1Ref = firebase.database().ref("/game/p1River");
+      p1Ref.off();
+      p1Ref.on("value", (snapshot) => {
+        this.p1River = snapshot.val();
+        console.log("p1RiverRef");
+      });
 
       this.p1Pool = this.initialPool;
       this.p1Hand = this.initialHand;
       this.uradora = "??";
 
       console.log("start as p2.");
     },
-    riverConnect() {
-      const p1Ref = firebase.database().ref("/game/p1River");
-      p1Ref.on("value", (snapshot) => {
-        this.p1River = snapshot.val();
-      });
-      const p2Ref = firebase.database().ref("/game/p2River");
-      p2Ref.on("value", (snapshot) => {
-        this.p2River = snapshot.val();
-      });
-    },
-    async win() {
+    win() {
+      resetRef();
+
       const gameRef = firebase.database().ref("/game");
       gameRef.update({
         p1Hand: this.p1Hand,
         p2Hand: this.p2Hand,
       });
-      const snapshot = await gameRef.once("value");
-      if (snapshot.val()) {
+      gameRef.once("value", (snapshot) => {
         this.uradora = snapshot.val()["uradora"];
-      }
+      });
       console.log("I win.");
     },
-    async lose() {
+    lose() {
+      resetRef();
+
       const gameRef = firebase.database().ref("/game");
-      const snapshot = await gameRef.once("value");
-      if (snapshot.val()) {
+      gameRef.once("value", (snapshot) => {
         this.uradora = snapshot.val()["uradora"];
         this.p1Hand = snapshot.val()["p1Hand"];
         this.p2Hand = snapshot.val()["p2Hand"];
-      }
+      });
       console.log("I lose.");
     },
+    resetRef() {
+      const p1Ref = firebase.database().ref("/game/p1River");
+      p1Ref.off();
+      const p2Ref = firebase.database().ref("/game/p2River");
+      p2Ref.off();
+    },
     // フィルタされている要素を選択した時（filterイベント）
     onFilter() {
       console.log("onFilter");