Add options for start squares of kings

takhta.html

@@ -34,6 +34,18 @@
 			#board tbody :nth-child(n) :first-child {
 				background-color: unset;
 			}
+			#options {
+				display: table;
+			}
+			.option {
+				display: table-row;
+			}
+			.option :nth-child(1) {
+				display: table-cell;
+			}
+			.optionvalues :nth-child(1) {
+				display: inline;
+			}
 			body {
 				display: flex;
 				flex-wrap: wrap;
@@ -189,6 +201,36 @@
 					<input type="button" value="Download moves" onclick="download()">
 				</form>
 			</p>
+			<p>
+				<form id="options">
+					<div class="option">
+						<div class="optiontext">White king on</div>
+						<div class="optionvalues">
+							<label>
+								<input type="radio" id="whited1" name="whiteking" value="d1" checked onchange="setupKings()">
+								d1
+							</label>
+							<label>
+								<input type="radio" id="whitee1" name="whiteking" value="e1" onchange="setupKings()">
+								e1
+							</label>
+						</div>
+					</div>
+					<div class="option">
+						<div class="optiontext">Black king on</div>
+						<div class="optionvalues">
+							<label>
+								<input type="radio" id="blackd8" name="blackking" value="d8" checked onchange="setupKings()">
+								d8
+							</label>
+							<label>
+								<input type="radio" id="blacke8" name="blackking" value="e8" onchange="setupKings()">
+								e8
+							</label>
+						</div>
+					</div>
+				</form>
+			</p>
 		</section>
 		<section id="moves">
 			<p>Moves thus far</p>
@@ -201,6 +243,9 @@
 			let form = document.getElementById('input');
 			form.onsubmit = moveEvent;
 
+			document.getElementById('whited1').checked = true;
+			document.getElementById('blackd8').checked = true;
+
 			let moveHistory = [];
 			let moveFuture = [];
 
@@ -432,10 +477,15 @@
 				let ret = doMove(move);
 				if ('error' in ret) {
 					alert(ret.error);
+					// Put back in list of undone moves
+					moveFuture.push(move);
+					return false;
 				}
 
 				// Mark it as un-undone in the list of moves
 				document.getElementById('movelist').children[index].className = '';
+
+				return true;
 			}
 
 			function flipBoard() {
@@ -532,6 +582,32 @@
 				link.click();
 				actions.removeChild(link);
 			}
+
+			function setupKings() {
+				let options = new FormData(document.getElementById('options'));
+				let whiteKing = options.get('whiteking');
+				let whiteQueen = whiteKing === 'd1' ? 'e1' : 'd1';
+				let blackKing = options.get('blackking');
+				let blackQueen = blackKing === 'd8' ? 'e8' : 'd8';
+
+				// Undo all moves
+				while (moveHistory.length > 0) {
+					undoMove();
+				}
+
+				// Place the kings and queens
+				document.getElementById(whiteKing).firstChild.data = '♔';
+				document.getElementById(whiteQueen).firstChild.data = '♕';
+				document.getElementById(blackKing).firstChild.data = '♚';
+				document.getElementById(blackQueen).firstChild.data = '♛';
+
+				// Redo all the moves we can
+				while (moveFuture.length > 0) {
+					if (!redoMove()) {
+						break;
+					}
+				}
+			}
 		</script>
 	</body>
 </html>