X-Git-Url: https://git.auder.net/?a=blobdiff_plain;f=public%2Fjavascripts%2Fcomponents%2Fgame.js;h=e412525fa301c400822b51e62302523a3733cf89;hb=01a135e2aa21365c0a96931fbb6be76876e7c2a1;hp=f0017a2dd961ac4d8dd266cb8b6fc2d3a20e31e0;hpb=f3802fcd1279e5d07cdff1341fc5e17c5296dc9c;p=vchess.git

diff --git a/public/javascripts/components/game.js b/public/javascripts/components/game.js
index f0017a2d..e412525f 100644
--- a/public/javascripts/components/game.js
+++ b/public/javascripts/components/game.js
@@ -203,36 +203,10 @@ Vue.component('my-game', {
 	//				elementArray.push(reserve);
 	//			}
 			const eogMessage = this.getEndgameMessage(this.score);
-			let elemsOfEog =
-			[
-				h('label',
-					{
-						attrs: { "for": "modal-control" },
-						"class": { "modal-close": true },
-					}
-				),
-				h('h3',
-					{
-						"class": { "section": true },
-						domProps: { innerHTML: eogMessage },
-					}
-				)
-			];
-			if (this.score != "*")
-			{
-				elemsOfEog.push(
-					h('p', //'textarea', //TODO: selectable!
-						{
-							domProps: { innerHTML: this.vr.getPGN(this.mycolor, this.score, this.fenStart) },
-							//attrs: { "readonly": true },
-						}
-					)
-				);
-			}
 			const modalEog = [
 				h('input',
 					{
-						attrs: { "id": "modal-control", type: "checkbox" },
+						attrs: { "id": "modal-eog", type: "checkbox" },
 						"class": { "modal": true },
 					}),
 				h('div',
@@ -244,7 +218,20 @@ Vue.component('my-game', {
 							{
 								"class": { "card": true, "smallpad": true },
 							},
-							elemsOfEog
+							[
+								h('label',
+									{
+										attrs: { "for": "modal-eog" },
+										"class": { "modal-close": true },
+									}
+								),
+								h('h3',
+									{
+										"class": { "section": true },
+										domProps: { innerHTML: eogMessage },
+									}
+								)
+							]
 						)
 					]
 				)
@@ -254,7 +241,7 @@ Vue.component('my-game', {
 		const modalNewgame = [
 			h('input',
 				{
-					attrs: { "id": "modal-control2", type: "checkbox" },
+					attrs: { "id": "modal-newgame", type: "checkbox" },
 					"class": { "modal": true },
 				}),
 			h('div',
@@ -269,7 +256,7 @@ Vue.component('my-game', {
 						[
 							h('label',
 								{
-									attrs: { "id": "close-newgame", "for": "modal-control2" },
+									attrs: { "id": "close-newgame", "for": "modal-newgame" },
 									"class": { "modal-close": true },
 								}
 							),
@@ -299,6 +286,23 @@ Vue.component('my-game', {
 			actionArray
 		);
 		elementArray.push(actions);
+		if (this.score != "*")
+		{
+			elementArray.push(
+				h('div',
+					{ },
+					[
+						h('p',
+							{
+								domProps: {
+									innerHTML: this.vr.getPGN(this.mycolor, this.score, this.fenStart, this.mode)
+								}
+							}
+						)
+					]
+				)
+			);
+		}
 		return h(
 			'div',
 			{
@@ -339,7 +343,7 @@ Vue.component('my-game', {
 				const moves = JSON.parse(localStorage.getItem("moves"));
 				this.newGame("human", fen, mycolor, oppid, moves, true);
 				// Send ping to server (answer pong if opponent is connected)
-				this.conn.send(JSON.stringify({code:"ping",oppid:this.oppId}));
+				this.conn.send(JSON.stringify({code:"ping",oppid:this.oppid}));
 			}
 			else if (localStorage.getItem("newgame") === variant)
 			{
@@ -399,6 +403,7 @@ Vue.component('my-game', {
 					}
 					else if (data.movesCount > this.vr.moves.length) //just got last move from him
 						this.play(data.lastMove, "animate");
+					break;
 				case "resign": //..you won!
 					this.endGame(this.mycolor=="w"?"1-0":"0-1");
 					break;
@@ -411,7 +416,6 @@ Vue.component('my-game', {
 			}
 		};
 		const socketCloseListener = () => {
-			console.log("Lost connection -- reconnect");
 			this.conn = new WebSocket(url + "/?sid=" + this.myid + "&page=" + variant);
 			this.conn.addEventListener('open', socketOpenListener);
 			this.conn.addEventListener('message', socketMessageListener);
@@ -424,9 +428,9 @@ Vue.component('my-game', {
 	methods: {
 		endGame: function(score) {
 			this.score = score;
-			let modalBox = document.getElementById("modal-control");
+			let modalBox = document.getElementById("modal-eog");
 			modalBox.checked = true;
-			//setTimeout(() => { modalBox.checked = false; }, 2000); //disabled, to show PGN
+			setTimeout(() => { modalBox.checked = false; }, 2000);
 			if (this.mode == "human")
 				this.clearStorage();
 			this.mode = "idle";
@@ -485,13 +489,12 @@ Vue.component('my-game', {
 			if (this.mode == "human")
 				return; //no newgame while playing
 			if (this.seek)
+			{
 				delete localStorage["newgame"]; //cancel game seek
+				this.seek = false;
+			}
 			else
-			{
-				localStorage["newgame"] = variant;
 				this.newGame("human");
-			}
-			this.seek = !this.seek;
 		},
 		clickComputerGame: function() {
 			if (this.mode == "human")
@@ -507,11 +510,12 @@ Vue.component('my-game', {
 				const storageVariant = localStorage.getItem("variant");
 				if (!!storageVariant && storageVariant !== variant)
 				{
-					// TODO: find a better way to ensure this. Newgame system is currently a mess.
 					alert("Finish your " + storageVariant + " game first!");
 					return;
 				}
 				// Send game request and wait..
+				localStorage["newgame"] = variant;
+				this.seek = true;
 				this.clearStorage(); //in case of
 				try {
 					this.conn.send(JSON.stringify({code:"newgame", fen:fen}));
@@ -520,7 +524,7 @@ Vue.component('my-game', {
 				}
 				if (continuation !== "reconnect") //TODO: bad HACK...
 				{
-					let modalBox = document.getElementById("modal-control2");
+					let modalBox = document.getElementById("modal-newgame");
 					modalBox.checked = true;
 					setTimeout(() => { modalBox.checked = false; }, 2000);
 				}
@@ -537,9 +541,9 @@ Vue.component('my-game', {
 				// Opponent found!
 				if (!continuation)
 				{
-					// Playing sound fails on game continuation:
-					new Audio("/sounds/newgame.mp3").play();
-					document.getElementById("modal-control2").checked = false;
+					// Not playing sound on game continuation:
+					new Audio("/sounds/newgame.mp3").play().then(() => {}).catch(err => {});
+					document.getElementById("modal-newgame").checked = false;
 				}
 				this.oppid = oppId;
 				this.oppConnected = true;
@@ -549,7 +553,7 @@ Vue.component('my-game', {
 				{
 					const oppCol = this.vr.turn;
 					const lastMove = moves[moves.length-1];
-					this.vr.undo(lastMove, "ingame");
+					this.vr.undo(lastMove);
 					this.incheck = this.vr.getCheckSquares(lastMove, oppCol);
 					this.vr.play(lastMove, "ingame");
 				}
@@ -685,7 +689,7 @@ Vue.component('my-game', {
 			// 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}));
-			new Audio("/sounds/chessmove1.mp3").play();
+			new Audio("/sounds/chessmove1.mp3").play().then(() => {}).catch(err => {});
 			this.vr.play(move, "ingame");
 			if (this.mode == "human")
 				this.updateStorage(); //after our moves and opponent moves