Multiple fixes

Refactored classes
Fixed visibility of dead units
Changed visibility handling
Refactored unitDatabase class
This commit is contained in:
Pax1601
2023-03-24 16:18:25 +01:00
parent 1e8c9ed401
commit a5ee5b0ad5
22 changed files with 498 additions and 504 deletions

View File

@@ -3,23 +3,24 @@ import { Slider } from "../controls/slider";
import { aircraftDatabase } from "../units/aircraftdatabase";
import { groundUnitsDatabase } from "../units/groundunitsdatabase";
import { Aircraft, GroundUnit, Unit } from "../units/unit";
import { UnitDatabase } from "../units/unitdatabase";
import { UnitsManager } from "../units/unitsmanager";
import { Panel } from "./panel";
const ROEs: string[] = ["Free", "Designated free", "Designated", "Return", "Hold"];
const reactionsToThreat: string[] = [ "None", "Passive", "Evade", "Escape", "Abort"];
const minSpeedValues: {[key: string]: number} = {Aircraft: 100, Helicopter: 0, NavyUnit: 0, GroundUnit: 0};
const maxSpeedValues: {[key: string]: number} = {Aircraft: 800, Helicopter: 300, NavyUnit: 60, GroundUnit: 60};
const speedIncrements: {[key: string]: number} = {Aircraft: 25, Helicopter: 10, NavyUnit: 5, GroundUnit: 5};
const minAltitudeValues: {[key: string]: number} = {Aircraft: 0, Helicopter: 0};
const maxAltitudeValues: {[key: string]: number} = {Aircraft: 50000, Helicopter: 10000};
const altitudeIncrements: {[key: string]: number} = {Aircraft: 2500, Helicopter: 1000};
const reactionsToThreat: string[] = ["None", "Passive", "Evade", "Escape", "Abort"];
const minSpeedValues: { [key: string]: number } = { Aircraft: 100, Helicopter: 0, NavyUnit: 0, GroundUnit: 0 };
const maxSpeedValues: { [key: string]: number } = { Aircraft: 800, Helicopter: 300, NavyUnit: 60, GroundUnit: 60 };
const speedIncrements: { [key: string]: number } = { Aircraft: 25, Helicopter: 10, NavyUnit: 5, GroundUnit: 5 };
const minAltitudeValues: { [key: string]: number } = { Aircraft: 0, Helicopter: 0 };
const maxAltitudeValues: { [key: string]: number } = { Aircraft: 50000, Helicopter: 10000 };
const altitudeIncrements: { [key: string]: number } = { Aircraft: 2500, Helicopter: 1000 };
export class UnitControlPanel extends Panel {
#altitudeSlider: Slider;
#airspeedSlider: Slider;
#optionButtons: {[key: string]: HTMLButtonElement[]} = {}
#optionButtons: { [key: string]: HTMLButtonElement[] } = {}
constructor(ID: string) {
super(ID);
@@ -28,87 +29,66 @@ export class UnitControlPanel extends Panel {
this.#airspeedSlider = new Slider("airspeed-slider", 0, 100, "kts", (value: number) => getUnitsManager().selectedUnitsSetSpeed(value / 1.94384));
/* Option buttons */
this.#optionButtons["ROE"] = ROEs.map((option: string, index:number) => {
this.#optionButtons["ROE"] = ROEs.map((option: string, index: number) => {
var button = document.createElement("button");
button.title = option;
button.value = option;
button.addEventListener("click", () => {getUnitsManager().selectedUnitsSetROE(button.title);});
button.addEventListener("click", () => { getUnitsManager().selectedUnitsSetROE(button.title); });
return button;
});
this.#optionButtons["reactionToThreat"] = reactionsToThreat.map((option: string, index:number) => {
this.#optionButtons["reactionToThreat"] = reactionsToThreat.map((option: string, index: number) => {
var button = document.createElement("button");
button.title = option;
button.value = option;
button.addEventListener("click", () => {getUnitsManager().selectedUnitsSetReactionToThreat(button.title);});
button.addEventListener("click", () => { getUnitsManager().selectedUnitsSetReactionToThreat(button.title); });
return button;
});
this.getElement().querySelector("#roe-buttons-container")?.append(...this.#optionButtons["ROE"]);
this.getElement().querySelector("#reaction-to-threat-buttons-container")?.append(...this.#optionButtons["reactionToThreat"]);
document.addEventListener("unitUpdated", (e: CustomEvent<Unit>) => {if (e.detail.getSelected()) this.update()});
document.addEventListener("unitsSelection", (e: CustomEvent<Unit[]>) => {this.show(); this.update()});
document.addEventListener("clearSelection", () => {this.hide()});
document.addEventListener("unitUpdated", (e: CustomEvent<Unit>) => { if (e.detail.getSelected()) this.update() });
document.addEventListener("unitsSelection", (e: CustomEvent<Unit[]>) => { this.show(); this.update() });
document.addEventListener("clearSelection", () => { this.hide() });
this.hide();
}
update() {
var units = getUnitsManager().getSelectedUnits();
if (this.getElement() != null && units.length > 0)
{
if (this.getElement() != null && units.length > 0) {
this.#showFlightControlSliders(units);
this.getElement().querySelector("#selected-units-container")?.replaceChildren(...units.map((unit: Unit, index:number) =>
{
const baseData = unit.getBaseData();
this.getElement().querySelector("#selected-units-container")?.replaceChildren(...units.map((unit: Unit, index: number) => {
let database: UnitDatabase | null;
if (unit instanceof Aircraft)
database = aircraftDatabase;
else if (unit instanceof GroundUnit)
database = groundUnitsDatabase;
else
database = null; // TODO add databases for other unit types
if ( index === 0 ) {
this.getElement().querySelectorAll(`[data-object|="unit"]`).forEach( marker => {
marker.setAttribute( "data-coalition", unit.getMissionData().coalition );
const shortLabel = <HTMLElement>marker.querySelector( ".unit-short-label" );
if ( shortLabel ) {
shortLabel.innerText = aircraftDatabase.getShortLabelByName( baseData.name );
}
if (index === 0) {
this.getElement().querySelectorAll(`[data-object|="unit"]`).forEach(marker => {
marker.setAttribute("data-coalition", unit.getMissionData().coalition);
const shortLabel = <HTMLElement>marker.querySelector(".unit-short-label");
if (shortLabel)
shortLabel.innerText = database?.getByName(unit.getBaseData().name)?.shortLabel || "";
});
}
var button = document.createElement("button");
const unitName = <HTMLInputElement>this.getElement().querySelector("#unit-name");
var callsign = aircraftDatabase.getByName(unit.getBaseData().unitName)?.label || "";
let callsign;
button.innerText = "";
button.setAttribute("data-short-label", database?.getByName(unit.getBaseData().name)?.shortLabel || "");
button.setAttribute("data-callsign", callsign);
unitName.value = callsign;
const unitName = <HTMLInputElement>this.getElement().querySelector( "#unit-name" );
if (unit instanceof Aircraft) {
button.innerText = "";
button.setAttribute( "data-short-label", aircraftDatabase.getLabelByName( baseData.name ) );
callsign = aircraftDatabase.getLabelByName( baseData.unitName );
button.setAttribute( "data-callsign", callsign );
unitName.value = callsign;
} else if (unit instanceof GroundUnit) {
button.setAttribute( "data-short-label", groundUnitsDatabase.getShortLabelByName(baseData.name));
callsign = aircraftDatabase.getLabelByName( baseData.unitName ) || "";
button.setAttribute( "data-callsign", groundUnitsDatabase.getLabelByName( baseData.unitName ) );
unitName.value = callsign;
} else {
button.setAttribute( "data-short-label", "");
button.setAttribute( "data-callsign", "" );
}
button.setAttribute( "data-coalition", unit.getMissionData().coalition );
button.classList.add( "pill", "highlight-coalition" )
button.setAttribute("data-coalition", unit.getMissionData().coalition);
button.classList.add("pill", "highlight-coalition")
button.addEventListener("click", () => getUnitsManager().selectUnit(unit.ID, true));
return (button);
@@ -116,16 +96,15 @@ export class UnitControlPanel extends Panel {
this.#optionButtons["ROE"].forEach((button: HTMLButtonElement) => {
button.classList.toggle("selected", units.every((unit: Unit) => unit.getOptionsData().ROE === button.value))
});
});
this.#optionButtons["reactionToThreat"].forEach((button: HTMLButtonElement) => {
button.classList.toggle("selected", units.every((unit: Unit) => unit.getOptionsData().reactionToThreat === button.value))
});
});
}
}
#showFlightControlSliders(units: Unit[])
{
#showFlightControlSliders(units: Unit[]) {
this.#airspeedSlider.show();
this.#altitudeSlider.show();
@@ -133,8 +112,7 @@ export class UnitControlPanel extends Panel {
var targetAltitude = getUnitsManager().getSelectedUnitsTargetAltitude();
var targetSpeed = getUnitsManager().getSelectedUnitsTargetSpeed();
if (unitsType != undefined)
{
if (unitsType != undefined) {
if (["GroundUnit", "NavyUnit"].includes(unitsType))
this.#altitudeSlider.hide()

View File

@@ -54,7 +54,7 @@ export class UnitInfoPanel extends Panel {
const baseData = unit.getBaseData();
/* Set the unit info */
this.#unitLabel.innerText = aircraftDatabase.getLabelByName( baseData.name );
this.#unitLabel.innerText = aircraftDatabase.getByName(baseData.name)?.label || "";
this.#unitName.innerText = baseData.unitName;
this.#unitControl.innerText = ( ( baseData.AI ) ? "AI" : "Human" ) + " controlled";
// this.#groupName.innerText = baseData.groupName;