Merge pull request #119 from Pax1601/91-spawn-from-airbase-not-working

Added spawn from airbase code
This commit is contained in:
Pax1601 2023-03-22 17:18:04 +01:00 committed by GitHub
commit 01852518b7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 107 additions and 138 deletions

View File

@ -1,4 +1,4 @@
#unit-data-table {
#unit-list {
display:flex;
flex-direction: column;
font-size:13px;
@ -6,22 +6,22 @@
width:fit-content;
}
#unit-data-table > div {
#unit-list > div {
display:flex;
flex-direction: row;
flex-wrap: nowrap;
}
#unit-data-table > div > div {
#unit-list > div > div {
text-overflow: ellipsis;
white-space: nowrap;
width:100px;
}
#unit-data-table > div:first-of-type {
#unit-list > div:first-of-type {
text-align: center;
}
#unit-data-table > div > div:nth-of-type( 4 ) {
#unit-list > div > div:nth-of-type( 4 ) {
text-align: center;
}

View File

@ -72,6 +72,8 @@ export class AirbaseContextMenu extends ContextMenu {
getMap().showMapContextMenu({originalEvent: {x: this.getX(), y: this.getY(), latlng: this.getLatLng()}});
getMap().getMapContextMenu().hideUpperBar();
getMap().getMapContextMenu().showSubMenu("aircraft");
getMap().getMapContextMenu().setAirbaseName(this.#airbase.getName());
getMap().getMapContextMenu().setLatLng(this.#airbase.getLatLng());
}
}
}

View File

@ -55,6 +55,7 @@ export class MapContextMenu extends ContextMenu {
}
show(x: number, y: number, latlng: LatLng) {
this.#spawnOptions = {role: "", type: "", latlng: new LatLng(0, 0), loadout: null, coalition: "blue", airbaseName: null};
super.show(x, y, latlng);
this.#spawnOptions.latlng = latlng;
this.showUpperBar();
@ -83,6 +84,16 @@ export class MapContextMenu extends ContextMenu {
this.getContainer()?.querySelector("#upper-bar")?.classList.toggle("hide", true);
}
setAirbaseName(airbaseName: string)
{
this.#spawnOptions.airbaseName = airbaseName;
}
setLatLng(latlng: LatLng)
{
this.#spawnOptions.latlng = latlng;
}
#onSwitch(e: any) {
if (this.getContainer() != null) {
if (e.srcElement.checked)
@ -95,13 +106,10 @@ export class MapContextMenu extends ContextMenu {
/********* Aircraft spawn menu *********/
#setAircraftRole(role: string)
{
if (this.#spawnOptions != null)
{
this.#spawnOptions.role = role;
this.#resetAircraftRole();
this.#aircraftTypeDropdown.setOptions(aircraftDatabase.getLabelsByRole(role));
this.#aircraftTypeDropdown.selectValue(0);
}
this.#spawnOptions.role = role;
this.#resetAircraftRole();
this.#aircraftTypeDropdown.setOptions(aircraftDatabase.getLabelsByRole(role));
this.#aircraftTypeDropdown.selectValue(0);
this.clip();
}
@ -116,20 +124,18 @@ export class MapContextMenu extends ContextMenu {
#setAircraftType(label: string)
{
if (this.#spawnOptions != null)
this.#resetAircraftType();
var type = aircraftDatabase.getNameByLabel(label);
if (type != null)
{
this.#resetAircraftType();
var type = aircraftDatabase.getNameByLabel(label);
if (type != null)
{
this.#spawnOptions.type = type;
this.#aircraftLoadoutDropdown.setOptions(aircraftDatabase.getLoadoutNamesByRole(type, this.#spawnOptions.role));
this.#aircraftLoadoutDropdown.selectValue(0);
var image = (<HTMLImageElement>this.getContainer()?.querySelector("#unit-image"));
image.src = `images/units/${aircraftDatabase.getByLabel(label)?.filename}`;
image.classList.toggle("hide", false);
}
this.#spawnOptions.type = type;
this.#aircraftLoadoutDropdown.setOptions(aircraftDatabase.getLoadoutNamesByRole(type, this.#spawnOptions.role));
this.#aircraftLoadoutDropdown.selectValue(0);
var image = (<HTMLImageElement>this.getContainer()?.querySelector("#unit-image"));
image.src = `images/units/${aircraftDatabase.getByLabel(label)?.filename}`;
image.classList.toggle("hide", false);
}
this.clip();
}
@ -143,23 +149,20 @@ export class MapContextMenu extends ContextMenu {
#setAircraftLoadout(loadoutName: string)
{
if (this.#spawnOptions != null)
var loadout = aircraftDatabase.getLoadoutsByName(this.#spawnOptions.type, loadoutName);
if (loadout)
{
var loadout = aircraftDatabase.getLoadoutsByName(this.#spawnOptions.type, loadoutName);
if (loadout)
{
this.#spawnOptions.loadout = loadout.code;
(<HTMLButtonElement>this.getContainer()?.querySelector("#aircraft-spawn-menu")?.querySelector(".deploy-unit-button")).disabled = false;
var items = loadout.items.map((item: any) => {return `${item.quantity}x ${item.name}`;});
items.length == 0? items.push("Empty loadout"): "";
(<HTMLButtonElement>this.getContainer()?.querySelector("#loadout-list")).replaceChildren(
...items.map((item: any) => {
var div = document.createElement('div');
div.innerText = item;
return div;
})
)
}
this.#spawnOptions.loadout = loadout.code;
(<HTMLButtonElement>this.getContainer()?.querySelector("#aircraft-spawn-menu")?.querySelector(".deploy-unit-button")).disabled = false;
var items = loadout.items.map((item: any) => {return `${item.quantity}x ${item.name}`;});
items.length == 0? items.push("Empty loadout"): "";
(<HTMLButtonElement>this.getContainer()?.querySelector("#loadout-list")).replaceChildren(
...items.map((item: any) => {
var div = document.createElement('div');
div.innerText = item;
return div;
})
)
}
this.clip();
}
@ -167,13 +170,10 @@ export class MapContextMenu extends ContextMenu {
/********* Ground unit spawn menu *********/
#setGroundUnitRole(role: string)
{
if (this.#spawnOptions != null)
{
this.#spawnOptions.role = role;
this.#resetGroundUnitRole();
this.#groundUnitTypeDropdown.setOptions(groundUnitsDatabase.getLabelsByRole(role));
this.#groundUnitTypeDropdown.selectValue(0);
}
this.#spawnOptions.role = role;
this.#resetGroundUnitRole();
this.#groundUnitTypeDropdown.setOptions(groundUnitsDatabase.getLabelsByRole(role));
this.#groundUnitTypeDropdown.selectValue(0);
this.clip();
}
@ -188,15 +188,12 @@ export class MapContextMenu extends ContextMenu {
#setGroundUnitType(label: string)
{
if (this.#spawnOptions != null)
this.#resetGroundUnitType();
var type = groundUnitsDatabase.getNameByLabel(label);
if (type != null)
{
this.#resetGroundUnitType();
var type = groundUnitsDatabase.getNameByLabel(label);
if (type != null)
{
this.#spawnOptions.type = type;
(<HTMLButtonElement>this.getContainer()?.querySelector("#ground-unit-spawn-menu")?.querySelector(".deploy-unit-button")).disabled = false;
}
this.#spawnOptions.type = type;
(<HTMLButtonElement>this.getContainer()?.querySelector("#ground-unit-spawn-menu")?.querySelector(".deploy-unit-button")).disabled = false;
}
this.clip();
}

View File

@ -30,7 +30,7 @@ var connected: boolean = false;
var activeCoalition: string = "blue";
var sessionHash: string | null = null;
var unitDataTable = new UnitDataTable();
var unitDataTable: UnitDataTable;
var featureSwitches;
@ -50,6 +50,8 @@ function setup() {
mouseInfoPanel = new MouseInfoPanel("mouse-info-panel");
//logPanel = new LogPanel("log-panel");
unitDataTable = new UnitDataTable("unit-data-table");
/* AIC */
let aicFeatureSwitch = featureSwitches.getSwitch("aic");
if (aicFeatureSwitch?.isEnabled()) {
@ -87,7 +89,6 @@ function requestUpdate() {
/* Main update rate = 250ms is minimum time, equal to server update time. */
getUnits((data: UnitsData) => {
getUnitsManager()?.update(data);
getUnitDataTable().update( data.units )
checkSessionHash(data.sessionHash);
}, false);
setTimeout(() => requestUpdate(), getConnected() ? 250 : 1000);
@ -98,9 +99,14 @@ function requestUpdate() {
function requestRefresh() {
/* Main refresh rate = 5000ms. */
getUnits((data: UnitsData) => {
getUnitsManager()?.update(data);
getAirbases((data: AirbasesData) => getMissionData()?.update(data));
getBullseyes((data: BullseyesData) => getMissionData()?.update(data));
getMission((data: any) => {getMissionData()?.update(data)});
// Update the list of existing units
getUnitDataTable()?.update();
checkSessionHash(data.sessionHash);
}, true);
setTimeout(() => requestRefresh(), 5000);
@ -152,8 +158,10 @@ function setupEvents() {
toggleDemoEnabled();
break;
case "Minus": // For Veltro's italian layout keyboard, which lacks a quote
case "Quote":
unitDataTable.toggle();
break
}
});

View File

@ -16,6 +16,14 @@ export class Panel {
this.#visible = false;
}
toggle() {
// Simple way to track if currently visible
if (this.#visible)
this.hide();
else
this.show();
}
getElement() {
return this.#element;
}

View File

@ -40,7 +40,7 @@ export class UnitControlPanel extends Panel {
var button = document.createElement("button");
button.title = option;
button.value = option;
button.addEventListener("click", () => {getUnitsManager().selectedUnitsSetROE(button.title);});
button.addEventListener("click", () => {getUnitsManager().selectedUnitsSetReactionToThreat(button.title);});
return button;
});

View File

@ -54,7 +54,7 @@ export class UnitInfoPanel extends Panel {
this.#currentTask.dataset.coalition = unit.getMissionData().coalition;
/* Add the loadout elements */
this.#loadoutContainer.replaceChildren(...unit.getMissionData().ammo.map(
this.#loadoutContainer.replaceChildren(...Object.values(unit.getMissionData().ammo).map(
(ammo: any) => {
var el = document.createElement("div");
el.classList.add("pill", "loadout-item");

View File

@ -1,103 +1,57 @@
export class UnitDataTable {
#element;
#tableId = "unit-data-table";
constructor() {
const table = document.getElementById( this.#tableId );
if ( table instanceof HTMLElement ) {
this.#element = table;
} else {
return;
}
import { getUnitsManager } from "..";
import { Panel } from "../panels/panel";
import { Unit } from "./unit";
export class UnitDataTable extends Panel {
constructor(id: string) {
super(id);
this.hide();
}
update() {
var units = getUnitsManager().getUnits();
getElement() {
return this.#element;
}
const unitsArray = Object.values(units).sort((a: Unit, b: Unit) => {
const aVal = a.getBaseData().unitName?.toLowerCase();
const bVal = b.getBaseData().unitName?.toLowerCase();
hide() {
this.getElement()?.closest( ".ol-dialog" )?.classList.add( "hide" );
}
show() {
this.getElement()?.closest( ".ol-dialog" )?.classList.remove( "hide" );
}
toggle() {
this.getElement()?.closest( ".ol-dialog" )?.classList.toggle( "hide" );
}
update( units:object ) {
const unitsArray = Object.values( units ).sort( ( a, b ) => {
const aVal = a.baseData.unitName.toLowerCase();
const bVal = b.baseData.unitName.toLowerCase();
if ( aVal > bVal ) {
if (aVal > bVal) {
return 1;
} else if ( bVal > aVal ) {
} else if (bVal > aVal) {
return -1;
} else {
return 0;
}
});
function addRow(parentEl: HTMLElement, columns: string[]) {
const rowDiv = document.createElement("div");
function addRow( parentEl:HTMLElement, columns:string[] ) {
for (const item of columns) {
const rowDiv = document.createElement( "div" );
for ( const item of columns ) {
const div = document.createElement( "div" );
const div = document.createElement("div");
div.innerText = item;
rowDiv.appendChild( div );
rowDiv.appendChild(div);
}
parentEl.appendChild( rowDiv );
parentEl.appendChild(rowDiv);
}
const el = <HTMLElement> this.getElement().querySelector("#unit-list");
const el = this.getElement();
if ( el ) {
if (el) {
el.innerHTML = "";
addRow( el, [ "Callsign", "Name", "Category", "AI/Human" ] )
addRow(el, ["Callsign", "Name", "Category", "AI/Human"])
for ( const unit of unitsArray ) {
const dataset = [ unit.baseData.unitName, unit.baseData.name, unit.baseData.category, ( unit.baseData.AI ) ? "AI" : "Human" ];
if ( this.getElement() ) {
}
addRow( el, dataset );
for (const unit of unitsArray) {
const dataset = [unit.getBaseData().unitName, unit.getBaseData().name, unit.getBaseData().category, (unit.getBaseData().AI) ? "AI" : "Human"];
addRow(el, dataset);
}
}
}
}

View File

@ -1,5 +1,5 @@
import { LatLng, LatLngBounds } from "leaflet";
import { getMap } from "..";
import { getMap, getUnitDataTable } from "..";
import { Unit } from "./unit";
import { cloneUnit } from "../server/server";
import { IDLE, MOVE_UNIT } from "../map/map";

View File

@ -1,4 +1,4 @@
<div class="ol-panel ol-dialog scrollable hide">
<div id="unit-data-table" class="ol-panel ol-dialog scrollable">
<div class="ol-dialog-close" data-on-click="closeDialog"></div>
@ -6,8 +6,8 @@
<h4>Unit list</h4>
</div>
<div id="unit-data-table" class="ol-dialog-content">
<div id="unit-list" class="ol-dialog-content">
<!-- Here the list of units is shown -->
</div>
</div>