From bc5049992ab981c44e268a46a0949b348ce8f0b8 Mon Sep 17 00:00:00 2001 From: Davide Passoni Date: Mon, 5 Aug 2024 17:07:58 +0200 Subject: [PATCH] Started working on tanker and AWACS settings --- frontend/react/.gitignore | 2 + .../react/src/ui/components/olaccordion.tsx | 1 - .../react/src/ui/components/olcallout.tsx | 6 +- frontend/react/src/ui/modals/login.tsx | 14 +- .../react/src/ui/panels/components/menu.tsx | 15 +- frontend/react/src/ui/panels/header.tsx | 2 +- frontend/react/src/ui/panels/mainmenu.tsx | 29 +- frontend/react/src/ui/panels/minimappanel.tsx | 16 +- .../react/src/ui/panels/unitcontrolmenu.tsx | 249 ++++++++++++------ .../src/ui/panels/unitmousecontrolbar.tsx | 4 +- 10 files changed, 213 insertions(+), 125 deletions(-) diff --git a/frontend/react/.gitignore b/frontend/react/.gitignore index cb0da3d6..67a86e91 100644 --- a/frontend/react/.gitignore +++ b/frontend/react/.gitignore @@ -21,3 +21,5 @@ dist-ssr *.njsproj *.sln *.sw? + +.vite \ No newline at end of file diff --git a/frontend/react/src/ui/components/olaccordion.tsx b/frontend/react/src/ui/components/olaccordion.tsx index 194594a4..16247c94 100644 --- a/frontend/react/src/ui/components/olaccordion.tsx +++ b/frontend/react/src/ui/components/olaccordion.tsx @@ -74,7 +74,6 @@ export function OlAccordion(props: {
{props.showArrows && (
- {" "} {!scrolledUp && ( - {" "} - BLUE COMMANDER{" "} + BLUE COMMANDER
) : (
- {" "} - RED COMMANDER{" "} + RED COMMANDER
)}
diff --git a/frontend/react/src/ui/modals/login.tsx b/frontend/react/src/ui/modals/login.tsx index f1f28606..5784cc9d 100644 --- a/frontend/react/src/ui/modals/login.tsx +++ b/frontend/react/src/ui/modals/login.tsx @@ -96,7 +96,7 @@ export function LoginModal(props: { dark:text-gray-200 `} > - {window.location.toString()}{" "} + {window.location.toString()}
- Password{" "} + Password - Login{" "} + Login - Continue{" "} + Continue - Still having issues? See our{" "} + Still having issues? See our - YouTube Video Guide{" "} + YouTube Video Guide - Wiki Guide{" "} + Wiki Guide - )}{" "} + )} {props.title} {props.canBeHidden == true && ( -
setHide(!hide)}> +
setHide(!hide)} + > {hide ? ( ) : ( diff --git a/frontend/react/src/ui/panels/header.tsx b/frontend/react/src/ui/panels/header.tsx index 5d77d7f9..c5971e02 100644 --- a/frontend/react/src/ui/panels/header.tsx +++ b/frontend/react/src/ui/panels/header.tsx @@ -110,7 +110,7 @@ export function Header() { dark:text-gray-200 `} > - {IP}{" "} + {IP} - + Olympus Version {VERSION}
@@ -63,7 +60,7 @@ export function MainMenu(props: { `} > {/**/} - View GitHub Repo{" "} + View GitHub Repo {/**/} - View User Guide{" "} + View User Guide {/**/} Open Olympus Manager -
+
{/**/} Database Manager -
+
{/**/} Export to file -
+
{/**/} Import from file -
+
{/**/} Close Olympus -
+
) : ( <> -
- FPS:{" "} +
+ FPS: {frameRate} - {" "} +
-
- Load:{" "} +
+ Load: {load} - {" "} +
-
- {showMissionTime ? "MT" : "ET"}: {timeString}{" "} +
+ {showMissionTime ? "MT" : "ET"}: {timeString}
diff --git a/frontend/react/src/ui/panels/unitcontrolmenu.tsx b/frontend/react/src/ui/panels/unitcontrolmenu.tsx index 912b953e..db48de17 100644 --- a/frontend/react/src/ui/panels/unitcontrolmenu.tsx +++ b/frontend/react/src/ui/panels/unitcontrolmenu.tsx @@ -49,11 +49,18 @@ import { mToFt, msToKnots, } from "../../other/utils"; -import { FaGasPump, FaQuestionCircle } from "react-icons/fa"; +import { + FaCog, + FaGasPump, + FaQuestionCircle, + FaSignal, + FaTag, +} from "react-icons/fa"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { OlSearchBar } from "../components/olsearchbar"; import { OlDropdown, OlDropdownItem } from "../components/oldropdown"; import { UnitBlueprint } from "../../interfaces"; +import { FaRadio } from "react-icons/fa6"; export function UnitControlMenu(props: { open: boolean; onClose: () => void }) { var [selectedUnits, setSelectedUnits] = useState([] as Unit[]); @@ -280,8 +287,9 @@ export function UnitControlMenu(props: { open: boolean; onClose: () => void }) { Selection tool
- The selection tools allows you to select units depending on their category, coalition, and control mode. You can also - select units depending on their specific type by using the search input. + The selection tools allows you to select units depending on their + category, coalition, and control mode. You can also select units + depending on their specific type by using the search input.
void }) { return; if ( - unit.getControlled() && + unit.isControlledByOlympus() && !selectionFilter["control"]["olympus"] ) return; if ( - !unit.getHuman() && - !unit.getControlled() && + !unit.isControlledByDCS() && !selectionFilter["control"]["dcs"] ) return; @@ -744,45 +751,47 @@ export function UnitControlMenu(props: { open: boolean; onClose: () => void }) { step={speedStep} />
-
- - Rules of engagement - - - {[ - olButtonsRoeHold, - olButtonsRoeReturn, - olButtonsRoeDesignated, - olButtonsRoeFree, - ].map((icon, idx) => { - return ( - { - selectedUnits.forEach((unit) => { - unit.setROE(ROEs[idx]); - setSelectedUnitsData({ - ...selectedUnitsData, - ROE: ROEs[idx], - }); - }); - }} - active={selectedUnitsData.ROE === ROEs[idx]} - icon={icon} - /> - ); - })} - -
+ {!(selectedUnits.length === 1 && selectedUnits[0].isTanker()) && + !(selectedUnits.length === 1 && selectedUnits[0].isAWACS()) && ( +
+ + Rules of engagement + + + {[ + olButtonsRoeHold, + olButtonsRoeReturn, + olButtonsRoeDesignated, + olButtonsRoeFree, + ].map((icon, idx) => { + return ( + { + selectedUnits.forEach((unit) => { + unit.setROE(ROEs[idx]); + setSelectedUnitsData({ + ...selectedUnitsData, + ROE: ROEs[idx], + }); + }); + }} + active={selectedUnitsData.ROE === ROEs[idx]} + icon={icon} + /> + ); + })} + +
+ )} {selectedCategories.every((category) => { return ["Aircraft", "Helicopter"].includes(category); }) && ( <> - {" "}
void }) { dark:text-white `} > - {" "} - Act as tanker{" "} + Make tanker available void }) { dark:text-white `} > - {" "} - Act as AWACS{" "} + Make AWACS available void }) { />
)} + {selectedUnits.length === 1 && selectedUnits[0].isTanker() && ( +
+ +
+ )} {selectedCategories.every((category) => { return ["GroundUnit", "NavyUnit"].includes(category); }) && ( <> - {" "}
void }) { dark:text-white `} > - {" "} - Operate as{" "} + Operate as void }) { dark:text-white `} > - {" "} - Follow roads{" "} + Follow roads void }) { dark:text-white `} > - {" "} - Unit active{" "} + Unit active void }) {
- {selectedUnits[0].getAmmo().map((ammo) => { - return ( -
-
- {ammo.quantity} + {selectedUnits[0].isControlledByOlympus() && + selectedUnits[0].isTanker() && ( + <> +
+
+
+ +
+
+ {`${["Texaco", "Arco", "Shell"][selectedUnits[0].getRadio().callsign]}-${ + selectedUnits[0].getRadio().callsignNumber + }`} +
+
-
- {ammo.name} +
+
+
+ +
+
+ {`${( + selectedUnits[0].getRadio().frequency / + 1000000 + ).toFixed(3)} MHz`} +
+
-
- ); - })} + +
+
+
+ +
+
+ {selectedUnits[0].getTACAN().isOn + ? `${selectedUnits[0].getTACAN().channel}${selectedUnits[0].getTACAN().XY} ${selectedUnits[0].getTACAN().callsign}` + : "TACAN OFF"} +
+
+
+ + )} + {!selectedUnits[0].isTanker() && + !selectedUnits[0].isAWACS() && + selectedUnits[0].getAmmo().map((ammo) => { + return ( +
+
+ {ammo.quantity} +
+
+ {ammo.name} +
+
+ ); + })}
)} diff --git a/frontend/react/src/ui/panels/unitmousecontrolbar.tsx b/frontend/react/src/ui/panels/unitmousecontrolbar.tsx index 39ca6417..78d214e7 100644 --- a/frontend/react/src/ui/panels/unitmousecontrolbar.tsx +++ b/frontend/react/src/ui/panels/unitmousecontrolbar.tsx @@ -71,8 +71,7 @@ export function UnitMouseControlBar(props: {}) { function onScroll(el) { const sl = el.scrollLeft; - const sr = - el.scrollWidth - el.scrollLeft - el.clientWidth; + const sr = el.scrollWidth - el.scrollLeft - el.clientWidth; sl < 1 && !scrolledLeft && setScrolledLeft(true); sl > 1 && scrolledLeft && setScrolledLeft(false); @@ -83,7 +82,6 @@ export function UnitMouseControlBar(props: {}) { return ( <> - {" "} {open && ( <>