X-Git-Url: https://git.auder.net/?a=blobdiff_plain;f=public%2Fjavascripts%2Fcomponents%2Fgame.js;h=6361b8a1e6e78aa12f347cb22d88f09e24b2f279;hb=4608eed94432356bd2df8c144d7d233913c6483c;hp=ca791257eb51360853575f0b208587c2e2a35cea;hpb=fd08ab2c5b8931bb8c95cf7e9f2f95122647f991;p=vchess.git

diff --git a/public/javascripts/components/game.js b/public/javascripts/components/game.js
index ca791257..6361b8a1 100644
--- a/public/javascripts/components/game.js
+++ b/public/javascripts/components/game.js
@@ -4,7 +4,8 @@
 // Game logic on a variant page: 3 modes, analyze, computer or human
 Vue.component('my-game', {
 	// gameId: to find the game in storage (assumption: it exists)
-	props: ["gameId","fen","mode","allowChat","allowMovelist"],
+	// fen: to start from a FEN without identifiers (analyze mode)
+	props: ["conn","gameId","fen","mode","allowChat","allowMovelist"],
 	data: function() {
 		return {
 			// if oppid == "computer" then mode = "computer" (otherwise human)
@@ -13,7 +14,6 @@ Vue.component('my-game', {
 			oppid: "", //opponent ID in case of HH game
 			score: "*", //'*' means 'unfinished'
 			mycolor: "w",
-			conn: null, //socket connection (et WebRTC connection ?!)
 			oppConnected: false, //TODO?
 			pgnTxt: "",
 			// sound level: 0 = no sound, 1 = sound only on newgame, 2 = always
@@ -22,12 +22,25 @@ Vue.component('my-game', {
 			compWorker: new Worker('/javascripts/playCompMove.js'),
 			timeStart: undefined, //time when computer starts thinking
 			vr: null, //VariantRules object, describing the game state + rules
+			endgameMessage: "",
+			orientation: "w",
+			
+			moves: [], //TODO: initialize if gameId is defined...
+			// orientation :: button flip
+			// userColor: given by gameId, or fen (if no game Id)
+			// gameOver: known if gameId; otherwise assue false
+			// lastMove: update after every play, initialize with last move from list (if continuation)
+			//orientation ? userColor ? gameOver ? lastMove ?
+		
 		};
 	},
 	watch: {
 		fen: function(newFen) {
 			this.vr = new VariantRules(newFen);
 		},
+		gameId: function() {
+			this.loadGame();
+		},
 	},
 	computed: {
 		showChat: function() {
@@ -42,12 +55,16 @@ Vue.component('my-game', {
 	},
 	// Modal end of game, and then sub-components
 	// TODO: provide chat parameters (connection, players ID...)
-	// and alwo moveList parameters (just moves ?)
+	// and also moveList parameters (just moves ?)
 	// TODO: connection + turn indicators en haut à droite (superposé au menu)
 	// TODO: controls: abort, clear, resign, draw (avec confirm box)
 	// et si partie terminée : (mode analyse) just clear, back / play
 	// + flip button toujours disponible
 	// gotoMove : vr = new VariantRules(fen stocké dans le coup [TODO])
+	
+	// NOTE: move.color must be fulfilled after each move played, because of Marseille (or Avalanche) chess
+	// --> useful in moveList component (universal comma separator ?)
+	
 	template: `
 		<div class="col-sm-12 col-md-10 col-md-offset-1 col-lg-8 col-lg-offset-2">
 			<input id="modal-eog" type="checkbox" class="modal"/>
@@ -62,18 +79,18 @@ Vue.component('my-game', {
 			</div>
 			<my-chat v-if="showChat">
 			</my-chat>
-			<my-board v-bind:vr="vr">
+			<my-board v-bind:vr="vr" :mode="mode" :orientation="orientation" :user-color="mycolor" @play-move="play">
 			</my-board>
-			<div v-show="showFen" id="fen-div" class="section-content">
+			<div v-if="showFen && !!vr" id="fen-div" class="section-content">
 				<p id="fen-string" class="text-center">
 					{{ vr.getFen() }}
 				</p>
 			</div>
 			<div id="pgn-div" class="section-content">
-				<a id="download" href: "#">
+				<a id="download" href="#">
 				</a>
 				<button id="downloadBtn" @click="download">
-					{{ translations["Download PGN"] }}
+					{{ translate("Download PGN") }}
 				</button>
 			</div>
 			<my-move-list v-if="showMoves">
@@ -81,8 +98,13 @@ Vue.component('my-game', {
 		</div>
 	`,
 	created: function() {
-		const url = socketUrl;
-		this.conn = new WebSocket(url + "/?sid=" + this.myid + "&page=" + variant._id);
+
+//		console.log(this.fen);
+//		console.log(this.gameId);
+		if (!!this.gameId)
+			this.loadGame();
+		else if (!!this.fen)
+			this.vr = new VariantRules(this.fen);
 		// TODO: after game, archive in indexedDB
 		// TODO: this events listener is central. Refactor ? How ?
 		const socketMessageListener = msg => {
@@ -157,7 +179,6 @@ Vue.component('my-game', {
 		};
 
 		const socketCloseListener = () => {
-			this.conn = new WebSocket(url + "/?sid=" + this.myid + "&page=" + variant._id);
 			this.conn.addEventListener('message', socketMessageListener);
 			this.conn.addEventListener('close', socketCloseListener);
 		};
@@ -190,10 +211,14 @@ Vue.component('my-game', {
 			}, delay);
 		}
 	},
-	//TODO: conn pourrait être une prop, donnée depuis variant.js
+	// this.conn est une prop, donnée depuis variant.js
 	//dans variant.js (plutôt room.js) conn gère aussi les challenges
 	// Puis en webRTC, repenser tout ça.
 	methods: {
+		translate: translate,
+		loadGame: function() {
+			// TODO: load this.gameId ...
+		},
 		setEndgameMessage: function(score) {
 			let eogMessage = "Undefined";
 			switch (score)