mirror of
https://github.com/openfrontio/OpenFrontIO.git
synced 2026-08-05 08:17:03 +00:00
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:
@@ -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(
|
||||||
|
|||||||
Reference in New Issue
Block a user