1 files changed, 14 insertions, 24 deletions
diff --git a/test-client/visual.ts b/test-client/visual.ts
index ece31b8b..d63bee03 100644
--- a/test-client/visual.ts
+++ b/test-client/visual.ts
@@ -221,7 +221,7 @@ function message_str(m: Message): string {
     return "[unknown message type]"
 }
 
-function draw_message(m: MessageData) {
+function draw_message(m: MessageData, server?: boolean) {
     ctx.save()
     ctx.translate(m.anim_position.x, m.anim_position.y)
     const scale = Math.min(m.anim_size, 1 - nametag_scale_anim);
@@ -251,20 +251,24 @@ function draw_message(m: MessageData) {
         ctx.translate(0, -1)
 
         ctx.textAlign = "center"
-        ctx.font = "15px sans-serif"
-        ctx.scale(2 / camera_scale, 2 / camera_scale)
+        ctx.font = "15px " + (server ? "monospace" : "sans-serif")
+        if (!server) 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
 
-        const text = message_str(m.inner);
-        const w = ctx.measureText(text).width + 30
+        if (!server) ctx.translate(0, -lines.length * 15 / 2)
 
         ctx.fillStyle = "#fffa"
         ctx.beginPath()
-        ctx.roundRect(-w / 2, -15, w, 30, 5)
+        ctx.roundRect(-w / 2, -5, w, lines.length * 15 + 10, 5)
         ctx.fill()
 
         ctx.fillStyle = "black"
-        ctx.textBaseline = "middle"
-        ctx.fillText(text, 0, 0)
+        ctx.textAlign = "left"
+        ctx.textBaseline = "top"
+        for (let i = 0; i < lines.length; i++)
+            ctx.fillText(lines[i], -w / 2 + 5, i * 15)
 
         ctx.translate(0, 1)
     }
@@ -275,22 +279,8 @@ function draw_global_message() {
     if (!global_message) return
     ctx.save()
     ctx.translate(canvas.width / 2, canvas.height / 6)
-    if ("text" in global_message.inner) {
-        ctx.font = "20px monospace"
-        const lines = global_message.inner.text.split("\n")
-        const w = lines.reduce((a, v) => Math.max(a, ctx.measureText(v).width), 0) + 20
-
-        ctx.fillStyle = "#fffa"
-        ctx.beginPath()
-        ctx.roundRect(-w / 2, -20, w, lines.length * 25 + 20, 5)
-        ctx.fill()
-
-        ctx.fillStyle = "black"
-        ctx.textAlign = "left"
-        ctx.textBaseline = "middle"
-        for (let i = 0; i < lines.length; i++)
-            ctx.fillText(lines[i], -w / 2 + 10, i * 25)
-    }
+    ctx.scale(2, 2)
+    draw_message(global_message, true)
     ctx.restore()
 }