mirror of
https://github.com/Pax1601/DCSOlympus.git
synced 2025-10-29 16:56:34 +00:00
Merge branch 'main' into 358-right-click-long-press-for-unit-action-context-menu
This commit is contained in:
@@ -15,7 +15,7 @@ const DEMO_UNIT_DATA = {
|
|||||||
radio: { frequency: 124000000, callsign: 1, callsignNumber: 1 },
|
radio: { frequency: 124000000, callsign: 1, callsignNumber: 1 },
|
||||||
generalSettings: { prohibitAA: false, prohibitAfterburner: false, prohibitAG: false, prohibitAirWpn: false, prohibitJettison: false },
|
generalSettings: { prohibitAA: false, prohibitAfterburner: false, prohibitAG: false, prohibitAirWpn: false, prohibitJettison: false },
|
||||||
ammo: [{ quantity: 2, name: "A cool missile\0Ciao", guidance: 0, category: 0, missileCategory: 0 } ],
|
ammo: [{ quantity: 2, name: "A cool missile\0Ciao", guidance: 0, category: 0, missileCategory: 0 } ],
|
||||||
contacts: [{ID: 2, detectionMethod: 1}, {ID: 3, detectionMethod: 4}],
|
contacts: [{ID: 2, detectionMethod: 1}, {ID: 3, detectionMethod: 4}, {ID: 5, detectionMethod: 4}],
|
||||||
activePath: [{lat: 38, lng: -115, alt: 0}, {lat: 38, lng: -114, alt: 0}]
|
activePath: [{lat: 38, lng: -115, alt: 0}, {lat: 38, lng: -114, alt: 0}]
|
||||||
},
|
},
|
||||||
["2"]:{ category: "Aircraft", alive: true, human: false, controlled: false, coalition: 1, country: 0, name: "FA-18C_hornet", unitName: "Cool guy 1-2", groupName: "Cool group 2", state: 1, task: "Being cool",
|
["2"]:{ category: "Aircraft", alive: true, human: false, controlled: false, coalition: 1, country: 0, name: "FA-18C_hornet", unitName: "Cool guy 1-2", groupName: "Cool group 2", state: 1, task: "Being cool",
|
||||||
|
|||||||
@@ -1031,13 +1031,41 @@ nav.ol-panel> :last-child {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.ol-target-icon {
|
.ol-target-icon {
|
||||||
background-image: url("/resources/theme/images/markers/target.svg");
|
|
||||||
height: 52px;
|
height: 52px;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
width: 52px;
|
width: 52px;
|
||||||
z-index: 9999;
|
z-index: 9999;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.ol-smoke-icon {
|
||||||
|
background-image: url("/resources/theme/images/markers/smoke.svg");
|
||||||
|
height: 52px;
|
||||||
|
pointer-events: none;
|
||||||
|
width: 52px;
|
||||||
|
z-index: 9999;
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ol-smoke-icon[data-color="white"] {
|
||||||
|
fill: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ol-smoke-icon[data-color="blue"] {
|
||||||
|
fill: blue;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ol-smoke-icon[data-color="red"] {
|
||||||
|
fill: red;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ol-smoke-icon[data-color="green"] {
|
||||||
|
fill: green;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ol-smoke-icon[data-color="orange"] {
|
||||||
|
fill: orange;
|
||||||
|
}
|
||||||
|
|
||||||
.ol-draw-icon {
|
.ol-draw-icon {
|
||||||
background-image: url("/resources/theme/images/markers/draw.svg");
|
background-image: url("/resources/theme/images/markers/draw.svg");
|
||||||
height: 24px;
|
height: 24px;
|
||||||
|
|||||||
133
client/public/themes/olympus/images/markers/smoke.svg
Normal file
133
client/public/themes/olympus/images/markers/smoke.svg
Normal file
@@ -0,0 +1,133 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||||
|
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||||
|
|
||||||
|
<svg
|
||||||
|
width="52"
|
||||||
|
height="52"
|
||||||
|
viewBox="0 0 13.758333 13.758333"
|
||||||
|
version="1.1"
|
||||||
|
id="svg5"
|
||||||
|
inkscape:version="1.2.2 (732a01da63, 2022-12-09)"
|
||||||
|
sodipodi:docname="smoke.svg"
|
||||||
|
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||||
|
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
xmlns:svg="http://www.w3.org/2000/svg">
|
||||||
|
<sodipodi:namedview
|
||||||
|
id="namedview7"
|
||||||
|
pagecolor="#ffffff"
|
||||||
|
bordercolor="#666666"
|
||||||
|
borderopacity="1.0"
|
||||||
|
inkscape:pageshadow="2"
|
||||||
|
inkscape:pageopacity="0.0"
|
||||||
|
inkscape:pagecheckerboard="0"
|
||||||
|
inkscape:document-units="mm"
|
||||||
|
showgrid="false"
|
||||||
|
width="52mm"
|
||||||
|
units="px"
|
||||||
|
inkscape:zoom="1.4823794"
|
||||||
|
inkscape:cx="-107.59729"
|
||||||
|
inkscape:cy="-51.268927"
|
||||||
|
inkscape:window-width="1920"
|
||||||
|
inkscape:window-height="1017"
|
||||||
|
inkscape:window-x="1912"
|
||||||
|
inkscape:window-y="-8"
|
||||||
|
inkscape:window-maximized="1"
|
||||||
|
inkscape:current-layer="layer1"
|
||||||
|
inkscape:showpageshadow="2"
|
||||||
|
inkscape:deskcolor="#d1d1d1" />
|
||||||
|
<defs
|
||||||
|
id="defs2">
|
||||||
|
<linearGradient
|
||||||
|
id="linearGradient4717"
|
||||||
|
inkscape:swatch="solid">
|
||||||
|
<stop
|
||||||
|
style="stop-color:#0cffff;stop-opacity:1;"
|
||||||
|
offset="0"
|
||||||
|
id="stop4715" />
|
||||||
|
</linearGradient>
|
||||||
|
</defs>
|
||||||
|
<g
|
||||||
|
inkscape:label="Layer 1"
|
||||||
|
inkscape:groupmode="layer"
|
||||||
|
id="layer1">
|
||||||
|
<circle
|
||||||
|
style="stroke-width:13.3879;stroke-linecap:round;stroke:none;stroke-opacity:1;fill-opacity:1"
|
||||||
|
id="path901"
|
||||||
|
cx="6.3892984"
|
||||||
|
cy="12.526179"
|
||||||
|
r="0.40000001" />
|
||||||
|
<circle
|
||||||
|
style="stroke-width:21.3082;stroke-linecap:round;stroke:none;stroke-opacity:1;fill-opacity:1"
|
||||||
|
id="path901-1"
|
||||||
|
cx="6.1684337"
|
||||||
|
cy="11.768929"
|
||||||
|
r="0.63664067" />
|
||||||
|
<circle
|
||||||
|
style="stroke-width:28.7005;stroke-linecap:round;stroke:none;stroke-opacity:1;fill-opacity:1"
|
||||||
|
id="path901-5"
|
||||||
|
cx="7.067668"
|
||||||
|
cy="11.674273"
|
||||||
|
r="0.85750532" />
|
||||||
|
<circle
|
||||||
|
style="stroke-width:28.1725;stroke-linecap:round;stroke:none;stroke-opacity:1;fill-opacity:1"
|
||||||
|
id="path901-4"
|
||||||
|
cx="6.8468037"
|
||||||
|
cy="10.711934"
|
||||||
|
r="0.84172928" />
|
||||||
|
<circle
|
||||||
|
style="stroke-width:51.9334;stroke-linecap:round;stroke:none;stroke-opacity:1;fill-opacity:1"
|
||||||
|
id="path901-6"
|
||||||
|
cx="8.7714815"
|
||||||
|
cy="8.3928556"
|
||||||
|
r="1.5516512" />
|
||||||
|
<circle
|
||||||
|
style="stroke-width:41.373;stroke-linecap:round;stroke:none;stroke-opacity:1;fill-opacity:1"
|
||||||
|
id="path901-2"
|
||||||
|
cx="7.9037986"
|
||||||
|
cy="10.159773"
|
||||||
|
r="1.2361304" />
|
||||||
|
<circle
|
||||||
|
style="stroke-width:53.5174;stroke-linecap:round;stroke:none;stroke-opacity:1;fill-opacity:1"
|
||||||
|
id="path901-3"
|
||||||
|
cx="7.320085"
|
||||||
|
cy="7.6040535"
|
||||||
|
r="1.5989795" />
|
||||||
|
<circle
|
||||||
|
style="fill-opacity:1;stroke:none;stroke-width:53.5174;stroke-linecap:round;stroke-opacity:1"
|
||||||
|
id="path901-3-9"
|
||||||
|
cx="7.05018"
|
||||||
|
cy="9.5266676"
|
||||||
|
r="1.5989795" />
|
||||||
|
<circle
|
||||||
|
style="stroke-width:60.3817;stroke-linecap:round;stroke:none;stroke-opacity:1;fill-opacity:1"
|
||||||
|
id="path901-20"
|
||||||
|
cx="10.033565"
|
||||||
|
cy="6.5155067"
|
||||||
|
r="1.804068" />
|
||||||
|
<circle
|
||||||
|
style="stroke-width:60.9097;stroke-linecap:round;stroke:none;stroke-opacity:1;fill-opacity:1"
|
||||||
|
id="path901-15"
|
||||||
|
cx="8.0300064"
|
||||||
|
cy="4.9221258"
|
||||||
|
r="1.819844" />
|
||||||
|
<circle
|
||||||
|
style="stroke-width:56.6856;stroke-linecap:round;stroke:none;stroke-opacity:1;fill-opacity:1"
|
||||||
|
id="path901-0"
|
||||||
|
cx="11.800482"
|
||||||
|
cy="2.3821828"
|
||||||
|
r="1.6936357" />
|
||||||
|
<circle
|
||||||
|
style="stroke-width:56.1575;stroke-linecap:round;stroke:none;stroke-opacity:1;fill-opacity:1"
|
||||||
|
id="path901-0-9"
|
||||||
|
cx="11.3272"
|
||||||
|
cy="4.7801414"
|
||||||
|
r="1.6778597" />
|
||||||
|
<circle
|
||||||
|
style="stroke-width:68.302;stroke-linecap:round;stroke:none;stroke-opacity:1;fill-opacity:1"
|
||||||
|
id="path901-0-4"
|
||||||
|
cx="9.8600283"
|
||||||
|
cy="2.6345997"
|
||||||
|
r="2.0407088" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 4.1 KiB |
101
client/public/themes/olympus/images/markers/target - Copy.svg
Normal file
101
client/public/themes/olympus/images/markers/target - Copy.svg
Normal file
@@ -0,0 +1,101 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||||
|
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||||
|
|
||||||
|
<svg
|
||||||
|
width="52"
|
||||||
|
height="52"
|
||||||
|
viewBox="0 0 13.758333 13.758333"
|
||||||
|
version="1.1"
|
||||||
|
id="svg5"
|
||||||
|
inkscape:version="1.1 (c68e22c387, 2021-05-23)"
|
||||||
|
sodipodi:docname="target.svg"
|
||||||
|
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||||
|
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
xmlns:svg="http://www.w3.org/2000/svg">
|
||||||
|
<sodipodi:namedview
|
||||||
|
id="namedview7"
|
||||||
|
pagecolor="#ffffff"
|
||||||
|
bordercolor="#666666"
|
||||||
|
borderopacity="1.0"
|
||||||
|
inkscape:pageshadow="2"
|
||||||
|
inkscape:pageopacity="0.0"
|
||||||
|
inkscape:pagecheckerboard="0"
|
||||||
|
inkscape:document-units="mm"
|
||||||
|
showgrid="false"
|
||||||
|
width="52mm"
|
||||||
|
units="px"
|
||||||
|
inkscape:zoom="16.771208"
|
||||||
|
inkscape:cx="31.989348"
|
||||||
|
inkscape:cy="27.63665"
|
||||||
|
inkscape:window-width="1920"
|
||||||
|
inkscape:window-height="1017"
|
||||||
|
inkscape:window-x="-8"
|
||||||
|
inkscape:window-y="-8"
|
||||||
|
inkscape:window-maximized="1"
|
||||||
|
inkscape:current-layer="layer1" />
|
||||||
|
<defs
|
||||||
|
id="defs2">
|
||||||
|
<linearGradient
|
||||||
|
id="linearGradient4717"
|
||||||
|
inkscape:swatch="solid">
|
||||||
|
<stop
|
||||||
|
style="stop-color:#0cffff;stop-opacity:1;"
|
||||||
|
offset="0"
|
||||||
|
id="stop4715" />
|
||||||
|
</linearGradient>
|
||||||
|
</defs>
|
||||||
|
<g
|
||||||
|
inkscape:label="Layer 1"
|
||||||
|
inkscape:groupmode="layer"
|
||||||
|
id="layer1">
|
||||||
|
<ellipse
|
||||||
|
style="fill:none;fill-opacity:1;stroke:#ffffff;stroke-width:1.03188;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:5.6;stroke-opacity:1;paint-order:stroke fill markers"
|
||||||
|
id="path5477"
|
||||||
|
cx="6.8599777"
|
||||||
|
cy="6.8209338"
|
||||||
|
rx="1.9410306"
|
||||||
|
ry="1.948356" />
|
||||||
|
<rect
|
||||||
|
style="fill:#ff5858;fill-opacity:1;stroke:#ffffff;stroke-width:0.79375;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:5.6;stroke-opacity:1;paint-order:stroke fill markers"
|
||||||
|
id="rect3980"
|
||||||
|
width="0.54935014"
|
||||||
|
height="2.6236348"
|
||||||
|
x="6.5846372"
|
||||||
|
y="3.3855996"
|
||||||
|
rx="0.29515001" />
|
||||||
|
<rect
|
||||||
|
style="fill:#ff5858;fill-opacity:1;stroke:#ffffff;stroke-width:0.79375;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:5.6;stroke-opacity:1;paint-order:stroke fill markers"
|
||||||
|
id="rect3980-4"
|
||||||
|
width="0.54935014"
|
||||||
|
height="2.6236348"
|
||||||
|
x="6.5858645"
|
||||||
|
y="7.6347723"
|
||||||
|
rx="0.29515001" />
|
||||||
|
<rect
|
||||||
|
style="fill:#ff5858;fill-opacity:1;stroke:#ffffff;stroke-width:0.79375;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:5.6;stroke-opacity:1;paint-order:stroke fill markers"
|
||||||
|
id="rect3980-47"
|
||||||
|
width="0.54935014"
|
||||||
|
height="2.6236348"
|
||||||
|
x="6.5517845"
|
||||||
|
y="-10.252322"
|
||||||
|
rx="0.29515001"
|
||||||
|
transform="rotate(90)" />
|
||||||
|
<rect
|
||||||
|
style="fill:#ff5858;fill-opacity:1;stroke:#ffffff;stroke-width:0.79375;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:5.6;stroke-opacity:1;paint-order:stroke fill markers"
|
||||||
|
id="rect3980-4-3"
|
||||||
|
width="0.54935014"
|
||||||
|
height="2.6236348"
|
||||||
|
x="6.5530119"
|
||||||
|
y="-6.003149"
|
||||||
|
rx="0.29515001"
|
||||||
|
transform="rotate(90)" />
|
||||||
|
<ellipse
|
||||||
|
style="fill:none;fill-opacity:1;stroke:#ff5858;stroke-width:0.449792;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:5.6;stroke-opacity:1;paint-order:stroke fill markers"
|
||||||
|
id="path5477-2"
|
||||||
|
cx="6.8613305"
|
||||||
|
cy="6.8167095"
|
||||||
|
rx="1.9410306"
|
||||||
|
ry="1.948356" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 3.7 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.5 KiB |
2
client/src/@types/dom.d.ts
vendored
2
client/src/@types/dom.d.ts
vendored
@@ -19,7 +19,7 @@ interface CustomEventMap {
|
|||||||
"mapStateChanged": CustomEvent<string>,
|
"mapStateChanged": CustomEvent<string>,
|
||||||
"mapContextMenu": CustomEvent<>,
|
"mapContextMenu": CustomEvent<>,
|
||||||
"mapVisibilityOptionsChanged": CustomEvent<>,
|
"mapVisibilityOptionsChanged": CustomEvent<>,
|
||||||
"commandModeOptionsChanged": CustomEvent<>,
|
"commandModeOptionsChanged": CustomEvent<>,
|
||||||
"contactsUpdated": CustomEvent<Unit>,
|
"contactsUpdated": CustomEvent<Unit>,
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -138,15 +138,16 @@ export const MOVE_UNIT = "Move unit";
|
|||||||
export const COALITIONAREA_DRAW_POLYGON = "Draw Coalition Area";
|
export const COALITIONAREA_DRAW_POLYGON = "Draw Coalition Area";
|
||||||
export const visibilityControls: string[] = ["human", "dcs", "aircraft", "groundunit-sam", "groundunit-other", "navyunit", "airbase"];
|
export const visibilityControls: string[] = ["human", "dcs", "aircraft", "groundunit-sam", "groundunit-other", "navyunit", "airbase"];
|
||||||
export const visibilityControlsTypes: string[][] = [["human"], ["dcs"], ["aircraft"], ["groundunit-sam", "groundunit-sam-radar", "groundunit-sam-launcher"], ["groundunit-other", "groundunit-ewr"], ["navyunit"], ["airbase"]];
|
export const visibilityControlsTypes: string[][] = [["human"], ["dcs"], ["aircraft"], ["groundunit-sam", "groundunit-sam-radar", "groundunit-sam-launcher"], ["groundunit-other", "groundunit-ewr"], ["navyunit"], ["airbase"]];
|
||||||
export const visibilityControlsTootlips: string[] = ["Toggle human players visibility", "Toggle DCS controlled units visibility", "Toggle aircrafts visibility", "Toggle SAM units visibility", "Toggle ground units (not SAM) visibility", "Toggle navy units visibility", "Toggle airbases visibility"];
|
export const visibilityControlsTooltips: string[] = ["Toggle human players visibility", "Toggle DCS controlled units visibility", "Toggle aircrafts visibility", "Toggle SAM units visibility", "Toggle ground units (not SAM) visibility", "Toggle navy units visibility", "Toggle airbases visibility"];
|
||||||
|
|
||||||
export const IADSTypes = ["AAA", "MANPADS", "SAM Site", "Radar"];
|
export const IADSTypes = ["AAA", "MANPADS", "SAM Site", "Radar"];
|
||||||
export const IADSDensities: {[key: string]: number}= {"AAA": 0.8, "MANPADS": 0.3, "SAM Site": 0.1, "Radar": 0.05};
|
export const IADSDensities: {[key: string]: number}= {"AAA": 0.8, "MANPADS": 0.3, "SAM Site": 0.1, "Radar": 0.05};
|
||||||
|
|
||||||
export const SHOW_CONTACT_LINES = "Show unit contact lines";
|
export const SHOW_CONTACT_LINES = "Show unit contact lines";
|
||||||
export const HIDE_GROUP_MEMBERS = "Hide group members when zoomed out";
|
export const HIDE_GROUP_MEMBERS = "Hide group members when zoomed out";
|
||||||
export const SHOW_UNIT_PATHS = "Show unit paths";
|
export const SHOW_UNIT_LABELS = "Show unit labels";
|
||||||
export const SHOW_UNIT_TARGETS = "Show unit targets";
|
export const SHOW_UNIT_PATHS = "Show unit paths";
|
||||||
|
export const SHOW_UNIT_TARGETS = "Show unit targets";
|
||||||
|
|
||||||
export enum DataIndexes {
|
export enum DataIndexes {
|
||||||
startOfData = 0,
|
startOfData = 0,
|
||||||
|
|||||||
@@ -12,6 +12,7 @@ import { ftToM } from "../other/utils";
|
|||||||
import { GAME_MASTER } from "../constants/constants";
|
import { GAME_MASTER } from "../constants/constants";
|
||||||
import { navyUnitDatabase } from "../unit/navyunitdatabase";
|
import { navyUnitDatabase } from "../unit/navyunitdatabase";
|
||||||
import { CoalitionArea } from "../map/coalitionarea";
|
import { CoalitionArea } from "../map/coalitionarea";
|
||||||
|
import { SmokeMarker } from "../map/smokemarker";
|
||||||
|
|
||||||
export class MapContextMenu extends ContextMenu {
|
export class MapContextMenu extends ContextMenu {
|
||||||
#coalitionSwitch: Switch;
|
#coalitionSwitch: Switch;
|
||||||
@@ -158,6 +159,8 @@ export class MapContextMenu extends ContextMenu {
|
|||||||
document.addEventListener("contextMenuDeploySmoke", (e: any) => {
|
document.addEventListener("contextMenuDeploySmoke", (e: any) => {
|
||||||
this.hide();
|
this.hide();
|
||||||
spawnSmoke(e.detail.color, this.getLatLng());
|
spawnSmoke(e.detail.color, this.getLatLng());
|
||||||
|
var marker = new SmokeMarker(this.getLatLng(), e.detail.color);
|
||||||
|
marker.addTo(getMap());
|
||||||
});
|
});
|
||||||
|
|
||||||
document.addEventListener("contextMenuExplosion", (e: any) => {
|
document.addEventListener("contextMenuExplosion", (e: any) => {
|
||||||
|
|||||||
@@ -137,9 +137,6 @@ function setupEvents() {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
switch (ev.code) {
|
switch (ev.code) {
|
||||||
case "KeyL":
|
|
||||||
document.body.toggleAttribute("data-hide-labels");
|
|
||||||
break;
|
|
||||||
case "KeyT":
|
case "KeyT":
|
||||||
toggleDemoEnabled();
|
toggleDemoEnabled();
|
||||||
break;
|
break;
|
||||||
|
|||||||
@@ -12,7 +12,7 @@ import { DestinationPreviewMarker } from "./destinationpreviewmarker";
|
|||||||
import { TemporaryUnitMarker } from "./temporaryunitmarker";
|
import { TemporaryUnitMarker } from "./temporaryunitmarker";
|
||||||
import { ClickableMiniMap } from "./clickableminimap";
|
import { ClickableMiniMap } from "./clickableminimap";
|
||||||
import { SVGInjector } from '@tanem/svg-injector'
|
import { SVGInjector } from '@tanem/svg-injector'
|
||||||
import { layers as mapLayers, mapBounds, minimapBoundaries, IDLE, COALITIONAREA_DRAW_POLYGON, visibilityControls, visibilityControlsTootlips, MOVE_UNIT, SHOW_CONTACT_LINES, HIDE_GROUP_MEMBERS, SHOW_UNIT_PATHS, SHOW_UNIT_TARGETS, visibilityControlsTypes } from "../constants/constants";
|
import { layers as mapLayers, mapBounds, minimapBoundaries, IDLE, COALITIONAREA_DRAW_POLYGON, visibilityControls, visibilityControlsTootlips, MOVE_UNIT, SHOW_CONTACT_LINES, HIDE_GROUP_MEMBERS, SHOW_UNIT_PATHS, SHOW_UNIT_TARGETS, visibilityControlsTypes, SHOW_UNIT_LABELS } from "../constants/constants";
|
||||||
import { TargetMarker } from "./targetmarker";
|
import { TargetMarker } from "./targetmarker";
|
||||||
import { CoalitionArea } from "./coalitionarea";
|
import { CoalitionArea } from "./coalitionarea";
|
||||||
import { CoalitionAreaContextMenu } from "../controls/coalitionareacontextmenu";
|
import { CoalitionAreaContextMenu } from "../controls/coalitionareacontextmenu";
|
||||||
@@ -45,7 +45,7 @@ export class Map extends L.Map {
|
|||||||
#temporaryMarkers: TemporaryUnitMarker[] = [];
|
#temporaryMarkers: TemporaryUnitMarker[] = [];
|
||||||
#selecting: boolean = false;
|
#selecting: boolean = false;
|
||||||
#isZooming: boolean = false;
|
#isZooming: boolean = false;
|
||||||
|
|
||||||
#destinationGroupRotation: number = 0;
|
#destinationGroupRotation: number = 0;
|
||||||
#computeDestinationRotation: boolean = false;
|
#computeDestinationRotation: boolean = false;
|
||||||
#destinationRotationCenter: L.LatLng | null = null;
|
#destinationRotationCenter: L.LatLng | null = null;
|
||||||
@@ -65,7 +65,7 @@ export class Map extends L.Map {
|
|||||||
#mapSourceDropdown: Dropdown;
|
#mapSourceDropdown: Dropdown;
|
||||||
#mapVisibilityOptionsDropdown: Dropdown;
|
#mapVisibilityOptionsDropdown: Dropdown;
|
||||||
#optionButtons: { [key: string]: HTMLButtonElement[] } = {}
|
#optionButtons: { [key: string]: HTMLButtonElement[] } = {}
|
||||||
#visibiityOptions: { [key: string]: boolean } = {}
|
#visibilityOptions: { [key: string]: boolean } = {}
|
||||||
|
|
||||||
constructor(ID: string) {
|
constructor(ID: string) {
|
||||||
/* Init the leaflet map */
|
/* Init the leaflet map */
|
||||||
@@ -91,7 +91,7 @@ export class Map extends L.Map {
|
|||||||
this.#mapSourceDropdown = new Dropdown("map-type", (layerName: string) => this.setLayer(layerName), this.getLayers());
|
this.#mapSourceDropdown = new Dropdown("map-type", (layerName: string) => this.setLayer(layerName), this.getLayers());
|
||||||
|
|
||||||
/* Visibility options dropdown */
|
/* Visibility options dropdown */
|
||||||
this.#mapVisibilityOptionsDropdown = new Dropdown("map-visibility-options", () => {});
|
this.#mapVisibilityOptionsDropdown = new Dropdown("map-visibility-options", (value: string) => { });
|
||||||
|
|
||||||
/* Init the state machine */
|
/* Init the state machine */
|
||||||
this.#state = IDLE;
|
this.#state = IDLE;
|
||||||
@@ -134,7 +134,7 @@ export class Map extends L.Map {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
document.addEventListener("toggleCoalitionAreaDraw", (ev: CustomEventInit) => {
|
document.addEventListener("toggleCoalitionAreaDraw", (ev: CustomEventInit) => {
|
||||||
this.getMapContextMenu().hide();
|
this.getMapContextMenu().hide();
|
||||||
this.deselectAllCoalitionAreas();
|
this.deselectAllCoalitionAreas();
|
||||||
@@ -151,6 +151,10 @@ export class Map extends L.Map {
|
|||||||
this.#panToUnit(this.#centerUnit);
|
this.#panToUnit(this.#centerUnit);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
document.addEventListener("mapVisibilityOptionsChanged", () => {
|
||||||
|
this.getContainer().toggleAttribute("data-hide-labels", !this.getVisibilityOptions()[SHOW_UNIT_LABELS]);
|
||||||
|
});
|
||||||
|
|
||||||
/* Pan interval */
|
/* Pan interval */
|
||||||
this.#panInterval = window.setInterval(() => {
|
this.#panInterval = window.setInterval(() => {
|
||||||
if (this.#panLeft || this.#panDown || this.#panRight || this.#panLeft)
|
if (this.#panLeft || this.#panDown || this.#panRight || this.#panLeft)
|
||||||
@@ -161,19 +165,19 @@ export class Map extends L.Map {
|
|||||||
/* Option buttons */
|
/* Option buttons */
|
||||||
this.#optionButtons["visibility"] = visibilityControls.map((option: string, index: number) => {
|
this.#optionButtons["visibility"] = visibilityControls.map((option: string, index: number) => {
|
||||||
var typesArrayString = `"${visibilityControlsTypes[index][0]}"`;
|
var typesArrayString = `"${visibilityControlsTypes[index][0]}"`;
|
||||||
visibilityControlsTypes[index].forEach((type: string, idx: number) => {if (idx > 0) typesArrayString = `${typesArrayString}, "${type}"`});
|
visibilityControlsTypes[index].forEach((type: string, idx: number) => { if (idx > 0) typesArrayString = `${typesArrayString}, "${type}"` });
|
||||||
return this.#createOptionButton(option, `visibility/${option.toLowerCase()}.svg`, visibilityControlsTootlips[index], "toggleMarkerVisibility", `{"types": [${typesArrayString}]}`);
|
return this.#createOptionButton(option, `visibility/${option.toLowerCase()}.svg`, visibilityControlsTooltips[index], "toggleMarkerVisibility", `{"types": [${typesArrayString}]}`);
|
||||||
});
|
});
|
||||||
document.querySelector("#unit-visibility-control")?.append(...this.#optionButtons["visibility"]);
|
document.querySelector("#unit-visibility-control")?.append(...this.#optionButtons["visibility"]);
|
||||||
|
|
||||||
/* Create the checkboxes to select the advanced visibility options */
|
/* Create the checkboxes to select the advanced visibility options */
|
||||||
|
this.#visibilityOptions[SHOW_CONTACT_LINES] = false;
|
||||||
this.#visibiityOptions[SHOW_CONTACT_LINES] = false;
|
this.#visibilityOptions[HIDE_GROUP_MEMBERS] = true;
|
||||||
this.#visibiityOptions[HIDE_GROUP_MEMBERS] = true;
|
this.#visibilityOptions[SHOW_UNIT_PATHS] = true;
|
||||||
this.#visibiityOptions[SHOW_UNIT_PATHS] = true;
|
this.#visibilityOptions[SHOW_UNIT_TARGETS] = true;
|
||||||
this.#visibiityOptions[SHOW_UNIT_TARGETS] = true;
|
this.#visibilityOptions[SHOW_UNIT_LABELS] = true;
|
||||||
this.#mapVisibilityOptionsDropdown.setOptionsElements(Object.keys(this.#visibiityOptions).map((option: string) => {
|
this.#mapVisibilityOptionsDropdown.setOptionsElements(Object.keys(this.#visibilityOptions).map((option: string) => {
|
||||||
return createCheckboxOption(option, option, this.#visibiityOptions[option], (ev: any) => {
|
return createCheckboxOption(option, option, this.#visibilityOptions[option], (ev: any) => {
|
||||||
this.#setVisibilityOption(option, ev);
|
this.#setVisibilityOption(option, ev);
|
||||||
});
|
});
|
||||||
}));
|
}));
|
||||||
@@ -436,7 +440,7 @@ export class Map extends L.Map {
|
|||||||
}
|
}
|
||||||
|
|
||||||
getVisibilityOptions() {
|
getVisibilityOptions() {
|
||||||
return this.#visibiityOptions;
|
return this.#visibilityOptions;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Event handlers */
|
/* Event handlers */
|
||||||
@@ -482,7 +486,7 @@ export class Map extends L.Map {
|
|||||||
/* Coalition areas are ordered in the #coalitionAreas array according to their zindex. Select the upper one */
|
/* Coalition areas are ordered in the #coalitionAreas array according to their zindex. Select the upper one */
|
||||||
for (let coalitionArea of this.#coalitionAreas) {
|
for (let coalitionArea of this.#coalitionAreas) {
|
||||||
if (coalitionArea.getBounds().contains(e.latlng)) {
|
if (coalitionArea.getBounds().contains(e.latlng)) {
|
||||||
if (coalitionArea.getSelected())
|
if (coalitionArea.getSelected())
|
||||||
clickedCoalitionArea = coalitionArea;
|
clickedCoalitionArea = coalitionArea;
|
||||||
else
|
else
|
||||||
this.getMapContextMenu().setCoalitionArea(coalitionArea);
|
this.getMapContextMenu().setCoalitionArea(coalitionArea);
|
||||||
@@ -704,7 +708,7 @@ export class Map extends L.Map {
|
|||||||
else {
|
else {
|
||||||
Object.values(getUnitsManager().selectedUnitsComputeGroupDestination(groupLatLng, this.#destinationGroupRotation)).forEach((latlng: L.LatLng, idx: number) => {
|
Object.values(getUnitsManager().selectedUnitsComputeGroupDestination(groupLatLng, this.#destinationGroupRotation)).forEach((latlng: L.LatLng, idx: number) => {
|
||||||
if (idx < this.#destinationPreviewCursors.length)
|
if (idx < this.#destinationPreviewCursors.length)
|
||||||
this.#destinationPreviewCursors[idx].setLatLng(this.#shiftKey? latlng : this.getMouseCoordinates());
|
this.#destinationPreviewCursors[idx].setLatLng(this.#shiftKey ? latlng : this.getMouseCoordinates());
|
||||||
})
|
})
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
@@ -769,7 +773,7 @@ export class Map extends L.Map {
|
|||||||
}
|
}
|
||||||
|
|
||||||
#setVisibilityOption(option: string, ev: any) {
|
#setVisibilityOption(option: string, ev: any) {
|
||||||
this.#visibiityOptions[option] = ev.currentTarget.checked;
|
this.#visibilityOptions[option] = ev.currentTarget.checked;
|
||||||
document.dispatchEvent(new CustomEvent("mapVisibilityOptionsChanged"));
|
document.dispatchEvent(new CustomEvent("mapVisibilityOptionsChanged"));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
31
client/src/map/smokemarker.ts
Normal file
31
client/src/map/smokemarker.ts
Normal file
@@ -0,0 +1,31 @@
|
|||||||
|
import { DivIcon, LatLngExpression, MarkerOptions } from "leaflet";
|
||||||
|
import { CustomMarker } from "./custommarker";
|
||||||
|
import { SVGInjector } from "@tanem/svg-injector";
|
||||||
|
import { getMap } from "..";
|
||||||
|
|
||||||
|
export class SmokeMarker extends CustomMarker {
|
||||||
|
#color: string;
|
||||||
|
|
||||||
|
constructor(latlng: LatLngExpression, color: string, options?: MarkerOptions) {
|
||||||
|
super(latlng, options);
|
||||||
|
this.setZIndexOffset(9999);
|
||||||
|
this.#color = color;
|
||||||
|
window.setTimeout(() => { this.removeFrom(getMap()); }, 300000) /* Remove the smoke after 5 minutes */
|
||||||
|
}
|
||||||
|
|
||||||
|
createIcon() {
|
||||||
|
this.setIcon(new DivIcon({
|
||||||
|
iconSize: [52, 52],
|
||||||
|
iconAnchor: [26, 52],
|
||||||
|
className: "leaflet-smoke-marker",
|
||||||
|
}));
|
||||||
|
var el = document.createElement("div");
|
||||||
|
el.classList.add("ol-smoke-icon");
|
||||||
|
el.setAttribute("data-color", this.#color);
|
||||||
|
var img = document.createElement("img");
|
||||||
|
img.src = "/resources/theme/images/markers/smoke.svg";
|
||||||
|
img.onload = () => SVGInjector(img);
|
||||||
|
el.appendChild(img);
|
||||||
|
this.getElement()?.appendChild(el);
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -76,7 +76,7 @@ export class Unit extends CustomMarker {
|
|||||||
};
|
};
|
||||||
#ammo: Ammo[] = [];
|
#ammo: Ammo[] = [];
|
||||||
#contacts: Contact[] = [];
|
#contacts: Contact[] = [];
|
||||||
#activePath: LatLng[] = [];
|
#activePath: LatLng[] = [];
|
||||||
#isLeader: boolean = false;
|
#isLeader: boolean = false;
|
||||||
|
|
||||||
#selectable: boolean;
|
#selectable: boolean;
|
||||||
@@ -94,43 +94,43 @@ export class Unit extends CustomMarker {
|
|||||||
#hotgroup: number | null = null;
|
#hotgroup: number | null = null;
|
||||||
#detectionMethods: number[] = [];
|
#detectionMethods: number[] = [];
|
||||||
|
|
||||||
getAlive() {return this.#alive};
|
getAlive() { return this.#alive };
|
||||||
getHuman() {return this.#human};
|
getHuman() { return this.#human };
|
||||||
getControlled() {return this.#controlled};
|
getControlled() { return this.#controlled };
|
||||||
getCoalition() {return this.#coalition};
|
getCoalition() { return this.#coalition };
|
||||||
getCountry() {return this.#country};
|
getCountry() { return this.#country };
|
||||||
getName() {return this.#name};
|
getName() { return this.#name };
|
||||||
getUnitName() {return this.#unitName};
|
getUnitName() { return this.#unitName };
|
||||||
getGroupName() {return this.#groupName};
|
getGroupName() { return this.#groupName };
|
||||||
getState() {return this.#state};
|
getState() { return this.#state };
|
||||||
getTask() {return this.#task};
|
getTask() { return this.#task };
|
||||||
getHasTask() {return this.#hasTask};
|
getHasTask() { return this.#hasTask };
|
||||||
getPosition() {return this.#position};
|
getPosition() { return this.#position };
|
||||||
getSpeed() {return this.#speed};
|
getSpeed() { return this.#speed };
|
||||||
getHeading() {return this.#heading};
|
getHeading() { return this.#heading };
|
||||||
getIsTanker() {return this.#isTanker};
|
getIsTanker() { return this.#isTanker };
|
||||||
getIsAWACS() {return this.#isAWACS};
|
getIsAWACS() { return this.#isAWACS };
|
||||||
getOnOff() {return this.#onOff};
|
getOnOff() { return this.#onOff };
|
||||||
getFollowRoads() {return this.#followRoads};
|
getFollowRoads() { return this.#followRoads };
|
||||||
getFuel() {return this.#fuel};
|
getFuel() { return this.#fuel };
|
||||||
getDesiredSpeed() {return this.#desiredSpeed};
|
getDesiredSpeed() { return this.#desiredSpeed };
|
||||||
getDesiredSpeedType() {return this.#desiredSpeedType};
|
getDesiredSpeedType() { return this.#desiredSpeedType };
|
||||||
getDesiredAltitude() {return this.#desiredAltitude};
|
getDesiredAltitude() { return this.#desiredAltitude };
|
||||||
getDesiredAltitudeType() {return this.#desiredAltitudeType};
|
getDesiredAltitudeType() { return this.#desiredAltitudeType };
|
||||||
getLeaderID() {return this.#leaderID};
|
getLeaderID() { return this.#leaderID };
|
||||||
getFormationOffset() {return this.#formationOffset};
|
getFormationOffset() { return this.#formationOffset };
|
||||||
getTargetID() {return this.#targetID};
|
getTargetID() { return this.#targetID };
|
||||||
getTargetPosition() {return this.#targetPosition};
|
getTargetPosition() { return this.#targetPosition };
|
||||||
getROE() {return this.#ROE};
|
getROE() { return this.#ROE };
|
||||||
getReactionToThreat() {return this.#reactionToThreat};
|
getReactionToThreat() { return this.#reactionToThreat };
|
||||||
getEmissionsCountermeasures() {return this.#emissionsCountermeasures};
|
getEmissionsCountermeasures() { return this.#emissionsCountermeasures };
|
||||||
getTACAN() {return this.#TACAN};
|
getTACAN() { return this.#TACAN };
|
||||||
getRadio() {return this.#radio};
|
getRadio() { return this.#radio };
|
||||||
getGeneralSettings() {return this.#generalSettings};
|
getGeneralSettings() { return this.#generalSettings };
|
||||||
getAmmo() {return this.#ammo};
|
getAmmo() { return this.#ammo };
|
||||||
getContacts() {return this.#contacts};
|
getContacts() { return this.#contacts };
|
||||||
getActivePath() {return this.#activePath};
|
getActivePath() { return this.#activePath };
|
||||||
getIsLeader() {return this.#isLeader};
|
getIsLeader() { return this.#isLeader };
|
||||||
|
|
||||||
static getConstructor(type: string) {
|
static getConstructor(type: string) {
|
||||||
if (type === "GroundUnit") return GroundUnit;
|
if (type === "GroundUnit") return GroundUnit;
|
||||||
@@ -156,7 +156,7 @@ export class Unit extends CustomMarker {
|
|||||||
this.on('contextmenu', (e) => this.#onContextMenu(e));
|
this.on('contextmenu', (e) => this.#onContextMenu(e));
|
||||||
this.on('mouseover', () => { if (this.belongsToCommandedCoalition()) this.setHighlighted(true); })
|
this.on('mouseover', () => { if (this.belongsToCommandedCoalition()) this.setHighlighted(true); })
|
||||||
this.on('mouseout', () => { this.setHighlighted(false); })
|
this.on('mouseout', () => { this.setHighlighted(false); })
|
||||||
getMap().on("zoomend", () => {this.#onZoom();})
|
getMap().on("zoomend", () => { this.#onZoom(); })
|
||||||
|
|
||||||
/* Deselect units if they are hidden */
|
/* Deselect units if they are hidden */
|
||||||
document.addEventListener("toggleCoalitionVisibility", (ev: CustomEventInit) => {
|
document.addEventListener("toggleCoalitionVisibility", (ev: CustomEventInit) => {
|
||||||
@@ -165,13 +165,13 @@ export class Unit extends CustomMarker {
|
|||||||
|
|
||||||
document.addEventListener("toggleUnitVisibility", (ev: CustomEventInit) => {
|
document.addEventListener("toggleUnitVisibility", (ev: CustomEventInit) => {
|
||||||
window.setTimeout(() => { this.setSelected(this.getSelected() && !this.getHidden()) }, 300);
|
window.setTimeout(() => { this.setSelected(this.getSelected() && !this.getHidden()) }, 300);
|
||||||
});
|
});
|
||||||
|
|
||||||
document.addEventListener("mapVisibilityOptionsChanged", (ev: CustomEventInit) => {
|
document.addEventListener("mapVisibilityOptionsChanged", (ev: CustomEventInit) => {
|
||||||
this.#updateMarker();
|
this.#updateMarker();
|
||||||
if (this.getSelected())
|
if (this.getSelected())
|
||||||
this.drawLines();
|
this.drawLines();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
getCategory() {
|
getCategory() {
|
||||||
@@ -222,12 +222,12 @@ export class Unit extends CustomMarker {
|
|||||||
case DataIndexes.radio: this.#radio = dataExtractor.extractRadio(); break;
|
case DataIndexes.radio: this.#radio = dataExtractor.extractRadio(); break;
|
||||||
case DataIndexes.generalSettings: this.#generalSettings = dataExtractor.extractGeneralSettings(); break;
|
case DataIndexes.generalSettings: this.#generalSettings = dataExtractor.extractGeneralSettings(); break;
|
||||||
case DataIndexes.ammo: this.#ammo = dataExtractor.extractAmmo(); break;
|
case DataIndexes.ammo: this.#ammo = dataExtractor.extractAmmo(); break;
|
||||||
case DataIndexes.contacts: this.#contacts = dataExtractor.extractContacts(); document.dispatchEvent(new CustomEvent("contactsUpdated", {detail: this})); break;
|
case DataIndexes.contacts: this.#contacts = dataExtractor.extractContacts(); document.dispatchEvent(new CustomEvent("contactsUpdated", { detail: this })); break;
|
||||||
case DataIndexes.activePath: this.#activePath = dataExtractor.extractActivePath(); break;
|
case DataIndexes.activePath: this.#activePath = dataExtractor.extractActivePath(); break;
|
||||||
case DataIndexes.isLeader: this.#isLeader = dataExtractor.extractBool(); break;
|
case DataIndexes.isLeader: this.#isLeader = dataExtractor.extractBool(); break;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Dead units can't be selected */
|
/* Dead units can't be selected */
|
||||||
this.setSelected(this.getSelected() && this.#alive && !this.getHidden())
|
this.setSelected(this.getSelected() && this.#alive && !this.getHidden())
|
||||||
|
|
||||||
@@ -314,7 +314,7 @@ export class Unit extends CustomMarker {
|
|||||||
|
|
||||||
getLiveryID(): string {
|
getLiveryID(): string {
|
||||||
const liveryID = this.getDatabase()?.getByName(this.getName())?.liveryID;
|
const liveryID = this.getDatabase()?.getByName(this.getName())?.liveryID;
|
||||||
return liveryID? liveryID: "";
|
return liveryID ? liveryID : "";
|
||||||
}
|
}
|
||||||
|
|
||||||
setAlive(newAlive: boolean) {
|
setAlive(newAlive: boolean) {
|
||||||
@@ -327,7 +327,7 @@ export class Unit extends CustomMarker {
|
|||||||
/* Only alive units can be selected. Some units are not selectable (weapons) */
|
/* Only alive units can be selected. Some units are not selectable (weapons) */
|
||||||
if ((this.#alive || !selected) && this.getSelectable() && this.getSelected() != selected && this.belongsToCommandedCoalition()) {
|
if ((this.#alive || !selected) && this.getSelectable() && this.getSelected() != selected && this.belongsToCommandedCoalition()) {
|
||||||
this.#selected = selected;
|
this.#selected = selected;
|
||||||
|
|
||||||
if (selected) {
|
if (selected) {
|
||||||
document.dispatchEvent(new CustomEvent("unitSelection", { detail: this }));
|
document.dispatchEvent(new CustomEvent("unitSelection", { detail: this }));
|
||||||
this.#updateMarker();
|
this.#updateMarker();
|
||||||
@@ -346,7 +346,7 @@ export class Unit extends CustomMarker {
|
|||||||
else
|
else
|
||||||
this.#updateMarker();
|
this.#updateMarker();
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -390,7 +390,7 @@ export class Unit extends CustomMarker {
|
|||||||
belongsToCommandedCoalition() {
|
belongsToCommandedCoalition() {
|
||||||
if (getMissionHandler().getCommandModeOptions().commandMode !== GAME_MASTER && getMissionHandler().getCommandedCoalition() !== this.#coalition)
|
if (getMissionHandler().getCommandModeOptions().commandMode !== GAME_MASTER && getMissionHandler().getCommandedCoalition() !== this.#coalition)
|
||||||
return false;
|
return false;
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
|
|
||||||
getType() {
|
getType() {
|
||||||
@@ -438,7 +438,15 @@ export class Unit extends CustomMarker {
|
|||||||
var unitIcon = document.createElement("div");
|
var unitIcon = document.createElement("div");
|
||||||
unitIcon.classList.add("unit-icon");
|
unitIcon.classList.add("unit-icon");
|
||||||
var img = document.createElement("img");
|
var img = document.createElement("img");
|
||||||
img.src = `/resources/theme/images/units/${this.getMarkerCategory()}.svg`;
|
var imgSrc;
|
||||||
|
|
||||||
|
/* If a unit does not belong to the commanded coalition or it is not visually detected, show it with the generic aircraft square */
|
||||||
|
if (this.belongsToCommandedCoalition() || this.getDetectionMethods().some(value => [VISUAL, OPTIC].includes(value)))
|
||||||
|
imgSrc = this.getMarkerCategory();
|
||||||
|
else
|
||||||
|
imgSrc = "aircraft";
|
||||||
|
|
||||||
|
img.src = `/resources/theme/images/units/${imgSrc}.svg`;
|
||||||
img.onload = () => SVGInjector(img);
|
img.onload = () => SVGInjector(img);
|
||||||
unitIcon.appendChild(img);
|
unitIcon.appendChild(img);
|
||||||
unitIcon.toggleAttribute("data-rotate-to-heading", iconOptions.rotateToHeading);
|
unitIcon.toggleAttribute("data-rotate-to-heading", iconOptions.rotateToHeading);
|
||||||
@@ -503,12 +511,12 @@ export class Unit extends CustomMarker {
|
|||||||
updateVisibility() {
|
updateVisibility() {
|
||||||
const hiddenUnits = getUnitsManager().getHiddenTypes();
|
const hiddenUnits = getUnitsManager().getHiddenTypes();
|
||||||
var hidden = ((this.#human && hiddenUnits.includes("human")) ||
|
var hidden = ((this.#human && hiddenUnits.includes("human")) ||
|
||||||
(this.#controlled == false && hiddenUnits.includes("dcs")) ||
|
(this.#controlled == false && hiddenUnits.includes("dcs")) ||
|
||||||
(hiddenUnits.includes(this.getMarkerCategory())) ||
|
(hiddenUnits.includes(this.getMarkerCategory())) ||
|
||||||
(hiddenUnits.includes(this.#coalition)) ||
|
(hiddenUnits.includes(this.#coalition)) ||
|
||||||
(!this.belongsToCommandedCoalition() && (this.#detectionMethods.length == 0 || (this.#detectionMethods.length == 1 && this.#detectionMethods[0] === RWR))) ||
|
(!this.belongsToCommandedCoalition() && (this.#detectionMethods.length == 0 || (this.#detectionMethods.length == 1 && this.#detectionMethods[0] === RWR))) ||
|
||||||
(getMap().getVisibilityOptions()[HIDE_GROUP_MEMBERS] && !this.#isLeader && this.getCategory() == "GroundUnit" && getMap().getZoom() < 13 && (this.belongsToCommandedCoalition() || (!this.belongsToCommandedCoalition() && this.#detectionMethods.length == 0)))) &&
|
(getMap().getVisibilityOptions()[HIDE_GROUP_MEMBERS] && !this.#isLeader && this.getCategory() == "GroundUnit" && getMap().getZoom() < 13 && (this.belongsToCommandedCoalition() || (!this.belongsToCommandedCoalition() && this.#detectionMethods.length == 0)))) &&
|
||||||
!(this.getSelected());
|
!(this.getSelected());
|
||||||
|
|
||||||
this.setHidden(hidden || !this.#alive);
|
this.setHidden(hidden || !this.#alive);
|
||||||
}
|
}
|
||||||
@@ -518,9 +526,9 @@ export class Unit extends CustomMarker {
|
|||||||
|
|
||||||
/* Add the marker if not present */
|
/* Add the marker if not present */
|
||||||
if (!getMap().hasLayer(this) && !this.getHidden()) {
|
if (!getMap().hasLayer(this) && !this.getHidden()) {
|
||||||
if (getMap().isZooming())
|
if (getMap().isZooming())
|
||||||
this.once("zoomend", () => {this.addTo(getMap())})
|
this.once("zoomend", () => { this.addTo(getMap()) })
|
||||||
else
|
else
|
||||||
this.addTo(getMap());
|
this.addTo(getMap());
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -563,10 +571,22 @@ export class Unit extends CustomMarker {
|
|||||||
return loadouts.some((loadout: LoadoutBlueprint) => {
|
return loadouts.some((loadout: LoadoutBlueprint) => {
|
||||||
return (roles as string[]).some((role: string) => { return loadout.roles.includes(role) });
|
return (roles as string[]).some((role: string) => { return loadout.roles.includes(role) });
|
||||||
});
|
});
|
||||||
} else
|
} else
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
isInViewport() {
|
||||||
|
|
||||||
|
const mapBounds = getMap().getBounds();
|
||||||
|
const unitPos = this.getPosition();
|
||||||
|
|
||||||
|
return (unitPos.lng > mapBounds.getWest()
|
||||||
|
&& unitPos.lng < mapBounds.getEast()
|
||||||
|
&& unitPos.lat > mapBounds.getSouth()
|
||||||
|
&& unitPos.lat < mapBounds.getNorth());
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
/********************** Unit commands *************************/
|
/********************** Unit commands *************************/
|
||||||
addDestination(latlng: L.LatLng) {
|
addDestination(latlng: L.LatLng) {
|
||||||
if (!this.#human) {
|
if (!this.#human) {
|
||||||
@@ -708,24 +728,28 @@ export class Unit extends CustomMarker {
|
|||||||
#onClick(e: any) {
|
#onClick(e: any) {
|
||||||
if (!this.#preventClick) {
|
if (!this.#preventClick) {
|
||||||
if (getMap().getState() === IDLE || getMap().getState() === MOVE_UNIT || e.originalEvent.ctrlKey) {
|
if (getMap().getState() === IDLE || getMap().getState() === MOVE_UNIT || e.originalEvent.ctrlKey) {
|
||||||
if (!e.originalEvent.ctrlKey)
|
if (!e.originalEvent.ctrlKey)
|
||||||
getUnitsManager().deselectAllUnits();
|
getUnitsManager().deselectAllUnits();
|
||||||
|
|
||||||
this.setSelected( !this.getSelected() );
|
this.setSelected(!this.getSelected());
|
||||||
if ( this.getSelected() ) {
|
const detail = { "detail": { "unit": this } };
|
||||||
document.dispatchEvent( new CustomEvent( "unitSelection", { "detail": this }));
|
if (this.getSelected())
|
||||||
} else {
|
document.dispatchEvent(new CustomEvent("unitSelected", detail));
|
||||||
document.dispatchEvent( new CustomEvent( "unitDeselection", { "detail": this }));
|
else
|
||||||
}
|
document.dispatchEvent(new CustomEvent("unitDeselection", { "detail": this }));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this.#timer = window.setTimeout(() => {
|
this.#timer = window.setTimeout(() => { this.#preventClick = false; }, 200);
|
||||||
this.#preventClick = false;
|
|
||||||
}, 200);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#onDoubleClick(e: any) {
|
#onDoubleClick(e: any) {
|
||||||
|
const unitsManager = getUnitsManager();
|
||||||
|
Object.values(unitsManager.getUnits()).forEach((unit: Unit) => {
|
||||||
|
if (unit.getAlive() === true && unit.getName() === this.getName() && unit.isInViewport())
|
||||||
|
unitsManager.selectUnit(unit.ID, false);
|
||||||
|
});
|
||||||
|
|
||||||
clearTimeout(this.#timer);
|
clearTimeout(this.#timer);
|
||||||
this.#preventClick = true;
|
this.#preventClick = true;
|
||||||
}
|
}
|
||||||
@@ -747,7 +771,7 @@ export class Unit extends CustomMarker {
|
|||||||
options["refuel"] = { text: "Air to air refuel", tooltip: "Refuel units at the nearest AAR Tanker. If no tanker is available the unit will RTB." }; // TODO Add some way of knowing which aircraft can AAR
|
options["refuel"] = { text: "Air to air refuel", tooltip: "Refuel units at the nearest AAR Tanker. If no tanker is available the unit will RTB." }; // TODO Add some way of knowing which aircraft can AAR
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if (selectedUnitTypes.length === 1 && ["NavyUnit", "GroundUnit"].includes(selectedUnitTypes[0]) && getUnitsManager().getSelectedUnitsVariable((unit: Unit) => {return unit.getCoalition()}) !== undefined)
|
if (selectedUnitTypes.length === 1 && ["NavyUnit", "GroundUnit"].includes(selectedUnitTypes[0]) && getUnitsManager().getSelectedUnitsVariable((unit: Unit) => {return unit.getCoalition()}) !== undefined)
|
||||||
options["group"] = { text: "Create group", tooltip: "Create a group from the selected units." };
|
options["group"] = { text: "Create group", tooltip: "Create a group from the selected units." };
|
||||||
|
|
||||||
@@ -791,7 +815,7 @@ export class Unit extends CustomMarker {
|
|||||||
getMap().hideUnitContextMenu();
|
getMap().hideUnitContextMenu();
|
||||||
this.#applyFollowOptions(option);
|
this.#applyFollowOptions(option);
|
||||||
});
|
});
|
||||||
|
|
||||||
getMap().showUnitContextMenu(e.originalEvent.x, e.originalEvent.y, e.latlng);
|
getMap().showUnitContextMenu(e.originalEvent.x, e.originalEvent.y, e.latlng);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -1050,16 +1074,17 @@ export class Unit extends CustomMarker {
|
|||||||
|
|
||||||
export class AirUnit extends Unit {
|
export class AirUnit extends Unit {
|
||||||
getIconOptions() {
|
getIconOptions() {
|
||||||
|
var belongsToCommandedCoalition = this.belongsToCommandedCoalition();
|
||||||
return {
|
return {
|
||||||
showState: this.belongsToCommandedCoalition(),
|
showState: belongsToCommandedCoalition,
|
||||||
showVvi: (this.belongsToCommandedCoalition() || this.getDetectionMethods().some(value => [VISUAL, OPTIC, RADAR, IRST, DLINK].includes(value))),
|
showVvi: (belongsToCommandedCoalition || this.getDetectionMethods().some(value => [VISUAL, OPTIC, RADAR, IRST, DLINK].includes(value))),
|
||||||
showHotgroup: this.belongsToCommandedCoalition(),
|
showHotgroup: belongsToCommandedCoalition,
|
||||||
showUnitIcon: (this.belongsToCommandedCoalition() || this.getDetectionMethods().some(value => [VISUAL, OPTIC, RADAR, IRST, DLINK].includes(value))),
|
showUnitIcon: (belongsToCommandedCoalition || this.getDetectionMethods().some(value => [VISUAL, OPTIC, RADAR, IRST, DLINK].includes(value))),
|
||||||
showShortLabel: (this.belongsToCommandedCoalition() || this.getDetectionMethods().some(value => [VISUAL, OPTIC].includes(value))),
|
showShortLabel: (belongsToCommandedCoalition || this.getDetectionMethods().some(value => [VISUAL, OPTIC].includes(value))),
|
||||||
showFuel: this.belongsToCommandedCoalition(),
|
showFuel: belongsToCommandedCoalition,
|
||||||
showAmmo: this.belongsToCommandedCoalition(),
|
showAmmo: belongsToCommandedCoalition,
|
||||||
showSummary: (this.belongsToCommandedCoalition() || this.getDetectionMethods().some(value => [VISUAL, OPTIC, RADAR, IRST, DLINK].includes(value))),
|
showSummary: (belongsToCommandedCoalition || this.getDetectionMethods().some(value => [VISUAL, OPTIC, RADAR, IRST, DLINK].includes(value))),
|
||||||
showCallsign: this.belongsToCommandedCoalition(),
|
showCallsign: belongsToCommandedCoalition,
|
||||||
rotateToHeading: false
|
rotateToHeading: false
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
@@ -1091,16 +1116,17 @@ export class GroundUnit extends Unit {
|
|||||||
}
|
}
|
||||||
|
|
||||||
getIconOptions() {
|
getIconOptions() {
|
||||||
|
var belongsToCommandedCoalition = this.belongsToCommandedCoalition();
|
||||||
return {
|
return {
|
||||||
showState: this.belongsToCommandedCoalition(),
|
showState: belongsToCommandedCoalition,
|
||||||
showVvi: false,
|
showVvi: false,
|
||||||
showHotgroup: this.belongsToCommandedCoalition(),
|
showHotgroup: belongsToCommandedCoalition,
|
||||||
showUnitIcon: (this.belongsToCommandedCoalition() || this.getDetectionMethods().some(value => [VISUAL, OPTIC, RADAR, IRST, DLINK].includes(value))),
|
showUnitIcon: (belongsToCommandedCoalition || this.getDetectionMethods().some(value => [VISUAL, OPTIC, RADAR, IRST, DLINK].includes(value))),
|
||||||
showShortLabel: false,
|
showShortLabel: false,
|
||||||
showFuel: false,
|
showFuel: false,
|
||||||
showAmmo: false,
|
showAmmo: false,
|
||||||
showSummary: false,
|
showSummary: false,
|
||||||
showCallsign: this.belongsToCommandedCoalition(),
|
showCallsign: belongsToCommandedCoalition,
|
||||||
rotateToHeading: false
|
rotateToHeading: false
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
@@ -1111,7 +1137,7 @@ export class GroundUnit extends Unit {
|
|||||||
|
|
||||||
getType() {
|
getType() {
|
||||||
var blueprint = groundUnitDatabase.getByName(this.getName());
|
var blueprint = groundUnitDatabase.getByName(this.getName());
|
||||||
return blueprint?.type? blueprint.type: "";
|
return blueprint?.type ? blueprint.type : "";
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -1121,16 +1147,17 @@ export class NavyUnit extends Unit {
|
|||||||
}
|
}
|
||||||
|
|
||||||
getIconOptions() {
|
getIconOptions() {
|
||||||
|
var belongsToCommandedCoalition = this.belongsToCommandedCoalition();
|
||||||
return {
|
return {
|
||||||
showState: this.belongsToCommandedCoalition(),
|
showState: belongsToCommandedCoalition,
|
||||||
showVvi: false,
|
showVvi: false,
|
||||||
showHotgroup: true,
|
showHotgroup: true,
|
||||||
showUnitIcon: (this.belongsToCommandedCoalition() || this.getDetectionMethods().some(value => [VISUAL, OPTIC, RADAR, IRST, DLINK].includes(value))),
|
showUnitIcon: (belongsToCommandedCoalition || this.getDetectionMethods().some(value => [VISUAL, OPTIC, RADAR, IRST, DLINK].includes(value))),
|
||||||
showShortLabel: false,
|
showShortLabel: false,
|
||||||
showFuel: false,
|
showFuel: false,
|
||||||
showAmmo: false,
|
showAmmo: false,
|
||||||
showSummary: false,
|
showSummary: false,
|
||||||
showCallsign: this.belongsToCommandedCoalition(),
|
showCallsign: belongsToCommandedCoalition,
|
||||||
rotateToHeading: false
|
rotateToHeading: false
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
@@ -1145,6 +1172,6 @@ export class NavyUnit extends Unit {
|
|||||||
|
|
||||||
getType() {
|
getType() {
|
||||||
var blueprint = navyUnitDatabase.getByName(this.getName());
|
var blueprint = navyUnitDatabase.getByName(this.getName());
|
||||||
return blueprint?.type? blueprint.type: "";
|
return blueprint?.type ? blueprint.type : "";
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user