Draft code reorganisation (+ fix Alice rules + stateless VariantRules object)
[vchess.git] / public / javascripts / index.js
1 // Javascript for index page: mostly counters updating
2 new Vue({
3 el: "#indexPage",
4 data: {
5 counts: {},
6 curPrefix: "",
7 conn: null,
8 },
9 computed: {
10 sortedCounts: function () {
11 // TODO: priorité aux parties corr où c'est à nous de jouer !
12 const variantsCounts = variantArray
13 .filter( v => {
14 return v.name.startsWith(this.curPrefix);
15 })
16 .map( v => {
17 return {
18 name: v.name,
19 desc: v.description,
20 count: this.counts[v.name] || 0,
21 };
22 });
23 return variantsCounts.sort((a,b) => {
24 if (a.count != b.count)
25 return b.count - a.count;
26 // Else, alphabetic ordering
27 return a.name.localeCompare(b.name);
28 });
29 },
30 },
31 created: function() {
32 const url = socketUrl;
33 const sid = getRandString();
34 this.conn = new WebSocket(url + "/?sid=" + sid + "&page=index");
35 const socketMessageListener = msg => {
36 const data = JSON.parse(msg.data);
37 if (data.code == "counts")
38 this.counts = data.counts;
39 else if (data.code == "increase")
40 this.counts[data.vname]++;
41 else if (data.code == "decrease")
42 this.counts[data.vname]--;
43 };
44 const socketCloseListener = () => {
45 this.conn = new WebSocket(url + "/?sid=" + sid + "&page=index");
46 this.conn.addEventListener('message', socketMessageListener);
47 this.conn.addEventListener('close', socketCloseListener);
48 };
49 this.conn.onmessage = socketMessageListener;
50 this.conn.onclose = socketCloseListener;
51 },
52 mounted: function() {
53 // Handle key stroke
54 document.onkeydown = event => {
55 // Is it Back or Esc? If yes, apply action on current word
56 if (event.keyCode == 8) //Back
57 {
58 event.preventDefault();
59 this.curPrefix = this.curPrefix.slice(0,-1);
60 }
61 else if (event.keyCode == 27) //Esc
62 {
63 event.preventDefault();
64 this.curPrefix = "";
65 }
66 // Is it alphanumeric? If yes, stack it
67 else if (_.range(48,58).includes(event.keyCode)
68 || _.range(65,91).includes(event.keyCode)
69 || _.range(97,123).includes(event.keyCode))
70 {
71 let newChar = String.fromCharCode(event.keyCode);
72 this.curPrefix += this.curPrefix.length==0
73 ? newChar.toUpperCase()
74 : newChar.toLowerCase();
75 }
76 // ...ignore everything else
77 };
78 },
79 });
80
81 // TODO:
82 // si dernier lastMove sur serveur n'est pas le mien et nextColor == moi, alors background orange
83 // ==> background orange si à moi de jouer par corr (sur main index)
84 // (fonction "getNextCol()" dans base_rules.js ?)