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

Started working on unit spawning

Browse Source
This commit is contained in:
Pax1601 2024-04-14 12:34:38 +02:00
parent 40df2ebb7d
commit 288df71970
9 changed files with 117 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
frontend/react/src/constants/constants.ts
View File

@ -183,6 +183,7 @@ export const defaultMapLayers = {
/* Map constants */
export const IDLE = "Idle";
export const MOVE_UNIT = "Move unit";
export const SPAWN_UNIT = "Spawn unit";
export const COALITIONAREA_DRAW_POLYGON = "Draw Coalition Area";
export const IADSTypes = ["AAA", "SAM Site", "Radar (EWR)"];

2
frontend/react/src/main.tsx
View File

@ -12,4 +12,4 @@ ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
</React.StrictMode>,
)
window.onload = setupApp;
//window.onload = setupApp;

123
frontend/react/src/map/map.ts
View File

@ -12,7 +12,7 @@ import { DestinationPreviewMarker } from "./markers/destinationpreviewmarker";
import { TemporaryUnitMarker } from "./markers/temporaryunitmarker";
import { ClickableMiniMap } from "./clickableminimap";
import { SVGInjector } from '@tanem/svg-injector'
import { defaultMapLayers, mapBounds, minimapBoundaries, IDLE, COALITIONAREA_DRAW_POLYGON, MOVE_UNIT, SHOW_UNIT_CONTACTS, HIDE_GROUP_MEMBERS, SHOW_UNIT_PATHS, SHOW_UNIT_TARGETS, SHOW_UNIT_LABELS, SHOW_UNITS_ENGAGEMENT_RINGS, SHOW_UNITS_ACQUISITION_RINGS, HIDE_UNITS_SHORT_RANGE_RINGS, FILL_SELECTED_RING, /*MAP_MARKER_CONTROLS,*/ DCS_LINK_PORT, DCSMapsZoomLevelsByTheatre, DCS_LINK_RATIO, MAP_OPTIONS_DEFAULTS, MAP_HIDDEN_TYPES_DEFAULTS } from "../constants/constants";
import { defaultMapLayers, mapBounds, minimapBoundaries, IDLE, COALITIONAREA_DRAW_POLYGON, MOVE_UNIT, SHOW_UNIT_CONTACTS, HIDE_GROUP_MEMBERS, SHOW_UNIT_PATHS, SHOW_UNIT_TARGETS, SHOW_UNIT_LABELS, SHOW_UNITS_ENGAGEMENT_RINGS, SHOW_UNITS_ACQUISITION_RINGS, HIDE_UNITS_SHORT_RANGE_RINGS, FILL_SELECTED_RING, /*MAP_MARKER_CONTROLS,*/ DCS_LINK_PORT, DCSMapsZoomLevelsByTheatre, DCS_LINK_RATIO, MAP_OPTIONS_DEFAULTS, MAP_HIDDEN_TYPES_DEFAULTS, SPAWN_UNIT } from "../constants/constants";
import { CoalitionArea } from "./coalitionarea/coalitionarea";
//import { CoalitionAreaContextMenu } from "../contextmenus/coalitionareacontextmenu";
import { DrawingCursor } from "./coalitionarea/drawingcursor";
@ -29,7 +29,8 @@ import './markers/stylesheets/units.css'
// Temporary
import './theme.css'
import { MapHiddenTypes, MapOptions } from "../types/types";
import { Coalition, MapHiddenTypes, MapOptions } from "../types/types";
import { UnitBlueprint } from "../interfaces";
var hasTouchScreen = false;
//if ("maxTouchPoints" in navigator)
@ -45,7 +46,7 @@ else
// TODO would be nice to convert to ts - yes
//require("../../node_modules/leaflet.nauticscale/dist/leaflet.nauticscale.js")
//require("../../node_modules/leaflet-path-drag/dist/index.js")
export class Map extends L.Map {
/* Options */
#options: MapOptions = MAP_OPTIONS_DEFAULTS;
@ -54,6 +55,9 @@ export class Map extends L.Map {
#ID: string;
#state: string;
#layer: L.TileLayer | L.LayerGroup | null = null;
#spawningBlueprint: UnitBlueprint | null = null;
#preventLeftClick: boolean = false;
#leftClickTimer: number = 0;
#deafultPanDelta: number = 100;
@ -62,17 +66,23 @@ export class Map extends L.Map {
#panRight: boolean = false;
#panUp: boolean = false;
#panDown: boolean = false;
#lastMousePosition: L.Point = new L.Point(0, 0);
#shiftKey: boolean = false;
#ctrlKey: boolean = false;
#centerUnit: Unit | null = null;
#miniMap: ClickableMiniMap | null = null;
#miniMapLayerGroup: L.LayerGroup;
#miniMapPolyline: L.Polyline;
#temporaryMarkers: TemporaryUnitMarker[] = [];
#selecting: boolean = false;
#isZooming: boolean = false;
#previousZoom: number = 0;
#slaveDCSCamera: boolean = false;
#slaveDCSCameraAvailable: boolean = false;
#cameraControlTimer: number = 0;
@ -88,6 +98,8 @@ export class Map extends L.Map {
#drawingCursor: DrawingCursor = new DrawingCursor();
#destinationPreviewHandle: DestinationPreviewHandle = new DestinationPreviewHandle(new L.LatLng(0, 0));
#destinationPreviewHandleLine: L.Polyline = new L.Polyline([], { color: "#000000", weight: 3, opacity: 0.5, smoothFactor: 1, dashArray: "4, 8" });
#spawnCursor: TemporaryUnitMarker | null = null;
#longPressHandled: boolean = false;
#longPressTimer: number = 0;
@ -128,7 +140,7 @@ export class Map extends L.Map {
this.#miniMapLayerGroup = new L.LayerGroup([minimapLayer]);
this.#miniMapPolyline = new L.Polyline([], { color: '#202831' });
this.#miniMapPolyline.addTo(this.#miniMapLayerGroup);
/* Scale */
//@ts-ignore TODO more hacking because the module is provided as a pure javascript module only
@ -137,7 +149,7 @@ export class Map extends L.Map {
/* Map source dropdown */
//this.#mapSourceDropdown = new Dropdown("map-type", (layerName: string) => this.setLayer(layerName));
//this.#mapSourceDropdown.setOptions(this.getLayers(), null);
//
//
///* Visibility options dropdown */
//this.#mapVisibilityOptionsDropdown = new Dropdown("map-visibility-options", (value: string) => { });
@ -216,13 +228,13 @@ export class Map extends L.Map {
document.addEventListener("toggleCameraLinkStatus", () => {
// if (this.#slaveDCSCameraAvailable) { // Commented to experiment with usability
this.setSlaveDCSCamera(!this.#slaveDCSCamera);
this.setSlaveDCSCamera(!this.#slaveDCSCamera);
// }
})
document.addEventListener("slewCameraToPosition", () => {
// if (this.#slaveDCSCameraAvailable) { // Commented to experiment with usability
this.#broadcastPosition();
this.#broadcastPosition();
// }
})
@ -256,14 +268,14 @@ export class Map extends L.Map {
} else {
this.#layer = new L.TileLayer(layerData.urlTemplate, layerData);
}
/* DCS core layers are handled here */
} else if (["DCS Map", "DCS Satellite"].includes(layerName) ) {
/* DCS core layers are handled here */
} else if (["DCS Map", "DCS Satellite"].includes(layerName)) {
let layerData = this.#mapLayers["ArcGIS Satellite"];
let layers = [new L.TileLayer(layerData.urlTemplate, layerData)];
let template = `https://maps.dcsolympus.com/maps/${layerName === "DCS Map"? "alt": "sat"}-{theatre}-modern/{z}/{x}/{y}.png`;
let template = `https://maps.dcsolympus.com/maps/${layerName === "DCS Map" ? "alt" : "sat"}-{theatre}-modern/{z}/{x}/{y}.png`;
layers.push(...DCSMapsZoomLevelsByTheatre[theatre].map((nativeZoomLevels: any) => {
return new L.TileLayer(template.replace("{theatre}", theatre.toLowerCase()), {...nativeZoomLevels, maxZoom: 20, crossOrigin: ""});
return new L.TileLayer(template.replace("{theatre}", theatre.toLowerCase()), { ...nativeZoomLevels, maxZoom: 20, crossOrigin: "" });
}));
this.#layer = new L.LayerGroup(layers);
@ -280,9 +292,8 @@ export class Map extends L.Map {
}
/* State machine */
setState(state: string) {
setState(state: string, options?: { blueprint: UnitBlueprint, coalition: Coalition }) {
this.#state = state;
this.#updateCursor();
/* Operations to perform if you are NOT in a state */
if (this.#state !== COALITIONAREA_DRAW_POLYGON) {
@ -290,10 +301,18 @@ export class Map extends L.Map {
}
/* Operations to perform if you ARE in a state */
if (this.#state === COALITIONAREA_DRAW_POLYGON) {
if (this.#state === SPAWN_UNIT) {
this.#spawningBlueprint = options?.blueprint ?? null;
this.#spawnCursor?.removeFrom(this);
this.#spawnCursor = new TemporaryUnitMarker(new L.LatLng(0, 0), this.#spawningBlueprint?.name ?? "unknown", options?.coalition ?? 'blue');
}
else if (this.#state === COALITIONAREA_DRAW_POLYGON) {
this.#coalitionAreas.push(new CoalitionArea([]));
this.#coalitionAreas[this.#coalitionAreas.length - 1].addTo(this);
}
this.#updateCursor();
document.dispatchEvent(new CustomEvent("mapStateChanged"));
}
@ -447,7 +466,7 @@ export class Map extends L.Map {
const boundaries = this.#getMinimapBoundaries();
this.#miniMapPolyline.setLatLngs(boundaries[theatre as keyof typeof boundaries]);
this.setLayer(this.#layerName);
}
@ -539,10 +558,10 @@ export class Map extends L.Map {
// }
// return list;
//}, [] as string[]);
//
//
//if (toggles.length === 0)
// return false;
//
//
//return toggles.some((toggle: string) => {
// // Specific coding for robots - extend later if needed
// return (toggle === "dcs" && !unit.getControlled() && !unit.getHuman());
@ -601,6 +620,14 @@ export class Map extends L.Map {
if (this.#state === IDLE) {
this.deselectAllCoalitionAreas();
}
else if (this.#state === SPAWN_UNIT) {
//getApp().getUnitsManager().spawnUnits(
// "asd",
// [
// {}
// ]
//)
}
else if (this.#state === COALITIONAREA_DRAW_POLYGON) {
if (this.getSelectedCoalitionArea()?.getEditing()) {
this.getSelectedCoalitionArea()?.addTemporaryLatLng(e.latlng);
@ -693,25 +720,25 @@ export class Map extends L.Map {
}
}
this.#longPressTimer = window.setTimeout(() => {
this.hideMapContextMenu();
this.#longPressHandled = true;
if (e.originalEvent.button != 2 || e.originalEvent.ctrlKey || e.originalEvent.shiftKey)
return;
var contextActionSet = new ContextActionSet();
var units = getApp().getUnitsManager().getSelectedUnits();
units.forEach((unit: Unit) => {
unit.appendContextActions(contextActionSet, null, e.latlng);
})
if (Object.keys(contextActionSet.getContextActions()).length > 0) {
getApp().getMap().showUnitContextMenu(e.originalEvent.x, e.originalEvent.y, e.latlng);
//getApp().getMap().getUnitContextMenu().setContextActions(contextActionSet);
}
}, 150);
this.#longPressHandled = false;
//this.#longPressTimer = window.setTimeout(() => {
// this.hideMapContextMenu();
// this.#longPressHandled = true;
//
// if (e.originalEvent.button != 2 || e.originalEvent.ctrlKey || e.originalEvent.shiftKey)
// return;
//
// var contextActionSet = new ContextActionSet();
// var units = getApp().getUnitsManager().getSelectedUnits();
// units.forEach((unit: Unit) => {
// unit.appendContextActions(contextActionSet, null, e.latlng);
// })
//
// if (Object.keys(contextActionSet.getContextActions()).length > 0) {
// getApp().getMap().showUnitContextMenu(e.originalEvent.x, e.originalEvent.y, e.latlng);
// //getApp().getMap().getUnitContextMenu().setContextActions(contextActionSet);
// }
//}, 150);
//this.#longPressHandled = false;
}
#onMouseUp(e: any) {
@ -739,6 +766,9 @@ export class Map extends L.Map {
this.#destinationGroupRotation = -bearing(this.#destinationRotationCenter.lat, this.#destinationRotationCenter.lng, this.getMouseCoordinates().lat, this.getMouseCoordinates().lng);
this.#updateDestinationCursors();
}
else if (this.#state === SPAWN_UNIT) {
this.#updateSpawnCursor();
}
else if (this.#state === COALITIONAREA_DRAW_POLYGON && e.latlng !== undefined) {
this.#drawingCursor.setLatLng(e.latlng);
/* Update the polygon being drawn with the current position of the mouse cursor */
@ -825,17 +855,20 @@ export class Map extends L.Map {
/* Hide all non default cursors */
this.#hideDestinationCursors();
this.#hideDrawingCursor();
this.#hideSpawnCursor();
this.#showDefaultCursor();
} else {
/* Hide all the unnecessary cursors depending on the active state */
if (this.#state !== IDLE) this.#hideDefaultCursor();
if (this.#state !== MOVE_UNIT) this.#hideDestinationCursors();
if (this.#state !== SPAWN_UNIT) this.#hideSpawnCursor();
if (this.#state !== COALITIONAREA_DRAW_POLYGON) this.#hideDrawingCursor();
/* Show the active cursor depending on the active state */
if (this.#state === IDLE) this.#showDefaultCursor();
else if (this.#state === MOVE_UNIT) this.#showDestinationCursors();
else if (this.#state === SPAWN_UNIT) this.#showSpawnCursor();
else if (this.#state === COALITIONAREA_DRAW_POLYGON) this.#showDrawingCursor();
}
}
@ -923,6 +956,18 @@ export class Map extends L.Map {
this.#drawingCursor.removeFrom(this);
}
#showSpawnCursor() {
this.#spawnCursor?.addTo(this);
}
#updateSpawnCursor() {
this.#spawnCursor?.setLatLng(this.getMouseCoordinates());
}
#hideSpawnCursor() {
this.#spawnCursor?.removeFrom(this);
}
#setSlaveDCSCameraAvailable(newSlaveDCSCameraAvailable: boolean) {
this.#slaveDCSCameraAvailable = newSlaveDCSCameraAvailable;
let linkButton = document.getElementById("camera-link-control");
@ -939,12 +984,12 @@ export class Map extends L.Map {
}
/* Check if the camera control plugin is available. Right now this will only change the color of the button, no changes in functionality */
#checkCameraPort(){
#checkCameraPort() {
if (this.#cameraOptionsXmlHttp?.readyState !== 4)
this.#cameraOptionsXmlHttp?.abort()
this.#cameraOptionsXmlHttp = new XMLHttpRequest();
/* Using 127.0.0.1 instead of localhost because the LuaSocket version used in DCS only listens to IPv4. This avoids the lag caused by the
browser if it first tries to send the request on the IPv6 address for localhost */
this.#cameraOptionsXmlHttp.open("OPTIONS", `http://127.0.0.1:${this.#cameraControlPort}`);

3
frontend/react/src/olympusapp.ts
View File

@ -35,7 +35,6 @@ import { aircraftDatabase } from "./unit/databases/aircraftdatabase";
import { helicopterDatabase } from "./unit/databases/helicopterdatabase";
import { groundUnitDatabase } from "./unit/databases/groundunitdatabase";
import { navyUnitDatabase } from "./unit/databases/navyunitdatabase";
import { initFlowbite } from "flowbite";
//import { UnitListPanel } from "./panels/unitlistpanel";
//import { ContextManager } from "./context/contextmanager";
//import { Context } from "./context/context";
@ -478,7 +477,7 @@ export class OlympusApp {
}
/* Temporary */
this.getServerManager().setCredentials("admin", "4b8823ed9e5c2392ab4a791913bb8ce41956ea32e308b760eefb97536746dd33");
this.getServerManager().setCredentials("admin", "6b86b273ff34fce19d6b804eff5a3f5747ada4eaa22f1d49c01e52ddb7875b4b");
this.getServerManager().startUpdate();
/* Reload the page, used to mimic a restart of the app */

2
frontend/react/src/ui/panels/header.tsx
View File

@ -13,7 +13,7 @@ export function Header() {
{(appState) =>
<EventsConsumer>
{(events) =>
<nav className="flex w-screen h-[66px] bg-gray-300 border-gray-200 dark:bg-[#171C26] dark:border-gray-700 px-3">
<nav className="flex w-screen h-[66px] bg-gray-300 border-gray-200 dark:bg-[#171C26] dark:border-gray-700 px-3 z-ui-1">
<div className="w-full max-w-full flex flex-nowrap items-center justify-between gap-3 my-auto">
<div className="flex flex-row items-center justify-center gap-1 flex-none">
<img src="images/icon.png" className='h-10 w-10 p-0 rounded-md mr-2 cursor-pointer'></img>

19
frontend/react/src/ui/panels/spawnmenu.tsx
View File

@ -1,4 +1,4 @@
import React, { useState } from "react";
import React, { useEffect, useState } from "react";
import { Menu } from "./components/menu";
import { faHelicopter, faJetFighter, faPlus, faShieldAlt, faShip, faTruck } from '@fortawesome/free-solid-svg-icons';
import { library } from '@fortawesome/fontawesome-svg-core'
@ -9,6 +9,7 @@ import { OlUnitEntryList } from "../components/olunitlistentry";
import { UnitSpawnMenu } from "./unitspawnmenu";
import { UnitBlueprint } from "../../interfaces";
import { olButtonsVisibilityAircraft, olButtonsVisibilityGroundunit, olButtonsVisibilityGroundunitSam, olButtonsVisibilityHelicopter, olButtonsVisibilityNavyunit } from "../components/olicons";
import { SPAWN_UNIT } from "../../constants/constants";
library.add(faPlus);
@ -31,6 +32,12 @@ export function SpawnMenu(props: {
var [blueprint, setBlueprint] = useState(null as (null | UnitBlueprint));
var [filterString, setFilterString] = useState("");
useEffect(() => {
if (!props.open || blueprint !== null) {
//getApp()?.getMap()?.setState(SPAWN_UNIT, {name: blueprint?.name ?? '', coalition: 'blue'});
}
} )
/* Filter aircrafts, helicopters, and navyunits */
const filteredAircraft = filterUnits(getApp()?.getAircraftDatabase()?.blueprints, filterString);
const filteredHelicopters = filterUnits(getApp()?.getHelicopterDatabase()?.blueprints, filterString);
@ -59,7 +66,7 @@ export function SpawnMenu(props: {
<>
{(blueprint === null) && <div className="p-5">
<OlSearchBar onChange={(ev) => setFilterString(ev.target.value)}/>
<OlAccordion title={`Aircrafts (${Object.keys(filteredAircraft).length})`}>
<OlAccordion title={`Aircrafts`}>
<div className="flex flex-col gap-1 max-h-80 overflow-y-scroll">
{Object.keys(filteredAircraft).map((key) => {
const blueprint = getApp().getAircraftDatabase().blueprints[key];
@ -67,7 +74,7 @@ export function SpawnMenu(props: {
})}
</div>
</OlAccordion>
<OlAccordion title={`Helicopters (${Object.keys(filteredHelicopters).length})`}>
<OlAccordion title={`Helicopters`}>
<div className="flex flex-col gap-1 max-h-80 overflow-y-scroll">
{Object.keys(filteredHelicopters).map((key) => {
const blueprint = getApp().getHelicopterDatabase().blueprints[key];
@ -75,7 +82,7 @@ export function SpawnMenu(props: {
})}
</div>
</OlAccordion>
<OlAccordion title={`SAM & AAA (${Object.keys(filteredAirDefense).length})`}>
<OlAccordion title={`SAM & AAA`}>
<div className="flex flex-col gap-1 max-h-80 overflow-y-scroll">
{Object.keys(filteredAirDefense).map((key) => {
const blueprint = getApp().getGroundUnitDatabase().blueprints[key];
@ -83,7 +90,7 @@ export function SpawnMenu(props: {
})}
</div>
</OlAccordion>
<OlAccordion title={`Ground Units (${Object.keys(filteredGroundUnits).length})`}>
<OlAccordion title={`Ground Units`}>
<div className="flex flex-col gap-1 max-h-80 overflow-y-scroll">
{Object.keys(filteredGroundUnits).map((key) => {
const blueprint = getApp().getGroundUnitDatabase().blueprints[key];
@ -91,7 +98,7 @@ export function SpawnMenu(props: {
})}
</div>
</OlAccordion>
<OlAccordion title={`Ships and submarines (${Object.keys(filteredNavyUnits).length})`}>
<OlAccordion title={`Ships and submarines`}>
<div className="flex flex-col gap-1 max-h-80 overflow-y-scroll">
{Object.keys(filteredNavyUnits).map((key) => {
const blueprint = getApp().getNavyUnitDatabase().blueprints[key];

23
frontend/react/src/ui/panels/unitcontrolmenu.tsx
View File

@ -10,6 +10,7 @@ import { OlToggle } from "../components/oltoggle";
import { OlCoalitionToggle } from "../components/olcoalitiontoggle";
import { olButtonsEmissionsAttack, olButtonsEmissionsDefend, olButtonsEmissionsFree, olButtonsEmissionsSilent, olButtonsIntensity1, olButtonsIntensity2, olButtonsIntensity3, olButtonsRoeDesignated, olButtonsRoeFree, olButtonsRoeHold, olButtonsRoeReturn, olButtonsScatter1, olButtonsScatter2, olButtonsScatter3, olButtonsThreatEvade, olButtonsThreatManoeuvre, olButtonsThreatNone, olButtonsThreatPassive } from "../components/olicons";
import { Coalition } from "../../types/types";
import { ftToM, knotsToMs, mToFt, msToKnots } from "../../other/utils";
export function UnitControlMenu() {
var [open, setOpen] = useState(false);
@ -63,13 +64,13 @@ export function UnitControlMenu() {
/* Update the current values of the shown data */
function updateData() {
const getters = {
desiredAltitude: (unit: Unit) => { return unit.getDesiredAltitude(); },
desiredAltitude: (unit: Unit) => { return Math.round(mToFt(unit.getDesiredAltitude())); },
desiredAltitudeType: (unit: Unit) => { return unit.getDesiredAltitudeType(); },
desiredSpeed: (unit: Unit) => { return unit.getDesiredSpeed(); },
desiredSpeed: (unit: Unit) => { return Math.round(msToKnots(unit.getDesiredSpeed())); },
desiredSpeedType: (unit: Unit) => { return unit.getDesiredSpeedType(); },
ROE: (unit: Unit) => { return unit.getROE(); },
reactionToThreat: (unit: Unit) => { return unit.getReactionToThreat(); },
emissionsCountermeasures: (unit: Unit) => { return unit.getROE(); },
emissionsCountermeasures: (unit: Unit) => { return unit.getEmissionsCountermeasures(); },
shotsScatter: (unit: Unit) => { return unit.getShotsScatter(); },
shotsIntensity: (unit: Unit) => { return unit.getShotsIntensity(); },
operateAs: (unit: Unit) => { return unit.getOperateAs(); },
@ -158,7 +159,7 @@ export function UnitControlMenu() {
<OlRangeSlider
onChange={(ev) => {
selectedUnits.forEach((unit) => {
unit.setAltitude(Number(ev.target.value));
unit.setAltitude(ftToM(Number(ev.target.value)));
setSelectedUnitsData({
...selectedUnitsData,
desiredAltitude: Number(ev.target.value)
@ -200,7 +201,7 @@ export function UnitControlMenu() {
<OlRangeSlider
onChange={(ev) => {
selectedUnits.forEach((unit) => {
unit.setSpeed(Number(ev.target.value));
unit.setSpeed(knotsToMs(Number(ev.target.value)));
setSelectedUnitsData({
...selectedUnitsData,
desiredSpeed: Number(ev.target.value)
@ -318,14 +319,14 @@ export function UnitControlMenu() {
return <OlButtonGroupItem
onClick={() => {
selectedUnits.forEach((unit) => {
unit.setShotsScatter(idx);
unit.setShotsScatter((idx + 1));
setSelectedUnitsData({
...selectedUnitsData,
shotsScatter: idx
shotsScatter: (idx + 1)
})
})
}}
active={selectedUnitsData.shotsScatter === idx}
active={selectedUnitsData.shotsScatter === (idx + 1)}
icon={icon} />
})
}
@ -339,14 +340,14 @@ export function UnitControlMenu() {
return <OlButtonGroupItem
onClick={() => {
selectedUnits.forEach((unit) => {
unit.setShotsIntensity(idx);
unit.setShotsIntensity((idx + 1));
setSelectedUnitsData({
...selectedUnitsData,
shotsIntensity: idx
shotsIntensity: (idx + 1)
})
})
}}
active={selectedUnitsData.shotsIntensity === idx}
active={selectedUnitsData.shotsIntensity === (idx + 1)}
icon={icon} />
})
}

2
frontend/react/src/ui/ui.tsx
View File

@ -77,12 +77,12 @@ export function UI() {
<Header />
<div className='flex h-full'>
<SideBar />
<div id='map-container' className='relative h-full w-screen top-0 left-0' />
<MainMenu open={mainMenuVisible} onClose={() => setMainMenuVisible(false)} />
<SpawnMenu open={spawnMenuVisible} onClose={() => setSpawnMenuVisible(false)} />
<UnitControlMenu />
</div>
</div>
<div id='map-container' className='fixed h-full w-screen top-0 left-0' />
</EventsProvider>
</StateProvider>
</div>

8
frontend/server/demo.js
View File

@ -67,7 +67,7 @@ module.exports = function (configLocation) {
}
/*
// UNCOMMENT TO TEST ALL UNITS ****************
var databases = Object.assign({}, aircraftDatabase, helicopterDatabase, groundUnitDatabase, navyUnitDatabase);
@ -105,8 +105,8 @@ module.exports = function (configLocation) {
}
}
*/
/*
let idx = 1;
DEMO_UNIT_DATA[idx] = JSON.parse(JSON.stringify(baseData));
DEMO_UNIT_DATA[idx].name = "S_75M_Volhov";
@ -142,7 +142,6 @@ module.exports = function (configLocation) {
DEMO_UNIT_DATA[idx].coalition = 1;
DEMO_UNIT_DATA[idx].desiredAltitude = 10000;
DEMO_UNIT_DATA[idx].desiredAltitudeType = 0;
idx += 1;
DEMO_UNIT_DATA[idx] = JSON.parse(JSON.stringify(baseData));
@ -171,8 +170,7 @@ module.exports = function (configLocation) {
DEMO_UNIT_DATA[idx].position.lat += idx / 100;
DEMO_UNIT_DATA[idx].category = "Aircraft";
DEMO_UNIT_DATA[idx].isLeader = true;
*/
this.startTime = Date.now();
}