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

Completed unit nation selection and new spawn menu

Browse Source
This commit is contained in:
Pax1601
2023-09-03 15:15:11 +02:00
parent 695adc8acb
commit 6898d1df6d
17 changed files with 13414 additions and 5159 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
client/src/controls/dropdown.ts
View File

@@ -6,6 +6,7 @@ export class Dropdown {
#defaultValue: string;
#optionsList: string[] = [];
#index: number = 0;
#hidden: boolean = false;
constructor(ID: string | null, callback: CallableFunction, options: string[] | null = null, defaultText?: string) {
if (ID === null)
@@ -139,11 +140,17 @@ export class Dropdown {
}
show() {
this.#container.classList.add("show");
this.#container.classList.remove("hide");
this.#hidden = false;
}
hide() {
this.#container.classList.add("hide");
this.#hidden = true;
}
isHidden() {
return this.#hidden;
}
#toggle() {

7
client/src/controls/slider.ts
View File

@@ -63,7 +63,12 @@ export class Slider extends Control {
setValue(newValue: number, ignoreExpectedValue: boolean = true) {
if (!this.getDragged() && (ignoreExpectedValue || this.checkExpectedValue(newValue))) {
this.#value = newValue;
if (this.#value !== newValue) {
this.#value = newValue;
if (this.#callback)
this.#callback(this.getValue());
}
if (this.#slider != null)
this.#slider.value = String((newValue - this.#minValue) / (this.#maxValue - this.#minValue) * parseFloat(this.#slider.max));
this.#update();

186
client/src/controls/unitspawnmenu.ts
View File

@@ -84,7 +84,10 @@ export class UnitSpawnMenu {
advancedOptionsText.innerText = "Advanced options";
var advancedOptionsHr = document.createElement("hr");
advancedOptionsToggle.append(advancedOptionsText, advancedOptionsHr);
advancedOptionsToggle.addEventListener("click", () => { advancedOptionsDiv.classList.toggle("hide") });
advancedOptionsToggle.addEventListener("click", () => {
advancedOptionsDiv.classList.toggle("hide");
this.#container.dispatchEvent(new Event("resize"));
});
advancedOptionsDiv.append(this.#unitCountryDropdown.getContainer(), this.#unitLiveryDropdown.getContainer(),
this.#unitLoadoutPreviewEl, this.#unitSpawnAltitudeSlider.getContainer() as HTMLElement);
@@ -94,7 +97,9 @@ export class UnitSpawnMenu {
this.#deployUnitButtonEl.disabled = true;
this.#deployUnitButtonEl.innerText = "Deploy unit";
this.#deployUnitButtonEl.setAttribute("data-coalition", "blue");
this.#deployUnitButtonEl.addEventListener("click", () => { this.#deployUnits(); });
this.#deployUnitButtonEl.addEventListener("click", () => {
this.deployUnits(this.#spawnOptions, parseInt(this.#unitCountDropdown.getValue()));
});
/* Assemble all components */
this.#container.append(this.#unitRoleTypeDropdown.getContainer(), unitLabelCountContainerEl, this.#unitLoadoutDropdown.getContainer(),
@@ -115,13 +120,11 @@ export class UnitSpawnMenu {
/* Event listeners */
this.#container.addEventListener("unitRoleTypeChanged", () => {
this.#deployUnitButtonEl.disabled = true;
this.#unitLabelDropdown.reset();
if (this.#unitLoadoutListEl !== null)
this.#unitLoadoutListEl.replaceChildren();
if (this.#unitLoadoutDropdown !== null)
this.#unitLoadoutDropdown.reset();
if (this.#unitImageEl !== null)
this.#unitImageEl.classList.toggle("hide", true);
this.#unitLoadoutListEl.replaceChildren();
this.#unitLoadoutDropdown.reset();
this.#unitImageEl.classList.toggle("hide", true);
this.#unitLiveryDropdown.reset();
if (this.#orderByRole)
@@ -129,18 +132,24 @@ export class UnitSpawnMenu {
else
this.#unitLabelDropdown.setOptions(this.#unitDatabase.getByType(this.#spawnOptions.roleType).map((blueprint) => { return blueprint.label }));
this.#container.dispatchEvent(new Event("resize"));
this.#spawnOptions.name = "";
this.#spawnOptions.loadout = undefined;
this.#spawnOptions.liveryID = undefined;
this.#computeSpawnPoints();
})
this.#container.addEventListener("unitLabelChanged", () => {
if (this.#unitLoadoutDropdown !== null) {
this.#deployUnitButtonEl.disabled = false;
if (!this.#unitLoadoutDropdown.isHidden()) {
this.#unitLoadoutDropdown.setOptions(this.#unitDatabase.getLoadoutNamesByRole(this.#spawnOptions.name, this.#spawnOptions.roleType));
this.#unitLoadoutDropdown.selectValue(0);
}
if (this.#unitImageEl !== null) {
this.#unitImageEl.src = `images/units/${this.#unitDatabase.getByName(this.#spawnOptions.name)?.filename}`;
this.#unitImageEl.classList.toggle("hide", false);
}
this.#unitImageEl.src = `images/units/${this.#unitDatabase.getByName(this.#spawnOptions.name)?.filename}`;
this.#unitImageEl.classList.toggle("hide", false);
this.#setUnitLiveryOptions();
this.#container.dispatchEvent(new Event("resize"));
@@ -148,9 +157,8 @@ export class UnitSpawnMenu {
})
this.#container.addEventListener("unitLoadoutChanged", () => {
this.#deployUnitButtonEl.disabled = false;
var items = this.#spawnOptions.loadout?.items.map((item: any) => { return `${item.quantity}x ${item.name}`; });
if (items != undefined && this.#unitLoadoutListEl !== null) {
if (items != undefined) {
items.length == 0 ? items.push("Empty loadout") : "";
this.#unitLoadoutListEl.replaceChildren(
...items.map((item: any) => {
@@ -191,12 +199,9 @@ export class UnitSpawnMenu {
else
this.#unitRoleTypeDropdown.setOptions(this.#unitDatabase.getTypes());
if (this.#unitLoadoutListEl !== null)
this.#unitLoadoutListEl.replaceChildren();
if (this.#unitLoadoutDropdown !== null)
this.#unitLoadoutDropdown.reset();
if (this.#unitImageEl !== null)
this.#unitImageEl.classList.toggle("hide", true);
this.#unitLoadoutListEl.replaceChildren();
this.#unitLoadoutDropdown.reset();
this.#unitImageEl.classList.toggle("hide", true);
this.setCountries();
this.#container.dispatchEvent(new Event("resize"));
@@ -208,7 +213,7 @@ export class UnitSpawnMenu {
this.#unitCountryDropdown.setOptionsElements(this.#createCountryButtons(this.#unitCountryDropdown, countries, (country: string) => { this.#setUnitCountry(country) }));
if (countries.length > 0 && !countries.includes(this.#spawnOptions.country)) {
this.#unitCountryDropdown.forceValue(countries[0]);
this.#unitCountryDropdown.forceValue(this.#getFormattedCountry(countries[0]));
this.#setUnitCountry(countries[0]);
}
}
@@ -300,10 +305,15 @@ export class UnitSpawnMenu {
#setUnitLivery(liveryName: string) {
var liveries = this.#unitDatabase.getByName(this.#spawnOptions.name)?.liveries;
if (liveries !== undefined) {
for (let liveryID in liveries)
if (liveries[liveryID].name === liveryName)
this.#spawnOptions.liveryID = liveryID;
if (liveryName === "Default") {
this.#spawnOptions.liveryID = "";
}
else {
if (liveries !== undefined) {
for (let liveryID in liveries)
if (liveries[liveryID].name === liveryName)
this.#spawnOptions.liveryID = liveryID;
}
}
this.#container.dispatchEvent(new Event("unitLiveryChanged"));
}
@@ -314,7 +324,7 @@ export class UnitSpawnMenu {
var countryLiveries: string[] = ["Default"];
liveries.forEach((livery: any) => {
var nationLiveryCodes = this.#countryCodes[this.#spawnOptions.country].liveryCodes;
if (livery.countries.some((country: string) => { return nationLiveryCodes.includes(country) }))
if (livery.countries === "All" || livery.countries.some((country: string) => { return nationLiveryCodes.includes(country) }))
countryLiveries.push(livery.name);
});
this.#unitLiveryDropdown.setOptions(countryLiveries);
@@ -322,43 +332,20 @@ export class UnitSpawnMenu {
}
}
#deployUnits() {
this.#spawnOptions.coalition = getActiveCoalition();
if (this.#spawnOptions) {
var unitTable = {
unitType: this.#spawnOptions.name,
location: this.#spawnOptions.latlng,
altitude: this.#spawnOptions.altitude,
loadout: this.#spawnOptions.loadout,
liveryID: this.#spawnOptions.liveryID
};
var units = [];
for (let i = 1; i < parseInt(this.#unitCountDropdown.getValue()) + 1; i++) {
units.push(unitTable);
}
if (getUnitsManager().spawnUnits("Unit", units, getActiveCoalition(), false, this.#spawnOptions.airbase ? this.#spawnOptions.airbase.getName() : "", this.#spawnOptions.country)) {
getMap().addTemporaryMarker(this.#spawnOptions.latlng, this.#spawnOptions.name, getActiveCoalition());
getMap().getMapContextMenu().hide();
}
}
deployUnits(spawnOptions: UnitSpawnOptions, unitsCount: number) {
/* Virtual function must be overloaded by inheriting classes */
}
#createCountryButtons(parent: Dropdown, countries: string[], callback: CallableFunction) {
return Object.values(countries).map((country: string) => {
var el = document.createElement("div");
var formattedCountry = "";
if (this.#countryCodes[country] !== undefined && this.#countryCodes[country].displayName !== undefined)
formattedCountry = this.#countryCodes[country].displayName;
else
formattedCountry = country.charAt(0).toUpperCase() + country.slice(1).toLowerCase();
var button = document.createElement("button");
button.classList.add("country-dropdown-element");
el.appendChild(button);
button.addEventListener("click", () => {
callback(country);
parent.forceValue(formattedCountry);
parent.forceValue(this.#getFormattedCountry(country));
parent.close();
});
if (this.#countryCodes[country] !== undefined) {
@@ -373,12 +360,21 @@ export class UnitSpawnMenu {
console.log("Unknown country " + country);
}
var text = document.createElement("div");
text.innerText = formattedCountry;
text.innerText = this.#getFormattedCountry(country);
button.appendChild(text);
return el;
});
}
#getFormattedCountry(country: string) {
var formattedCountry = "";
if (this.#countryCodes[country] !== undefined && this.#countryCodes[country].displayName !== undefined)
formattedCountry = this.#countryCodes[country].displayName;
else
formattedCountry = country.charAt(0).toUpperCase() + country.slice(1).toLowerCase();
return formattedCountry;
}
#computeSpawnPoints() {
if (getMissionHandler() && getMissionHandler().getCommandModeOptions().commandMode !== GAME_MASTER) {
var unitCount = parseInt(this.#unitCountDropdown.getValue());
@@ -401,6 +397,27 @@ export class AircraftSpawnMenu extends UnitSpawnMenu {
this.getAltitudeSlider().setIncrement(500);
this.getAltitudeSlider().setValue(20000);
}
deployUnits(spawnOptions: UnitSpawnOptions, unitsCount: number) {
spawnOptions.coalition = getActiveCoalition();
if (spawnOptions) {
var unitTable = {
unitType: spawnOptions.name,
location: spawnOptions.latlng,
altitude: spawnOptions.altitude? spawnOptions.altitude: 0,
loadout: spawnOptions.loadout? spawnOptions.loadout.name: "",
liveryID: spawnOptions.liveryID? spawnOptions.liveryID: ""
};
var units = [];
for (let i = 1; i < unitsCount + 1; i++) {
units.push(unitTable);
}
if (getUnitsManager().spawnUnits("Aircraft", units, getActiveCoalition(), false, spawnOptions.airbase ? spawnOptions.airbase.getName() : "", spawnOptions.country)) {
getMap().addTemporaryMarker(spawnOptions.latlng, spawnOptions.name, getActiveCoalition());
getMap().getMapContextMenu().hide();
}
}
}
}
export class HelicopterSpawnMenu extends UnitSpawnMenu {
@@ -415,6 +432,27 @@ export class HelicopterSpawnMenu extends UnitSpawnMenu {
this.getAltitudeSlider().setIncrement(100);
this.getAltitudeSlider().setValue(5000);
}
deployUnits(spawnOptions: UnitSpawnOptions, unitsCount: number) {
spawnOptions.coalition = getActiveCoalition();
if (spawnOptions) {
var unitTable = {
unitType: spawnOptions.name,
location: spawnOptions.latlng,
altitude: spawnOptions.altitude? spawnOptions.altitude: 0,
loadout: spawnOptions.loadout? spawnOptions.loadout.name: "",
liveryID: spawnOptions.liveryID? spawnOptions.liveryID: ""
};
var units = [];
for (let i = 1; i < unitsCount + 1; i++) {
units.push(unitTable);
}
if (getUnitsManager().spawnUnits("Helicopter", units, getActiveCoalition(), false, spawnOptions.airbase ? spawnOptions.airbase.getName() : "", spawnOptions.country)) {
getMap().addTemporaryMarker(spawnOptions.latlng, spawnOptions.name, getActiveCoalition());
getMap().getMapContextMenu().hide();
}
}
}
}
export class GroundUnitSpawnMenu extends UnitSpawnMenu {
@@ -429,6 +467,26 @@ export class GroundUnitSpawnMenu extends UnitSpawnMenu {
this.getLoadoutDropdown().hide();
this.getLoadoutPreview().classList.add("hide");
}
deployUnits(spawnOptions: UnitSpawnOptions, unitsCount: number) {
spawnOptions.coalition = getActiveCoalition();
if (spawnOptions) {
var unitTable = {
unitType: spawnOptions.name,
location: spawnOptions.latlng,
liveryID: spawnOptions.liveryID? spawnOptions.liveryID: ""
};
var units = [];
for (let i = 1; i < unitsCount + 1; i++) {
units.push(JSON.parse(JSON.stringify(unitTable)));
unitTable.location.lat += 0.0001;
}
if (getUnitsManager().spawnUnits("GroundUnit", units, getActiveCoalition(), false, spawnOptions.airbase ? spawnOptions.airbase.getName() : "", spawnOptions.country)) {
getMap().addTemporaryMarker(spawnOptions.latlng, spawnOptions.name, getActiveCoalition());
getMap().getMapContextMenu().hide();
}
}
}
}
export class NavyUnitSpawnMenu extends UnitSpawnMenu {
@@ -443,4 +501,24 @@ export class NavyUnitSpawnMenu extends UnitSpawnMenu {
this.getLoadoutDropdown().hide();
this.getLoadoutPreview().classList.add("hide");
}
deployUnits(spawnOptions: UnitSpawnOptions, unitsCount: number) {
spawnOptions.coalition = getActiveCoalition();
if (spawnOptions) {
var unitTable = {
unitType: spawnOptions.name,
location: spawnOptions.latlng,
liveryID: spawnOptions.liveryID? spawnOptions.liveryID: ""
};
var units = [];
for (let i = 1; i < unitsCount + 1; i++) {
units.push(JSON.parse(JSON.stringify(unitTable)));
unitTable.location.lat += 0.0001;
}
if (getUnitsManager().spawnUnits("NavyUnit", units, getActiveCoalition(), false, spawnOptions.airbase ? spawnOptions.airbase.getName() : "", spawnOptions.country)) {
getMap().addTemporaryMarker(spawnOptions.latlng, spawnOptions.name, getActiveCoalition());
getMap().getMapContextMenu().hide();
}
}
}
}

2
client/src/mission/missionhandler.ts
View File

@@ -1,6 +1,6 @@
import { LatLng } from "leaflet";
import { getInfoPopup, getMap } from "..";
import { Airbase, AirbaseChartData } from "./airbase";
import { Airbase } from "./airbase";
import { Bullseye } from "./bullseye";
import { BLUE_COMMANDER, GAME_MASTER, NONE, RED_COMMANDER } from "../constants/constants";
import { refreshAll, setCommandModeOptions } from "../server/server";

8
client/src/server/server.ts
View File

@@ -170,14 +170,14 @@ export function spawnHelicopters(units: any, coalition: string, airbaseName: str
POST(data, () => { });
}
export function spawnGroundUnits(units: any, coalition: string, immediate: boolean, spawnPoints: number) {
var command = { "units": units, "coalition": coalition, "immediate": immediate, "spawnPoints": spawnPoints };;
export function spawnGroundUnits(units: any, coalition: string, country: string, immediate: boolean, spawnPoints: number) {
var command = { "units": units, "coalition": coalition, "country": country, "immediate": immediate, "spawnPoints": spawnPoints };;
var data = { "spawnGroundUnits": command }
POST(data, () => { });
}
export function spawnNavyUnits(units: any, coalition: string, immediate: boolean, spawnPoints: number) {
var command = { "units": units, "coalition": coalition, "immediate": immediate, "spawnPoints": spawnPoints };
export function spawnNavyUnits(units: any, coalition: string, country: string, immediate: boolean, spawnPoints: number) {
var command = { "units": units, "coalition": coalition, "country": country, "immediate": immediate, "spawnPoints": spawnPoints };
var data = { "spawnNavyUnits": command }
POST(data, () => { });
}

4
client/src/unit/unitsmanager.ts
View File

@@ -722,14 +722,14 @@ export class UnitsManager {
return false;
}
spawnPoints = units.reduce((points: number, unit: any) => {return points + groundUnitDatabase.getSpawnPointsByName(unit.unitType)}, 0);
spawnGroundUnits(units, coalition, immediate, spawnPoints);
spawnGroundUnits(units, coalition, country, immediate, spawnPoints);
} else if (category === "NavyUnit") {
if (getMissionHandler().getCommandModeOptions().restrictSpawns && getMissionHandler().getRemainingSetupTime() < 0 && getMissionHandler().getCommandModeOptions().commandMode !== GAME_MASTER) {
getInfoPopup().setText("Navy units can be spawned during the SETUP phase only");
return false;
}
spawnPoints = units.reduce((points: number, unit: any) => {return points + navyUnitDatabase.getSpawnPointsByName(unit.unitType)}, 0);
spawnNavyUnits(units, coalition, immediate, spawnPoints);
spawnNavyUnits(units, coalition, country, immediate, spawnPoints);
}
if (spawnPoints <= getMissionHandler().getAvailableSpawnPoints()) {