X-Git-Url: https://git.auder.net/?a=blobdiff_plain;f=client%2Fclient_OLD%2Fjavascripts%2Fcomponents%2Fcorrespondance.js;fp=client%2Fclient_OLD%2Fjavascripts%2Fcomponents%2Fcorrespondance.js;h=7dbde1570511098da2286d1dc8b3ce8dbbe79187;hb=625022fdcf750f0aff8fcd699f7e9b89730e1d10;hp=0000000000000000000000000000000000000000;hpb=b955c65b942d09d24b5c3bed0d755d4f2f8f71f1;p=vchess.git

diff --git a/client/client_OLD/javascripts/components/correspondance.js b/client/client_OLD/javascripts/components/correspondance.js
new file mode 100644
index 00000000..7dbde157
--- /dev/null
+++ b/client/client_OLD/javascripts/components/correspondance.js
@@ -0,0 +1,161 @@
+Vue.component("my-correspondance", {
+	data: function() {
+		return {
+			userId: user.id,
+			games: [],
+			challenges: [],
+			willPlay: [], //IDs of challenges in which I decide to play (>= 3 players)
+			newgameInfo: {
+				fen: "",
+				vid: 0,
+				nbPlayers: 0,
+				players: [{id:0,name:""},{id:0,name:""},{id:0,name:""}],
+				mainTime: 0,
+				increment: 0,
+			},
+		};
+	},
+	template: `
+		<div class="col-sm-12 col-md-10 col-md-offset-1 col-lg-8 col-lg-offset-2">
+			<input id="modalNewgame" type="checkbox" class="modal"/>
+			<div role="dialog" aria-labelledby="titleFenedit">
+				<div class="card smallpad">
+					<label id="closeNewgame" for="modalNewgame" class="modal-close">
+					</label>
+					<fieldset>
+						<label for="selectVariant">{{ translate("Variant") }}</label>
+						<select id="selectVariant" v-model="newgameInfo.vid">
+							<option v-for="v in variants" :value="v.id">
+								{{ v.name }}
+							</option>
+						</select>
+					</fieldset>
+					<fieldset>
+						<label for="selectNbPlayers">
+							{{ translate("Number of players") }}
+						</label>
+						<select id="selectNbPlayers" v-model="newgameInfo.nbPlayers">
+							<option v-show="possibleNbplayers(2)" value="2">2</option>
+							<option v-show="possibleNbplayers(3)" value="3">3</option>
+							<option v-show="possibleNbplayers(4)" value="4">4</option>
+						</select>
+					</fieldset>
+					<fieldset>
+						<label for="timeControl">Time control (in days)</label>
+						<div id="timeControl">
+							<input type="number" v-model="newgameInfo.mainTime"
+								placeholder="Main time"/>
+							<input type="number" v-model="newgameInfo.increment"
+								placeholder="Increment"/>
+						</div>
+					</fieldset>
+					<fieldset>
+						<label for="selectPlayers">{{ translate("Play with?") }}</label>
+						<div id="selectPlayers">
+							<input type="text" v-model="newgameInfo.players[0].name"/>
+							<input v-show="newgameInfo.nbPlayers>=3" type="text"
+								v-model="newgameInfo.players[1].name"/>
+							<input v-show="newgameInfo.nbPlayers==4" type="text"
+								v-model="newgameInfo.players[2].name"/>
+						</div>
+					</fieldset>
+					<fieldset>
+						<label for="inputFen">
+							{{ translate("FEN (ignored if players fields are blank)") }}
+						</label>
+						<input id="inputFen" type="text" v-model="newgameInfo.fen"/>
+					</fieldset>
+					<button @click="newGame">Launch game</button>
+				</div>
+			</div>
+			<p v-if="!userId">
+				Correspondance play is reserved to registered users
+			</p>
+			<div v-if="!!userId">
+				<my-challenge-list :challenges="challenges"
+					@click-challenge="clickChallenge">
+				</my-challenge-list>
+				<button onClick="doClick('modalNewgame')">New game</button>
+				<my-game-list :games="games" @show-game="showGame">
+				</my-game-list>
+			</div>
+		</div>
+	`,
+	computed: {
+		// TODO: this is very artificial...
+		variants: function() {
+			return variantArray;
+		},
+	},
+	created: function() {
+		// use user.id to load challenges + games from server
+	},
+	methods: {
+		translate: translate,
+		clickChallenge: function() {
+			// TODO: accepter un challenge peut lancer une partie, il
+			// faut alors supprimer challenge + creer partie + la retourner et l'ajouter ici
+			// autres actions:
+			// supprime mon défi
+			// accepte un défi
+			// annule l'acceptation d'un défi (si >= 3 joueurs)
+			//
+			// si pas le mien et FEN speciale :: (charger code variante et)
+			// montrer diagramme + couleur (orienté)
+		},
+		showGame: function(g) {
+			// Redirect to /variant#game?id=...
+			location.href="/variant#game?id=" + g.id;
+		},
+		newGame: function() {
+			const afterRulesAreLoaded = () => {
+				// NOTE: side-effect = set FEN
+				// TODO: (to avoid any cheating option) separate the GenRandInitFen() functions
+				// in separate files, load on server and generate FEN on server.
+				const error = checkChallenge(this.newgameInfo, vname);
+				if (!!error)
+					return alert(error);
+				// Possible (server) error if filled player does not exist
+				ajax(
+					"/challenges/" + this.newgameInfo.vid,
+					"POST",
+					this.newgameInfo,
+					response => {
+						const chall = Object.assign({},
+							this.newgameInfo,
+							{
+								id: response.cid,
+								uid: user.id,
+								added: Date.now(),
+								vname: vname,
+							},
+						this.challenges.push(response.challengei);
+					}
+				);
+			};
+			const idxInVariants =
+				variantArray.findIndex(v => v.id == this.newgameInfo.vid);
+			const vname = variantArray[idxInVariants].name;
+			const scriptId = vname + "RulesScript";
+			if (!document.getElementById(scriptId))
+			{
+				// Load variant rules (only once)
+				var script = document.createElement("script");
+				script.id = scriptId;
+				script.onload = afterRulesAreLoaded;
+				//script.addEventListener ("load", afterRulesAreLoaded, false);
+				script.src = "/javascripts/variants/" + vname + ".js";
+				document.body.appendChild(script);
+			}
+			else
+				afterRulesAreLoaded();
+		},
+		possibleNbplayers: function(nbp) {
+			if (this.newgameInfo.vid == 0)
+				return false;
+			const idxInVariants =
+				variantArray.findIndex(v => v.id == this.newgameInfo.vid);
+			return NbPlayers[variantArray[idxInVariants].name].includes(nbp);
+		},
+	},
+});