Enable Shield (#817)

## Description:
Shield needs enabling
## Please complete the following:

- [x] I have added screenshots for all UI updates
- [x] I confirm I have thoroughly tested these changes and take full
responsibility for any bugs introduced
- [x] I understand that submitting code with bugs that could have been
caught through manual testing blocks releases and new features for all
contributors

## Please put your Discord username so you can be contacted if a bug or
regression is found:

1brucben
This commit is contained in:
1brucben
2025-05-19 11:27:52 -07:00
committed by GitHub
parent 090ef8046c
commit 2cdce06244
+30 -34
View File
@@ -12,7 +12,7 @@ import { ClientID } from "../../../core/Schemas";
import { Theme } from "../../../core/configuration/Config"; import { Theme } from "../../../core/configuration/Config";
import { AllPlayers, Cell, nukeTypes } from "../../../core/game/Game"; import { AllPlayers, Cell, nukeTypes } from "../../../core/game/Game";
import { GameView, PlayerView } from "../../../core/game/GameView"; import { GameView, PlayerView } from "../../../core/game/GameView";
import { createCanvas, renderTroops } from "../../Utils"; import { createCanvas, renderNumber, renderTroops } from "../../Utils";
import { TransformHandler } from "../TransformHandler"; import { TransformHandler } from "../TransformHandler";
import { Layer } from "./Layer"; import { Layer } from "./Layer";
@@ -214,20 +214,18 @@ export class NameLayer implements Layer {
troopsDiv.style.marginTop = "-5%"; troopsDiv.style.marginTop = "-5%";
element.appendChild(troopsDiv); element.appendChild(troopsDiv);
// TODO: enable this for new meta. const shieldDiv = document.createElement("div");
shieldDiv.classList.add("player-shield");
// const shieldDiv = document.createElement("div"); shieldDiv.style.zIndex = "3";
// shieldDiv.classList.add("player-shield"); shieldDiv.style.marginTop = "-5%";
// shieldDiv.style.zIndex = "3"; shieldDiv.style.display = "flex";
// shieldDiv.style.marginTop = "-5%"; shieldDiv.style.alignItems = "center";
// shieldDiv.style.display = "flex"; shieldDiv.style.gap = "0px";
// shieldDiv.style.alignItems = "center"; shieldDiv.innerHTML = `
// shieldDiv.style.gap = "0px"; <img src="${this.shieldIconImage.src}" style="width: 16px; height: 16px;" />
// shieldDiv.innerHTML = ` <span style="color: black; font-size: 10px; margin-top: -2px;">0</span>
// <img src="${this.shieldIconImage.src}" style="width: 16px; height: 16px;" /> `;
// <span style="color: black; font-size: 10px; margin-top: -2px;">0</span> element.appendChild(shieldDiv);
// `;
// element.appendChild(shieldDiv);
// Start off invisible so it doesn't flash at 0,0 // Start off invisible so it doesn't flash at 0,0
element.style.display = "none"; element.style.display = "none";
@@ -293,25 +291,23 @@ export class NameLayer implements Layer {
troopsDiv.style.color = render.fontColor; troopsDiv.style.color = render.fontColor;
troopsDiv.textContent = renderTroops(render.player.troops()); troopsDiv.textContent = renderTroops(render.player.troops());
// TODO: enable this for new meta. const density = renderNumber(
render.player.troops() / render.player.numTilesOwned(),
// const density = renderNumber( );
// render.player.troops() / render.player.numTilesOwned(), const shieldDiv = render.element.querySelector(
// ); ".player-shield",
// const shieldDiv = render.element.querySelector( ) as HTMLDivElement;
// ".player-shield", const shieldImg = shieldDiv.querySelector("img");
// ) as HTMLDivElement; const shieldNumber = shieldDiv.querySelector("span");
// const shieldImg = shieldDiv.querySelector("img"); if (shieldImg) {
// const shieldNumber = shieldDiv.querySelector("span"); shieldImg.style.width = `${render.fontSize * 0.8}px`;
// if (shieldImg) { shieldImg.style.height = `${render.fontSize * 0.8}px`;
// 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`;
// if (shieldNumber) { shieldNumber.style.marginTop = `${-render.fontSize * 0.1}px`;
// shieldNumber.style.fontSize = `${render.fontSize * 0.6}px`; shieldNumber.textContent = density;
// shieldNumber.style.marginTop = `${-render.fontSize * 0.1}px`; }
// shieldNumber.textContent = density;
// }
// Handle icons // Handle icons
const iconsDiv = render.element.querySelector( const iconsDiv = render.element.querySelector(