X-Git-Url: https://git.auder.net/variants/Cwda/complete_rules.html?a=blobdiff_plain;f=public%2Fjavascripts%2Fcomponents%2Fgame.js;h=84976b0c6629cef1bf2ebf37d21446da375c6dde;hb=9106c77bf4f1d56ad855d4ffbb93f945065d7fac;hp=86f252106991c911a48f57740d9278d1a0b7a359;hpb=efb20746c30ac26f258f9c5de6dfb70b91980de4;p=vchess.git

diff --git a/public/javascripts/components/game.js b/public/javascripts/components/game.js
index 86f25210..84976b0c 100644
--- a/public/javascripts/components/game.js
+++ b/public/javascripts/components/game.js
@@ -240,23 +240,77 @@ Vue.component('my-game', {
 				);
 			}
 			elementArray.push(gameDiv);
-	//			if (!!vr.reserve)
-	//			{
-	//				let reserve = h('div',
-	//					{'class':{'game':true}}, [
-	//						h('div',
-	//							{ 'class': { 'row': true }},
-	//							[
-	//								h('div',
-	//									{'class':{'board':true}},
-	//									[h('img',{'class':{"piece":true},attrs:{"src":"/images/pieces/wb.svg"}})]
-	//								)
-	//							]
-	//						)
-	//					],
-	//				);
-	//				elementArray.push(reserve);
-	//			}
+			if (!!this.vr.reserve)
+			{
+				const shiftIdx = (this.mycolor=="w" ? 0 : 1);
+				let myReservePiecesArray = [];
+				for (let i=0; i<VariantRules.RESERVE_PIECES.length; i++)
+				{
+					myReservePiecesArray.push(h('div',
+					{
+						'class': {'board':true, ['board'+sizeY]:true},
+						attrs: { id: this.getSquareId({x:sizeX+shiftIdx,y:i}) }
+					},
+					[
+						h('img',
+						{
+							'class': {"piece":true},
+							attrs: {
+								"src": "/images/pieces/" +
+									this.vr.getReservePpath(this.mycolor,i) + ".svg",
+							}
+						}),
+						h('sup',
+							{style: { "padding-left":"40%"} },
+							[ this.vr.reserve[this.mycolor][VariantRules.RESERVE_PIECES[i]] ]
+						)
+					]));
+				}
+				let oppReservePiecesArray = [];
+				const oppCol = this.vr.getOppCol(this.mycolor);
+				for (let i=0; i<VariantRules.RESERVE_PIECES.length; i++)
+				{
+					oppReservePiecesArray.push(h('div',
+					{
+						'class': {'board':true, ['board'+sizeY]:true},
+						attrs: { id: this.getSquareId({x:sizeX+(1-shiftIdx),y:i}) }
+					},
+					[
+						h('img',
+						{
+							'class': {"piece":true},
+							attrs: {
+								"src": "/images/pieces/" +
+									this.vr.getReservePpath(oppCol,i) + ".svg",
+							}
+						}),
+						h('sup',
+							{style: { "padding-left":"40%"} },
+							[ this.vr.reserve[oppCol][VariantRules.RESERVE_PIECES[i]] ]
+						)
+					]));
+				}
+				let reserves = h('div',
+					{
+						'class':{'game':true},
+						style: {"margin-bottom": "20px"},
+					},
+					[
+						h('div',
+							{
+								'class': { 'row': true },
+								style: {"margin-bottom": "15px"},
+							},
+							myReservePiecesArray
+						),
+						h('div',
+							{ 'class': { 'row': true }},
+							oppReservePiecesArray
+						)
+					]
+				);
+				elementArray.push(reserves);
+			}
 			const eogMessage = this.getEndgameMessage(this.score);
 			const modalEog = [
 				h('input',
@@ -383,9 +437,9 @@ Vue.component('my-game', {
 					mousedown: this.mousedown,
 					mousemove: this.mousemove,
 					mouseup: this.mouseup,
-					touchdown: this.mousedown,
+					touchstart: this.mousedown,
 					touchmove: this.mousemove,
-					touchup: this.mouseup,
+					touchend: this.mouseup,
 				},
 			},
 			elementArray
@@ -701,7 +755,8 @@ Vue.component('my-game', {
 				this.possibleMoves = this.mode!="idle" && this.vr.canIplay(this.mycolor,startSquare)
 					? this.vr.getPossibleMovesFrom(startSquare)
 					: [];
-				e.target.parentNode.appendChild(this.selectedPiece);
+				// Next line add moving piece just after current image (required for Crazyhouse reserve)
+				e.target.parentNode.insertBefore(this.selectedPiece, e.target.nextSibling);
 			}
 		},
 		mousemove: function(e) {