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 advanced settings panel for tanker and AWACS

Browse Source 
Reformatted files with larger width, reordered unused icons
This commit is contained in:
Pax1601
2024-08-07 15:32:39 +02:00
parent bc5049992a
commit 224dc5a688
158 changed files with 5813 additions and 6404 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
frontend/react/src/map/coalitionarea/coalitionarea.ts
View File

@@ -1,5 +0,0 @@
const CoalitionArea = Base => class extends Base {
}
export CoalitionArea;

2
frontend/react/src/map/coalitionarea/coalitionareahandle.ts
View File

@@ -7,7 +7,7 @@ export class CoalitionAreaHandle extends CustomMarker {
this.on("add", (e) => {
this.getElement()?.addEventListener("touchstart", (e) => e.stopPropagation());
})
});
}
createIcon() {

33
frontend/react/src/map/coalitionarea/coalitioncircle.ts
View File

@@ -1,12 +1,4 @@
import {
LatLngExpression,
Map,
Circle,
DivIcon,
Marker,
CircleOptions,
LatLng,
} from "leaflet";
import { LatLngExpression, Map, Circle, DivIcon, Marker, CircleOptions, LatLng } from "leaflet";
import { getApp } from "../../olympusapp";
import { CoalitionAreaHandle } from "./coalitionareahandle";
import { BLUE_COMMANDER, RED_COMMANDER } from "../../constants/constants";
@@ -38,11 +30,7 @@ export class CoalitionCircle extends Circle {
this.#labelText = `Circle ${totalAreas}`;
if (
[BLUE_COMMANDER, RED_COMMANDER].includes(
getApp().getMissionManager().getCommandModeOptions().commandMode
)
)
if ([BLUE_COMMANDER, RED_COMMANDER].includes(getApp().getMissionManager().getCommandModeOptions().commandMode))
this.setCoalition(getApp().getMissionManager().getCommandedCoalition());
this.on("drag", () => {
@@ -129,14 +117,8 @@ export class CoalitionCircle extends Circle {
if (this.#radiusHandle) this.#radiusHandle.removeFrom(getApp().getMap());
if (this.#selected) {
const dest = turf.destination(
turf.point([this.getLatLng().lng, this.getLatLng().lat]),
this.getRadius() / 1000,
0
);
this.#radiusHandle = new CoalitionAreaHandle(
new LatLng(dest.geometry.coordinates[1], dest.geometry.coordinates[0])
);
const dest = turf.destination(turf.point([this.getLatLng().lng, this.getLatLng().lat]), this.getRadius() / 1000, 0);
this.#radiusHandle = new CoalitionAreaHandle(new LatLng(dest.geometry.coordinates[1], dest.geometry.coordinates[0]));
this.#radiusHandle.addTo(getApp().getMap());
this.#radiusHandle.on("drag", (e: any) => {
this.setRadius(this.getLatLng().distanceTo(e.latlng));
@@ -156,11 +138,6 @@ export class CoalitionCircle extends Circle {
}),
interactive: false,
}).addTo(this._map);
this.#label
.getElement()
?.classList.add(
`ol-coalitionarea-label`,
`${this.#selected ? "selected" : `${this.#coalition}`}`
);
this.#label.getElement()?.classList.add(`ol-coalitionarea-label`, `${this.#selected ? "selected" : `${this.#coalition}`}`);
}
}

56
frontend/react/src/map/coalitionarea/coalitionpolygon.ts
View File

@@ -1,13 +1,4 @@
import {
LatLng,
LatLngExpression,
Map,
Point,
Polygon,
PolylineOptions,
DivIcon,
Marker
} from "leaflet";
import { LatLng, LatLngExpression, Map, Point, Polygon, PolylineOptions, DivIcon, Marker } from "leaflet";
import { getApp } from "../../olympusapp";
import { CoalitionAreaHandle } from "./coalitionareahandle";
import { CoalitionAreaMiddleHandle } from "./coalitionareamiddlehandle";
@@ -27,10 +18,7 @@ export class CoalitionPolygon extends Polygon {
#labelText: string;
#label: Marker;
constructor(
latlngs: LatLngExpression[] | LatLngExpression[][] | LatLngExpression[][][],
options?: PolylineOptions
) {
constructor(latlngs: LatLngExpression[] | LatLngExpression[][] | LatLngExpression[][][], options?: PolylineOptions) {
if (options === undefined) options = {};
totalAreas++;
@@ -45,11 +33,7 @@ export class CoalitionPolygon extends Polygon {
this.#labelText = `Polygon ${totalAreas}`;
if (
[BLUE_COMMANDER, RED_COMMANDER].includes(
getApp().getMissionManager().getCommandModeOptions().commandMode
)
)
if ([BLUE_COMMANDER, RED_COMMANDER].includes(getApp().getMissionManager().getCommandModeOptions().commandMode))
this.setCoalition(getApp().getMissionManager().getCommandedCoalition());
this.on("drag", () => {
@@ -130,17 +114,11 @@ export class CoalitionPolygon extends Polygon {
onRemove(map: Map): this {
super.onRemove(map);
this.#handles
.concat(this.#middleHandles)
.forEach((handle: CoalitionAreaHandle | CoalitionAreaMiddleHandle) =>
handle.removeFrom(getApp().getMap())
);
this.#handles.concat(this.#middleHandles).forEach((handle: CoalitionAreaHandle | CoalitionAreaMiddleHandle) => handle.removeFrom(getApp().getMap()));
return this;
}
setLatLngs(
latlngs: LatLngExpression[] | LatLngExpression[][] | LatLngExpression[][][]
) {
setLatLngs(latlngs: LatLngExpression[] | LatLngExpression[][] | LatLngExpression[][][]) {
super.setLatLngs(latlngs);
this.#drawLabel();
return this;
@@ -158,9 +136,7 @@ export class CoalitionPolygon extends Polygon {
}
#setHandles() {
this.#handles.forEach((handle: CoalitionAreaHandle) =>
handle.removeFrom(getApp().getMap())
);
this.#handles.forEach((handle: CoalitionAreaHandle) => handle.removeFrom(getApp().getMap()));
this.#handles = [];
if (this.getSelected()) {
var latlngs = this.getLatLngs()[0] as LatLng[];
@@ -181,9 +157,7 @@ export class CoalitionPolygon extends Polygon {
}
#setMiddleHandles() {
this.#middleHandles.forEach((handle: CoalitionAreaMiddleHandle) =>
handle.removeFrom(getApp().getMap())
);
this.#middleHandles.forEach((handle: CoalitionAreaMiddleHandle) => handle.removeFrom(getApp().getMap()));
this.#middleHandles = [];
var latlngs = this.getLatLngs()[0] as LatLng[];
if (this.getSelected() && latlngs.length >= 2) {
@@ -193,13 +167,8 @@ export class CoalitionPolygon extends Polygon {
if (lastLatLng != null) {
const handle1Point = getApp().getMap().latLngToLayerPoint(latlng);
const handle2Point = getApp().getMap().latLngToLayerPoint(lastLatLng);
const middlePoint = new Point(
(handle1Point.x + handle2Point.x) / 2,
(handle1Point.y + handle2Point.y) / 2
);
const middleLatLng = getApp()
.getMap()
.layerPointToLatLng(middlePoint);
const middlePoint = new Point((handle1Point.x + handle2Point.x) / 2, (handle1Point.y + handle2Point.y) / 2);
const middleLatLng = getApp().getMap().layerPointToLatLng(middlePoint);
const middleHandle = new CoalitionAreaMiddleHandle(middleLatLng);
middleHandle.addTo(getApp().getMap());
@@ -228,12 +197,7 @@ export class CoalitionPolygon extends Polygon {
}),
interactive: false,
}).addTo(this._map);
this.#label
.getElement()
?.classList.add(
`ol-coalitionarea-label`,
`${this.#selected ? "selected" : `${this.#coalition}`}`
);
this.#label.getElement()?.classList.add(`ol-coalitionarea-label`, `${this.#selected ? "selected" : `${this.#coalition}`}`);
}
}
}

24
frontend/react/src/map/coalitionarea/draggablepath.ts
View File

@@ -1,6 +1,4 @@
import * as L from "leaflet";
export const initDraggablePath = () => {
export const initDraggablePath = (L) => {
//@ts-ignore
L.PathDraggable = L.Draggable.extend({
initialize: function (path) {
@@ -8,9 +6,7 @@ export const initDraggablePath = () => {
this._canvas = path._map.getRenderer(path) instanceof L.Canvas;
var element = this._canvas
? this._path._map.getRenderer(this._path)._container
: this._path._path;
var element = this._canvas ? this._path._map.getRenderer(this._path)._container : this._path._path;
//@ts-ignore
L.Draggable.prototype.initialize.call(this, element, element, true);
@@ -27,12 +23,7 @@ export const initDraggablePath = () => {
this._startPoint = new L.Point(first.clientX, first.clientY);
if (
this._canvas &&
!this._path._containsPoint(
this._path._map.mouseEventToLayerPoint(first)
)
) {
if (this._canvas && !this._path._containsPoint(this._path._map.mouseEventToLayerPoint(first))) {
return;
}
@@ -87,10 +78,7 @@ export const initDraggablePath = () => {
_onDrag: function (e) {
var path = this._path,
event =
e.originalEvent.touches && e.originalEvent.touches.length === 1
? e.originalEvent.touches[0]
: e.originalEvent,
event = e.originalEvent.touches && e.originalEvent.touches.length === 1 ? e.originalEvent.touches[0] : e.originalEvent,
newPoint = L.point(event.clientX, event.clientY),
latlng = path._map.layerPointToLatLng(newPoint);
@@ -108,9 +96,7 @@ export const initDraggablePath = () => {
path.fire("drag", e);
e.latlng = this._path.getCenter
? this._path.getCenter()
: this._path.getLatLng();
e.latlng = this._path.getCenter ? this._path.getCenter() : this._path.getLatLng();
path.fire("move", e);
},