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

Added explosions, protection screen and delete unit

Browse Source
This commit is contained in:
Davide Passoni
2024-10-12 17:13:41 +02:00
parent 44bd054a3d
commit 4947997a0c
24 changed files with 1083 additions and 953 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -20,10 +20,11 @@ import {
COALITIONAREA_EDIT,
COALITIONAREA_DRAW_CIRCLE,
NOT_INITIALIZED,
SPAWN_EFFECT,
} from "../constants/constants";
import { CoalitionPolygon } from "./coalitionarea/coalitionpolygon";
import { MapHiddenTypes, MapOptions } from "../types/types";
import { SpawnRequestTable } from "../interfaces";
import { EffectRequestTable, SpawnRequestTable } from "../interfaces";
import { ContextAction } from "../unit/contextaction";
/* Stylesheets */
@@ -35,6 +36,7 @@ import { CoalitionCircle } from "./coalitionarea/coalitioncircle";
import { initDraggablePath } from "./coalitionarea/draggablepath";
import { faDrawPolygon, faHandPointer, faJetFighter, faMap } from "@fortawesome/free-solid-svg-icons";
import { ExplosionMarker } from "./markers/explosionmarker";
/* Register the handler for the box selection */
L.Map.addInitHook("addHandler", "boxSelect", BoxSelect);
@@ -108,6 +110,7 @@ export class Map extends L.Map {
/* Unit spawning */
#spawnRequestTable: SpawnRequestTable | null = null;
#effectRequestTable: EffectRequestTable | null = null;
#temporaryMarkers: TemporaryUnitMarker[] = [];
#currentSpawnMarker: TemporaryUnitMarker | null = null;
@@ -342,6 +345,7 @@ export class Map extends L.Map {
state: string,
options?: {
spawnRequestTable?: SpawnRequestTable;
effectRequestTable?: EffectRequestTable;
contextAction?: ContextAction | null;
defaultContextAction?: ContextAction | null;
}
@@ -366,6 +370,13 @@ export class Map extends L.Map {
console.log(this.#spawnRequestTable);
this.#currentSpawnMarker = new TemporaryUnitMarker(new L.LatLng(0, 0), this.#spawnRequestTable?.unit.unitType ?? "", this.#spawnRequestTable?.coalition ?? "neutral")
this.#currentSpawnMarker.addTo(this);
} else if (this.#state === SPAWN_EFFECT) {
this.deselectAllCoalitionAreas();
this.#effectRequestTable = options?.effectRequestTable ?? null;
console.log(`Effect request table:`);
console.log(this.#effectRequestTable);
//this.#currentEffectMarker = new TemporaryUnitMarker(new L.LatLng(0, 0), this.#spawnRequestTable?.unit.unitType ?? "", this.#spawnRequestTable?.coalition ?? "neutral")
//this.#currentEffectMarker.addTo(this);
} else if (this.#state === CONTEXT_ACTION) {
this.deselectAllCoalitionAreas();
this.#contextAction = options?.contextAction ?? null;
@@ -435,6 +446,24 @@ export class Map extends L.Map {
text: "Move map location",
},
];
} else if (this.#state === SPAWN_EFFECT) {
return [
{
actions: [touch ? faHandPointer : "LMB"],
target: faMap,
text: "Spawn effect",
},
{
actions: [touch ? faHandPointer : "LMB", 2],
target: faMap,
text: "Exit spawn mode",
},
{
actions: [touch ? faHandPointer : "LMB", "Drag"],
target: faMap,
text: "Move map location",
},
];
} else if (this.#state === CONTEXT_ACTION) {
let controls = [
{
@@ -670,6 +699,12 @@ export class Map extends L.Map {
return marker;
}
addExplosionMarker(latlng: L.LatLng, timeout: number = 30) {
var marker = new ExplosionMarker(latlng, timeout);
marker.addTo(this);
return marker;
}
getSelectedCoalitionArea() {
const coalitionArea = this.#coalitionAreas.find((coalitionArea: CoalitionPolygon | CoalitionCircle) => {
return coalitionArea.getSelected();
@@ -695,24 +730,6 @@ export class Map extends L.Map {
return this.#previousZoom;
}
getIsUnitProtected(unit: Unit) {
//const toggles = this.#mapMarkerVisibilityControls.reduce((list, control: MapMarkerVisibilityControl) => {
// if (control.isProtected) {
// list = list.concat(control.toggles);
// }
// 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());
//});
return false;
}
setSlaveDCSCamera(newSlaveDCSCamera: boolean) {
this.#slaveDCSCamera = newSlaveDCSCamera;
let button = document.getElementById("camera-link-control");
@@ -829,6 +846,7 @@ export class Map extends L.Map {
this.setState(COALITIONAREA_EDIT);
} else {
this.setState(IDLE);
document.dispatchEvent(new CustomEvent("hideAllMenus"))
}
}
@@ -861,7 +879,11 @@ export class Map extends L.Map {
}
);
}
} else if (this.#state === COALITIONAREA_DRAW_POLYGON) {
} else if (this.#state === SPAWN_EFFECT) {
if (e.originalEvent.button != 2 && this.#effectRequestTable !== null) {
getApp().getServerManager().spawnExplosion(50, 'normal', pressLocation);
}
} else if (this.#state === COALITIONAREA_DRAW_POLYGON) {
const selectedArea = this.getSelectedCoalitionArea();
if (selectedArea && selectedArea instanceof CoalitionPolygon) {
selectedArea.addTemporaryLatLng(pressLocation);

38
frontend/react/src/map/markers/explosionmarker.ts Normal file
View File

@@ -0,0 +1,38 @@
import { CustomMarker } from "./custommarker";
import { DivIcon, LatLng } from "leaflet";
import { SVGInjector } from "@tanem/svg-injector";
import { getApp } from "../../olympusapp";
export class ExplosionMarker extends CustomMarker {
#timer: number = 0;
#timeout: number = 0;
constructor(latlng: LatLng, timeout: number) {
super(latlng, { interactive: false });
this.#timeout = timeout;
this.#timer = window.setTimeout(() => {
this.removeFrom(getApp().getMap());
}, timeout * 1000);
}
createIcon() {
/* Set the icon */
var icon = new DivIcon({
className: "leaflet-explosion-icon",
iconAnchor: [25, 25],
iconSize: [50, 50],
});
this.setIcon(icon);
var el = document.createElement("div");
var img = document.createElement("img");
img.src = `/vite/images/markers/smoke.svg`;
img.onload = () => SVGInjector(img);
el.append(img);
this.getElement()?.appendChild(el);
this.getElement()?.classList.add("ol-temporary-marker");
}
}