X-Git-Url: https://git.auder.net/js/rpsls.js?a=blobdiff_plain;f=client%2Fsrc%2Fviews%2FHall.vue;h=f4fc172cd4ffdfadc8cd74fea58721ea8f9d2656;hb=bf7e5f3669a4c0bfa2756921d15d3fd055d4cfd2;hp=1261cd09c93994a52f01cec048268d2e097f151f;hpb=b83a675a3066c67cc7843ae27ad8aeffd15b0976;p=vchess.git diff --git a/client/src/views/Hall.vue b/client/src/views/Hall.vue index 1261cd09..f4fc172c 100644 --- a/client/src/views/Hall.vue +++ b/client/src/views/Hall.vue @@ -227,7 +227,7 @@ export default { vid: parseInt(localStorage.getItem("vid")) || 0, to: "", //name of challenged player (if any) cadence: localStorage.getItem("cadence") || "", - randomness: parseInt(localStorage.getItem("randomness")) || 2, + randomness: parseInt(localStorage.getItem("challRandomness")) || 2, // VariantRules object, stored to not interfere with // diagrams of targetted challenges: V: null, @@ -280,6 +280,45 @@ export default { pages: [{ path: "/", focus: true }] } ); + const connectAndPoll = () => { + this.send("connect"); + this.send("pollclientsandgamers"); + }; + // Initialize connection + this.connexionString = + params.socketUrl + + "/?sid=" + + this.st.user.sid + + "&id=" + + this.st.user.id + + "&tmpId=" + + getRandString() + + "&page=" + + // Hall: path is "/" (could be hard-coded as well) + encodeURIComponent(this.$route.path); + this.conn = new WebSocket(this.connexionString); + this.conn.onopen = connectAndPoll; + this.conn.onmessage = this.socketMessageListener; + this.conn.onclose = this.socketCloseListener; + }, + mounted: function() { + document.addEventListener('visibilitychange', this.visibilityChange); + ["peopleWrap", "infoDiv", "newgameDiv"].forEach(eltName => { + document.getElementById(eltName) + .addEventListener("click", processModalClick); + }); + document.querySelectorAll("#predefinedCadences > button").forEach(b => { + b.addEventListener("click", () => { + this.newchallenge.cadence = b.innerHTML; + }); + }); + const dispCorr = this.$route.query["disp"]; + const showCtype = + dispCorr || localStorage.getItem("type-challenges") || "live"; + const showGtype = + dispCorr || localStorage.getItem("type-games") || "live"; + this.setDisplay('c', showCtype); + this.setDisplay('g', showGtype); // Ask server for current corr games (all but mines) ajax( "/games", @@ -287,6 +326,15 @@ export default { { data: { uid: this.st.user.id, excluded: true }, success: (response) => { + if ( + response.games.length > 0 && + this.games.length == 0 && + this.gdisplay == "live" + ) { + document + .getElementById("btnGcorr") + .classList.add("somethingnew"); + } this.games = this.games.concat( response.games.map(g => { const type = this.classifyObject(g); @@ -311,6 +359,15 @@ export default { { data: { uid: this.st.user.id }, success: (response) => { + if ( + response.challenges.length > 0 && + this.challenges.length == 0 && + this.cdisplay == "live" + ) { + document + .getElementById("btnCcorr") + .classList.add("somethingnew"); + } // Gather all senders names, and then retrieve full identity: // (TODO [perf]: some might be online...) let names = {}; @@ -357,45 +414,6 @@ export default { } } ); - const connectAndPoll = () => { - this.send("connect"); - this.send("pollclientsandgamers"); - }; - // Initialize connection - this.connexionString = - params.socketUrl + - "/?sid=" + - this.st.user.sid + - "&id=" + - this.st.user.id + - "&tmpId=" + - getRandString() + - "&page=" + - // Hall: path is "/" (could be hard-coded as well) - encodeURIComponent(this.$route.path); - this.conn = new WebSocket(this.connexionString); - this.conn.onopen = connectAndPoll; - this.conn.onmessage = this.socketMessageListener; - this.conn.onclose = this.socketCloseListener; - }, - mounted: function() { - document.addEventListener('visibilitychange', this.visibilityChange); - ["peopleWrap", "infoDiv", "newgameDiv"].forEach(eltName => { - let elt = document.getElementById(eltName); - elt.addEventListener("click", processModalClick); - }); - document.querySelectorAll("#predefinedCadences > button").forEach(b => { - b.addEventListener("click", () => { - this.newchallenge.cadence = b.innerHTML; - }); - }); - const dispCorr = this.$route.query["disp"]; - const showCtype = - dispCorr || localStorage.getItem("type-challenges") || "live"; - const showGtype = - dispCorr || localStorage.getItem("type-games") || "live"; - this.setDisplay("c", showCtype); - this.setDisplay("g", showGtype); }, beforeDestroy: function() { document.removeEventListener('visibilitychange', this.visibilityChange); @@ -845,8 +863,7 @@ export default { const vModule = await import("@/variants/" + vname + ".js"); this.newchallenge.V = vModule.VariantRules; this.newchallenge.vname = vname; - if (!!cb) - cb(); + if (!!cb) cb(); }, trySetNewchallDiag: function() { if (!this.newchallenge.fen) { @@ -872,7 +889,7 @@ export default { this.newchallenge.vid = pchall.vid; this.newchallenge.cadence = pchall.cadence; this.newchallenge.randomness = pchall.randomness; - this.issueNewChallenge(); + this.loadNewchallVariant(this.issueNewChallenge); }, issueNewChallenge: async function() { if (!!(this.newchallenge.cadence.match(/^[0-9]+$/))) @@ -970,7 +987,7 @@ export default { // Remember cadence + vid for quicker further challenges: localStorage.setItem("cadence", chall.cadence); localStorage.setItem("vid", chall.vid); - localStorage.setItem("randomness", chall.randomness); + localStorage.setItem("challRandomness", chall.randomness); document.getElementById("modalNewgame").checked = false; // Show the challenge if not on current display if ( @@ -1272,6 +1289,10 @@ tr > td &.random-2 background-color: #33B42B +@media screen and (max-width: 767px) + h4 + margin: 5px 0 + td.remove-preset background-color: lightgrey text-align: center