Added temporary spawn marker

This commit is contained in:
Pax1601 2023-05-03 19:15:00 +02:00
parent b8edc500c4
commit 669ee510d3
6 changed files with 100 additions and 32 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -1,5 +1,5 @@
import { LatLng } from "leaflet";
import { getActiveCoalition, setActiveCoalition } from "..";
import { getActiveCoalition, getMap, setActiveCoalition } from "..";
import { spawnAircraft, spawnGroundUnit, spawnSmoke } from "../server/server";
import { aircraftDatabase } from "../units/aircraftdatabase";
import { groundUnitsDatabase } from "../units/groundunitsdatabase";
@ -41,14 +41,20 @@ export class MapContextMenu extends ContextMenu {
this.hide();
this.#spawnOptions.coalition = getActiveCoalition();
if (this.#spawnOptions)
{
getMap().addTemporaryMarker(this.#spawnOptions.latlng);
spawnAircraft(this.#spawnOptions);
}
});
document.addEventListener("contextMenuDeployGroundUnit", () => {
this.hide();
this.#spawnOptions.coalition = getActiveCoalition();
if (this.#spawnOptions)
{
getMap().addTemporaryMarker(this.#spawnOptions.latlng);
spawnGroundUnit(this.#spawnOptions);
}
});
document.addEventListener("contextMenuDeploySmoke", (e: any) => {

View File

@ -45,25 +45,28 @@ export var BoxSelect = Handler.extend({
},
_onMouseDown: function (e: any) {
if ((e.which !== 1 && e.button !== 0) || !e.shiftKey) { return false; }
if ((e.which == 1 && e.button == 0 && e.shiftKey)) {
// Clear the deferred resetState if it hasn't executed yet, otherwise it
// will interrupt the interaction and orphan a box element in the container.
this._clearDeferredResetState();
this._resetState();
// Clear the deferred resetState if it hasn't executed yet, otherwise it
// will interrupt the interaction and orphan a box element in the container.
this._clearDeferredResetState();
this._resetState();
DomUtil.disableTextSelection();
DomUtil.disableImageDrag();
DomUtil.disableTextSelection();
DomUtil.disableImageDrag();
this._startPoint = this._map.mouseEventToContainerPoint(e);
this._startPoint = this._map.mouseEventToContainerPoint(e);
//@ts-ignore
DomEvent.on(document, {
contextmenu: DomEvent.stop,
mousemove: this._onMouseMove,
mouseup: this._onMouseUp,
keydown: this._onKeyDown
}, this);
//@ts-ignore
DomEvent.on(document, {
contextmenu: DomEvent.stop,
mousemove: this._onMouseMove,
mouseup: this._onMouseUp,
keydown: this._onKeyDown
}, this);
} else {
return false;
}
},
_onMouseMove: function (e: any) {

View File

@ -3,7 +3,7 @@ import { MiniMap, MiniMapOptions } from "leaflet-control-mini-map";
import { getUnitsManager } from "..";
import { BoxSelect } from "./boxselect";
import { MapContextMenu } from "../controls/mapcontextmenu";
import { MapContextMenu, SpawnOptions } from "../controls/mapcontextmenu";
import { UnitContextMenu } from "../controls/unitcontextmenu";
import { AirbaseContextMenu } from "../controls/airbasecontextmenu";
import { Dropdown } from "../controls/dropdown";
@ -18,6 +18,12 @@ export const MOVE_UNIT = "MOVE_UNIT";
L.Map.addInitHook('addHandler', 'boxSelect', BoxSelect);
var temporaryIcon = new L.Icon({
iconUrl: 'images/icon-temporary.png',
iconSize: [52, 52],
iconAnchor: [26, 26]
});
export class ClickableMiniMap extends MiniMap {
constructor(layer: L.TileLayer | L.LayerGroup, options?: MiniMapOptions) {
super(layer, options);
@ -44,6 +50,7 @@ export class Map extends L.Map {
#centerUnit: Unit | null = null;
#miniMap: ClickableMiniMap | null = null;
#miniMapLayerGroup: L.LayerGroup;
#temporaryMarkers: L.Marker[] = [];
#mapContextMenu: MapContextMenu = new MapContextMenu("map-contextmenu");
#unitContextMenu: UnitContextMenu = new UnitContextMenu("unit-contextmenu");
@ -372,6 +379,31 @@ export class Map extends L.Map {
}
}
addTemporaryMarker(latlng: L.LatLng) {
var marker = new L.Marker(latlng, {icon: temporaryIcon});
marker.addTo(this);
this.#temporaryMarkers.push(marker);
}
removeTemporaryMarker(latlng: L.LatLng) {
var d: number | null = null;
var closest: L.Marker | null = null;
var i: number = 0;
this.#temporaryMarkers.forEach((marker: L.Marker, idx: number) => {
var t = latlng.distanceTo(marker.getLatLng());
if (d == null || t < d) {
d = t;
closest = marker;
i = idx;
}
});
if (closest)
{
this.removeLayer(closest);
delete this.#temporaryMarkers[i];
}
}
/* Event handlers */
#onClick(e: any) {
if (!this.#preventLeftClick) {

View File

@ -1,4 +1,4 @@
import { Marker, LatLng, Polyline, Icon, DivIcon, CircleMarker } from 'leaflet';
import { Marker, LatLng, Polyline, Icon, DivIcon, CircleMarker, Map } 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, setAdvacedOptions, followUnit } from '../server/server';
@ -383,6 +383,12 @@ export class Unit extends Marker {
}, 200);
}
onAdd(map: Map): this {
super.onAdd(map);
getMap().removeTemporaryMarker(new LatLng(this.getFlightData().latitude, this.getFlightData().longitude));
return this;
}
#onDoubleClick(e: any) {
clearTimeout(this.#timer);
this.#preventClick = true;
@ -438,6 +444,7 @@ export class Unit extends Marker {
'Line abreast (LH)': `<div id="line-abreast">Line abreast (left)</div>`,
'Line abreast (RH)': `<div id="line-abreast">Line abreast (right)</div>`,
'Front': `<div id="front">In front</div>`,
'Diamond': `<div id="diamond">Diamond</div>`,
'Custom': `<div id="custom">Custom</div>`
}
@ -458,18 +465,7 @@ export class Unit extends Marker {
})
}
else {
// X: front-rear, positive front
// Y: top-bottom, positive top
// Z: left-right, positive right
var offset = {"x": 0, "y": 0, "z": 0};
if (action == "Trail") { offset.x = -50; offset.y = -30; offset.z = 0; }
else if (action == "Echelon (LH)") { offset.x = -50; offset.y = -10; offset.z = -50; }
else if (action == "Echelon (RH)") { offset.x = -50; offset.y = -10; offset.z = 50; }
else if (action == "Line abreast (RH)") { offset.x = 0; offset.y = 0; offset.z = 50; }
else if (action == "Line abreast (LH)") { offset.x = 0; offset.y = 0; offset.z = -50; }
else if (action == "Front") { offset.x = 100; offset.y = 0; offset.z = 0; }
getUnitsManager().selectedUnitsFollowUnit(this.ID, offset);
getUnitsManager().selectedUnitsFollowUnit(this.ID, undefined, action);
}
}

View File

@ -292,12 +292,42 @@ export class UnitsManager {
this.#showActionMessage(selectedUnits, `sent to nearest tanker`);
}
selectedUnitsFollowUnit(ID: number, offset: {"x": number, "y": number, "z": number}) {
selectedUnitsFollowUnit(ID: number, offset?: {"x": number, "y": number, "z": number}, formation?: string) {
if (offset == undefined){
// X: front-rear, positive front
// Y: top-bottom, positive top
// Z: left-right, positive right
offset = {"x": 0, "y": 0, "z": 0};
if (formation === "Trail") { offset.x = -50; offset.y = -30; offset.z = 0; }
else if (formation === "Echelon (LH)") { offset.x = -50; offset.y = -10; offset.z = -50; }
else if (formation === "Echelon (RH)") { offset.x = -50; offset.y = -10; offset.z = 50; }
else if (formation === "Line abreast (RH)") { offset.x = 0; offset.y = 0; offset.z = 50; }
else if (formation === "Line abreast (LH)") { offset.x = 0; offset.y = 0; offset.z = -50; }
else if (formation === "Front") { offset.x = 100; offset.y = 0; offset.z = 0; }
else offset = undefined;
}
var selectedUnits = this.getSelectedUnits();
var count = 1;
var xr = 0; var yr = 1; var zr = -1;
var layer = 1;
for (let idx in selectedUnits) {
var commandedUnit = selectedUnits[idx];
commandedUnit.followUnit(ID, {"x": offset.x * count, "y": offset.y * count, "z": offset.z * count} );
if (offset != undefined)
commandedUnit.followUnit(ID, {"x": offset.x * count, "y": offset.y * count, "z": offset.z * count} );
else {
if (formation === "Diamond")
{
var xl = xr * Math.cos(Math.PI / 4) - yr * Math.sin(Math.PI / 4);
var yl = xr * Math.sin(Math.PI / 4) + yr * Math.cos(Math.PI / 4);
commandedUnit.followUnit(ID, {"x": -yl * 50, "y": zr * 10, "z": xl * 50} );
if (yr == 0) { layer++; xr = 0; yr = layer; zr = -layer; }
else {
if (xr < layer){ xr++; zr--; }
else { yr--; zr++; }
}
}
}
count++;
}
this.#showActionMessage(selectedUnits, `following unit ${this.getUnitByID(ID)?.getBaseData().unitName}`);
@ -316,6 +346,7 @@ export class UnitsManager {
for (let idx in this.#copiedUnits)
{
var unit = this.#copiedUnits[idx];
getMap().addTemporaryMarker(getMap().getMouseCoordinates());
cloneUnit(unit.ID, getMap().getMouseCoordinates());
this.#showActionMessage(this.#copiedUnits, `pasted`);
}