diff --git a/80_info.js b/80_info.js
index 95f232a5..0e93fddc 100644
--- a/80_info.js
+++ b/80_info.js
@@ -283,7 +283,7 @@ function NewInfoHandler() {
}
};
- ih.draw_infobox = function(mouse_point, active_square, leela_should_go, active_colour, searchmoves, hoverdraw_line) {
+ ih.draw_infobox = function(mouse_point, active_square, leela_should_go, active_colour, searchmoves, hoverdraw_index) {
ih.draw_statusbox(leela_should_go, searchmoves);
@@ -296,6 +296,8 @@ function NewInfoHandler() {
return;
}
+ let info_list = this.sorted();
+
// We might be highlighting some div...
let highlight_move = null;
@@ -306,10 +308,8 @@ function NewInfoHandler() {
highlight_class = "ocm_highlight";
}
- let hoverdraw_move = null;
-
- if (Array.isArray(hoverdraw_line) && hoverdraw_line.length > 0) {
- highlight_move = hoverdraw_line[0];
+ if (typeof hoverdraw_index === "number" && hoverdraw_index >= 0 && hoverdraw_index < info_list.length) {
+ highlight_move = info_list[hoverdraw_index].move;
highlight_class = "hover_highlight";
}
@@ -337,9 +337,9 @@ function NewInfoHandler() {
this.info_clickers = [];
- let info_list = this.sorted();
let substrings = [];
- let n = 0;
+ let clicker_index = 0;
+ let div_index = 0;
for (let info of info_list) {
@@ -351,7 +351,7 @@ function NewInfoHandler() {
divclass += " " + highlight_class;
}
- substrings.push(`
`);
+ substrings.push(`
`);
// The "focus" button...
@@ -391,7 +391,7 @@ function NewInfoHandler() {
if (nice_pv[i].includes("O-O")) {
spanclass += " nobr";
}
- substrings.push(`${nice_pv[i]} `);
+ substrings.push(`${nice_pv[i]} `);
this.info_clickers.push({
move: info.pv[i],
is_start: i === 0,
diff --git a/95_renderer.js b/95_renderer.js
index 425d6e1b..e20fc292 100644
--- a/95_renderer.js
+++ b/95_renderer.js
@@ -16,7 +16,8 @@ function NewRenderer() {
renderer.pgn_choices = null; // All games found when opening a PGN file.
renderer.friendly_draws = New2DArray(8, 8); // What pieces are drawn in boardfriends. Used to skip redraws.
renderer.active_square = null; // Clicked square.
- renderer.hoverdraw_line = []; // The fantasy line drawn so far.
+ renderer.hoverdraw_index = -1;
+ renderer.hoverdraw_depth = 0;
renderer.tick = 0; // How many draw loops we've been through.
renderer.position_change_time = performance.now(); // Time of the last position change. Used for cooldown on hover draw.
@@ -38,7 +39,7 @@ function NewRenderer() {
this.position_change_time = performance.now();
this.searchmoves = [];
- this.hoverdraw_line = [];
+ this.hoverdraw_index = -1;
this.position_changed_clear_info_handler(new_game_flag);
this.escape();
@@ -1012,59 +1013,52 @@ function NewRenderer() {
renderer.hoverdraw = function() {
if (!config.hover_draw) {
- this.hoverdraw_line = [];
+ this.hoverdraw_index = -1;
return false;
}
if (performance.now() - this.position_change_time < 1000) {
- this.hoverdraw_line = [];
+ this.hoverdraw_index = -1;
return false;
}
let overlist = document.querySelectorAll(":hover");
- let firstmove = null;
+ let sorted_index = null;
for (let item of overlist) {
if (typeof item.id === "string" && item.id.startsWith("infoline_")) {
- firstmove = item.id.slice("infoline_".length);
+ sorted_index = parseInt(item.id.slice("infoline_".length), 10);
break;
}
}
- if (!firstmove) {
- this.hoverdraw_line = [];
+ if (typeof sorted_index !== "number" || Number.isNaN(sorted_index)) {
+ this.hoverdraw_index = -1;
return false;
}
- let info = this.info_handler.table[firstmove];
-
- // It is entirely possible that the firstmove we've detected is illegal
- // due to the HTML being stale - because we call hoverdraw() before
- // updating the HTML to prevent flicker.
+ let info = this.info_handler.sorted()[sorted_index]; // Possibly undefined
if (!info || Array.isArray(info.pv) === false || info.pv.length === 0) {
- this.hoverdraw_line = [];
+ this.hoverdraw_index = -1;
return false;
}
- // At this point, info.pv represents the full line to animate. We need
- // to check if it's compatible with the moves we've already drawn, if
- // there are any...
+ // If the user is hovering over a different div index in the infobox, reset depth...
- if (ArrayStartsWith(info.pv, this.hoverdraw_line) === false) {
- this.hoverdraw_line = [];
+ if (sorted_index !== this.hoverdraw_index) {
+ this.hoverdraw_index = sorted_index;
+ this.hoverdraw_depth = 0;
}
- // And now, sometimes add a move to the drawn line...
+ // Sometimes increase depth...
if (this.tick % config.animate_delay_multiplier === 0) {
- if (this.hoverdraw_line.length < info.pv.length) {
- this.hoverdraw_line.push(info.pv[this.hoverdraw_line.length]);
- }
+ this.hoverdraw_depth++;
}
- return this.draw_fantasy_from_moves(this.hoverdraw_line);
+ return this.draw_fantasy_from_moves(info.pv.slice(0, this.hoverdraw_depth)); // Relies on slice() being safe if depth > length
};
renderer.draw_fantasy_from_moves = function(moves) {
@@ -1136,7 +1130,7 @@ function NewRenderer() {
this.leela_should_go(),
this.node.get_board().active,
this.searchmoves,
- this.hoverdraw_line);
+ this.hoverdraw_index);
};
renderer.draw_loop = function() {