Visual changes, fix solution not being optimal when one move away

euler-golf/index.html

@@ -51,7 +51,7 @@
             <li>
               The inital point that you rotate around is the origin (blue).
             </li>
-            <li>You must navigate to the target point (green).</li>
+            <li>You must navigate to the target point (white).</li>
           </ul>
           <p>
             Initial game by

euler-golf/js/game.js

@@ -46,7 +46,7 @@ CanvasRenderingContext2D.prototype.draw_cartesian_path = function (
   grid_spec,
   cartesian_path,
   width = 2,
-  color = "#000"
+  color = "#fff"
 ) {
   const path = cartesian_path.map((coord) => grid_to_canvas(coord, grid_spec));
   path.slice(1).forEach((coord, i) => {
@@ -168,7 +168,7 @@ const render = ({ width, height, ctx, rows, cols, target } = state) => {
       move(prev, curr, new cx(0, state.angle.im < 0 ? -1 : 1)),
     ].map((c) => grid_to_canvas(complex_to_grid(c, rows, cols), grid_spec));
 
-    ctx.line(a, b, 6, "#aaa");
+    ctx.line(a, b, 6, "rgba(127, 127, 127, 0.3)");
   }
 
   const grid_target = complex_to_grid(target, rows, cols);
@@ -182,7 +182,7 @@ const render = ({ width, height, ctx, rows, cols, target } = state) => {
     } else if (x == grid_target.x && y == grid_target.y) {
       return {
         radius: 8,
-        color: "#00ff00",
+        color: "#fff",
       };
     } else {
       return {

euler-golf/js/sol.js

@@ -16,9 +16,14 @@ const backtrack = (local_index, depth) =>
     .map((direction) => (Number(direction) ? "+" : "-"));
 
 const sol = (target, start_from = new cx(0, 0), start_to = new cx(1, 0)) => {
-  let moves = [start_to, ...construct_moves(start_from, start_to)];
-  let curr_depth = 2;
+  const next_moves = construct_moves(start_from, start_to);
+  const solved_in_first_move = next_moves.findIndex((move) =>
+    cx.eq(move, target)
+  );
+  if (solved_in_first_move != -1) return backtrack(solved_in_first_move, 1);
 
+  let moves = [start_to, ...next_moves];
+  let curr_depth = 2;
   while (curr_depth < DEPTH) {
     for (let i = 0; i < Math.pow(2, curr_depth); i++) {
       const direction = DIRECTION[Number(i.toString(2).at(-1))];