add hint-based tutorial for item crafting

1 files changed, 14 insertions, 7 deletions

diff --git a/test-client/visual.ts b/test-client/visual.ts
index 4c0a8ecc..09b6ec85 100644
--- a/test-client/visual.ts
+++ b/test-client/visual.ts
@@ -15,7 +15,7 @@
     along with this program.  If not, see <https://www.gnu.org/licenses/>.
 
 */
-import { ItemData, MessageData, PlayerData, TileData, camera, camera_scale, canvas, ctx, data, demands_completed, demands_failed, get_interact_target, global_message, interact_active_anim, interact_possible_anim, interact_target_anim, items_removed, keys_down, my_id, nametag_scale_anim, players, points, tiles, time_remaining } from "./main.ts";
+import { ItemData, MessageData, PlayerData, TileData, camera, camera_scale, canvas, ctx, data, demands_completed, demands_failed, get_interact_target, global_message, interact_active_anim, interact_possible_anim, interact_target_anim, items_removed, keys_down, my_id, nametag_scale_anim, players, points, server_hints, tiles, time_remaining } from "./main.ts";
 import { PLAYER_SIZE } from "./movement.ts";
 import { draw_item_sprite, draw_tile_sprite, ItemName, TileName } from "./tiles.ts";
 import { V2, ceil_v2, floor_v2 } from "./util.ts";
@@ -71,9 +71,14 @@ export function draw_ingame() {
         if (player.message_persist) draw_message(player.message_persist)
     }
 
+    // Draw nametags
     for (const [_, player] of players)
         draw_player_nametag(player)
 
+    // Draw server hints
+    for (const [_, message] of server_hints)
+        draw_message(message)
+
     // Draw interact target
     draw_interact_target()
 
@@ -221,12 +226,14 @@ function draw_message(m: MessageData) {
         ctx.closePath()
         ctx.fill()
 
-        const t = m.timeout.remaining / m.timeout.initial;
-        ctx.beginPath()
-        ctx.strokeStyle = `hsl(${Math.sqrt(t) * 0.3}turn, 100%, 50%)`
-        ctx.lineWidth = 0.1
-        ctx.arc(0, -1, 0.45, -Math.PI / 2, -Math.PI / 2 + Math.PI * 2 * (1 - t))
-        ctx.stroke()
+        if (m.timeout) {
+            const t = m.timeout.remaining / m.timeout.initial;
+            ctx.beginPath()
+            ctx.strokeStyle = `hsl(${Math.sqrt(t) * 0.3}turn, 100%, 50%)`
+            ctx.lineWidth = 0.1
+            ctx.arc(0, -1, 0.45, -Math.PI / 2, -Math.PI / 2 + Math.PI * 2 * (1 - t))
+            ctx.stroke()
+        }
 
         ctx.translate(0, -1)
         draw_item_sprite(ctx, data.item_names[m.inner.item] as ItemName)