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

Minor tweaks and fixes

Browse Source
This commit is contained in:
Pax1601
2023-07-09 18:48:21 +02:00
parent 2d4202979f
commit a0763a6450
19 changed files with 216 additions and 89 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
client/src/controls/airbasecontextmenu.ts
View File

@@ -50,7 +50,7 @@ export class AirbaseContextMenu extends ContextMenu {
}
setCoalition(coalition: string) {
(<HTMLElement>this.getContainer()?.querySelector("#spawn-airbase-aircraft-button")).dataset.activeCoalition = coalition;
(<HTMLElement>this.getContainer()?.querySelector("#spawn-airbase-aircraft-button")).dataset.coalition = coalition;
}
enableLandButton(enableLandButton: boolean) {
@@ -62,6 +62,7 @@ export class AirbaseContextMenu extends ContextMenu {
setActiveCoalition(this.#airbase.getCoalition());
getMap().showMapContextMenu({ originalEvent: { x: this.getX(), y: this.getY(), latlng: this.getLatLng() } });
getMap().getMapContextMenu().hideUpperBar();
getMap().getMapContextMenu().hideAltitudeSlider();
getMap().getMapContextMenu().showSubMenu("aircraft");
getMap().getMapContextMenu().setAirbaseName(this.#airbase.getName());
getMap().getMapContextMenu().setLatLng(this.#airbase.getLatLng());

19
client/src/controls/coalitionareacontextmenu.ts
View File

@@ -1,5 +1,6 @@
import { LatLng } from "leaflet";
import { getMap, getUnitsManager } from "..";
import { IADSRoles } from "../constants/constants";
import { GAME_MASTER, IADSRoles } from "../constants/constants";
import { CoalitionArea } from "../map/coalitionarea";
import { ContextMenu } from "./contextmenu";
import { Dropdown } from "./dropdown";
@@ -75,6 +76,12 @@ export class CoalitionAreaContextMenu extends ContextMenu {
this.hide();
}
show(x: number, y: number, latlng: LatLng) {
super.show(x, y, latlng);
if (getUnitsManager().getCommandMode() !== GAME_MASTER)
this.#coalitionSwitch.hide()
}
showSubMenu(type: string) {
this.getContainer()?.querySelector("#iads-menu")?.classList.toggle("hide", type !== "iads");
this.getContainer()?.querySelector("#iads-button")?.classList.toggle("is-open", type === "iads");
@@ -104,9 +111,11 @@ export class CoalitionAreaContextMenu extends ContextMenu {
}
#onSwitchClick(value: boolean) {
this.getCoalitionArea()?.setCoalition(value ? "red" : "blue");
this.getContainer()?.querySelectorAll('[data-coalition]').forEach((element: any) => {
element.setAttribute("data-coalition", this.getCoalitionArea()?.getCoalition())
});
if (getUnitsManager().getCommandMode() == GAME_MASTER) {
this.getCoalitionArea()?.setCoalition(value ? "red" : "blue");
this.getContainer()?.querySelectorAll('[data-coalition]').forEach((element: any) => {
element.setAttribute("data-coalition", this.getCoalitionArea()?.getCoalition())
});
}
}
}

66
client/src/controls/mapcontextmenu.ts
View File

@@ -1,5 +1,5 @@
import { LatLng } from "leaflet";
import { getActiveCoalition, getMap, setActiveCoalition } from "..";
import { getActiveCoalition, getMap, getUnitsManager, setActiveCoalition } from "..";
import { spawnAircrafts, spawnExplosion, spawnGroundUnits, spawnSmoke } from "../server/server";
import { aircraftDatabase } from "../units/aircraftdatabase";
import { groundUnitsDatabase } from "../units/groundunitsdatabase";
@@ -8,16 +8,19 @@ import { Dropdown } from "./dropdown";
import { Switch } from "./switch";
import { Slider } from "./slider";
import { ftToM } from "../other/utils";
import { GAME_MASTER } from "../constants/constants";
export class MapContextMenu extends ContextMenu {
#coalitionSwitch: Switch;
#aircraftRoleDropdown: Dropdown;
#aircraftTypeDropdown: Dropdown;
#aircraftCountDropdown: Dropdown;
#aircraftLoadoutDropdown: Dropdown;
#aircrafSpawnAltitudeSlider: Slider;
#groundUnitRoleDropdown: Dropdown;
#groundUnitTypeDropdown: Dropdown;
#spawnOptions = { role: "", name: "", latlng: new LatLng(0, 0), coalition: "blue", loadout: "", airbaseName: "", altitude: ftToM(20000) };
#groundCountDropdown: Dropdown;
#spawnOptions = { role: "", name: "", latlng: new LatLng(0, 0), coalition: "blue", loadout: "", airbaseName: "", altitude: ftToM(20000), count: 1 };
constructor(id: string) {
super(id);
@@ -27,6 +30,9 @@ export class MapContextMenu extends ContextMenu {
this.#coalitionSwitch.getContainer()?.addEventListener("contextmenu", (e) => this.#onSwitchRightClick(e));
this.#aircraftRoleDropdown = new Dropdown("aircraft-role-options", (role: string) => this.#setAircraftRole(role));
this.#aircraftTypeDropdown = new Dropdown("aircraft-type-options", (type: string) => this.#setAircraftType(type));
this.#aircraftCountDropdown = new Dropdown("aircraft-count-options", (type: string) => this.#setAircraftCount(type));
this.#aircraftCountDropdown.setOptions(["1", "2", "3", "4"]);
this.#aircraftCountDropdown.setValue("1");
this.#aircraftLoadoutDropdown = new Dropdown("loadout-options", (loadout: string) => this.#setAircraftLoadout(loadout));
this.#aircrafSpawnAltitudeSlider = new Slider("aircraft-spawn-altitude-slider", 0, 50000, "ft", (value: number) => {this.#spawnOptions.altitude = ftToM(value);});
this.#aircrafSpawnAltitudeSlider.setIncrement(500);
@@ -34,6 +40,11 @@ export class MapContextMenu extends ContextMenu {
this.#aircrafSpawnAltitudeSlider.setActive(true);
this.#groundUnitRoleDropdown = new Dropdown("ground-unit-role-options", (role: string) => this.#setGroundUnitRole(role));
this.#groundUnitTypeDropdown = new Dropdown("ground-unit-type-options", (type: string) => this.#setGroundUnitType(type));
this.#groundCountDropdown = new Dropdown("ground-count-options", (type: string) => this.#setGroundCount(type));
var groundCount = [];
for (let i = 1; i <= 10; i++) groundCount.push(String(i));
this.#groundCountDropdown.setOptions(groundCount);
this.#groundCountDropdown.setValue("1");
document.addEventListener("mapContextMenuShow", (e: any) => {
if (this.getVisibleSubMenu() !== e.detail.type)
@@ -47,7 +58,12 @@ export class MapContextMenu extends ContextMenu {
this.#spawnOptions.coalition = getActiveCoalition();
if (this.#spawnOptions) {
getMap().addTemporaryMarker(this.#spawnOptions.latlng, this.#spawnOptions.name, getActiveCoalition());
spawnAircrafts([{unitName: this.#spawnOptions.name, latlng: this.#spawnOptions.latlng, loadout: this.#spawnOptions.loadout}], getActiveCoalition(), this.#spawnOptions.airbaseName, false);
var unitTable = {unitType: this.#spawnOptions.name, location: this.#spawnOptions.latlng, altitude: this.#spawnOptions.altitude, loadout: this.#spawnOptions.loadout};
var units = [];
for (let i = 1; i < parseInt(this.#aircraftCountDropdown.getValue()) + 1; i++) {
units.push(unitTable);
}
spawnAircrafts(units, getActiveCoalition(), this.#spawnOptions.airbaseName, false);
}
});
@@ -56,7 +72,13 @@ export class MapContextMenu extends ContextMenu {
this.#spawnOptions.coalition = getActiveCoalition();
if (this.#spawnOptions) {
getMap().addTemporaryMarker(this.#spawnOptions.latlng, this.#spawnOptions.name, getActiveCoalition());
spawnGroundUnits([{unitName: this.#spawnOptions.name, latlng: this.#spawnOptions.latlng}], getActiveCoalition(), false);
var unitTable = {unitType: this.#spawnOptions.name, location: this.#spawnOptions.latlng};
var units = [];
for (let i = 1; i < parseInt(this.#groundCountDropdown.getValue()) + 1; i++) {
units.push(JSON.parse(JSON.stringify(unitTable)));
unitTable.location.lat += 0.0001;
}
spawnGroundUnits(units, getActiveCoalition(), false);
}
});
@@ -70,7 +92,6 @@ export class MapContextMenu extends ContextMenu {
spawnExplosion(e.detail.strength, this.getLatLng());
});
this.hide();
}
@@ -79,6 +100,19 @@ export class MapContextMenu extends ContextMenu {
super.show(x, y, latlng);
this.#spawnOptions.latlng = latlng;
this.showUpperBar();
this.showAltitudeSlider();
this.getContainer()?.querySelectorAll('[data-coalition]').forEach((element: any) => { element.setAttribute("data-coalition", getActiveCoalition()) });
if (getActiveCoalition() == "blue")
this.#coalitionSwitch.setValue(false);
else if (getActiveCoalition() == "red")
this.#coalitionSwitch.setValue(true);
else
this.#coalitionSwitch.setValue(undefined);
if (getUnitsManager().getCommandMode() !== GAME_MASTER)
this.#coalitionSwitch.hide()
}
showSubMenu(type: string) {
@@ -95,6 +129,8 @@ export class MapContextMenu extends ContextMenu {
this.#resetAircraftType();
this.#resetGroundUnitRole();
this.#resetGroundUnitType();
this.#aircraftCountDropdown.setValue("1");
this.#groundCountDropdown.setValue("1");
this.clip();
this.setVisibleSubMenu(type);
@@ -119,7 +155,6 @@ export class MapContextMenu extends ContextMenu {
this.setVisibleSubMenu(null);
}
showUpperBar() {
this.getContainer()?.querySelector("#upper-bar")?.classList.toggle("hide", false);
}
@@ -128,6 +163,14 @@ export class MapContextMenu extends ContextMenu {
this.getContainer()?.querySelector("#upper-bar")?.classList.toggle("hide", true);
}
showAltitudeSlider() {
this.getContainer()?.querySelector("#aircraft-spawn-altitude-slider")?.classList.toggle("hide", false);
}
hideAltitudeSlider() {
this.getContainer()?.querySelector("#aircraft-spawn-altitude-slider")?.classList.toggle("hide", true);
}
setAirbaseName(airbaseName: string) {
this.#spawnOptions.airbaseName = airbaseName;
}
@@ -144,6 +187,7 @@ export class MapContextMenu extends ContextMenu {
#onSwitchRightClick(e: any) {
this.#coalitionSwitch.setValue(undefined);
setActiveCoalition("neutral");
this.getContainer()?.querySelectorAll('[data-coalition]').forEach((element: any) => { element.setAttribute("data-coalition", getActiveCoalition()) });
}
/********* Aircraft spawn menu *********/
@@ -178,6 +222,11 @@ export class MapContextMenu extends ContextMenu {
this.clip();
}
#setAircraftCount(count: string) {
this.#spawnOptions.count = parseInt(count);
this.clip();
}
#resetAircraftType() {
(<HTMLButtonElement>this.getContainer()?.querySelector("#aircraft-spawn-menu")?.querySelector(".deploy-unit-button")).disabled = true;
(<HTMLButtonElement>this.getContainer()?.querySelector("#loadout-list")).replaceChildren();
@@ -236,6 +285,11 @@ export class MapContextMenu extends ContextMenu {
this.clip();
}
#setGroundCount(count: string) {
this.#spawnOptions.count = parseInt(count);
this.clip();
}
#resetGroundUnitType() {
(<HTMLButtonElement>this.getContainer()?.querySelector("#ground-unit-spawn-menu")?.querySelector(".deploy-unit-button")).disabled = true;
this.clip();

17
client/src/index.ts
View File

@@ -16,6 +16,7 @@ import { Popup } from "./popups/popup";
import { Dropdown } from "./controls/dropdown";
import { HotgroupPanel } from "./panels/hotgrouppanel";
import { SVGInjector } from "@tanem/svg-injector";
import { BLUE_COMMANDER, GAME_MASTER, RED_COMMANDER } from "./constants/constants";
var map: Map;
@@ -44,8 +45,8 @@ function setup() {
featureSwitches = new FeatureSwitches();
/* Initialize base functionalitites */
map = new Map('map-container');
unitsManager = new UnitsManager();
map = new Map('map-container');
missionHandler = new MissionHandler();
/* Panels */
@@ -252,11 +253,21 @@ export function getHotgroupPanel() {
}
export function setActiveCoalition(newActiveCoalition: string) {
activeCoalition = newActiveCoalition;
if (getUnitsManager().getCommandMode() == GAME_MASTER)
activeCoalition = newActiveCoalition;
}
export function getActiveCoalition() {
return activeCoalition;
if (getUnitsManager().getCommandMode() == GAME_MASTER)
return activeCoalition;
else {
if (getUnitsManager().getCommandMode() == BLUE_COMMANDER)
return "blue";
else if (getUnitsManager().getCommandMode() == RED_COMMANDER)
return "red";
else
return "neutral";
}
}
export function setLoginStatus(status: string) {

9
client/src/map/coalitionarea.ts
View File

@@ -1,7 +1,8 @@
import { DomUtil, LatLng, LatLngExpression, Map, Point, Polygon, PolylineOptions } from "leaflet";
import { getMap } from "..";
import { getMap, getUnitsManager } from "..";
import { CoalitionAreaHandle } from "./coalitionareahandle";
import { CoalitionAreaMiddleHandle } from "./coalitionareamiddlehandle";
import { BLUE_COMMANDER, RED_COMMANDER } from "../constants/constants";
export class CoalitionArea extends Polygon {
#coalition: string = "blue";
@@ -19,7 +20,11 @@ export class CoalitionArea extends Polygon {
super(latlngs, options);
this.#setColors();
this.#registerCallbacks();
if (getUnitsManager().getCommandMode() == BLUE_COMMANDER)
this.setCoalition("blue");
else if (getUnitsManager().getCommandMode() == RED_COMMANDER)
this.setCoalition("red");
}
setCoalition(coalition: string) {

2
client/src/other/utils.ts
View File

@@ -247,7 +247,7 @@ export function getMarkerCategoryByName(name: string) {
return (role?.includes("SAM")) ? "groundunit-sam" : "groundunit-other";
}
else
return ""; // TODO add other unit types
return "groundunit-other"; // TODO add other unit types
}
export function getUnitDatabaseByCategory(category: string) {

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

@@ -36,7 +36,7 @@ export class UnitControlPanel extends Panel {
/* Option buttons */
// Reversing the ROEs so that the least "aggressive" option is always on the left
this.#optionButtons["ROE"] = ROEs.slice(0).reverse().map((option: string, index: number) => {
return this.#createOptionButton(option, `roe/${option.toLowerCase()}.svg`, ROEDescriptions[index], () => { getUnitsManager().selectedUnitsSetROE(option); });
return this.#createOptionButton(option, `roe/${option.toLowerCase()}.svg`, ROEDescriptions.slice(0).reverse()[index], () => { getUnitsManager().selectedUnitsSetROE(option); });
});
this.#optionButtons["reactionToThreat"] = reactionsToThreat.map((option: string, index: number) => {

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

@@ -324,9 +324,7 @@ export function startUpdate() {
export function requestUpdate() {
/* Main update rate = 250ms is minimum time, equal to server update time. */
if (!getPaused()) {
getUnits((buffer: ArrayBuffer) => {
getUnitsManager()?.update(buffer);
}, false);
getUnits((buffer: ArrayBuffer) => { getUnitsManager()?.update(buffer); }, false);
}
window.setTimeout(() => requestUpdate(), getConnected() ? 250 : 1000);
@@ -335,7 +333,6 @@ export function requestUpdate() {
export function requestRefresh() {
/* Main refresh rate = 5000ms. */
if (!getPaused()) {
getAirbases((data: AirbasesData) => getMissionData()?.update(data));
getBullseye((data: BullseyesData) => getMissionData()?.update(data));

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

@@ -6,7 +6,7 @@ import { CustomMarker } from '../map/custommarker';
import { SVGInjector } from '@tanem/svg-injector';
import { UnitDatabase } from './unitdatabase';
import { TargetMarker } from '../map/targetmarker';
import { BLUE_COMMANDER, BOMBING, CARPET_BOMBING, DLINK, DataIndexes, FIRE_AT_AREA, HIDE_ALL, IDLE, IRST, MOVE_UNIT, OPTIC, RADAR, RED_COMMANDER, ROEs, RWR, VISUAL, emissionsCountermeasures, reactionsToThreat, states } from '../constants/constants';
import { BLUE_COMMANDER, BOMBING, CARPET_BOMBING, DLINK, DataIndexes, FIRE_AT_AREA, GAME_MASTER, HIDE_ALL, IDLE, IRST, MOVE_UNIT, OPTIC, RADAR, RED_COMMANDER, ROEs, RWR, VISUAL, emissionsCountermeasures, reactionsToThreat, states } from '../constants/constants';
import { Ammo, Contact, GeneralSettings, Offset, Radio, TACAN, UnitIconOptions } from '../@types/unit';
import { DataExtractor } from './dataextractor';
@@ -223,6 +223,10 @@ export class Unit extends CustomMarker {
if (updateMarker)
this.#updateMarker();
document.dispatchEvent(new CustomEvent("unitUpdated", { detail: this }));
}
drawLines() {
// TODO dont delete the polylines of the detected units
this.#clearContacts();
if (this.getSelected()) {
@@ -234,8 +238,6 @@ export class Unit extends CustomMarker {
this.#clearPath();
this.#clearTarget();
}
document.dispatchEvent(new CustomEvent("unitUpdated", { detail: this }));
}
getData() {
@@ -365,11 +367,11 @@ export class Unit extends CustomMarker {
}
belongsToCommandedCoalition() {
if (getUnitsManager().getVisibilityMode() === HIDE_ALL)
if (getUnitsManager().getCommandMode() === HIDE_ALL)
return false;
if (getUnitsManager().getVisibilityMode() === BLUE_COMMANDER && this.#coalition !== "blue")
if (getUnitsManager().getCommandMode() === BLUE_COMMANDER && this.#coalition !== "blue")
return false;
if (getUnitsManager().getVisibilityMode() === RED_COMMANDER && this.#coalition !== "red")
if (getUnitsManager().getCommandMode() === RED_COMMANDER && this.#coalition !== "red")
return false;
return true;
}
@@ -486,7 +488,7 @@ export class Unit extends CustomMarker {
hidden = true;
if (hiddenUnits.includes(this.#coalition))
hidden = true;
if (getUnitsManager().getVisibilityMode() === HIDE_ALL)
if (getUnitsManager().getCommandMode() === HIDE_ALL)
hidden = true;
if (!this.belongsToCommandedCoalition() && this.#detectionMethods.length == 0) {
hidden = true;
@@ -791,7 +793,8 @@ export class Unit extends CustomMarker {
this.updateVisibility();
/* Draw the minimap marker */
if (this.#alive) {
var drawMiniMapMarker = (this.belongsToCommandedCoalition() || this.getDetectionMethods().some(value => [VISUAL, OPTIC, RADAR, IRST, DLINK].includes(value)));
if (this.#alive && drawMiniMapMarker) {
if (this.#miniMapMarker == null) {
this.#miniMapMarker = new CircleMarker(new LatLng(this.#position.lat, this.#position.lng), { radius: 0.5 });
if (this.#coalition == "neutral")
@@ -985,7 +988,7 @@ export class Unit extends CustomMarker {
}
else if (this.#targetID != 0) {
const target = getUnitsManager().getUnitByID(this.#targetID);
if (target && getUnitsManager().getUnitDetectedMethods(target).some(value => [VISUAL, OPTIC, RADAR, IRST, DLINK].includes(value))) {
if (target && (getUnitsManager().getCommandMode() == GAME_MASTER || (this.belongsToCommandedCoalition() && getUnitsManager().getUnitDetectedMethods(target).some(value => [VISUAL, OPTIC, RADAR, IRST, DLINK].includes(value))))) {
this.#drawtargetPosition(target.getPosition());
}
}
@@ -1093,6 +1096,10 @@ export class NavyUnit extends Unit {
};
}
getMarkerCategory() {
return "navyunit";
}
getCategory() {
return "NavyUnit";
}
@@ -1109,7 +1116,7 @@ export class Weapon extends Unit {
showState: false,
showVvi: false,
showHotgroup: false,
showUnitIcon: this.belongsToCommandedCoalition(),
showUnitIcon: true,
showShortLabel: false,
showFuel: false,
showAmmo: false,

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

@@ -16,7 +16,7 @@ export class UnitsManager {
#selectionEventDisabled: boolean = false;
#pasteDisabled: boolean = false;
#hiddenTypes: string[] = [];
#visibilityMode: string = HIDE_ALL;
#commandMode: string = HIDE_ALL;
constructor() {
this.#units = {};
@@ -75,7 +75,7 @@ export class UnitsManager {
update(buffer: ArrayBuffer) {
var dataExtractor = new DataExtractor(buffer);
var updateTime = Number(dataExtractor.extractUInt64());
var requestRefresh = false;
while (dataExtractor.getSeekPosition() < buffer.byteLength) {
const ID = dataExtractor.extractUInt32();
if (!(ID in this.#units)) {
@@ -85,7 +85,7 @@ export class UnitsManager {
this.addUnit(ID, category);
}
else {
// TODO request a refresh since we must have missed some packets
requestRefresh = true;
}
}
this.#units[ID]?.setData(dataExtractor);
@@ -98,6 +98,10 @@ export class UnitsManager {
}
setLastUpdateTime(updateTime);
for (let ID in this.#units) {
this.#units[ID].drawLines();
};
}
setHiddenType(key: string, value: boolean) {
@@ -115,21 +119,21 @@ export class UnitsManager {
}
setVisibilityMode(newVisibilityMode: string) {
if (newVisibilityMode !== this.#visibilityMode) {
if (newVisibilityMode !== this.#commandMode) {
document.dispatchEvent(new CustomEvent("visibilityModeChanged", { detail: this }));
const el = document.getElementById("visibiliy-mode");
if (el) {
el.dataset.mode = newVisibilityMode;
el.textContent = newVisibilityMode.toUpperCase();
}
this.#visibilityMode = newVisibilityMode;
this.#commandMode = newVisibilityMode;
for (let ID in this.#units)
this.#units[ID].updateVisibility();
}
}
getVisibilityMode() {
return this.#visibilityMode;
getCommandMode() {
return this.#commandMode;
}
selectUnit(ID: number, deselectAllUnits: boolean = true) {
@@ -558,7 +562,7 @@ export class UnitsManager {
const probability = Math.pow(1 - minDistance / 50e3, 5) * IADSRoles[role];
if (Math.random() < probability){
const unitBlueprint = randomUnitBlueprintByRole(groundUnitsDatabase, role);
spawnGroundUnits([{unitName: unitBlueprint.name, latlng: latlng}], coalitionArea.getCoalition(), true);
spawnGroundUnits([{unitType: unitBlueprint.name, location: latlng}], coalitionArea.getCoalition(), true);
getMap().addTemporaryMarker(latlng, unitBlueprint.name, coalitionArea.getCoalition());
}
}
@@ -569,10 +573,12 @@ export class UnitsManager {
for (let ID in this.#units) {
var unit = this.#units[ID];
if (!["Aircraft", "Helicopter"].includes(unit.getCategory())) {
var data: any = unit.getData();
data.category = unit.getCategory();
if (unit.getGroupName() in unitsToExport)
unitsToExport[unit.getGroupName()].push(unit.getData());
unitsToExport[unit.getGroupName()].push(data);
else
unitsToExport[unit.getGroupName()] = [unit.getData()];
unitsToExport[unit.getGroupName()] = [data];
}
}
var a = document.createElement("a");
@@ -594,7 +600,12 @@ export class UnitsManager {
reader.onload = function(e: any) {
var contents = e.target.result;
var groups = JSON.parse(contents);
for (let groupName in groups) {
if (groupName !== "" && groups[groupName].length > 0 && groups[groupName].every((unit: any) => {return unit.category == "GroundUnit";})) {
var units = groups[groupName].map((unit: any) => {return {unitType: unit.name, location: unit.position}});
spawnGroundUnits(units, groups[groupName][0].coalition, true);
}
}
};
reader.readAsText(file);
})