weyne/DCSOlympus
1
0
Fork 0
mirror of https://github.com/Pax1601/DCSOlympus.git synced 2025-10-29 16:56:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: better color management of unit markers

Browse Source
This commit is contained in:
Davide Passoni 2025-01-23 12:54:20 +01:00
parent b711872d6c
commit 6074367300
2 changed files with 30 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
frontend/react/src/map/markers/stylesheets/units.css
View File

@ -143,6 +143,13 @@
fill: white !important;
}
[data-is-selected][data-coalition="blue"] .unit-icon svg > *:first-child {
stroke: var(--unit-background-blue);
}
[data-is-selected][data-coalition="red"] .unit-icon svg > *:first-child {
stroke: var(--unit-background-red);
}
[data-is-highlighted] .unit-icon svg > *:first-child {
stroke: white;
}
@ -414,6 +421,10 @@
color: var(--secondary-blue-text);
}
[data-object|="unit"][data-coalition="blue"][data-is-selected] path {
fill: var(--secondary-blue-text);
}
[data-object|="unit"][data-coalition="blue"] .unit-fuel-level,
[data-object|="unit"][data-coalition="blue"] .unit-health-level,
[data-object|="unit"][data-coalition="blue"][data-has-fox-1] .unit-ammo > div:nth-child(1),
@ -431,6 +442,10 @@
color: var(--secondary-red-text);
}
[data-object|="unit"][data-coalition="red"][data-is-selected] path {
fill: var(--secondary-red-text);
}
[data-object|="unit"][data-coalition="red"] .unit-fuel-level,
[data-object|="unit"][data-coalition="red"] .unit-health-level,
[data-object|="unit"][data-coalition="red"][data-has-fox-1] .unit-ammo > div:nth-child(1),

23
frontend/react/src/unit/unit.ts
View File

@ -45,6 +45,7 @@ import {
SHORT_PRESS_MILLISECONDS,
TRAIL_LENGTH,
colors,
UnitState,
} from "../constants/constants";
import { DataExtractor } from "../server/dataextractor";
import { Weapon } from "../weapon/weapon";
@ -425,7 +426,6 @@ export abstract class Unit extends CustomMarker {
var updateMarker = !getApp().getMap().hasLayer(this) && this.getAlive();
var oldIsLeader = this.#isLeader;
var oldOperateAs = this.#operateAs;
var datumIndex = 0;
while (datumIndex != DataIndexes.endOfData) {
datumIndex = dataExtractor.extractUInt8();
@ -591,7 +591,7 @@ export abstract class Unit extends CustomMarker {
if (updateMarker) this.#updateMarker();
/* Redraw the marker if isLeader has changed. TODO I don't love this approach, observables may be more elegant */
if (oldIsLeader !== this.#isLeader || oldOperateAs !== this.#operateAs) {
if (oldIsLeader !== this.#isLeader) {
this.#redrawMarker();
/* Reapply selection */
@ -885,8 +885,7 @@ export abstract class Unit extends CustomMarker {
el.classList.add("unit");
el.setAttribute("data-object", `unit-${this.getMarkerCategory()}`);
el.setAttribute("data-coalition", this.#coalition);
el.setAttribute("data-operate-as", this.#operateAs);
var iconOptions = this.getIconOptions();
/* Generate and append elements depending on active options */
@ -919,7 +918,7 @@ export abstract class Unit extends CustomMarker {
if (this.belongsToCommandedCoalition() || this.getDetectionMethods().some((value) => [VISUAL, OPTIC].includes(value)))
marker = this.getBlueprint()?.markerFile ?? this.getDefaultMarker();
else marker = "aircraft";
img.src = `./images/units/map/${/*TODO getApp().getMap().getOptions().AWACSMode ? "awacs" : */"normal"}/${this.getCoalition()}/${marker}.svg`;
img.src = `./images/units/map/${/*TODO getApp().getMap().getOptions().AWACSMode ? "awacs" : */ "normal"}/${this.getCoalition()}/${marker}.svg`;
img.onload = () => SVGInjector(img);
unitIcon.appendChild(img);
@ -1560,6 +1559,14 @@ export abstract class Unit extends CustomMarker {
const BRAA = `${computeBearingRangeString(reference.getPosition(), this.getPosition())}`;
if (element.querySelector(".unit-braa")) (<HTMLElement>element.querySelector(".unit-braa")).innerText = `${BRAA}`;
} else if (element.querySelector(".unit-braa")) (<HTMLElement>element.querySelector(".unit-braa")).innerText = ``;
/* Set operate as */
element.querySelector(".unit")?.setAttribute(
"data-operate-as",
this.getState() === UnitState.MISS_ON_PURPOSE || this.getState() === UnitState.SCENIC_AAA || this.getState() === UnitState.SIMULATE_FIRE_FIGHT
? this.#operateAs
: "neutral"
);
}
/* Set vertical offset for altitude stacking */
@ -1868,7 +1875,7 @@ export abstract class AirUnit extends Unit {
showFuel: belongsToCommandedCoalition,
showAmmo: belongsToCommandedCoalition,
showSummary: belongsToCommandedCoalition || this.getDetectionMethods().some((value) => [VISUAL, OPTIC, RADAR, IRST, DLINK].includes(value)),
showCallsign: belongsToCommandedCoalition && (/*TODO !getApp().getMap().getOptions().AWACSMode || */ this.getHuman()),
showCallsign: belongsToCommandedCoalition && /*TODO !getApp().getMap().getOptions().AWACSMode || */ this.getHuman(),
rotateToHeading: false,
} as ObjectIconOptions;
}
@ -1955,7 +1962,7 @@ export class GroundUnit extends Unit {
showFuel: false,
showAmmo: false,
showSummary: false,
showCallsign: belongsToCommandedCoalition && (/*TODO !getApp().getMap().getOptions().AWACSMode || */ this.getHuman()),
showCallsign: belongsToCommandedCoalition && /*TODO !getApp().getMap().getOptions().AWACSMode || */ this.getHuman(),
rotateToHeading: false,
} as ObjectIconOptions;
}
@ -2020,7 +2027,7 @@ export class NavyUnit extends Unit {
showFuel: false,
showAmmo: false,
showSummary: false,
showCallsign: belongsToCommandedCoalition && (/*TODO !getApp().getMap().getOptions().AWACSMode || */ this.getHuman()),
showCallsign: belongsToCommandedCoalition && /*TODO !getApp().getMap().getOptions().AWACSMode || */ this.getHuman(),
rotateToHeading: false,
} as ObjectIconOptions;
}