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

More work on advanced settings dialog

Browse Source
This commit is contained in:
Pax1601
2023-04-12 17:21:36 +02:00
parent 316261e01e
commit 7eee469bed
10 changed files with 315 additions and 306 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
client/src/@types/unit.d.ts vendored
View File

@@ -46,6 +46,7 @@ interface TaskData {
radioOn: boolean;
TACANOn: boolean;
radioFrequency: number;
radioCallsign: number;
TACANChannel: number;
TACANXY: string;
TACANCallsign: string;

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

@@ -5,7 +5,8 @@ export class Dropdown {
#callback: CallableFunction;
#defaultValue: string;
#optionsList: string[] = [];
#index: number = 0;
constructor(ID: string, callback: CallableFunction, options: string[] | null = null)
{
this.#element = <HTMLElement>document.getElementById(ID);
@@ -13,69 +14,39 @@ export class Dropdown {
this.#value = <HTMLElement>this.#element.querySelector(".ol-select-value");
this.#defaultValue = this.#value.innerText;
this.#callback = callback;
if (options != null) {
this.setOptions(options);
}
this.#value.addEventListener( "click", ev => {
this.#element.classList.toggle( "is-open" );
this.#clip();
});
this.#element.addEventListener("mouseleave", ev => {
this.#close();
});
}
#clip() {
const options = this.#options;
const bounds = options.getBoundingClientRect();
this.#element.dataset.position = ( bounds.bottom > window.innerHeight ) ? "top" : "";
}
#close() {
this.#element.classList.remove( "is-open" );
this.#element.dataset.position = "";
}
#open() {
this.#element.classList.add( "is-open" );
}
#toggle() {
if ( this.#element.classList.contains( "is-open" ) ) {
this.#close();
} else {
this.#open();
}
}
setOptions(optionsList: string[])
{
this.#optionsList = optionsList;
this.#options.replaceChildren(...optionsList.map((option: string) => {
this.#options.replaceChildren(...optionsList.map((option: string, idx: number) => {
var div = document.createElement("div");
var button = document.createElement("button");
button.textContent = option;
div.appendChild(button);
if (option === this.#defaultValue)
this.#index = idx;
button.addEventListener("click", (e: MouseEvent) => {
e.stopPropagation();
this.#value.innerText = option;
this.#close();
this.#callback( option, e );
this.#callback(option, e);
this.#index = idx;
});
return div;
}));
@@ -87,6 +58,8 @@ export class Dropdown {
{
var option = this.#optionsList[idx];
this.#value.innerText = option;
this.#index = idx;
this.#close();
this.#callback(option);
}
}
@@ -95,4 +68,35 @@ export class Dropdown {
this.#options.replaceChildren();
this.#value.innerText = this.#defaultValue;
}
getValue() {
return this.#value.innerText;
}
getIndex() {
return this.#index;
}
#clip() {
const options = this.#options;
const bounds = options.getBoundingClientRect();
this.#element.dataset.position = ( bounds.bottom > window.innerHeight ) ? "top" : "";
}
#close() {
this.#element.classList.remove( "is-open" );
this.#element.dataset.position = "";
}
#open() {
this.#element.classList.add( "is-open" );
}
#toggle() {
if ( this.#element.classList.contains( "is-open" ) ) {
this.#close();
} else {
this.#open();
}
}
}

44
client/src/panels/unitcontrolpanel.ts
View File

@@ -1,4 +1,5 @@
import { getUnitsManager } from "..";
import { Dropdown } from "../controls/dropdown";
import { Slider } from "../controls/slider";
import { dataPointMap } from "../other/utils";
import { aircraftDatabase } from "../units/aircraftdatabase";
@@ -20,6 +21,9 @@ const altitudeIncrements: { [key: string]: number } = { Aircraft: 2500, Helicopt
export class UnitControlPanel extends Panel {
#altitudeSlider: Slider;
#airspeedSlider: Slider;
#TACANXYDropdown: Dropdown;
#radioDecimalsDropdown: Dropdown;
#radioCallsignDropdown: Dropdown;
#expectedAltitude: number = -1;
#expectedSpeed: number = -1;
#optionButtons: { [key: string]: HTMLButtonElement[] } = {}
@@ -39,6 +43,13 @@ export class UnitControlPanel extends Panel {
getUnitsManager().selectedUnitsSetSpeed(value / 1.94384)
});
/* Advanced settings dropdowns */
this.#TACANXYDropdown = new Dropdown("TACAN-XY", () => {});
this.#TACANXYDropdown.setOptions(["X", "Y"]);
this.#radioDecimalsDropdown = new Dropdown("radio-decimals", () => {});
this.#radioDecimalsDropdown.setOptions([".000", ".250", ".500", ".750"]);
this.#radioCallsignDropdown = new Dropdown("radio-callsign", () => {});
/* Option buttons */
this.#optionButtons["ROE"] = ROEs.map((option: string, index: number) => {
var button = document.createElement("button");
@@ -64,6 +75,11 @@ export class UnitControlPanel extends Panel {
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("applyAdvancedSettings", () => {this.#applyAdvancedSettings();})
document.addEventListener("showAdvancedSettings", () => {
this.#updateAdvancedSettingsDialog(getUnitsManager().getSelectedUnits());
this.#advancedSettingsDialog.classList.remove("hide");
})
this.hide();
}
@@ -97,7 +113,6 @@ export class UnitControlPanel extends Panel {
var units = getUnitsManager().getSelectedUnits();
if (this.getElement() != null && units.length > 0) {
this.#showFlightControlSliders(units);
this.#updateAdvancedSettingsDialog(units);
this.getElement().querySelector("#selected-units-container")?.replaceChildren(...units.map((unit: Unit, index: number) => {
let database: UnitDatabase | null;
@@ -195,10 +210,15 @@ export class UnitControlPanel extends Panel {
(<HTMLElement>this.#advancedSettingsDialog.querySelector("#unit-name")).innerText = unit.getBaseData().unitName;
if (getUnitsManager().getSelectedUnits().length == 1){
this.#radioCallsignDropdown.setOptions(["Enfield", "Springfield", "Uzi", "Colt", "Dodge", "Ford", "Chevy", "Pontiac"]);
this.#radioCallsignDropdown.selectValue(unit.getTaskData().radioCallsign);
var roles = aircraftDatabase.getByName(unit.getBaseData().name)?.loadouts.map((loadout) => {return loadout.roles})
if (roles != undefined && Array.prototype.concat.apply([], roles)?.includes("Tanker")){
this.#advancedSettingsDialog.querySelector("#tanker-checkbox")?.querySelector("input")?.setAttribute('checked', String(unit.getTaskData().isTanker));
this.#advancedSettingsDialog.querySelector("#tanker-checkbox")?.classList.remove("hide");
this.#radioCallsignDropdown.setOptions(["Texaco", "Arco", "Shell"]);
this.#radioCallsignDropdown.selectValue(unit.getTaskData().radioCallsign);
}
else {
this.#advancedSettingsDialog.querySelector("#tanker-checkbox")?.classList.add("hide");
@@ -207,10 +227,32 @@ export class UnitControlPanel extends Panel {
if (roles != undefined && Array.prototype.concat.apply([], roles)?.includes("AWACS")){
this.#advancedSettingsDialog.querySelector("#AWACS-checkbox")?.querySelector("input")?.setAttribute('checked', String(unit.getTaskData().isAWACS));
this.#advancedSettingsDialog.querySelector("#AWACS-checkbox")?.classList.remove("hide");
this.#radioCallsignDropdown.setOptions(["Overlord", "Magic", "Wizard", "Focus", "Darkstar"]);
this.#radioCallsignDropdown.selectValue(unit.getTaskData().radioCallsign);
} else {
this.#advancedSettingsDialog.querySelector("#AWACS-checkbox")?.classList.add("hide");
}
}
}
}
#applyAdvancedSettings()
{
this.#advancedSettingsDialog.classList.add("hide");
const isTanker = <boolean> this.#advancedSettingsDialog.querySelector("#tanker-checkbox")?.querySelector("input")?.checked;
const isAWACS= <boolean> this.#advancedSettingsDialog.querySelector("#AWACS-checkbox")?.querySelector("input")?.checked;
const TACANChannel = Number(this.#advancedSettingsDialog.querySelector("#TACAN-channel")?.querySelector("input")?.value);
const TACANXY = this.#TACANXYDropdown.getValue();
const TACANCallsign = <string> this.#advancedSettingsDialog.querySelector("#tacan-callsign")?.querySelector("input")?.value
const radioMHz = Number(this.#advancedSettingsDialog.querySelector("#radio-mhz")?.querySelector("input")?.value);
const radioDecimals = this.#radioDecimalsDropdown.getValue();
const radioCallsign = this.#radioCallsignDropdown.getIndex();
var radioFrequency = (radioMHz * 1000 + Number(radioDecimals.substring(1))) * 1000;
var units = getUnitsManager().getSelectedUnits();
if (units.length > 0)
units[0].setAdvancedOptions(isTanker, isAWACS, TACANChannel, TACANXY, TACANCallsign, radioFrequency, radioCallsign);
}
}

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

@@ -183,14 +183,18 @@ export function refuel(ID: number) {
POST(data, () => { });
}
export function setTanker(ID: number, state: boolean) {
var command = { "ID": ID, "state": state };
var data = { "setIsTanker": command }
POST(data, () => { });
}
export function setAdvacedOptions(ID: number, isTanker: boolean, isAWACS: boolean, TACANChannel: number, TACANXY: string, TACANCallsign: string, radioFrequency: number, radioCallsign: number)
{
var command = { "ID": ID,
"isTanker": isTanker,
"isAWACS": isAWACS,
"TACANChannel": TACANChannel,
"TACANXY": TACANXY,
"TACANCallsign": TACANCallsign,
"radioFrequency": radioFrequency,
"radioCallsign": radioCallsign
};
export function setAWACS(ID: number, state: boolean) {
var command = { "ID": ID, "state": state };
var data = { "setIsAWACS": command }
var data = { "setAdvancedOptions": command };
POST(data, () => { });
}
}

11
client/src/units/unit.ts
View File

@@ -1,7 +1,7 @@
import { Marker, LatLng, Polyline, Icon, DivIcon } from 'leaflet';
import { getMap, getUnitsManager } from '..';
import { rad2deg } from '../other/utils';
import { addDestination, attackUnit, changeAltitude, changeSpeed, createFormation as setLeader, deleteUnit, getUnits, landAt, setAltitude, setReactionToThreat, setROE, setSpeed, refuel, setTanker, setAWACS } from '../server/server';
import { addDestination, attackUnit, changeAltitude, changeSpeed, createFormation as setLeader, deleteUnit, getUnits, landAt, setAltitude, setReactionToThreat, setROE, setSpeed, refuel, setAdvacedOptions } from '../server/server';
import { aircraftDatabase } from './aircraftdatabase';
import { groundUnitsDatabase } from './groundunitsdatabase';
@@ -55,6 +55,7 @@ export class Unit extends Marker {
radioOn: false,
TACANOn: false,
radioFrequency: 0,
radioCallsign: 0,
TACANChannel: 0,
TACANXY: "X",
TACANCallsign: "",
@@ -375,12 +376,8 @@ export class Unit extends Marker {
refuel(this.ID);
}
toggleTanker() {
setTanker(this.ID, !this.getTaskData().isTanker);
}
toggleAWACS() {
setAWACS(this.ID, !this.getTaskData().isAWACS);
setAdvancedOptions(isTanker: boolean, isAWACS: boolean, TACANChannel: number, TACANXY: string, TACANcallsign: string, radioFrequency: number, radioCallsign: number) {
setAdvacedOptions(this.ID, isTanker, isAWACS, TACANChannel, TACANXY, TACANcallsign, radioFrequency, radioCallsign);
}
#onClick(e: any) {

18
client/src/units/unitsmanager.ts
View File

@@ -334,24 +334,6 @@ export class UnitsManager {
}
}
selectedUnitsToggleTanker()
{
var selectedUnits = this.getSelectedUnits();
for (let idx in selectedUnits)
{
selectedUnits[idx].toggleTanker();
}
}
selectedUnitsToggleAWACS()
{
var selectedUnits = this.getSelectedUnits();
for (let idx in selectedUnits)
{
selectedUnits[idx].toggleAWACS();
}
}
copyUnits()
{
this.#copiedUnits = this.getSelectedUnits();