Merge branch 'v2' of https://github.com/Pax1601/DCSOlympus into v2

frontend/react/src/ui/panels/awacsmenu.tsx

@@ -2,12 +2,21 @@ import React, { useEffect, useState } from "react";
 import { Menu } from "./components/menu";
 import { OlToggle } from "../components/oltoggle";
 import { MAP_OPTIONS_DEFAULTS } from "../../constants/constants";
-import { AWACSReferenceChangedEvent as AWACSReferenceUnitChangedEvent, HotgroupsChangedEvent, MapOptionsChangedEvent } from "../../events";
+import {
+  AWACSReferenceChangedEvent as AWACSReferenceUnitChangedEvent,
+  BullseyesDataChanged,
+  HotgroupsChangedEvent,
+  MapOptionsChangedEvent,
+} from "../../events";
 import { getApp } from "../../olympusapp";
 import { OlCoalitionToggle } from "../components/olcoalitiontoggle";
 import { Coalition } from "../../types/types";
 import { FaQuestionCircle } from "react-icons/fa";
 import { Unit } from "../../unit/unit";
+import { Bullseye } from "../../mission/bullseye";
+import { coalitionToEnum, computeBearingRangeString, mToFt, rad2deg } from "../../other/utils";
+
+const trackStrings = ["North", "North-East", "East", "South-East", "South", "South-West", "West", "North-West"]
 
 export function AWACSMenu(props: { open: boolean; onClose: () => void; children?: JSX.Element | JSX.Element[] }) {
   const [callsign, setCallsign] = useState("Magic");
@@ -15,16 +24,45 @@ export function AWACSMenu(props: { open: boolean; onClose: () => void; children?
   const [coalition, setCoalition] = useState("blue" as Coalition);
   const [hotgroups, setHotgroups] = useState({} as { [key: number]: Unit[] });
   const [referenceUnit, setReferenceUnit] = useState(null as Unit | null);
+  const [bullseyes, setBullseyes] = useState(null as null | { [name: string]: Bullseye });
 
   useEffect(() => {
     MapOptionsChangedEvent.on((mapOptions) => setMapOptions({ ...mapOptions }));
     HotgroupsChangedEvent.on((hotgroups) => setHotgroups({ ...hotgroups }));
     AWACSReferenceUnitChangedEvent.on((unit) => setReferenceUnit(unit));
+    BullseyesDataChanged.on((bullseyes) => setBullseyes(bullseyes));
   }, []);
 
-  const enemyGroups = Object.values(hotgroups).filter((hotgroup) => {
-    return hotgroup.every((unit) => unit.getCoalition() !== coalition)
-  })
+  const activeGroups = Object.values(hotgroups).filter((hotgroup) => {
+    return hotgroup.every((unit) => unit.getCoalition() !== coalition);
+  });
+
+  let readout: string[] = [];
+
+  if (bullseyes) {
+    if (referenceUnit) {
+      readout.push(`$`);
+    } else {
+      readout.push(`${callsign}, ${activeGroups.length} group${activeGroups.length > 1 && "s"}`);
+      readout.push(
+        ...activeGroups.map((group, idx) => {
+          let order = "th";
+          if (idx == 0) order = "st";
+          else if (idx == 1) order = "nd";
+          else if (idx == 2) order = "rd";
+
+          let trackDegs = rad2deg(group[0].getTrack())
+          if (trackDegs < 0) trackDegs += 360
+          let trackIndex = Math.round(trackDegs / 45)
+          
+          let groupLine = `${idx + 1}${order} group bullseye ${computeBearingRangeString(bullseyes[coalitionToEnum(coalition)].getLatLng(), group[0].getPosition()).replace("/", " ")}, ${ (mToFt(group[0].getPosition().alt ?? 0) / 1000).toFixed()} thousand, track ${trackStrings[trackIndex]}`;
+          return groupLine;
+        })
+      );
+      
+    }
+  }
+
 
   return (
     <Menu title={"AWACS Tools"} open={props.open} onClose={props.onClose} showBackButton={false} canBeHidden={true}>
@@ -37,12 +75,14 @@ export function AWACSMenu(props: { open: boolean; onClose: () => void; children?
         <>
           <div className="flex content-center gap-4">
             <FaQuestionCircle
-              className={`my-auto min-h-5 min-w-5 text-sm text-gray-500`}
+              className={`
+              my-auto min-h-5 min-w-5 text-sm text-gray-500
+            `}
             />
             <div className="flex flex-col gap-1 text-sm text-gray-500">
               <p>1 Use the coalition toggle to change your coalition as AWACS.</p>
-              <p>2 Set a friendly unit as reference by right clicking on it and selecting "Set AWACS reference".</p>
-              <p>3 Set enemy unit hotgroups to automatically create picture and tactical calls to read on radio for your CAP.</p>
+              <p>2 Set enemy unit hotgroups to automatically create picture calls to read on radio for your CAP.</p>
+              <p>3 Optionally, set a friendly unit as reference by right clicking on it and selecting "Set AWACS reference" to create tactical calls.</p>
             </div>
           </div>
           <div className="flex gap-4">
@@ -97,18 +137,17 @@ export function AWACSMenu(props: { open: boolean; onClose: () => void; children?
               Show units BRAA from reference unit
             </div>
           </div>
-          <div className="mt-4">
-          {
-            referenceUnit ? <>
-              {
-                enemyGroups.length == 0 ? <>
-                  No enemy or neutral hotgroup
-                </>:<>
-
-                </>
-              }
-            </>:<>No reference unit selected</>
-          }
+          <div className="mt-4 flex flex-col gap-2">
+            {activeGroups.length == 0 ? (
+              <>No hotgroups</>
+            ) : (
+              <>
+                Callout: 
+                {readout.map((line) => (
+                  <span className="font-bold italic text-cyan-500">{line}</span>
+                ))}
+              </>
+            )}
           </div>
         </>
       </div>

frontend/react/src/ui/panels/coordinatespanel.tsx

@@ -21,7 +21,6 @@ export function CoordinatesPanel(props: {}) {
     });
 
     BullseyesDataChanged.on((bullseyes) => setBullseyes(bullseyes));
-
     SelectedUnitsChangedEvent.on((selectedUnits) => setSelectedUnits(selectedUnits));
   }, []);