tbl.replaceChildren();
if (display_lines.length < 2) {
+ // Update the move highlight, as we've rewritten all the HTML.
+ update_move_highlight();
return;
}
let color;
if (scores[i] === 0) {
color = [0.5, 0.5, 0.5];
- rect.setAttributeNS(null, 'y', base_y - 1);
+ rect.setAttributeNS(null, 'y', base_y);
rect.setAttributeNS(null, 'height', 1);
} else if (scores[i] > 0) {
color = [0.2, 0.4, 0.8];
rect.setAttributeNS(null, 'y', base_y - extent);
- rect.setAttributeNS(null, 'height', extent);
+ rect.setAttributeNS(null, 'height', extent + 1);
} else {
color = [1.0, 0.267, 0.267];
rect.setAttributeNS(null, 'y', base_y);
- rect.setAttributeNS(null, 'height', -extent);
+ rect.setAttributeNS(null, 'height', -extent + 1);
}
let hlcolor = [color[0], color[1], color[2]];
if (scores[i] !== 0) {
}
}
}
- let white_imbalance = '';
- let black_imbalance = '';
+ let white_imbalance = document.getElementById('whiteimbalance');
+ let black_imbalance = document.getElementById('blackimbalance');
+ white_imbalance.textContent = '';
+ black_imbalance.textContent = '';
for (let piece in imbalance) {
for (let i = 0; i < imbalance[piece]; ++i) {
- white_imbalance += '<img src="' + svg_pieces['w' + piece.toUpperCase()] + '" alt="" style="width: 15px;height: 15px;" class="imbalance-piece">';
- white_imbalance += '<img src="' + svg_pieces['b' + piece.toUpperCase()] + '" alt="" style="width: 15px;height: 15px;" class="imbalance-inverted-piece">';
+ let i1 = document.createElement('img');
+ i1.src = svg_pieces['w' + piece.toUpperCase()];
+ i1.setAttribute('alt', piece.toUpperCase());
+ i1.classList.add('imbalance-piece');
+ white_imbalance.appendChild(i1);
+
+ let i2 = document.createElement('img');
+ i2.src = svg_pieces['b' + piece.toUpperCase()];
+ i2.setAttribute('alt', piece.toUpperCase());
+ i2.classList.add('imbalance-inverted-piece');
+ white_imbalance.appendChild(i2);
}
for (let i = 0; i < -imbalance[piece]; ++i) {
- black_imbalance += '<img src="' + svg_pieces['b' + piece.toUpperCase()] + '" alt="" style="width: 15px;height: 15px;" class="imbalance-piece">';
- black_imbalance += '<img src="' + svg_pieces['w' + piece.toUpperCase()] + '" alt="" style="width: 15px;height: 15px;" class="imbalance-inverted-piece">';
+ let i1 = document.createElement('img');
+ i1.src = svg_pieces['b' + piece.toUpperCase()];
+ i1.setAttribute('alt', piece.toUpperCase());
+ i1.classList.add('imbalance-piece');
+ black_imbalance.appendChild(i1);
+
+ let i2 = document.createElement('img');
+ i2.src = svg_pieces['w' + piece.toUpperCase()];
+ i2.setAttribute('alt', piece.toUpperCase());
+ i2.classList.add('imbalance-inverted-piece');
+ black_imbalance.appendChild(i2);
}
}
- document.getElementById('whiteimbalance').innerHTML = white_imbalance;
- document.getElementById('blackimbalance').innerHTML = black_imbalance;
}
/** Mark the currently selected move in red.
fetch(backend_hash_url + "?fen=" + fen, { signal })
.then((response) => response.json())
.then((data) => { show_explore_hash_results(data, fen); })
- .catch((err) => {});
+ .catch((err) => {
+ // Truncate the lines, since we already cleared the display.
+ display_lines = [ display_lines[0], display_lines[1] ];
+ update_move_highlight();
+ });
}
/** Process the JSON response from a hash probe request.
}
let mousedownSquare = function(e) {
- if (!e.target || !e.target.matches('.square-55d63')) {
+ if (!e.target || !e.target.closest('.square-55d63')) {
return;
}
reverse_dragging_from = null;
- let square = e.target.getAttribute('data-square');
+ let square = e.target.closest('.square-55d63').getAttribute('data-square');
let pseudogame = new Chess(display_fen);
if (pseudogame.game_over() === true) {
}
let mouseupSquare = function(e) {
- if (!e.target || !e.target.matches('.square-55d63')) {
+ if (!e.target || !e.target.closest('.square-55d63')) {
return;
}
if (reverse_dragging_from === null) {
return;
}
- let source = e.target.getAttribute('data-square');
+ let source = e.target.closest('.square-55d63').getAttribute('data-square');
let target = reverse_dragging_from;
reverse_dragging_from = null;
if (onDrop(source, target) !== 'snapback') {
}
let line = display_lines[i];
if (line.pv[line.start_display_move_num] === move.san) {
- show_line(i, line.start_display_move_num);
+ show_line(i, 0);
return;
}
}