X-Git-Url: https://git.sesse.net/?p=remoteglot;a=blobdiff_plain;f=www%2Fjs%2Fremoteglot.js;h=595bce185aa1a3457dc89cb5241fe5abee9c307e;hp=fe5d266a672f71ee1aaccad7f8a34e4f906dabac;hb=2e6f47cc12a8ce6fdd3c8d5da5183abb8cc3719a;hpb=73764545d4560b3ad9f49badb7978eb0f2a98b74

diff --git a/www/js/remoteglot.js b/www/js/remoteglot.js
index fe5d266..595bce1 100644
--- a/www/js/remoteglot.js
+++ b/www/js/remoteglot.js
@@ -36,12 +36,18 @@ var ims = 0;
 /** @type {boolean} @private */
 var sort_refutation_lines_by_score = true;
 
+/** @type {boolean} @private */
+var truncate_display_history = true;
+
 /** @type {!string|undefined} @private */
 var highlight_from = undefined;
 
 /** @type {!string|undefined} @private */
 var highlight_to = undefined;
 
+/** @type {?jQuery} @private */
+var highlighted_move = null;
+
 /** @type {!number} @private */
 var unique = Math.random();
 
@@ -54,7 +60,8 @@ var fen = null;
 /** @typedef {{
  *    start_fen: string,
  *    uci_pv: Array.<string>,
- *    pretty_pv: Array.<string>
+ *    pretty_pv: Array.<string>,
+ *    line_num: number
  * }} DisplayLine
  */
 
@@ -377,28 +384,52 @@ var thousands = function(x) {
  * @param {number} move_num
  * @param {!string} toplay
  * @param {number=} opt_limit
+ * @param {boolean=} opt_showlast
  */
-var print_pv = function(fen, uci_pv, pretty_pv, move_num, toplay, opt_limit) {
+var add_pv = function(fen, uci_pv, pretty_pv, move_num, toplay, opt_limit, opt_showlast) {
 	display_lines.push({
 		start_fen: fen,
 		uci_pv: uci_pv,
-		pretty_pv: pretty_pv 
+		pretty_pv: pretty_pv,
+		line_number: display_lines.length
 	});
+	return print_pv(display_lines.length - 1, pretty_pv, move_num, toplay, opt_limit, opt_showlast);
+}
 
+/**
+ * @param {number} line_num
+ * @param {Array.<string>} pretty_pv
+ * @param {number} move_num
+ * @param {!string} toplay
+ * @param {number=} opt_limit
+ * @param {boolean=} opt_showlast
+ */
+var print_pv = function(line_num, pretty_pv, move_num, toplay, opt_limit, opt_showlast) {
 	var pv = '';
 	var i = 0;
-	if (toplay == 'B') {
-		var move = "<a class=\"move\" href=\"javascript:show_line(" + (display_lines.length - 1) + ", " + 0 + ");\">" + pretty_pv[0] + "</a>";
+	if (opt_limit && opt_showlast && pretty_pv.length > opt_limit) {
+		// Truncate the PV at the beginning (instead of at the end).
+		// We assume here that toplay is 'W'. We also assume that if
+		// opt_showlast is set, then it is the history, and thus,
+		// the UI should be to expand the history.
+		pv = '(<a class="move" href="javascript:collapse_history(false)">…</a>) ';
+		i = pretty_pv.length - opt_limit;
+		if (i % 2 == 1) {
+			++i;
+		}
+		move_num += i / 2;
+	} else if (toplay == 'B') {
+		var move = "<a class=\"move\" id=\"automove" + line_num + "-0\" href=\"javascript:show_line(" + line_num + ", " + 0 + ");\">" + pretty_pv[0] + "</a>";
 		pv = move_num + '. … ' + move;
 		toplay = 'W';
 		++i;
 		++move_num;
 	}
 	for ( ; i < pretty_pv.length; ++i) {
-		var move = "<a class=\"move\" href=\"javascript:show_line(" + (display_lines.length - 1) + ", " + i + ");\">" + pretty_pv[i] + "</a>";
+		var move = "<a class=\"move\" id=\"automove" + line_num + "-" + i + "\" href=\"javascript:show_line(" + line_num + ", " + i + ");\">" + pretty_pv[i] + "</a>";
 
 		if (toplay == 'W') {
-			if (i > opt_limit) {
+			if (i > opt_limit && !opt_showlast) {
 				return pv + ' (…)';
 			}
 			if (pv != '') {
@@ -423,12 +454,33 @@ var update_highlight = function() {
 	}
 }
 
+var update_history = function() {
+	if (display_lines[0] === null || display_lines[0].pretty_pv.length == 0) {
+		$("#history").html("No history");
+	} else if (truncate_display_history) {
+		$("#history").html(print_pv(0, display_lines[0].pretty_pv, 1, 'W', 8, true));
+	} else {
+		$("#history").html(
+			'(<a class="move" href="javascript:collapse_history(true)">collapse</a>) ' +
+			print_pv(0, display_lines[0].pretty_pv, 1, 'W'));
+	}
+}
+
+/**
+ * @param {!boolean} truncate_history
+ */
+var collapse_history = function(truncate_history) {
+	truncate_display_history = truncate_history;
+	update_history();
+}
+window['collapse_history'] = collapse_history;
+
 var update_refutation_lines = function() {
 	if (fen === null) {
 		return;
 	}
-	if (display_lines.length > 1) {
-		display_lines = [ display_lines[0] ];
+	if (display_lines.length > 2) {
+		display_lines = [ display_lines[0], display_lines[1] ];
 	}
 
 	var tbl = $("#refutationlines");
@@ -468,7 +520,7 @@ var update_refutation_lines = function() {
 		var pv_td = document.createElement("td");
 		tr.appendChild(pv_td);
 		$(pv_td).addClass("pv");
-		$(pv_td).html(print_pv(fen, line['pv_uci'], line['pv_pretty'], move_num, toplay, 10));
+		$(pv_td).html(add_pv(fen, line['pv_uci'], line['pv_pretty'], move_num, toplay, 10));
 
 		tbl.append(tr);
 	}
@@ -518,6 +570,11 @@ var update_board = function(data, num_viewers) {
 		$("#numviewers").text(num_viewers + " current viewers");
 	}
 
+	// The engine id.
+	if (data['id'] && data['id']['name'] !== null) {
+		$("#engineid").text(data['id']['name']);
+	}
+
 	// The score.
 	if (data['score'] !== null) {
 		$("#score").text(data['score']);
@@ -546,14 +603,22 @@ var update_board = function(data, num_viewers) {
 
 	if (data['position']['last_move_uci']) {
 		highlight_from = data['position']['last_move_uci'].substr(0, 2);
-		highlight_to = data['position']['last_move_uci'].substr(2, 4);
+		highlight_to = data['position']['last_move_uci'].substr(2, 2);
 	} else {
 		highlight_from = highlight_to = undefined;
 	}
 	update_highlight();
 
+	// Print the history.
+	if (data['position']['history']) {
+		add_pv('start', data['position']['history'], data['position']['pretty_history'], 1, 'W', 8, true);
+	} else {
+		display_lines.push(null);
+	}
+	update_history();
+
 	// Print the PV.
-	$("#pv").html(print_pv(data['position']['fen'], data['pv_uci'], data['pv_pretty'], data['position']['move_num'], data['position']['toplay']));
+	$("#pv").html(add_pv(data['position']['fen'], data['pv_uci'], data['pv_pretty'], data['position']['move_num'], data['position']['toplay']));
 
 	// Update the PV arrow.
 	clear_arrows();
@@ -562,7 +627,7 @@ var update_board = function(data, num_viewers) {
 		for (var i = 0; i < data['pv_uci'].length; i += 2) {
 			var from = data['pv_uci'][i].substr(0, 2);
 			var to = data['pv_uci'][i].substr(2,4);
-			if ((i >= 2 && from != data['pv_uci'][i - 2].substr(2, 4)) ||
+			if ((i >= 2 && from != data['pv_uci'][i - 2].substr(2, 2)) ||
 			     interfering_arrow(from, to)) {
 				break;
 			}
@@ -572,7 +637,7 @@ var update_board = function(data, num_viewers) {
 		var alt_moves = find_nonstupid_moves(data, 30);
 		for (var i = 1; i < alt_moves.length && i < 3; ++i) {
 			create_arrow(alt_moves[i].substr(0, 2),
-				     alt_moves[i].substr(2, 4), '#f66', 1, 10);
+				     alt_moves[i].substr(2, 2), '#f66', 1, 10);
 		}
 	}
 
@@ -603,7 +668,7 @@ var update_board = function(data, num_viewers) {
 
 		if (nonstupid_moves.length > 0 && response !== undefined) {
 			create_arrow(response.substr(0, 2),
-				     response.substr(2, 4), '#66f', 6, 20);
+				     response.substr(2, 2), '#66f', 6, 20);
 		}
 	}
 
@@ -627,6 +692,15 @@ var resort_refutation_lines = function(sort_by_score) {
 }
 window['resort_refutation_lines'] = resort_refutation_lines;
 
+/**
+ * @param {boolean} truncate_history
+ */
+var set_truncate_history = function(truncate_history) {
+	truncate_display_history = truncate_history;
+	update_refutation_lines();
+}
+window['set_truncate_history'] = set_truncate_history;
+
 /**
  * @param {number} line_num
  * @param {number} move_num
@@ -646,18 +720,25 @@ var show_line = function(line_num, move_num) {
 window['show_line'] = show_line;
 
 var prev_move = function() {
-	--current_display_move;
+	if (current_display_move > -1) {
+		--current_display_move;
+	}
 	update_displayed_line();
 }
 window['prev_move'] = prev_move;
 
 var next_move = function() {
-	++current_display_move;
+	if (current_display_line && current_display_move < current_display_line.pretty_pv.length - 1) {
+		++current_display_move;
+	}
 	update_displayed_line();
 }
 window['next_move'] = next_move;
 
 var update_displayed_line = function() {
+	if (highlighted_move !== null) {
+		highlighted_move.removeClass('highlight'); 
+	}
 	if (current_display_line === null) {
 		$("#linenav").hide();
 		$("#linemsg").show();
@@ -668,7 +749,7 @@ var update_displayed_line = function() {
 	$("#linenav").show();
 	$("#linemsg").hide();
 
-	if (current_display_move == 0) {
+	if (current_display_move <= 0) {
 		$("#prevmove").html("Previous");
 	} else {
 		$("#prevmove").html("<a href=\"javascript:prev_move();\">Previous</a></span>");
@@ -681,9 +762,32 @@ var update_displayed_line = function() {
 
 	hiddenboard.position(current_display_line.start_fen, false);
 	for (var i = 0; i <= current_display_move; ++i) {
+		var pos = hiddenboard.position();
 		var move = current_display_line.uci_pv[i];
-		move = move.substr(0, 2) + "-" + move.substr(2, 4);
+		var source = move.substr(0, 2);
+		var target = move.substr(2, 2);
+		var promo = move.substr(4, 1);
+
+		// Check if we need to do en passant.
+		var piece = pos[source];
+		if (piece == "wP" || piece == "bP") {
+			if (source.substr(0, 1) != target.substr(0, 1) &&
+			    pos[target] === undefined) {
+				var ep_square = target.substr(0, 1) + source.substr(1, 1);
+				delete pos[ep_square];
+				hiddenboard.position(pos, false);
+			}
+		}
+
+		move = source + "-" + target;
 		hiddenboard.move(move, false);
+		pos = hiddenboard.position();
+
+		// Do promotion if needed.
+		if (promo != "") {
+			pos[target] = pos[target].substr(0, 1) + promo.toUpperCase();
+			hiddenboard.position(pos, false);
+		}
 
 		// chessboard.js does not automatically move the rook on castling
 		// (issue #51; marked as won't fix), so update it ourselves.
@@ -697,6 +801,10 @@ var update_displayed_line = function() {
 			hiddenboard.move("a8-d8", false);
 		}
 	}
+
+	highlighted_move = $("#automove" + current_display_line.line_number + "-" + current_display_move);
+	highlighted_move.addClass('highlight'); 
+
 	board.position(hiddenboard.position());
 }