p.text-center
span.variantName
| {{ curChallToAccept.vname }}
- | {{ curChallToAccept.options.abridged }}
+ | {{ curChallToAccept.options.abridged || '' }}
span {{ curChallToAccept.cadence }}
span {{ st.tr["with"] + " " + curChallToAccept.from.name }}
p.text-center(v-if="!!curChallToAccept.color")
)
| {{ v.display }}
// Variant-specific options (often at least randomness)
- fieldset(v-if="!!newchallenge.V")
- div(v-for="select of newchallenge.V.Options.select")
+ fieldset(v-if="!!newchallenge.V && newchallenge.V.Options")
+ div(v-for="select of newchallenge.V.Options.select || []")
label(:for="select.variable + '_opt'") {{ st.tr[select.label] }} *
select(:id="select.variable + '_opt'")
option(
:selected="o.value == select.defaut"
)
| {{ st.tr[o.label] }}
- div(v-for="check of newchallenge.V.Options.check")
+ div(v-for="check of newchallenge.V.Options.check || []")
label(:for="check.variable + '_opt'") {{ st.tr[check.label] }} *
input(
:id="check.variable + '_opt'"
th {{ st.tr["Options"] }}
th
tbody
+ // TODO: remove the check !!pc.options
tr(
v-for="pc in presetChalls"
@click="newChallFromPreset(pc)"
+ v-if="!!pc.options"
)
td {{ pc.vname }}
td {{ pc.cadence }}
- td(:class="getRandomnessClass(pc)") {{ pc.options.abridged }}
+ td(:class="getRandomnessClass(pc)") {{ pc.options.abridged || '' }}
td.remove-preset(@click="removePresetChall($event, pc)")
img(src="/images/icons/delete.svg")
.row
presetChalls: JSON.parse(localStorage.getItem("presetChalls") || "[]"),
conn: null,
connexionString: "",
- socketCloseListener: 0,
+ reopenTimeout: 0,
+ reconnectTimeout: 0,
// Related to (killing of) self multi-connects:
newConnect: {}
};
}
},
created: function() {
- // TODO: remove this patch soon:
- this.presetChalls.forEach(pc => {
- if (!pc.options) pc.options = { randomness: pc.randomness };
- });
document.addEventListener('visibilitychange', this.visibilityChange);
window.addEventListener('focus', this.onFocus);
window.addEventListener('blur', this.onBlur);
id: my.id,
name: my.name,
tmpIds: {
- tmpId: { page: "/", focus: true }
+ [tmpId]: { page: "/", focus: true }
}
}
);
- const connectAndPoll = () => {
- this.send("connect");
- this.send("pollclientsandgamers");
- if (!!this.$route.query["challenge"]) {
- // Automatic challenge sending, for tournaments
- this.loadNewchallVariant(
- () => {
- Object.assign(
- this.newchallenge,
- {
- fen: "",
- vid:
- this.st.variants
- .find(v => v.name == this.$route.query["variant"])
- .id,
- to: this.$route.query["challenge"],
- color: this.$route.query["color"] || '',
- cadence: this.$route.query["cadence"],
- options: {},
- memorize: false
- }
- );
- window.doClick("modalNewgame");
- },
- this.$route.query["variant"]
- );
- }
- };
- // Initialize connection
+ if (!!this.$route.query["challenge"]) {
+ // Automatic challenge sending, for tournaments
+ this.loadNewchallVariant(
+ () => {
+ Object.assign(
+ this.newchallenge,
+ {
+ fen: "",
+ vid:
+ this.st.variants
+ .find(v => v.name == this.$route.query["variant"])
+ .id,
+ to: this.$route.query["challenge"],
+ color: this.$route.query["color"] || '',
+ cadence: this.$route.query["cadence"],
+ options: {},
+ memorize: false
+ }
+ );
+ window.doClick("modalNewgame");
+ },
+ this.$route.query["variant"]
+ );
+ }
+ // Connexion string won't change if disconnect/reconnect
this.connexionString =
params.socketUrl +
"/?sid=" + this.st.user.sid +
"&page=" +
// Hall: path is "/" (TODO: could be hard-coded as well)
encodeURIComponent(this.$route.path);
- this.conn = new WebSocket(this.connexionString);
- this.conn.onopen = connectAndPoll;
- this.conn.addEventListener("message", this.socketMessageListener);
- this.socketCloseListener = setInterval(
- () => {
- if (this.conn.readyState == 3) {
- this.conn.removeEventListener("message", this.socketMessageListener);
- this.conn = new WebSocket(this.connexionString);
- this.conn.addEventListener("message", this.socketMessageListener);
- }
- },
- 1000
- );
+ this.openConnection();
},
mounted: function() {
document.getElementById("peopleWrap")
this.cleanBeforeDestroy();
},
methods: {
+ openConnection: function() {
+ const connectAndPoll = () => {
+ this.send("connect");
+ this.send("pollclientsandgamers");
+ };
+ // Initialize connection
+ this.conn = new WebSocket(this.connexionString);
+ this.conn.onopen = () => {
+ this.reconnectTimeout = 250;
+ connectAndPoll();
+ };
+ this.conn.onmessage = this.socketMessageListener;
+ const closeConnection = () => {
+ this.reopenTimeout = setTimeout(
+ () => {
+ this.openConnection();
+ this.reconnectTimeout = Math.min(2*this.reconnectTimeout, 30000);
+ },
+ this.reconnectTimeout
+ );
+ };
+ this.conn.onerror = closeConnection;
+ this.conn.onclose = closeConnection;
+ },
cleanBeforeDestroy: function() {
- clearInterval(this.socketCloseListener);
document.removeEventListener('visibilitychange', this.visibilityChange);
window.removeEventListener('focus', this.onFocus);
window.removeEventListener('blur', this.onBlur);
window.removeEventListener("beforeunload", this.cleanBeforeDestroy);
- this.conn.removeEventListener("message", this.socketMessageListener);
+ clearTimeout(this.reopenTimeout);
this.send("disconnect");
this.conn = null;
},
getRandomnessClass: function(pc) {
- if (!pc.options.randomness) return {};
- return {
- ["random-" + pc.options.randomness]: true
- };
+ const opts = pc.options;
+ if (opts.randomness === undefined && opts.random === undefined)
+ return {};
+ if (opts.randomness !== undefined)
+ return { ["random-" + opts.randomness]: true };
+ return { ["random-" + (opts.random ? 2 : 0)]: true };
},
anonymousCount: function() {
let count = 0;
},
invColor: function(c) {
if (c == 'w') return this.st.tr["Black"];
- return this.tr.tr["White"];
+ return this.st.tr["White"];
},
partialResetNewchallenge: function() {
// Reset potential target and custom FEN:
id: c.id,
from: this.st.user.sid,
to: c.to,
- options: c.options,
+ options: JSON.stringify(c.options),
fen: c.fen,
vid: c.vid,
cadence: c.cadence,
if (!game.score)
// New game from Hall
newGame.score = "*";
+ // TODO: remove patch on next line (options || "{}")
+ newGame.options = JSON.parse(newGame.options || "{}");
this.games.push(newGame);
if (
newGame.score == '*' &&
}
case "startgame": {
// New game just started, I'm involved
- const gameInfo = data.data;
- if (this.classifyObject(gameInfo) == "live")
+ let gameInfo = data.data;
+ if (this.classifyObject(gameInfo) == "live") {
+ // TODO: remove patch on next line (+ const gameInfo)
+ if (!gameInfo.options) gameInfo.options = "{}";
this.startNewGame(gameInfo);
+ }
else {
this.infoMessage =
this.st.tr["New correspondence game:"] + " " +
let moreGames = res.games.map(g => {
this.setVname(g);
g.type = "corr";
+ g.options = JSON.parse(g.options);
return g;
});
this.games = this.games.concat(moreGames);
) {
let newChall = Object.assign({}, chall);
newChall.type = this.classifyObject(chall);
- newChall.options = chall.options;
+ // TODO: remove patch on next line (options || "{}")
+ newChall.options = JSON.parse(chall.options || "{}");
newChall.added = Date.now();
let fromValues = Object.assign({}, this.people[chall.from]);
delete fromValues["pages"]; //irrelevant in this context
this.newchallenge.vid = pchall.vid;
this.newchallenge.cadence = pchall.cadence;
this.newchallenge.options = pchall.options;
+ this.newchallenge.fromPreset = true;
this.loadNewchallVariant(this.issueNewChallenge);
},
issueNewChallenge: async function() {
error = this.st.tr["Wrong color"];
}
}
- if (!!error) {
- alert(error);
- return;
- }
- window.V = this.newchallenge.V;
- error = checkChallenge(this.newchallenge);
if (error) {
alert(error);
return;
}
- // NOTE: "from" information is not required here
+ window.V = this.newchallenge.V;
let chall = Object.assign({}, this.newchallenge);
- chall.options = {};
- // Get/set options variables (if any) / TODO: v-model?!
- for (const check of this.newchallenge.V.Options.check) {
- const elt = document.getElementById(check.variable + "_opt");
- if (elt.checked) chall.options[check.variable] = true;
+ if (!this.newchallenge.fromPreset) chall.options = { options: {} };
+ if (V.Options && !this.newchallenge.fromPreset) {
+ // Get/set options variables (if any) / TODO: v-model?!
+ for (const check of this.newchallenge.V.Options.check || []) {
+ const elt = document.getElementById(check.variable + "_opt");
+ chall.options[check.variable] = elt.checked;
+ }
+ for (const select of this.newchallenge.V.Options.select || []) {
+ const elt = document.getElementById(select.variable + "_opt");
+ const tryIntVal = parseInt(elt.value, 10);
+ chall.options[select.variable] =
+ (isNaN(tryIntVal) ? elt.value : tryIntVal);
+ }
}
- for (const select of this.newchallenge.V.Options.select) {
- const elt = document.getElementById(select.variable + "_opt");
- chall.options[select.variable] = elt.value;
+ error = checkChallenge(chall);
+ if (error) {
+ alert(this.st.tr[error]);
+ return;
}
chall.options.abridged = V.AbbreviateOptions(chall.options);
// Add only if not already issued (not counting FEN):
+ // NOTE: "from" information is not required here
if (this.challenges.some(c =>
(
c.from.sid == this.st.user.sid ||
alert(this.st.tr["Challenge already exists"]);
return;
}
- if (this.newchallenge.memorize) this.addPresetChall(this.newchallenge);
+ if (this.newchallenge.memorize) this.addPresetChall(chall);
delete chall["V"];
delete chall["diag"];
const finishAddChallenge = cid => {
this.send("newchallenge", {
data: Object.assign(
// Temporarily add sender infos to display challenge on Discord.
- { from: this.st.user.sid, sender: this.st.user.name }, chall)
+ { from: this.st.user.sid, sender: this.st.user.name },
+ chall,
+ { options: JSON.stringify(chall.options) }
+ )
});
// Add new challenge:
chall.from = {
let gameInfo = {
id: getRandString(),
fen: c.fen || V.GenRandInitFen(c.options),
- options: c.options, //for rematch
+ options: JSON.stringify(c.options), //for rematch
players: players,
vid: c.vid,
cadence: c.cadence
{
// cid is useful to delete the challenge:
data: {
- gameInfo: Object.assign(
- {},
- gameInfo,
- { options: JSON.stringify(gameInfo.options) }
- ),
+ gameInfo: gameInfo,
cid: c.id
},
success: (response) => {
#chat > .card
max-width: 100%
- margin: 0;
- border: none;
+ margin: 0
+ border: none
#players > p
margin-left: 5px
projects / vchess.git / blobdiff