Readded context menus

frontend/react/src/unit/contextaction.ts

@@ -1,13 +1,14 @@
 import { IconDefinition } from "@fortawesome/fontawesome-svg-core";
 import { Unit } from "./unit";
 import { LatLng } from "leaflet";
+import { ContextActionType } from "../constants/constants";
 
 export interface ContextActionOptions {
   executeImmediately?: boolean;
-  buttonColor?: string | null;
+  type: ContextActionType;
 }
 
-export type ContextActionCallback = (units: Unit[], targetUnit: Unit | null, targetPosition: LatLng | null) => void;
+export type ContextActionCallback = (units: Unit[], targetUnit: Unit | null, targetPosition: LatLng | null, originalEvent?: MouseEvent) => void;
 
 export class ContextAction {
   #id: string = "";
@@ -64,7 +65,7 @@ export class ContextAction {
     return this.#target;
   }
 
-  executeCallback(targetUnit: Unit | null, targetPosition: LatLng | null) {
-    if (this.#callback) this.#callback(this.#units, targetUnit, targetPosition);
+  executeCallback(targetUnit: Unit | null, targetPosition: LatLng | null, originalEvent?: MouseEvent) {
+    if (this.#callback) this.#callback(this.#units, targetUnit, targetPosition, originalEvent);
   }
 }

frontend/react/src/unit/databases/unitdatabase.ts

@@ -226,4 +226,61 @@ export class UnitDatabase {
       shortLabel: "",
     };
   }
+
+  
+getRandomUnit(
+  options: {
+    type?: string;
+    role?: string;
+    ranges?: string[];
+    eras?: string[];
+    coalition?: string;
+  }
+) {
+  /* Start from all the unit blueprints in the database */
+  var unitBlueprints = this.getBlueprints();
+
+  /* If a specific type or role is provided, use only the blueprints of that type or role */
+  if (options.type && options.role) {
+    console.error("Can't create random unit if both type and role are provided. Either create by type or by role.");
+    return null;
+  }
+
+  if (options.type) {
+    unitBlueprints = this.getByType(options.type);
+  } else if (options.role) {
+    unitBlueprints = this.getByType(options.role);
+  }
+
+  /* Keep only the units that have a range included in the requested values */
+  if (options.ranges) {
+    unitBlueprints = unitBlueprints.filter((unitBlueprint: UnitBlueprint) => {
+      var rangeType = "";
+      var range = unitBlueprint.acquisitionRange;
+      if (range !== undefined) {
+        if (range >= 0 && range < 10000) rangeType = "Short range";
+        else if (range >= 10000 && range < 100000) rangeType = "Medium range";
+        else if (range >= 100000 && range < 999999) rangeType = "Long range";
+      }
+      return options.ranges?.includes(rangeType);
+    });
+  }
+
+  /* Keep only the units that have an era included in the requested values */
+  if (options.eras) {
+    unitBlueprints = unitBlueprints.filter((unitBlueprint: UnitBlueprint) => {
+      return unitBlueprint.era ? options.eras?.includes(unitBlueprint.era) : true;
+    });
+  }
+
+  /* Keep only the units that have the correct coalition, if selected */
+  if (options.coalition) {
+    unitBlueprints = unitBlueprints.filter((unitBlueprint: UnitBlueprint) => {
+      return unitBlueprint.coalition && unitBlueprint.coalition !== "" ? options.coalition === unitBlueprint.coalition : true;
+    });
+  }
+
+  var index = Math.floor(Math.random() * unitBlueprints.length);
+  return unitBlueprints[index];
+}
 }

frontend/react/src/unit/unit.ts

@@ -18,7 +18,6 @@ import {
 } from "../other/utils";
 import { CustomMarker } from "../map/markers/custommarker";
 import { SVGInjector } from "@tanem/svg-injector";
-import { UnitDatabase } from "./databases/unitdatabase";
 import { TargetMarker } from "../map/markers/targetmarker";
 import {
   DLINK,
@@ -36,11 +35,10 @@ import {
   GROUPING_ZOOM_TRANSITION,
   MAX_SHOTS_SCATTER,
   SHOTS_SCATTER_DEGREES,
-  ContextActionColors,
-  CONTEXT_ACTION_COLORS,
   OlympusState,
   JTACSubState,
   UnitControlSubState,
+  ContextActionType,
 } from "../constants/constants";
 import { DataExtractor } from "../server/dataextractor";
 import { Weapon } from "../weapon/weapon";
@@ -58,6 +56,7 @@ import {
 } from "../ui/components/olicons";
 import {
   faExplosion,
+  faHand,
   faLocationCrosshairs,
   faLocationDot,
   faMapLocation,
@@ -69,7 +68,7 @@ import {
   faXmarksLines,
 } from "@fortawesome/free-solid-svg-icons";
 import { Carrier } from "../mission/carrier";
-import { ContactsUpdatedEvent, HiddenTypesChangedEvent, MapOptionsChangedEvent, UnitDeadEvent, UnitDeselectedEvent, UnitSelectedEvent, UnitUpdatedEvent } from "../events";
+import { ContactsUpdatedEvent, FormationCreationRequestEvent, HiddenTypesChangedEvent, MapOptionsChangedEvent, UnitContextMenuRequestEvent, UnitDeadEvent, UnitDeselectedEvent, UnitExplosionRequestEvent, UnitSelectedEvent, UnitUpdatedEvent } from "../events";
 
 var pathIcon = new Icon({
   iconUrl: "/vite/images/markers/marker-icon.png",
@@ -828,6 +827,22 @@ export abstract class Unit extends CustomMarker {
    *
    */
   appendContextActions(contextActionSet: ContextActionSet) {
+    contextActionSet.addContextAction(
+      this,
+      "stop",
+      "Stop unit",
+      "Stops the unit",
+      faHand,
+      null,
+      (units: Unit[], _1, _2) => {
+        getApp().getUnitsManager().clearDestinations(units);
+      },
+      {
+        executeImmediately: true,
+        type: ContextActionType.MOVE,
+      }
+    );
+
     contextActionSet.addContextAction(
       this,
       "move",
@@ -835,11 +850,11 @@ export abstract class Unit extends CustomMarker {
       "Click on the map to move the units there",
       faLocationDot,
       "position",
-      (units: Unit[], _, targetPosition) => {
-        getApp().getUnitsManager().clearDestinations(units);
-        if (targetPosition) getApp().getUnitsManager().addDestination(targetPosition, false, 0, units);
+      (units: Unit[], _, targetPosition, originalEvent) => {
+        if (!originalEvent?.ctrlKey) getApp().getUnitsManager().clearDestinations(units);
+        if (targetPosition) getApp().getUnitsManager().addDestination(targetPosition, getApp().getMap().getOptions().keepRelativePositions, 0, units);
       },
-      { buttonColor: CONTEXT_ACTION_COLORS[ContextActionColors.MOVE] }
+      { type: ContextActionType.MOVE }
     );
 
     contextActionSet.addContextAction(
@@ -850,9 +865,9 @@ export abstract class Unit extends CustomMarker {
       faRoute,
       "position",
       (units: Unit[], _, targetPosition) => {
-        if (targetPosition) getApp().getUnitsManager().addDestination(targetPosition, false, 0, units);
+        if (targetPosition) getApp().getUnitsManager().addDestination(targetPosition, getApp().getMap().getOptions().keepRelativePositions, 0, units);
       },
-      { buttonColor: CONTEXT_ACTION_COLORS[ContextActionColors.MOVE] }
+      { type: ContextActionType.MOVE }
     );
 
     contextActionSet.addContextAction(
@@ -867,7 +882,7 @@ export abstract class Unit extends CustomMarker {
       },
       {
         executeImmediately: true,
-        buttonColor: CONTEXT_ACTION_COLORS[ContextActionColors.DELETE],
+        type: ContextActionType.DELETE,
       }
     );
 
@@ -880,16 +895,17 @@ export abstract class Unit extends CustomMarker {
       null,
       (units: Unit[], _1, _2) => {
         getApp().setState(OlympusState.UNIT_CONTROL, UnitControlSubState.UNIT_EXPLOSION_MENU)
+        UnitExplosionRequestEvent.dispatch(units)
       },
       {
         executeImmediately: true,
-        buttonColor: CONTEXT_ACTION_COLORS[ContextActionColors.DELETE],
+        type: ContextActionType.DELETE,
       }
     );
 
-    contextActionSet.addDefaultContextAction(this, "default", "Set destination", "", faRoute, null, (units: Unit[], targetUnit, targetPosition) => {
+    contextActionSet.addDefaultContextAction(this, "default", "Set destination", "", faRoute, null, (units: Unit[], targetUnit, targetPosition, originalEvent) => {
       if (targetPosition) {
-        getApp().getUnitsManager().clearDestinations(units);
+        if (!originalEvent?.ctrlKey) getApp().getUnitsManager().clearDestinations(units);
         getApp().getUnitsManager().addDestination(targetPosition, false, 0, units);
       }
     });
@@ -1175,6 +1191,7 @@ export abstract class Unit extends CustomMarker {
 
   clearDestinations() {
     if (!this.#human) this.#activePath = [];
+    getApp().getServerManager().addDestination(this.ID, []);
   }
 
   updatePathFromMarkers() {
@@ -1393,11 +1410,11 @@ export abstract class Unit extends CustomMarker {
   #onShortPress(e: LeafletMouseEvent) {
     console.log(`Short press on ${this.getUnitName()}`);
 
-    if (getApp().getState() === OlympusState.IDLE || e.originalEvent.ctrlKey) {
+    if (getApp().getState() !== OlympusState.UNIT_CONTROL || e.originalEvent.ctrlKey) {
       if (!e.originalEvent.ctrlKey) getApp().getUnitsManager().deselectAllUnits();
       this.setSelected(!this.getSelected());
     } else if (getApp().getState() === OlympusState.UNIT_CONTROL) {
-      if (getApp().getMap().getContextAction()) getApp().getMap().executeContextAction(this, null);
+      if (getApp().getMap().getContextAction()) getApp().getMap().executeContextAction(this, null, e.originalEvent);
       else {
         getApp().getUnitsManager().deselectAllUnits();
         this.setSelected(!this.getSelected());
@@ -1413,6 +1430,7 @@ export abstract class Unit extends CustomMarker {
 
     if (e.originalEvent.button === 2) {
       getApp().setState(OlympusState.UNIT_CONTROL, UnitControlSubState.UNIT_CONTEXT_MENU)
+      UnitContextMenuRequestEvent.dispatch(this);
     }
   }
 
@@ -1837,7 +1855,7 @@ export abstract class AirUnit extends Unit {
       (units: Unit[]) => {
         getApp().getUnitsManager().refuel(units);
       },
-      { executeImmediately: true, buttonColor: CONTEXT_ACTION_COLORS[ContextActionColors.ADMIN] }
+      { executeImmediately: true, type: ContextActionType.ADMIN }
     );
     contextActionSet.addContextAction(
       this,
@@ -1849,7 +1867,7 @@ export abstract class AirUnit extends Unit {
       (units: Unit[]) => {
         getApp().getMap().centerOnUnit(units[0]);
       },
-      { executeImmediately: true, buttonColor: CONTEXT_ACTION_COLORS[ContextActionColors.OTHER] }
+      { executeImmediately: true, type: ContextActionType.OTHER }
     );
 
     /* Context actions that require a target unit */
@@ -1863,7 +1881,7 @@ export abstract class AirUnit extends Unit {
       (units: Unit[], targetUnit: Unit | null, _) => {
         if (targetUnit) getApp().getUnitsManager().attackUnit(targetUnit.ID, units);
       },
-      { buttonColor: CONTEXT_ACTION_COLORS[ContextActionColors.ENGAGE] }
+      { type: ContextActionType.ENGAGE }
     );
 
     contextActionSet.addContextAction(
@@ -1875,17 +1893,11 @@ export abstract class AirUnit extends Unit {
       "unit",
       (units: Unit[], targetUnit: Unit | null, _) => {
         if (targetUnit) {
-          document.dispatchEvent(
-            new CustomEvent("showFormationMenu", {
-              detail: {
-                leader: targetUnit,
-                wingmen: units.filter((unit) => unit !== targetUnit),
-              },
-            })
-          );
+          getApp().setState(OlympusState.UNIT_CONTROL, UnitControlSubState.FORMATION);
+          FormationCreationRequestEvent.dispatch(targetUnit, units.filter((unit) => unit !== targetUnit))
         }
       },
-      { buttonColor: CONTEXT_ACTION_COLORS[ContextActionColors.ADMIN] }
+      { type: ContextActionType.ADMIN }
     );
 
     if (this.canTargetPoint()) {
@@ -1898,9 +1910,9 @@ export abstract class AirUnit extends Unit {
         faLocationCrosshairs,
         "position",
         (units: Unit[], _, targetPosition: LatLng | null) => {
-          if (targetPosition) getApp().getUnitsManager().bombPoint(targetPosition, units);
+          if (targetPosition) getApp().getUnitsManager().bombPoint(targetPosition, getApp().getMap().getOptions().keepRelativePositions, 0, units);
         },
-        { buttonColor: CONTEXT_ACTION_COLORS[ContextActionColors.ENGAGE] }
+        { type: ContextActionType.ENGAGE }
       );
 
       contextActionSet.addContextAction(
@@ -1911,9 +1923,9 @@ export abstract class AirUnit extends Unit {
         faXmarksLines,
         "position",
         (units: Unit[], _, targetPosition: LatLng | null) => {
-          if (targetPosition) getApp().getUnitsManager().carpetBomb(targetPosition, units);
+          if (targetPosition) getApp().getUnitsManager().carpetBomb(targetPosition, getApp().getMap().getOptions().keepRelativePositions, 0, units);
         },
-        { buttonColor: CONTEXT_ACTION_COLORS[ContextActionColors.ENGAGE] }
+        { type: ContextActionType.ENGAGE }
       );
     }
 
@@ -1927,7 +1939,7 @@ export abstract class AirUnit extends Unit {
       (units: Unit[], _, targetPosition: LatLng | null) => {
         if (targetPosition) getApp().getUnitsManager().landAt(targetPosition, units);
       },
-      { buttonColor: CONTEXT_ACTION_COLORS[ContextActionColors.ADMIN] }
+      { type: ContextActionType.ADMIN }
     );
   }
 }
@@ -1973,9 +1985,9 @@ export class Helicopter extends AirUnit {
       olButtonsContextLandAtPoint,
       "position",
       (units: Unit[], _, targetPosition: LatLng | null) => {
-        if (targetPosition) getApp().getUnitsManager().landAtPoint(targetPosition, units);
+        if (targetPosition) getApp().getUnitsManager().landAtPoint(targetPosition, getApp().getMap().getOptions().keepRelativePositions, 0, units);
       },
-      { buttonColor: CONTEXT_ACTION_COLORS[ContextActionColors.ADMIN] }
+      { type: ContextActionType.ADMIN }
     );
   }
 
@@ -2024,7 +2036,7 @@ export class GroundUnit extends Unit {
       (units: Unit[], _1, _2) => {
         getApp().getUnitsManager().createGroup(units);
       },
-      { executeImmediately: true, buttonColor: CONTEXT_ACTION_COLORS[ContextActionColors.OTHER] }
+      { executeImmediately: true, type: ContextActionType.OTHER }
     );
     contextActionSet.addContextAction(
       this,
@@ -2036,7 +2048,7 @@ export class GroundUnit extends Unit {
       (units: Unit[]) => {
         getApp().getMap().centerOnUnit(units[0]);
       },
-      { executeImmediately: true, buttonColor: CONTEXT_ACTION_COLORS[ContextActionColors.OTHER] }
+      { executeImmediately: true, type: ContextActionType.OTHER }
     );
 
     /* Context actions that require a target unit */
@@ -2050,7 +2062,7 @@ export class GroundUnit extends Unit {
       (units: Unit[], targetUnit: Unit | null, _) => {
         if (targetUnit) getApp().getUnitsManager().attackUnit(targetUnit.ID, units);
       },
-      { buttonColor: CONTEXT_ACTION_COLORS[ContextActionColors.ENGAGE] }
+      { type: ContextActionType.ENGAGE }
     );
 
     /* Context actions that require a target position */
@@ -2063,9 +2075,9 @@ export class GroundUnit extends Unit {
         faLocationCrosshairs,
         "position",
         (units: Unit[], _, targetPosition: LatLng | null) => {
-          if (targetPosition) getApp().getUnitsManager().fireAtArea(targetPosition, units);
+          if (targetPosition) getApp().getUnitsManager().fireAtArea(targetPosition, getApp().getMap().getOptions().keepRelativePositions, 0, units);
         },
-        { buttonColor: CONTEXT_ACTION_COLORS[ContextActionColors.ENGAGE] }
+        { type: ContextActionType.ENGAGE }
       );
       contextActionSet.addContextAction(
         this,
@@ -2075,9 +2087,9 @@ export class GroundUnit extends Unit {
         olButtonsContextSimulateFireFight,
         "position",
         (units: Unit[], _, targetPosition: LatLng | null) => {
-          if (targetPosition) getApp().getUnitsManager().simulateFireFight(targetPosition, units);
+          if (targetPosition) getApp().getUnitsManager().simulateFireFight(targetPosition, getApp().getMap().getOptions().keepRelativePositions, 0, units);
         },
-        { buttonColor: CONTEXT_ACTION_COLORS[ContextActionColors.ADMIN] }
+        { type: ContextActionType.ADMIN }
       );
     }
   }
@@ -2148,7 +2160,7 @@ export class NavyUnit extends Unit {
       (units: Unit[], _1, _2) => {
         getApp().getUnitsManager().createGroup(units);
       },
-      { executeImmediately: true, buttonColor: CONTEXT_ACTION_COLORS[ContextActionColors.OTHER] }
+      { executeImmediately: true, type: ContextActionType.OTHER }
     );
     contextActionSet.addContextAction(
       this,
@@ -2160,7 +2172,7 @@ export class NavyUnit extends Unit {
       (units: Unit[]) => {
         getApp().getMap().centerOnUnit(units[0]);
       },
-      { executeImmediately: true, buttonColor: CONTEXT_ACTION_COLORS[ContextActionColors.OTHER] }
+      { executeImmediately: true, type: ContextActionType.OTHER }
     );
 
     /* Context actions that require a target unit */
@@ -2174,7 +2186,7 @@ export class NavyUnit extends Unit {
       (units: Unit[], targetUnit: Unit | null, _) => {
         if (targetUnit) getApp().getUnitsManager().attackUnit(targetUnit.ID, units);
       },
-      { buttonColor: CONTEXT_ACTION_COLORS[ContextActionColors.ENGAGE] }
+      { type: ContextActionType.ENGAGE }
     );
 
     /* Context actions that require a target position */
@@ -2186,9 +2198,9 @@ export class NavyUnit extends Unit {
       faLocationCrosshairs,
       "position",
       (units: Unit[], _, targetPosition: LatLng | null) => {
-        if (targetPosition) getApp().getUnitsManager().fireAtArea(targetPosition, units);
+        if (targetPosition) getApp().getUnitsManager().fireAtArea(targetPosition, getApp().getMap().getOptions().keepRelativePositions, 0, units);
       },
-      { buttonColor: CONTEXT_ACTION_COLORS[ContextActionColors.ENGAGE] }
+      { type: ContextActionType.ENGAGE }
     );
   }
 

frontend/react/src/unit/unitsmanager.ts

@@ -11,10 +11,6 @@ import {
   mToFt,
   mercatorToLatLng,
   msToKnots,
-  polyContains,
-  polygonArea,
-  randomPointInPoly,
-  randomUnitBlueprint,
 } from "../other/utils";
 import { CoalitionPolygon } from "../map/coalitionarea/coalitionpolygon";
 import { DELETE_CYCLE_TIME, DELETE_SLOW_THRESHOLD, DataIndexes, GAME_MASTER, IADSDensities, OlympusState, UnitControlSubState } from "../constants/constants";
@@ -33,6 +29,7 @@ import { ContextActionSet } from "./contextactionset";
 import {
   CommandModeOptionsChangedEvent,
   ContactsUpdatedEvent,
+  InfoPopupEvent,
   SelectedUnitsChangedEvent,
   SelectionClearedEvent,
   UnitDatabaseLoadedEvent,
@@ -343,9 +340,7 @@ export class UnitsManager {
   addDestination(latlng: L.LatLng, mantainRelativePosition: boolean, rotation: number, units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
 
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
       /* Compute the destination for each unit. If mantainRelativePosition is true, compute the destination so to hold the relative positions */
@@ -380,11 +375,9 @@ export class UnitsManager {
    */
   clearDestinations(units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
-    let callback = (units) => {
+    let callback = (units: Unit[]) => {
       for (let idx in units) {
         const unit = units[idx];
         if (unit.getState() === "follow") {
@@ -408,9 +401,7 @@ export class UnitsManager {
    */
   landAt(latlng: LatLng, units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
       units.forEach((unit: Unit) => unit.landAt(latlng));
@@ -430,9 +421,7 @@ export class UnitsManager {
    */
   changeSpeed(speedChange: string, units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
       units.forEach((unit: Unit) => unit.changeSpeed(speedChange));
@@ -450,9 +439,7 @@ export class UnitsManager {
    */
   changeAltitude(altitudeChange: string, units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
       units.forEach((unit: Unit) => unit.changeAltitude(altitudeChange));
@@ -470,9 +457,7 @@ export class UnitsManager {
    */
   setSpeed(speed: number, units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
       units.forEach((unit: Unit) => unit.setSpeed(speed));
@@ -491,9 +476,7 @@ export class UnitsManager {
    */
   setSpeedType(speedType: string, units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
       units.forEach((unit: Unit) => unit.setSpeedType(speedType));
@@ -512,9 +495,7 @@ export class UnitsManager {
    */
   setAltitude(altitude: number, units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
       units.forEach((unit: Unit) => unit.setAltitude(altitude));
@@ -533,9 +514,7 @@ export class UnitsManager {
    */
   setAltitudeType(altitudeType: string, units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
       units.forEach((unit: Unit) => unit.setAltitudeType(altitudeType));
@@ -554,9 +533,7 @@ export class UnitsManager {
    */
   setROE(ROE: string, units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
       units.forEach((unit: Unit) => unit.setROE(ROE));
@@ -575,9 +552,7 @@ export class UnitsManager {
    */
   setReactionToThreat(reactionToThreat: string, units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
       units.forEach((unit: Unit) => unit.setReactionToThreat(reactionToThreat));
@@ -596,9 +571,7 @@ export class UnitsManager {
    */
   setEmissionsCountermeasures(emissionCountermeasure: string, units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
       units.forEach((unit: Unit) => unit.setEmissionsCountermeasures(emissionCountermeasure));
@@ -617,9 +590,7 @@ export class UnitsManager {
    */
   setOnOff(onOff: boolean, units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
       units.forEach((unit: Unit) => unit.setOnOff(onOff));
@@ -638,9 +609,7 @@ export class UnitsManager {
    */
   setFollowRoads(followRoads: boolean, units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
       units.forEach((unit: Unit) => unit.setFollowRoads(followRoads));
@@ -660,9 +629,7 @@ export class UnitsManager {
   setOperateAs(operateAsBool: boolean, units: Unit[] | null = null) {
     var operateAs = operateAsBool ? "blue" : "red";
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
       units.forEach((unit: Unit) => unit.setOperateAs(operateAs));
@@ -681,9 +648,7 @@ export class UnitsManager {
    */
   attackUnit(ID: number, units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
       units.forEach((unit: Unit) => unit.attackUnit(ID));
@@ -701,9 +666,7 @@ export class UnitsManager {
   refuel(units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
 
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
       units.forEach((unit: Unit) => unit.refuel());
@@ -724,9 +687,7 @@ export class UnitsManager {
    */
   followUnit(ID: number, offset?: { x: number; y: number; z: number }, formation?: string, units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
       if (offset == undefined) {
@@ -759,11 +720,10 @@ export class UnitsManager {
         } else offset = undefined;
       }
 
-      if (getApp().getMap().getOptions().protectDCSUnits && !units.every((unit) => unit.isControlledByOlympus())){
+      if (getApp().getMap().getOptions().protectDCSUnits && !units.every((unit) => unit.isControlledByOlympus())) {
         getApp().setState(OlympusState.UNIT_CONTROL, UnitControlSubState.PROTECTION);
         this.#protectionCallback = callback;
-      }
-      else callback(units);
+      } else callback(units);
     };
     var count = 1;
     var xr = 0;
@@ -813,14 +773,19 @@ export class UnitsManager {
    * @param latlng Location to bomb
    * @param units (Optional) Array of units to apply the control to. If not provided, the operation will be completed on all selected units.
    */
-  bombPoint(latlng: LatLng, units: Unit[] | null = null) {
+  bombPoint(latlng: LatLng, mantainRelativePosition: boolean, rotation: number = 0, units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
-      units.forEach((unit: Unit) => unit.bombPoint(latlng));
+      /* Compute the target for each unit. If mantainRelativePosition is true, compute the target so to hold the relative positions */
+      var unitTargets: { [key: number]: LatLng } = {};
+      if (mantainRelativePosition) unitTargets = this.computeGroupDestination(latlng, rotation);
+      else
+        units.forEach((unit: Unit) => {
+          unitTargets[unit.ID] = latlng;
+        });
+      units.forEach((unit: Unit) => unit.bombPoint(unitTargets[unit.ID]));
       this.#showActionMessage(units, `unit bombing point`);
     };
 
@@ -834,14 +799,19 @@ export class UnitsManager {
    * @param latlng Location to bomb
    * @param units (Optional) Array of units to apply the control to. If not provided, the operation will be completed on all selected units.
    */
-  carpetBomb(latlng: LatLng, units: Unit[] | null = null) {
+  carpetBomb(latlng: LatLng, mantainRelativePosition: boolean, rotation: number = 0, units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
-      units.forEach((unit: Unit) => unit.carpetBomb(latlng));
+      /* Compute the target for each unit. If mantainRelativePosition is true, compute the target so to hold the relative positions */
+      var unitTargets: { [key: number]: LatLng } = {};
+      if (mantainRelativePosition) unitTargets = this.computeGroupDestination(latlng, rotation);
+      else
+        units.forEach((unit: Unit) => {
+          unitTargets[unit.ID] = latlng;
+        });
+      units.forEach((unit: Unit) => unit.carpetBomb(unitTargets[unit.ID]));
       this.#showActionMessage(units, `unit carpet bombing point`);
     };
 
@@ -855,14 +825,19 @@ export class UnitsManager {
    * @param latlng Location to fire at
    * @param units (Optional) Array of units to apply the control to. If not provided, the operation will be completed on all selected units.
    */
-  fireAtArea(latlng: LatLng, units: Unit[] | null = null) {
+  fireAtArea(latlng: LatLng, mantainRelativePosition: boolean, rotation: number = 0, units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
-      units.forEach((unit: Unit) => unit.fireAtArea(latlng));
+      /* Compute the target for each unit. If mantainRelativePosition is true, compute the target so to hold the relative positions */
+      var unitTargets: { [key: number]: LatLng } = {};
+      if (mantainRelativePosition) unitTargets = this.computeGroupDestination(latlng, rotation);
+      else
+        units.forEach((unit: Unit) => {
+          unitTargets[unit.ID] = latlng;
+        });
+      units.forEach((unit: Unit) => unit.fireAtArea(unitTargets[unit.ID]));
       this.#showActionMessage(units, `unit firing at area`);
     };
 
@@ -876,26 +851,34 @@ export class UnitsManager {
    * @param latlng Location to fire at
    * @param units (Optional) Array of units to apply the control to. If not provided, the operation will be completed on all selected units.
    */
-  simulateFireFight(latlng: LatLng, units: Unit[] | null = null) {
-    // TODO
-    //    if (units === null)
-    //      units = this.getSelectedUnits();
-    //    units = units.filter((unit => {!unit.getHuman()}));
-    //
-    //    let callback = (units) => {
-    //
-    //    getGroundElevation(latlng, (response: string) => {
-    //      var groundElevation: number | null = null;
-    //      try {
-    //        groundElevation = parseFloat(response);
-    //      } catch {
-    //        console.warn("Simulate fire fight: could not retrieve ground elevation");
-    //      }
-    //
-    //if (getApp().getMap().getOptions().protectDCSUnits && !units.every(unit => unit.isControlledByOlympus()))
-    //      this.showProtectedUnitsPopup(units.filter(unit => unit.isControlledByDCS()).length, callback);}      units?.forEach((unit: Unit) => unit.simulateFireFight(latlng, groundElevation));
-    //    });
-    //    this.#showActionMessage(units, `unit simulating fire fight`);
+  simulateFireFight(latlng: LatLng, mantainRelativePosition: boolean, rotation: number = 0, units: Unit[] | null = null) {
+    if (units === null) units = this.getSelectedUnits();
+    units = units.filter((unit) => !unit.getHuman());
+
+    let callback = (units) => {
+      getGroundElevation(latlng, (response: string) => {
+        var groundElevation: number | null = null;
+        try {
+          groundElevation = parseFloat(response);
+          /* Compute the target for each unit. If mantainRelativePosition is true, compute the target so to hold the relative positions */
+          var unitTargets: { [key: number]: LatLng } = {};
+          if (mantainRelativePosition) unitTargets = this.computeGroupDestination(latlng, rotation);
+          else
+            units.forEach((unit: Unit) => {
+              unitTargets[unit.ID] = latlng;
+            });
+          units.forEach((unit: Unit) => unit.simulateFireFight(unitTargets[unit.ID], groundElevation));
+          this.#showActionMessage(units, `simulating fire fight`);
+        } catch {
+          console.warn("Simulate fire fight: could not retrieve ground elevation");
+        }
+      });
+    };
+
+    if (getApp().getMap().getOptions().protectDCSUnits && !units.every((unit) => unit.isControlledByOlympus())) {
+      getApp().setState(OlympusState.UNIT_CONTROL, UnitControlSubState.PROTECTION);
+      this.#protectionCallback = callback;
+    } else callback(units);
   }
 
   /** Instruct units to enter into scenic AAA mode. Units will shoot in the air without aiming
@@ -903,9 +886,7 @@ export class UnitsManager {
    */
   scenicAAA(units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
       units.forEach((unit: Unit) => unit.scenicAAA());
@@ -922,9 +903,7 @@ export class UnitsManager {
    */
   missOnPurpose(units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
       units.forEach((unit: Unit) => unit.missOnPurpose());
@@ -941,14 +920,19 @@ export class UnitsManager {
    * @param latlng Point where to land
    * @param units (Optional) Array of units to apply the control to. If not provided, the operation will be completed on all selected units.
    */
-  landAtPoint(latlng: LatLng, units: Unit[] | null = null) {
+  landAtPoint(latlng: LatLng, mantainRelativePosition: boolean, rotation: number = 0, units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
-      units.forEach((unit: Unit) => unit.landAtPoint(latlng));
+      /* Compute the target for each unit. If mantainRelativePosition is true, compute the target so to hold the relative positions */
+      var unitTargets: { [key: number]: LatLng } = {};
+      if (mantainRelativePosition) unitTargets = this.computeGroupDestination(latlng, rotation);
+      else
+        units.forEach((unit: Unit) => {
+          unitTargets[unit.ID] = latlng;
+        });
+      units.forEach((unit: Unit) => unit.landAtPoint(unitTargets[unit.ID]));
       this.#showActionMessage(units, `unit landing at point`);
     };
 
@@ -964,9 +948,7 @@ export class UnitsManager {
    */
   setShotsScatter(shotsScatter: number, units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
       units.forEach((unit: Unit) => unit.setShotsScatter(shotsScatter));
@@ -985,9 +967,7 @@ export class UnitsManager {
    */
   setShotsIntensity(shotsIntensity: number, units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
       units.forEach((unit: Unit) => unit.setShotsIntensity(shotsIntensity));
@@ -1022,9 +1002,7 @@ export class UnitsManager {
    */
   createGroup(units: Unit[] | null = null) {
     if (units === null) units = this.getSelectedUnits();
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     let callback = (units) => {
       if (this.getUnitsCategories(units).length == 1) {
@@ -1033,14 +1011,14 @@ export class UnitsManager {
         getApp().getServerManager().cloneUnits(unitsData, true, 0 /* No spawn points, we delete the original units */);
         this.#showActionMessage(units, `created a group`);
       } else {
-        //(getApp().getPopupsManager().get("infoPopup") as Popup).setText(`Groups can only be created from units of the same category`);
+        getApp().addInfoMessage(`Groups can only be created from units of the same category`);
       }
-
-      if (getApp().getMap().getOptions().protectDCSUnits && !units.every((unit) => unit.isControlledByOlympus())) {
-        getApp().setState(OlympusState.UNIT_CONTROL, UnitControlSubState.PROTECTION);
-        this.#protectionCallback = callback;
-      } else callback(units);
     };
+
+    if (getApp().getMap().getOptions().protectDCSUnits && !units.every((unit) => unit.isControlledByOlympus())) {
+      getApp().setState(OlympusState.UNIT_CONTROL, UnitControlSubState.PROTECTION);
+      this.#protectionCallback = callback;
+    } else callback(units);
   }
 
   /** Set the hotgroup for the selected units. It will be the only hotgroup of the unit
@@ -1080,11 +1058,10 @@ export class UnitsManager {
       this.#showActionMessage(units as Unit[], `deleted`);
     };
 
-    if ((getApp().getMap().getOptions().protectDCSUnits && !units.every((unit) => unit.isControlledByOlympus())) || units.find((unit) => unit.getHuman())){
+    if ((getApp().getMap().getOptions().protectDCSUnits && !units.every((unit) => unit.isControlledByOlympus())) || units.find((unit) => unit.getHuman())) {
       getApp().setState(OlympusState.UNIT_CONTROL, UnitControlSubState.PROTECTION);
       this.#protectionCallback = callback;
-    }
-    else callback(units);
+    } else callback(units);
   }
 
   /** Compute the destinations of every unit in the selected units. This function preserves the relative positions of the units, and rotates the whole formation by rotation.
@@ -1098,9 +1075,7 @@ export class UnitsManager {
     // TODO handle protected units
     if (units === null) units = this.getSelectedUnits();
 
-    units = units.filter((unit) => {
-      return !unit.getHuman();
-    });
+    units = units.filter((unit) => !unit.getHuman());
 
     if (units.length === 0) return {};
 
@@ -1159,7 +1134,7 @@ export class UnitsManager {
         })
       )
     ); /* Can be applied to humans too */
-    //(getApp().getPopupsManager().get("infoPopup") as Popup).setText(`${this.#copiedUnits.length} units copied`);
+    getApp().addInfoMessage(`${this.#copiedUnits.length} units copied`);
   }
 
   /*********************** Unit manipulation functions  ************************/
@@ -1173,17 +1148,17 @@ export class UnitsManager {
     /* If spawns are restricted, check that the user has the necessary spawn points */
     if (getApp().getMissionManager().getCommandModeOptions().commandMode != GAME_MASTER) {
       if (getApp().getMissionManager().getCommandModeOptions().restrictSpawns && getApp().getMissionManager().getRemainingSetupTime() < 0) {
-        //(getApp().getPopupsManager().get("infoPopup") as Popup).setText(`Units can be pasted only during SETUP phase`);
+        getApp().addInfoMessage(`Units can be pasted only during SETUP phase`);
         return false;
       }
 
       this.#copiedUnits.forEach((unit: UnitData) => {
-        let unitSpawnPoints = getUnitDatabaseByCategory(unit.category)?.getSpawnPointsByName(unit.name);
+        let unitSpawnPoints = this.#unitDatabase.getSpawnPointsByName(unit.name);
         if (unitSpawnPoints !== undefined) spawnPoints += unitSpawnPoints;
       });
 
       if (spawnPoints > getApp().getMissionManager().getAvailableSpawnPoints()) {
-        //(getApp().getPopupsManager().get("infoPopup") as Popup).setText("Not enough spawn points available!");
+        getApp().addInfoMessage("Not enough spawn points available!");
         return false;
       }
     }
@@ -1229,9 +1204,9 @@ export class UnitsManager {
             }
           });
       }
-      //(getApp().getPopupsManager().get("infoPopup") as Popup).setText(`${this.#copiedUnits.length} units pasted`);
+      getApp().addInfoMessage(`${this.#copiedUnits.length} units pasted`);
     } else {
-      //(getApp().getPopupsManager().get("infoPopup") as Popup).setText("No units copied!");
+      getApp().addInfoMessage("No units copied!");
     }
   }
 
@@ -1284,14 +1259,14 @@ export class UnitsManager {
               /* Get a random blueprint depending on the selected parameters and spawn the unit */
               let unitBlueprint: UnitBlueprint | null;
               if (forceCoalition)
-                unitBlueprint = randomUnitBlueprint(groundUnitDatabase, {
+                unitBlueprint = this.#unitDatabase.getRandomUnit({
                   type: type,
                   eras: activeEras,
                   ranges: activeRanges,
                   coalition: coalitionArea.getCoalition(),
                 });
               else
-                unitBlueprint = randomUnitBlueprint(groundUnitDatabase, {
+                unitBlueprint = this.#unitDatabase.getRandomUnit({
                   type: type,
                   eras: activeEras,
                   ranges: activeRanges,
@@ -1337,14 +1312,14 @@ export class UnitsManager {
               /* Get a random blueprint depending on the selected parameters and spawn the unit */
               let unitBlueprint: UnitBlueprint | null;
               if (forceCoalition)
-                unitBlueprint = randomUnitBlueprint(groundUnitDatabase, {
+                unitBlueprint = this.#unitDatabase.getRandomUnit({
                   type: type,
                   eras: activeEras,
                   ranges: activeRanges,
                   coalition: coalitionArea.getCoalition(),
                 });
               else
-                unitBlueprint = randomUnitBlueprint(groundUnitDatabase, {
+                unitBlueprint = this.#unitDatabase.getRandomUnit({
                   type: type,
                   eras: activeEras,
                   ranges: activeRanges,
@@ -1418,38 +1393,38 @@ export class UnitsManager {
 
     if (category === "aircraft") {
       if (airbase == "" && spawnsRestricted) {
-        //(getApp().getPopupsManager().get("infoPopup") as Popup).setText("Aircrafts can be air spawned during the SETUP phase only");
+        getApp().addInfoMessage("Aircrafts can be air spawned during the SETUP phase only");
         return false;
       }
       spawnPoints = units.reduce((points: number, unit: UnitSpawnTable) => {
-        return points + this.getDatabase().getSpawnPointsByName(unit.unitType)
+        return points + this.getDatabase().getSpawnPointsByName(unit.unitType);
       }, 0);
       spawnFunction = () => getApp().getServerManager().spawnAircrafts(units, coalition, airbase, country, immediate, spawnPoints, callback);
     } else if (category === "helicopter") {
       if (airbase == "" && spawnsRestricted) {
-        //(getApp().getPopupsManager().get("infoPopup") as Popup).setText("Helicopters can be air spawned during the SETUP phase only");
+        getApp().addInfoMessage("Helicopters can be air spawned during the SETUP phase only");
         return false;
       }
       spawnPoints = units.reduce((points: number, unit: UnitSpawnTable) => {
-        return points + this.getDatabase().getSpawnPointsByName(unit.unitType)
+        return points + this.getDatabase().getSpawnPointsByName(unit.unitType);
       }, 0);
       spawnFunction = () => getApp().getServerManager().spawnHelicopters(units, coalition, airbase, country, immediate, spawnPoints, callback);
     } else if (category === "groundunit") {
       if (spawnsRestricted) {
-        //(getApp().getPopupsManager().get("infoPopup") as Popup).setText("Ground units can be spawned during the SETUP phase only");
+        getApp().addInfoMessage("Ground units can be spawned during the SETUP phase only");
         return false;
       }
       spawnPoints = units.reduce((points: number, unit: UnitSpawnTable) => {
-        return points + this.getDatabase().getSpawnPointsByName(unit.unitType)
+        return points + this.getDatabase().getSpawnPointsByName(unit.unitType);
       }, 0);
       spawnFunction = () => getApp().getServerManager().spawnGroundUnits(units, coalition, country, immediate, spawnPoints, callback);
     } else if (category === "navyunit") {
       if (spawnsRestricted) {
-        //(getApp().getPopupsManager().get("infoPopup") as Popup).setText("Navy units can be spawned during the SETUP phase only");
+        getApp().addInfoMessage("Navy units can be spawned during the SETUP phase only");
         return false;
       }
       spawnPoints = units.reduce((points: number, unit: UnitSpawnTable) => {
-        return points + this.getDatabase().getSpawnPointsByName(unit.unitType)
+        return points + this.getDatabase().getSpawnPointsByName(unit.unitType);
       }, 0);
       spawnFunction = () => getApp().getServerManager().spawnNavyUnits(units, coalition, country, immediate, spawnPoints, callback);
     }
@@ -1459,7 +1434,7 @@ export class UnitsManager {
       spawnFunction();
       return true;
     } else {
-      //(getApp().getPopupsManager().get("infoPopup") as Popup).setText("Not enough spawn points available!");
+      getApp().addInfoMessage("Not enough spawn points available!");
       return false;
     }
   }
@@ -1527,10 +1502,8 @@ export class UnitsManager {
   }
 
   #showActionMessage(units: Unit[], message: string) {
-    //if (units.length == 1)
-    //(getApp().getPopupsManager().get("infoPopup") as Popup).setText(`${units[0].getUnitName()} ${message}`);
-    //else if (units.length > 1)
-    //(getApp().getPopupsManager().get("infoPopup") as Popup).setText(`${units[0].getUnitName()} and ${units.length - 1} other units ${message}`);
+    if (units.length == 1) getApp().addInfoMessage(`${units[0].getUnitName()} ${message}`);
+    else if (units.length > 1) getApp().addInfoMessage(`${units[0].getUnitName()} and ${units.length - 1} other units ${message}`);
   }
 
   #showSlowDeleteDialog(units: Unit[]) {
@@ -1562,15 +1535,15 @@ export class UnitsManager {
   }
 
   #showNumberOfSelectedProtectedUnits() {
-    const map = getApp().getMap();
     const units = this.getSelectedUnits();
     const numSelectedUnits = units.length;
-    //const numProtectedUnits = units.filter((unit: Unit) => map.getIsUnitProtected(unit)).length;
+    const numProtectedUnits = units.filter((unit: Unit) => !unit.isControlledByOlympus() && !unit.getHuman()).length;
+    const numHumanUnits = units.filter((unit: Unit) => unit.getHuman()).length;
 
-    //if (numProtectedUnits === 1 && numSelectedUnits === numProtectedUnits)
-    //(getApp().getPopupsManager().get("infoPopup") as Popup).setText(`Notice: unit is protected`);
-
-    //if (numProtectedUnits > 1)
-    //(getApp().getPopupsManager().get("infoPopup") as Popup).setText(`Notice: selection contains ${numProtectedUnits} protected units.`);
+    if (getApp().getMap().getOptions().protectDCSUnits && numProtectedUnits === 1 && numSelectedUnits === numProtectedUnits)
+      getApp().addInfoMessage(`Notice: unit is protected`);
+    if (getApp().getMap().getOptions().protectDCSUnits && numProtectedUnits > 1)
+      getApp().addInfoMessage(`Notice: selection contains ${numProtectedUnits} protected units.`);
+    if (numHumanUnits) getApp().addInfoMessage(`Notice: selection contains ${numHumanUnits} human units.`);
   }
 }