Experimental in-page analyze + show rules from Game page
[vchess.git] / client / src / views / Analyse.vue
index 484b804..39022e8 100644 (file)
@@ -19,6 +19,8 @@ import BaseGame from "@/components/BaseGame.vue";
 import { store } from "@/store";
 export default {
   name: "my-analyse",
+  // TODO: game import ==> require some adjustments, like
+  // the ability to analyse from a list of moves...
   components: {
     BaseGame
   },
@@ -27,7 +29,6 @@ export default {
     return {
       st: store.state,
       gameRef: {
-        //given in URL (rid = remote ID)
         vname: "",
         fen: ""
       },
@@ -50,7 +51,8 @@ export default {
     alertAndQuit: function(text, wrongVname) {
       // Soon after component creation, st.tr might be uninitialized.
       // Set a timeout to let a chance for the message to show translated.
-      const newUrl = "/variants" + (wrongVname ? "" : "/" + this.gameRef.vname);
+      const newUrl =
+        "/variants" + (wrongVname ? "" : "/" + this.gameRef.vname);
       setTimeout(() => {
         alert(this.st.tr[text] || text);
         this.$router.replace(newUrl);
@@ -62,7 +64,9 @@ export default {
       if (!routeFen) this.alertAndQuit("Missing FEN");
       else {
         this.gameRef.fen = routeFen.replace(/_/g, " ");
-        // orientation is optional: taken from FEN if missing
+        // orientation is optional: taken from FEN if missing.
+        // NOTE: currently no internal usage of 'side', but could be used by
+        // manually settings the URL (TODO?).
         const orientation = this.$route.query["side"];
         this.initialize(orientation);
       }
@@ -96,7 +100,7 @@ export default {
     },
     adjustFenSize: function() {
       let fenInput = document.getElementById("fen");
-      fenInput.style.width = (this.curFen.length+1) + "ch";
+      fenInput.style.width = (this.curFen.length+3) + "ch";
     },
     tryGotoFen: function() {
       if (V.IsGoodFen(this.curFen)) {
@@ -107,3 +111,9 @@ export default {
   }
 };
 </script>
+
+<style lang="sass" scoped=true>
+input#fen
+  // Use a Monospace font for input FEN width adjustment
+  font-family: "Fira Code"
+</style>