Winrate Graph now shows the centipawn value as a hover annotation when you move the mouse

[yuzisee]

Component

Winrate Graph

Implemented in this PR

When hovering the mouse inside the winrate graph, show the move token & eval value of the move you are hovering over.

• Purpose:
  1. This makes it easier for users to pinpoint a specific move that they want to jump to, when hovering over the winrate graph with their mouse.
  2. This makes it easier to quickly scan for the specific eval value
• Changes:
  • Adds last_hover_node as state to the Grapher in files/src/renderer/55_winrate_graph.js
  • When hovering over the winrate graph, save last_hover_node
  • During grapher.draw_everything call draw_hover_annotation to show token + eval of the last hovered node.
  • Adds is_inside_graph_canvas to check when the mouse leaves the graph canvas, at which point we clear last_hover_node so that the hover annotation is no longer drawn.

Testing

When hovering a move that has an eval:

When hovering a move that doesn't have an eval:

[rooklift]

Thanks. Nibbler isn't really maintained right now, the codebase is too complicated and really should be rewritten - so I don't promise to get to this any time very soon.

[yuzisee]

Understood. FWIW I've been running this locally for my own use, and it works well for me.

[yuzisee]

Fixed a couple rendering bugs in 27edd29 should be good to go now.

[yuzisee]

Converting to draft until #244 is resolved, since the hover depends on the graph data structures.

[yuzisee]

Updated to match #244

---

September 25, 2023:

• Tested working
• Screenshots updated above

[yuzisee]

Leaving this as a draft for now, in favor of #249 first (which is simpler).

This branch remains working in case someone wants to try it out, but otherwise I'll revisit & rebase this current pull request only if #249 is accepted into master.