X-Git-Url: https://git.auder.net/?a=blobdiff_plain;f=public%2Fjavascripts%2Fcomponents%2Fgame.js;h=5690eb14e96ccd8df485e5131b42c338ea2fa1f2;hb=0cd8f2bdfe04a0bd880ee48ef2dcce24728536ee;hp=40035a5fb256052612eac0e5c8adb827121f5c2b;hpb=3ed62725fe47e395793cf952403d61fc9f347eee;p=vchess.git

diff --git a/public/javascripts/components/game.js b/public/javascripts/components/game.js
index 40035a5f..5690eb14 100644
--- a/public/javascripts/components/game.js
+++ b/public/javascripts/components/game.js
@@ -16,6 +16,7 @@ Vue.component('my-game', {
 			seek: false,
 			fenStart: "",
 			incheck: [],
+			pgnTxt: "",
 			expert: document.cookie.length>0 ? document.cookie.substr(-1)=="1" : false,
 		};
 	},
@@ -216,18 +217,21 @@ Vue.component('my-game', {
 					);
 				}), choices]
 			);
-			actionArray.push(
-				h('button',
-					{
-						on: { click: this.resign },
-						attrs: { "aria-label": 'Resign' },
-						'class': {
-							"tooltip":true,
-							"bottom": true,
+			if (this.mode != "idle")
+			{
+				actionArray.push(
+					h('button',
+						{
+							on: { click: this.resign },
+							attrs: { "aria-label": 'Resign' },
+							'class': {
+								"tooltip":true,
+								"bottom": true,
+							},
 						},
-					},
-					[h('i', { 'class': { "material-icons": true } }, "flag")])
-			);
+						[h('i', { 'class': { "material-icons": true } }, "flag")])
+				);
+			}
 			elementArray.push(gameDiv);
 	//			if (!!vr.reserve)
 	//			{
@@ -334,12 +338,22 @@ Vue.component('my-game', {
 		{
 			elementArray.push(
 				h('div',
-					{ },
+					{ attrs: { id: "pgn-div" } },
 					[
+						h('a',
+							{
+								attrs: {
+									id: "download",
+									href: "#",
+								}
+							}
+						),
 						h('p',
 							{
+								attrs: { id: "pgn-game" },
+								on: { click: this.download },
 								domProps: {
-									innerHTML: this.vr.getPGN(this.mycolor, this.score, this.fenStart, this.mode)
+									innerHTML: this.pgnTxt
 								}
 							}
 						)
@@ -398,7 +412,6 @@ Vue.component('my-game', {
 		};
 		const socketMessageListener = msg => {
 			const data = JSON.parse(msg.data);
-			console.log("Receive message: " + data.code);
 			switch (data.code)
 			{
 				case "newgame": //opponent found
@@ -470,10 +483,21 @@ Vue.component('my-game', {
 		this.conn.onclose = socketCloseListener;
 	},
 	methods: {
+		download: function() {
+			let content = document.getElementById("pgn-game").innerHTML;
+			content = content.replace(/<br>/g, "\n");
+			// Prepare and trigger download link
+			let downloadAnchor = document.getElementById("download");
+			downloadAnchor.setAttribute("download", "game.pgn");
+			downloadAnchor.href = "data:text/plain;charset=utf-8," + encodeURIComponent(content);
+			downloadAnchor.click();
+		},
 		endGame: function(score) {
 			this.score = score;
 			let modalBox = document.getElementById("modal-eog");
 			modalBox.checked = true;
+			// Variants may have special PGN structure (so next function isn't defined here)
+			this.pgnTxt = this.vr.getPGN(this.mycolor, this.score, this.fenStart, this.mode);
 			setTimeout(() => { modalBox.checked = false; }, 2000);
 			if (this.mode == "human")
 				this.clearStorage();
@@ -579,6 +603,7 @@ Vue.component('my-game', {
 				return;
 			}
 			this.vr = new VariantRules(fen, moves || []);
+			this.pgnTxt = ""; //redundant with this.score = "*", but cleaner
 			this.mode = mode;
 			this.incheck = []; //in case of
 			this.fenStart = continuation
@@ -599,10 +624,9 @@ Vue.component('my-game', {
 				this.seek = false;
 				if (!!moves && moves.length > 0) //imply continuation
 				{
-					const oppCol = this.vr.turn;
 					const lastMove = moves[moves.length-1];
 					this.vr.undo(lastMove);
-					this.incheck = this.vr.getCheckSquares(lastMove, oppCol);
+					this.incheck = this.vr.getCheckSquares(lastMove);
 					this.vr.play(lastMove, "ingame");
 				}
 				delete localStorage["newgame"];
@@ -616,8 +640,7 @@ Vue.component('my-game', {
 			}
 		},
 		playComputerMove: function() {
-			const compColor = this.mycolor=='w' ? 'b' : 'w';
-			const compMove = this.vr.getComputerMove(compColor);
+			const compMove = this.vr.getComputerMove();
 			// HACK: avoid selecting elements before they appear on page:
 			setTimeout(() => this.play(compMove, "animate"), 500);
 		},
@@ -649,9 +672,10 @@ Vue.component('my-game', {
 				this.selectedPiece.style.display = "inline-block";
 				this.selectedPiece.style.zIndex = 3000;
 				let startSquare = this.getSquareFromId(e.target.parentNode.id);
-				this.possibleMoves = this.vr.canIplay(this.mycolor,startSquare)
+				this.possibleMoves = this.mode!="idle" && this.vr.canIplay(this.mycolor,startSquare)
 					? this.vr.getPossibleMovesFrom(startSquare)
 					: [];
+				console.log(this.possibleMoves);
 				e.target.parentNode.appendChild(this.selectedPiece);
 			}
 		},
@@ -732,8 +756,7 @@ Vue.component('my-game', {
 				this.animateMove(move);
 				return;
 			}
-			const oppCol = this.vr.getOppCol(this.vr.turn);
-			this.incheck = this.vr.getCheckSquares(move, oppCol); //is opponent in check?
+			this.incheck = this.vr.getCheckSquares(move); //is opponent in check?
 			// Not programmatic, or animation is over
 			if (this.mode == "human" && this.vr.turn == this.mycolor)
 				this.conn.send(JSON.stringify({code:"newmove", move:move, oppid:this.oppid}));
@@ -741,7 +764,7 @@ Vue.component('my-game', {
 			this.vr.play(move, "ingame");
 			if (this.mode == "human")
 				this.updateStorage(); //after our moves and opponent moves
-			const eog = this.vr.checkGameOver(this.vr.turn);
+			const eog = this.vr.checkGameOver();
 			if (eog != "*")
 				this.endGame(eog);
 			else if (this.mode == "computer" && this.vr.turn != this.mycolor)