X-Git-Url: https://git.auder.net/?a=blobdiff_plain;f=public%2Fjavascripts%2Fcomponents%2Fgame.js;h=aaef522ba40375ed3524200c446fe06152e85902;hb=8a196305a09269888497995373658f953b9b5bf8;hp=3f74fde92a0552a5f11681f273c88df22a751bea;hpb=4b3539364e8fea527158f4ba27db1c0870ffd2fc;p=vchess.git

diff --git a/public/javascripts/components/game.js b/public/javascripts/components/game.js
index 3f74fde9..aaef522b 100644
--- a/public/javascripts/components/game.js
+++ b/public/javascripts/components/game.js
@@ -20,7 +20,7 @@ Vue.component('my-game', {
 		};
 	},
 	render(h) {
-		let [sizeX,sizeY] = VariantRules.size;
+		const [sizeX,sizeY] = VariantRules.size;
 		// Precompute hints squares to facilitate rendering
 		let hintSquares = doubleArray(sizeX, sizeY, false);
 		this.possibleMoves.forEach(m => { hintSquares[m.end.x][m.end.y] = true; });
@@ -127,7 +127,10 @@ Vue.component('my-game', {
 				this.choices.map( m => { //a "choice" is a move
 					return h('div',
 						{
-							'class': { 'board': true },
+							'class': {
+								'board': true,
+								['board'+sizeY]: true,
+							},
 							style: {
 								'width': (100/this.choices.length) + "%",
 								'padding-bottom': (100/this.choices.length) + "%",
@@ -137,7 +140,7 @@ Vue.component('my-game', {
 							{
 								attrs: { "src": '/images/pieces/' +
 									VariantRules.getPpath(m.appear[0].c+m.appear[0].p) + '.svg' },
-								'class': { 'choice-piece': true, 'board': true },
+								'class': { 'choice-piece': true },
 								on: { "click": e => { this.play(m); this.choices=[]; } },
 							})
 						]
@@ -204,6 +207,7 @@ Vue.component('my-game', {
 								{
 									'class': {
 										'board': true,
+										['board'+sizeY]: true,
 										'light-square': (i+j)%2==0 && (this.expert || !highlight),
 										'dark-square': (i+j)%2==1 && (this.expert || !highlight),
 										'highlight': !this.expert && highlight,
@@ -393,6 +397,11 @@ Vue.component('my-game', {
 			? localStorage.getItem("myid")
 			// random enough (TODO: function)
 			: (Date.now().toString(36) + Math.random().toString(36).substr(2, 7)).toUpperCase();
+		if (!continuation)
+		{
+			// HACK: play a small silent sound to allow "new game" sound later if tab not focused
+			new Audio("/sounds/silent.mp3").play().then(() => {}).catch(err => {});
+		}
 		this.conn = new WebSocket(url + "/?sid=" + this.myid + "&page=" + variant);
 		const socketOpenListener = () => {
 			if (continuation)
@@ -644,6 +653,13 @@ Vue.component('my-game', {
 		},
 		playComputerMove: function() {
 			const timeStart = Date.now();
+			const nbMoves = this.vr.moves.length; //using played moves to know if search finished
+			setTimeout(
+				() => {
+					const L = this.vr.moves.length;
+					if (nbMoves == L || !this.vr.moves[L-1].notation) //move search didn't finish
+						this.vr.shouldReturn = true;
+				}, 5000);
 			const compMove = this.vr.getComputerMove();
 			// (first move) HACK: avoid selecting elements before they appear on page:
 			const delay = Math.max(500-(Date.now()-timeStart), 0);
@@ -734,8 +750,9 @@ Vue.component('my-game', {
 			let rectStart = startSquare.getBoundingClientRect();
 			let rectEnd = endSquare.getBoundingClientRect();
 			let translation = {x:rectEnd.x-rectStart.x, y:rectEnd.y-rectStart.y};
-			let movingPiece = document.querySelector("#" + this.getSquareId(move.start) + " > img.piece");
-			// HACK for animation (otherwise with positive translate, image slides "under background"...)
+			let movingPiece =
+				document.querySelector("#" + this.getSquareId(move.start) + " > img.piece");
+			// HACK for animation (with positive translate, image slides "under background"...)
 			// Possible improvement: just alter squares on the piece's way...
 			squares = document.getElementsByClassName("board");
 			for (let i=0; i<squares.length; i++)