Separate client and server codes. Keep everything in one git repo for simplicity

[vchess.git] / client / client_OLD / javascripts / index.js

diff --git a/client/client_OLD/javascripts/index.js b/client/client_OLD/javascripts/index.js
new file mode 100644 (file)
index 0000000..0e2a263
--- /dev/null
+++ b/client/client_OLD/javascripts/index.js
@@ -0,0 +1,70 @@
+// Javascript for index page: mostly counters updating
+new Vue({
+       el: "#VueElement",
+       data: {
+               counts: {},
+               curPrefix: "",
+               conn: null,
+               display: "variants",
+       },
+       computed: {
+               sortedCounts: function () {
+                       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,
+                                       count: this.counts[v.name] || 0,
+                               };
+                       });
+                       return variantsCounts.sort((a,b) => {
+                               if (a.count != b.count)
+                                       return b.count - a.count;
+                               // Else, alphabetic ordering
+                               return a.name.localeCompare(b.name);
+                       });
+               },
+       },
+       created: function() {
+               this.setDisplay();
+               window.onhashchange = this.setDisplay;
+               
+               const url = socketUrl;
+               const sid = getRandString();
+               this.conn = new WebSocket(url + "/?sid=" + sid + "&page=index");
+               const socketMessageListener = msg => {
+                       const data = JSON.parse(msg.data);
+                       if (data.code == "counts")
+                               this.counts = data.counts;
+                       else if (data.code == "increase")
+                               this.counts[data.vid]++;
+                       else if (data.code == "decrease")
+                               this.counts[data.vid]--;
+               };
+               const socketCloseListener = () => {
+                       this.conn = new WebSocket(url + "/?sid=" + sid + "&page=index");
+                       this.conn.addEventListener('message', socketMessageListener);
+                       this.conn.addEventListener('close', socketCloseListener);
+               };
+               this.conn.onmessage = socketMessageListener;
+               this.conn.onclose = socketCloseListener;
+
+               // 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)
+
+       },
+       methods: {
+               setDisplay: function() {
+                       if (!location.hash)
+                               location.hash = "#variants"; //default
+                       this.display = location.hash.substr(1);
+               },
+
+       },
+});