From 669ee510d34ae11962c989c6e2fbdd60734840da Mon Sep 17 00:00:00 2001 From: Pax1601 Date: Wed, 3 May 2023 19:15:00 +0200 Subject: [PATCH] Added temporary spawn marker --- client/public/images/icon-temporary.png | Bin 0 -> 2538 bytes client/src/controls/mapcontextmenu.ts | 8 +++++- client/src/map/boxselect.ts | 33 ++++++++++++---------- client/src/map/map.ts | 34 ++++++++++++++++++++++- client/src/units/unit.ts | 22 ++++++--------- client/src/units/unitsmanager.ts | 35 ++++++++++++++++++++++-- 6 files changed, 100 insertions(+), 32 deletions(-) create mode 100644 client/public/images/icon-temporary.png diff --git a/client/public/images/icon-temporary.png b/client/public/images/icon-temporary.png new file mode 100644 index 0000000000000000000000000000000000000000..712221a037440b8ec733699557345d0a48851823 GIT binary patch literal 2538 zcmV%$WAf1p#$bTT!hGBHbX8|B!=xZUQ z8q%&thj$YhBu5?xu+Sbgde<5WxW*ot zK+w$&sK<{3Tw9B?lJOp5G9)1KP{zQ(zyXiP^Qt(Y_QM8w@BM1?^OD8+vS!sv87r{% zYgqdLbTQSEv4CWP!Qers*Z6U3n_9bRo64EDFie)MT4z2RM@tQ6*Jv=}5D}UOWcJ|g z{8k*WeDykMZTlqZv!|bWQfkhglCc7o`ia-;JwkT)YI;xP7*DJpb96^X$1FE)_TJfZ zG070EZU2*#6;(1;P#5ZCgb>yBq7tG>i;IhmDO0AD%g`<#6Sei1#Bt1r&SP9)s?X;; zE?V!9p~8_6?N_AV+uQqHe0)~M2~&I-QSToweOvs2F4^NI{B#r8&lHzfv$_z0|HYWknH08cdNJz#HLD7d-k%p=W~R6Wb-Q=(9`^(4A3KdB zZa5&Rr>Cb%jSx)D%T}$O$g~}X{{DVe>Io_$g%9R+oi)6bm6ciR*RTInMv0RZ?@Dva z4e3N&Gt!b7xgm)!YpmHr&Nm#*(r>v`UM_+qZ9T zi}z-(HMOX1-`=I>FIr)~{h$8)Rn_VDtMS0vjYAvrnX~5{$HVQuA)&-JXeBetS=NDg zGBPq&#Cj`D&DUk!=5G#u_Xh&zTW!96UCK(|8c`fXL#A)&_kMrCaeQiO>I<`H&#t_A z^JdVxXXSItLSAII`LQPW*(=3S?>9By7?+Ln^+N}x011LA+{xt#Y_u~$#x#U=&%O_t zge1;J+JxAM`K&qiGq+&Y`$y@YT#rvoO#G^7&w^0~=xHW1UB&XV2es0d<#Ph)&3*;- z9*iOT=44t3X7t6Hpa92#SXdJ0nOiU>i*|fpX5~I7>oygc@fi=AP?*cv33((=u}aX# zqivwy+wm<|KJNq;xplfOqTagI!ootMy1LpxhV!6A_s6mleVp0s zFW4)tVL@MJhIxP+4>Ck#0qgg7#T`#waq--`bt}9K0wEG(^*94X>Bnl4@IhUDSe0?C z^zFFgA3b_>4LWB-(lv*Wg#v+q6;vLSJx$0SPs=2LH60Iv+yeO7DK2sN^rxq%%Yz3G zL~}4$3(3lrE3L9Yb#-;M!S%!~*h8QKK5UBP(L)&qPy!kokJ)MNMZry4UvZrafo2sa&@WYHP;(&NZ z>UjNy@HrZWjXn8}yAtaD{rm5imzTFosLEC+PMk1ZjwJ*82mHbkJcy(aJbn7~n@$tP zD@1+1%wdY}eYsd(`_=1Vn`N{)+!nYE4GoplSLMZ7*xrbnVD%whqQZUdwcuwsZ*!M-3(ZNS(SEP?wl}}p?fV~{q?vsKsZ#WX=l0J47lAhxISB7Uw>GQ0Zid^#qnsG)Ya9o zeZ^kkGuqwKB}Q-2B1E@Kft&G=_Y`CvB>&2lD}PpF012G=*Eus*MvJRgufBznEFadf zk^yy05r-4PU~=Fli|Z^1PlbywU%q@yO%k{^bR`)0hsQgwWv^ z;_WP%3{slR637CC!B@}%rcTr?S;BiFajitZOhaS*3%GtsyB^Dor57$-DCz6#3#bVO z*QlwfDdCIMYtPfVP^UDBXkW#I(i^SidPtF368fKmT#MAMUAwk)c6R<(O%U$hy?c4* z&YeunOZA$$T8At*t`^NgqRp9G%6T#dgqGQc}`bTU*P` z+boVb48KDsptlEPP_{j?DgjEr9upIeeyE9gwBm`HM2ePV{hjwcnwVG5Yk-IW63V^~ z?uou<3f!t6BnNN};>z8>mx3434HvW%>6gf+{3r?881ou#UA3t-sQzOW+M-d^Nb}y5;5lh0fl=52zJxm;I;!G)8E?KYFRBPLvb>; z{~8$y)X<+`tTr-T%uE_+%`#!6W@l%!8qVNeCZP>6T}vv*i_@% literal 0 HcmV?d00001 diff --git a/client/src/controls/mapcontextmenu.ts b/client/src/controls/mapcontextmenu.ts index 8faeddef..bde299e5 100644 --- a/client/src/controls/mapcontextmenu.ts +++ b/client/src/controls/mapcontextmenu.ts @@ -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) => { diff --git a/client/src/map/boxselect.ts b/client/src/map/boxselect.ts index 6161fa88..b285c10a 100644 --- a/client/src/map/boxselect.ts +++ b/client/src/map/boxselect.ts @@ -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) { diff --git a/client/src/map/map.ts b/client/src/map/map.ts index bac70981..c7bfd727 100644 --- a/client/src/map/map.ts +++ b/client/src/map/map.ts @@ -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) { diff --git a/client/src/units/unit.ts b/client/src/units/unit.ts index d3ee4338..946a0d47 100644 --- a/client/src/units/unit.ts +++ b/client/src/units/unit.ts @@ -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)': `
Line abreast (left)
`, 'Line abreast (RH)': `
Line abreast (right)
`, 'Front': `
In front
`, + 'Diamond': `
Diamond
`, 'Custom': `
Custom
` } @@ -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); } } diff --git a/client/src/units/unitsmanager.ts b/client/src/units/unitsmanager.ts index dc1e4069..20782f91 100644 --- a/client/src/units/unitsmanager.ts +++ b/client/src/units/unitsmanager.ts @@ -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`); }