X-Git-Url: https://git.auder.net/?p=vchess.git;a=blobdiff_plain;f=public%2Fjavascripts%2Findex.js;h=bc4cd9e1d2a23b4940fbb2193643742faf4f5c10;hp=12bcf64450e3001717d9af98d482bcbd3f4daeed;hb=fd08ab2c5b8931bb8c95cf7e9f2f95122647f991;hpb=ecf44502c1ed7c408b8ea4d1be5234203aa3d314 diff --git a/public/javascripts/index.js b/public/javascripts/index.js index 12bcf644..bc4cd9e1 100644 --- a/public/javascripts/index.js +++ b/public/javascripts/index.js @@ -1,13 +1,20 @@ +// Javascript for index page: mostly counters updating new Vue({ - el: "#indexPage", + el: "#VueElement", data: { counts: {}, curPrefix: "", conn: null, + display: "variants", }, computed: { sortedCounts: function () { - const variantsCounts = variantArray.map( v => { + const capitalizedPrefix = this.curPrefix.replace(/^\w/, c => c.toUpperCase()); + const variantsCounts = variantArray + .filter( v => { + return v.name.startsWith(capitalizedPrefix); + }) + .map( v => { return { name: v.name, desc: v.description, @@ -24,8 +31,7 @@ new Vue({ }, created: function() { const url = socketUrl; - // random enough (TODO: function) - const sid = (Date.now().toString(36) + Math.random().toString(36).substr(2, 7)).toUpperCase(); + const sid = getRandString(); this.conn = new WebSocket(url + "/?sid=" + sid + "&page=index"); const socketMessageListener = msg => { const data = JSON.parse(msg.data); @@ -43,32 +49,10 @@ new Vue({ }; this.conn.onmessage = socketMessageListener; this.conn.onclose = socketCloseListener; - }, - mounted: function() { - // Handle key stroke - document.onkeydown = event => { - // Is it Back or Esc? If yes, apply action on current word - if (event.keyCode == 8) //Back - { - event.preventDefault(); - this.curPrefix = this.curPrefix.slice(0,-1); - } - else if (event.keyCode == 27) //Esc - { - event.preventDefault(); - this.curPrefix = ""; - } - // Is it alphanumeric? If yes, stack it - else if (_.range(48,58).includes(event.keyCode) - || _.range(65,91).includes(event.keyCode) - || _.range(97,123).includes(event.keyCode)) - { - let newChar = String.fromCharCode(event.keyCode); - this.curPrefix += this.curPrefix.length==0 - ? newChar.toUpperCase() - : newChar.toLowerCase(); - } - // ...ignore everything else - }; + + // TODO: AJAX call get corr games (all variants) + // si dernier lastMove sur serveur n'est pas le mien et nextColor == moi, alors background orange + // ==> background orange si à moi de jouer par corr (sur main index) + // (helper: static fonction "GetNextCol()" dans base_rules.js) }, });