Added code to show spawn menu from airbase spawn

client/src/controls/airbasecontextmenu.ts

@@ -1,4 +1,4 @@
-import { getUnitsManager } from "..";
+import { getMap, getUnitsManager, setActiveCoalition } from "..";
 import { Airbase } from "../missionhandler/airbase";
 import { ContextMenu } from "./contextmenu";
 
@@ -8,6 +8,9 @@ export class AirbaseContextMenu extends ContextMenu {
     constructor(id: string)
     {
         super(id);
+        document.addEventListener("contextMenuSpawnAirbase", (e: any) => {
+            this.showSpawnMenu();
+        })
     }
 
     setAirbase(airbase: Airbase)
@@ -53,6 +56,16 @@ export class AirbaseContextMenu extends ContextMenu {
     enableLandButton(enableLandButton: boolean)
     {
         this.getContainer()?.querySelector("#land-here-button")?.classList.toggle("hide", !enableLandButton);
-        
+    }
+
+    showSpawnMenu()
+    {
+        if (this.#airbase != null)
+        {
+            setActiveCoalition(this.#airbase.getCoalition());
+            getMap().showMapContextMenu({originalEvent: {x: this.getX(), y: this.getY(), latlng: this.getLatLng()}});
+            getMap().getMapContextMenu().hideUpperBar();
+            getMap().getMapContextMenu().showSubMenu("aircraft");
+        }
     }
 }

client/src/controls/contextmenu.ts

@@ -33,6 +33,16 @@ export class ContextMenu {
         return this.#latlng;
     }
 
+    getX()
+    {
+        return this.#x;
+    }
+
+    getY()
+    {
+        return this.#y;
+    }
+
     clip()
     {
         if (this.#container != null) {

client/src/controls/mapcontextmenu.ts

@@ -34,18 +34,7 @@ export class MapContextMenu extends ContextMenu {
         this.#groundUnitTypeDropdown = new Dropdown("ground-unit-type-options", (type: string) => this.#setGroundUnitType(type));
 
         document.addEventListener("contextMenuShow", (e: any) => {
-            this.getContainer()?.querySelector("#aircraft-spawn-menu")?.classList.toggle("hide", e.detail.type !== "aircraft");
+            this.showSubMenu(e.detail.type);
-            this.getContainer()?.querySelector("#aircraft-spawn-button")?.classList.toggle("is-open", e.detail.type === "aircraft");
-            this.getContainer()?.querySelector("#ground-unit-spawn-menu")?.classList.toggle("hide", e.detail.type !== "ground-unit");
-            this.getContainer()?.querySelector("#ground-unit-spawn-button")?.classList.toggle("is-open", e.detail.type === "ground-unit");
-            this.getContainer()?.querySelector("#smoke-spawn-menu")?.classList.toggle("hide", e.detail.type !== "smoke");
-            this.getContainer()?.querySelector("#smoke-spawn-button")?.classList.toggle("is-open", e.detail.type === "smoke");
-
-            this.#resetAircraftRole();
-            this.#resetAircraftType();
-            this.#resetGroundUnitRole();
-            this.#resetGroundUnitType();
-            this.clip();
         })
 
         document.addEventListener("contextMenuDeployAircraft", () => {
@@ -68,6 +57,30 @@ export class MapContextMenu extends ContextMenu {
     show(x: number, y: number, latlng: LatLng) {
         super.show(x, y, latlng);
         this.#spawnOptions.latlng = latlng;
+        this.showUpperBar();
+    }
+
+    showSubMenu(type: string){
+        this.getContainer()?.querySelector("#aircraft-spawn-menu")?.classList.toggle("hide", type !== "aircraft");
+        this.getContainer()?.querySelector("#aircraft-spawn-button")?.classList.toggle("is-open", type === "aircraft");
+        this.getContainer()?.querySelector("#ground-unit-spawn-menu")?.classList.toggle("hide", type !== "ground-unit");
+        this.getContainer()?.querySelector("#ground-unit-spawn-button")?.classList.toggle("is-open", type === "ground-unit");
+        this.getContainer()?.querySelector("#smoke-spawn-menu")?.classList.toggle("hide", type !== "smoke");
+        this.getContainer()?.querySelector("#smoke-spawn-button")?.classList.toggle("is-open", type === "smoke");
+
+        this.#resetAircraftRole();
+        this.#resetAircraftType();
+        this.#resetGroundUnitRole();
+        this.#resetGroundUnitType();
+        this.clip();
+    }
+
+    showUpperBar() {
+        this.getContainer()?.querySelector("#upper-bar")?.classList.toggle("hide", false);
+    }
+
+    hideUpperBar() {
+        this.getContainer()?.querySelector("#upper-bar")?.classList.toggle("hide", true);
     }
 
     #onSwitch(e: any) {

client/views/contextmenus.ejs

@@ -1,6 +1,6 @@
 <div id="map-contextmenu">
     <div id="active-coalition-label" data-active-coalition="blue"></div>
-    <div class="ol-panel">
+    <div id="upper-bar" class="ol-panel">
         <label id="context-menu-switch" class="toggle" for="context-menu-toggle">
             <input class="toggle-input" name="" type="checkbox" id="context-menu-toggle">
             <div data-active-coalition="blue" class="toggle-fill"></div>