pinned orders

1 files changed, 35 insertions, 20 deletions

diff --git a/test-client/visual.ts b/test-client/visual.ts
index 9a267da0..784a36a3 100644
--- a/test-client/visual.ts
+++ b/test-client/visual.ts
@@ -16,7 +16,7 @@
 
 */
 import { tr } from "./locale.ts";
-import { ItemData, MessageData, PlayerData, TileData, camera, camera_scale, canvas, ctx, data, get_interact_target, global_message, interact_active_anim, interact_possible_anim, interact_target_anim, is_lobby, items_removed, keys_down, my_id, nametag_scale_anim, players, score, server_hints, tiles } from "./main.ts";
+import { ItemData, MessageData, MessageStyle, PlayerData, TileData, camera, camera_scale, canvas, ctx, data, get_interact_target, global_message, interact_active_anim, interact_possible_anim, interact_target_anim, is_lobby, items_removed, keys_down, my_id, overlay_vis_anim, players, score, server_hints, tiles } 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";
@@ -67,16 +67,24 @@ export function draw_ingame() {
     draw_interact_target()
 
     for (const [_, player] of players)
-        if (player.message) draw_message(player.message)
+        if (player.message) draw_message(player.message, true)
 
     for (const [_, player] of players)
-        if (player.message_persist) draw_message(player.message_persist)
+        if (player.message_persist) draw_message(player.message_persist, true)
 
     for (const [_, player] of players)
         draw_player_nametag(player)
 
     for (const [_, message] of server_hints)
-        draw_message(message)
+        draw_message(message, true)
+
+    ctx.restore()
+    ctx.save()
+    ctx.translate(50, 50)
+    ctx.scale(80, 80)
+
+    for (const [_, player] of players)
+        if (player.message_pinned) draw_message(player.message_pinned, false)
 
     ctx.restore()
 
@@ -143,13 +151,13 @@ function draw_player(player: PlayerData) {
 }
 
 function draw_player_nametag(player: PlayerData) {
-    if (nametag_scale_anim > 0.01) {
+    if (overlay_vis_anim > 0.01) {
         ctx.save()
         ctx.translate(player.anim_position.x, player.anim_position.y)
         ctx.translate(0, -1)
         ctx.textAlign = "center"
         ctx.font = "15px sans-serif"
-        ctx.scale(nametag_scale_anim / camera_scale, nametag_scale_anim / camera_scale)
+        ctx.scale(overlay_vis_anim / camera_scale, overlay_vis_anim / camera_scale)
         const w = ctx.measureText(player.name).width + 20
         ctx.fillStyle = "#fffa"
         ctx.beginPath()
@@ -221,20 +229,27 @@ function message_str(m: Message): string {
     return "[unknown message type]"
 }
 
-const MESSAGE_BG = { "normal": "#fff", "hint": "#111", "error": "#fff" }
-const MESSAGE_FG = { "normal": "#000", "hint": "#fff", "error": "#a00" }
-function draw_message(m: MessageData, server?: boolean) {
+const MESSAGE_BG: { [key in MessageStyle]: string } = { normal: "#fff", hint: "#111", error: "#fff", pinned: "rgb(4, 32, 0)" }
+const MESSAGE_FG: { [key in MessageStyle]: string } = { normal: "#000", hint: "#fff", error: "#a00", pinned: "#000" }
+function draw_message(m: MessageData, world: boolean) {
     ctx.save()
     ctx.translate(m.anim_position.x, m.anim_position.y)
-    const scale = Math.min(m.anim_size, 1 - nametag_scale_anim);
+    const scale = Math.min(m.anim_size, 1 - overlay_vis_anim);
     ctx.scale(scale, scale)
     if ("item" in m.inner) {
-        ctx.fillStyle = "#fffa"
-        ctx.beginPath()
-        ctx.moveTo(0, -0.3)
-        ctx.arc(0, -1, 0.5, Math.PI / 4, Math.PI - Math.PI / 4, true)
-        ctx.closePath()
-        ctx.fill()
+        ctx.fillStyle = MESSAGE_BG[m.style]
+        if (m.style == "pinned") {
+            ctx.translate(0, 1)
+            ctx.beginPath()
+            ctx.arc(0, -1, 0.5, 0, Math.PI * 2)
+            ctx.fill()
+        } else {
+            ctx.beginPath()
+            ctx.moveTo(0, -0.3)
+            ctx.arc(0, -1, 0.5, Math.PI / 4, Math.PI - Math.PI / 4, true)
+            ctx.closePath()
+            ctx.fill()
+        }
 
         if (m.timeout) {
             const t = m.timeout.remaining / m.timeout.initial;
@@ -253,13 +268,13 @@ function draw_message(m: MessageData, server?: boolean) {
         ctx.translate(0, -1)
 
         ctx.textAlign = "center"
-        ctx.font = "15px " + (server ? "monospace" : "sans-serif")
-        if (!server) ctx.scale(2 / camera_scale, 2 / camera_scale)
+        ctx.font = "15px " + (world ? "sans-serif" : "monospace")
+        if (world) ctx.scale(2 / camera_scale, 2 / camera_scale)
 
         const lines = message_str(m.inner).split("\n")
         const w = lines.reduce((a, v) => Math.max(a, ctx.measureText(v).width), 0) + 10
 
-        if (!server) ctx.translate(0, -lines.length * 15 / 2)
+        if (world) ctx.translate(0, -lines.length * 15 / 2)
 
         ctx.fillStyle = MESSAGE_BG[m.style]
         ctx.beginPath()
@@ -282,7 +297,7 @@ function draw_global_message() {
     ctx.save()
     ctx.translate(canvas.width / 2, canvas.height / 6)
     ctx.scale(2, 2)
-    draw_message(global_message, true)
+    draw_message(global_message, false)
     ctx.restore()
 }