client/src/views/Analyze.vue

   1 <template lang="pug">
   2 .row
   3   .col-sm-12.col-md-10.col-md-offset-1.col-lg-8.col-lg-offset-2
   4     BaseGame(:game="game" :vr="vr" ref="basegame")
   5 </template>
   6
   7 <script>
   8 import BaseGame from "@/components/BaseGame.vue";
   9 import { store } from "@/store";
  10 import { ArrayFun } from "@/utils/array";
  11
  12 export default {
  13   name: 'my-analyze',
  14   components: {
  15     BaseGame,
  16   },
  17   // gameRef: to find the game in (potentially remote) storage
  18   data: function() {
  19     return {
  20       st: store.state,
  21       gameRef: { //given in URL (rid = remote ID)
  22         vname: "",
  23         fen: ""
  24       },
  25       game: {
  26         players:[{name:"Analyze"},{name:"Analyze"}],
  27         mode: "analyze"
  28       },
  29       vr: null, //"variant rules" object initialized from FEN
  30       //people: [], //players + observers //TODO later: interactive analyze...
  31     };
  32   },
  33   watch: {
  34     "$route": function(to, from) {
  35       this.gameRef.fen = to.query["fen"].replace(/_/g, " ");
  36       this.gameRef.vname = to.params["vname"];
  37       this.loadGame();
  38     },
  39   },
  40   created: function() {
  41     this.gameRef.fen = this.$route.query["fen"].replace(/_/g, " ");
  42     this.gameRef.vname = this.$route.params["vname"];
  43     this.loadGame();
  44   },
  45   methods: {
  46     loadGame: async function() {
  47       this.game.vname = this.gameRef.vname;
  48       this.game.fen = this.gameRef.fen;
  49       const vModule = await import("@/variants/" + this.game.vname + ".js");
  50       window.V = vModule.VariantRules;
  51       this.vr = new V(this.game.fen);
  52     },
  53   },
  54 };
  55 </script>
  56
  57 <style lang="sass">
  58 // TODO
  59 </style>