public/javascripts/variant.js

   1 new Vue({
   2     el: "#VueElement",
   3     data: {
   4         display: "undefined", //default to main hall; see "created()" function
   5         gameid: undefined, //...yet
   6         queryHash: "",
   7         conn: null,
   8
   9         // Settings initialized with values from localStorage
  10         settings:   {
  11             bcolor: localStorage["bcolor"] || "lichess",
  12             sound: parseInt(localStorage["sound"]) || 2,
  13             hints: parseInt(localStorage["hints"]) || 1,
  14             coords: !!eval(localStorage["coords"]),
  15             highlight: !!eval(localStorage["highlight"]),
  16             sqSize: parseInt(localStorage["sqSize"]),
  17         },
  18
  19         // TEMPORARY: DEBUG
  20         mode: "analyze",
  21         orientation: "w",
  22         userColor: "w",
  23         allowChat: false,
  24         allowMovelist: true,
  25         fen: V.GenRandInitFen(),
  26     },
  27     created: function() {
  28         if (!!localStorage["variant"])
  29         {
  30             location.hash = "#game?id=" + localStorage["gameId"];
  31             this.display = location.hash.substr(1);
  32         }
  33         else
  34             this.setDisplay();
  35         window.onhashchange = this.setDisplay;
  36         this.myid = "abcdefghij";
  37 //console.log(this.myid + " " + variant);
  38             //myid: localStorage.getItem("myid"), //our ID, always set
  39
  40         this.conn = new WebSocket(socketUrl + "/?sid=" + this.myid + "&page=" + variant.id);
  41         const socketCloseListener = () => {
  42             this.conn = new WebSocket(socketUrl + "/?sid=" + this.myid + "&page=" + variant.id);
  43         }
  44         this.conn.onclose = socketCloseListener;
  45
  46         //this.vr = new VariantRules( V.GenRandInitFen() );
  47     },
  48     methods: {
  49         updateSettings: function(event) {
  50             const propName =
  51                 event.target.id.substr(3).replace(/^\w/, c => c.toLowerCase())
  52             localStorage[propName] = ["highlight","coords"].includes(propName)
  53                 ? event.target.checked
  54                 : event.target.value;
  55         },
  56         setDisplay: function() {
  57             // Prevent set display if there is a running game
  58             if (!!localStorage["variant"])
  59                 return;
  60             if (!location.hash)
  61                 location.hash = "#room"; //default
  62             const hashParts = location.hash.substr(1).split("?");
  63             this.display = hashParts[0];
  64             this.queryHash = hashParts[1]; //may be empty, undefined...
  65             // Close menu on small screens:
  66             let menuToggle = document.getElementById("drawer-control");
  67             if (!!menuToggle)
  68                 menuToggle.checked = false;
  69         },
  70     },
  71 });
  72
  73 //const continuation = (localStorage.getItem("variant") === variant.name);
  74 //          if (continuation) //game VS human has priority
  75 //              this.continueGame("human");