X-Git-Url: https://git.auder.net/?a=blobdiff_plain;f=client%2Fsrc%2Fviews%2FGame.vue;h=e8b07567db18aaf0cd16a103ee52961501753220;hb=5fc82c80fe57ad106cc117a534b242cc08805890;hp=0d7a4ee90b1dd1ceb3ec706ffd82ddaa00677403;hpb=07052665845283c65b50a76537669d0602ba436b;p=vchess.git

diff --git a/client/src/views/Game.vue b/client/src/views/Game.vue
index 0d7a4ee9..e8b07567 100644
--- a/client/src/views/Game.vue
+++ b/client/src/views/Game.vue
@@ -97,13 +97,13 @@ main
         )
           img(src="/images/icons/draw.svg")
         button.tooltip(
-          v-if="!!game.mycolor"
+          v-show="!!game.mycolor"
           @click="abortGame()"
           :aria-label="st.tr['Abort']"
         )
           img(src="/images/icons/abort.svg")
         button.tooltip(
-          v-if="!!game.mycolor"
+          v-show="!!game.mycolor"
           @click="resign()"
           :aria-label="st.tr['Resign']"
         )
@@ -815,8 +815,7 @@ export default {
                   GameStorage.update(this.gameRef, { drawOffer: "" });
                 }
               }
-              this.$refs["basegame"].play(
-                movePlus.move, "received", null, true);
+              this.$refs["basegame"].play(movePlus.move, "received");
               this.game.clocks[moveColIdx] = movePlus.clock;
               this.processMove(
                 movePlus.move,
@@ -883,6 +882,8 @@ export default {
             this.$router.push("/game/" + gameInfo.id);
           } else {
             this.rematchId = gameInfo.id;
+            document.getElementById("modalRules").checked = false;
+            document.getElementById("modalScore").checked = false;
             document.getElementById("modalRematch").checked = true;
           }
           break;
@@ -945,7 +946,7 @@ export default {
       this.game.clocks[oppIdx] = data.clock;
       if (data.movesCount > L) {
         // Just got last move from him
-        this.$refs["basegame"].play(data.lastMove, "received", null, true);
+        this.$refs["basegame"].play(data.lastMove, "received");
         this.processMove(data.lastMove);
       } else {
         if (!!this.clockUpdate) clearInterval(this.clockUpdate);
@@ -1243,21 +1244,21 @@ export default {
       await import("@/variants/" + game.vname + ".js")
       .then((vModule) => {
         window.V = vModule[game.vname + "Rules"];
-        // (AJAX) Request to get rules content (plain text, HTML)
-        this.rulesContent =
-          require(
-            "raw-loader!@/translations/rules/" +
-            game.vname + "/" +
-            this.st.lang + ".pug"
-          )
-          // Next two lines fix a weird issue after last update (2019-11)
-          .replace(/\\n/g, " ")
-          .replace(/\\"/g, '"')
-          .replace('module.exports = "', "")
-          .replace(/"$/, "")
-          .replace(/(fen:)([^:]*):/g, replaceByDiag);
         this.loadGame(game, callback);
       });
+      // (AJAX) Request to get rules content (plain text, HTML)
+      this.rulesContent =
+        require(
+          "raw-loader!@/translations/rules/" +
+          game.vname + "/" +
+          this.st.lang + ".pug"
+        )
+        // Next two lines fix a weird issue after last update (2019-11)
+        .replace(/\\n/g, " ")
+        .replace(/\\"/g, '"')
+        .replace('module.exports = "', "")
+        .replace(/"$/, "")
+        .replace(/(fen:)([^:]*):/g, replaceByDiag);
     },
     // 3 cases for loading a game:
     //  - from indexedDB (running or completed live game I play)
@@ -1566,6 +1567,7 @@ export default {
       this.game.score = score;
       if (!scoreMsg) scoreMsg = getScoreMessage(score);
       this.game.scoreMsg = scoreMsg;
+      document.getElementById("modalRules").checked = false;
       // Display result in a un-missable way:
       document.getElementById("modalScore").checked = true;
       this.$set(this.game, "scoreMsg", scoreMsg);
@@ -1610,19 +1612,22 @@ export default {
 
 <style lang="sass" scoped>
 #scoreDiv > .card, #rematchDiv > .card
-  padding: 15px 0
+  padding: 10px 0
   max-width: 430px
 
 #rulesDiv > .card
   padding: 5px 0
-  max-width: 75%
+  max-width: 50%
   max-height: 100%
+  @media screen and (max-width: 1500px)
+    max-width: 67%
   @media screen and (max-width: 1024px)
     max-width: 85%
   @media screen and (max-width: 767px)
     max-width: 100%
 
 p.score-section
+  margin: 0
   font-size: 1.3em
   span.score
     font-weight: bold
@@ -1758,82 +1763,6 @@ h4#variantNameInGame
 </style>
 
 <style lang="sass">
-// TODO: next is duplicated from Rules/. Merge ? How ? ...
-
-figure.diagram-container
-  margin: 15px 0 15px 0
-  text-align: center
-  width: 100%
-  display: block
-  .diagram
-    display: block
-    width: 50%
-    min-width: 240px
-    margin-left: auto
-    margin-right: auto
-  .diag12
-    float: left
-    width: 40%
-    margin-left: calc(10% - 20px)
-    margin-right: 40px
-    @media screen and (max-width: 630px)
-      float: none
-      margin: 0 auto 10px auto
-  .diag22
-    float: left
-    width: 40%
-    margin-right: calc(10% - 20px)
-    @media screen and (max-width: 630px)
-      float: none
-      margin: 0 auto
-  figcaption
-    display: block
-    clear: both
-    padding-top: 5px
-    font-size: 0.8em
-
-p.boxed
-  background-color: #FFCC66
-  padding: 5px
-
-.bigfont
-  font-size: 1.2em
-
-.bold
-  font-weight: bold
-
-.stageDelimiter
-  color: purple
-
-// To show (new) pieces, and/or there values...
-figure.showPieces > img
-  width: 50px
-
-figure.showPieces > figcaption
-  color: #6C6C6C
-
-.section-title
-  padding: 0
-
-.section-title > h4
-  padding: 5px
-
-ol, ul:not(.browser-default)
-  padding-left: 20px
-
-ul:not(.browser-default)
-  margin-top: 5px
-
-ul:not(.browser-default) > li
-  list-style-type: disc
-
-table
-  margin: 15px auto
-
-.italic
-  font-style: italic
-
-img.img-center
-  display: block
-  margin: 0 auto 15px auto
+@import "@/styles/_rules.sass"
+@import "@/styles/_board_squares_img.sass"
 </style>