diff --git a/src/client/graphics/layers/NameLayer.ts b/src/client/graphics/layers/NameLayer.ts
index 3b752904e..58c49fff2 100644
--- a/src/client/graphics/layers/NameLayer.ts
+++ b/src/client/graphics/layers/NameLayer.ts
@@ -12,7 +12,7 @@ import { ClientID } from "../../../core/Schemas";
import { Theme } from "../../../core/configuration/Config";
import { AllPlayers, Cell, nukeTypes } from "../../../core/game/Game";
import { GameView, PlayerView } from "../../../core/game/GameView";
-import { createCanvas, renderTroops } from "../../Utils";
+import { createCanvas, renderNumber, renderTroops } from "../../Utils";
import { TransformHandler } from "../TransformHandler";
import { Layer } from "./Layer";
@@ -214,20 +214,18 @@ export class NameLayer implements Layer {
troopsDiv.style.marginTop = "-5%";
element.appendChild(troopsDiv);
- // TODO: enable this for new meta.
-
- // const shieldDiv = document.createElement("div");
- // shieldDiv.classList.add("player-shield");
- // shieldDiv.style.zIndex = "3";
- // shieldDiv.style.marginTop = "-5%";
- // shieldDiv.style.display = "flex";
- // shieldDiv.style.alignItems = "center";
- // shieldDiv.style.gap = "0px";
- // shieldDiv.innerHTML = `
- //
- // 0
- // `;
- // element.appendChild(shieldDiv);
+ const shieldDiv = document.createElement("div");
+ shieldDiv.classList.add("player-shield");
+ shieldDiv.style.zIndex = "3";
+ shieldDiv.style.marginTop = "-5%";
+ shieldDiv.style.display = "flex";
+ shieldDiv.style.alignItems = "center";
+ shieldDiv.style.gap = "0px";
+ shieldDiv.innerHTML = `
+
+ 0
+ `;
+ element.appendChild(shieldDiv);
// Start off invisible so it doesn't flash at 0,0
element.style.display = "none";
@@ -293,25 +291,23 @@ export class NameLayer implements Layer {
troopsDiv.style.color = render.fontColor;
troopsDiv.textContent = renderTroops(render.player.troops());
- // TODO: enable this for new meta.
-
- // const density = renderNumber(
- // render.player.troops() / render.player.numTilesOwned(),
- // );
- // const shieldDiv = render.element.querySelector(
- // ".player-shield",
- // ) as HTMLDivElement;
- // const shieldImg = shieldDiv.querySelector("img");
- // const shieldNumber = shieldDiv.querySelector("span");
- // if (shieldImg) {
- // shieldImg.style.width = `${render.fontSize * 0.8}px`;
- // shieldImg.style.height = `${render.fontSize * 0.8}px`;
- // }
- // if (shieldNumber) {
- // shieldNumber.style.fontSize = `${render.fontSize * 0.6}px`;
- // shieldNumber.style.marginTop = `${-render.fontSize * 0.1}px`;
- // shieldNumber.textContent = density;
- // }
+ const density = renderNumber(
+ render.player.troops() / render.player.numTilesOwned(),
+ );
+ const shieldDiv = render.element.querySelector(
+ ".player-shield",
+ ) as HTMLDivElement;
+ const shieldImg = shieldDiv.querySelector("img");
+ const shieldNumber = shieldDiv.querySelector("span");
+ if (shieldImg) {
+ shieldImg.style.width = `${render.fontSize * 0.8}px`;
+ shieldImg.style.height = `${render.fontSize * 0.8}px`;
+ }
+ if (shieldNumber) {
+ shieldNumber.style.fontSize = `${render.fontSize * 0.6}px`;
+ shieldNumber.style.marginTop = `${-render.fontSize * 0.1}px`;
+ shieldNumber.textContent = density;
+ }
// Handle icons
const iconsDiv = render.element.querySelector(