1
+ ? `
+ cursor-pointer
+ hover:bg-blue-500
+ `
+ : ""
+ }
+ flex h-full rounded-md border-2 border-transparent bg-blue-600
+ px-4 text-gray-200
`}
onClick={() => {
- if (enabledCommandModes.length > 0) {
+ if (enabledCommandModes.length > 1) {
let gameMasterCommandModeIndex = enabledCommandModes.indexOf(GAME_MASTER);
let redCommandModeIndex = enabledCommandModes.indexOf(RED_COMMANDER);
if (redCommandModeIndex >= 0) getApp().getServerManager().setActiveCommandMode(RED_COMMANDER);
@@ -318,12 +336,10 @@ export function Header() {
}}
>
- {enabledCommandModes.length > 0 && (
+ {enabledCommandModes.length > 1 && (
<>
{loadingNewCommandMode ? (
-
)}
@@ -334,12 +350,20 @@ export function Header() {
{commandModeOptions.commandMode === RED_COMMANDER && (
1
+ ? `
+ cursor-pointer
+ hover:bg-red-500
+ `
+ : ""
+ }
+ rounded-md border-2 border-transparent bg-red-600 px-4
+ text-gray-200
`}
onClick={() => {
- if (enabledCommandModes.length > 0) {
+ if (enabledCommandModes.length > 1) {
let gameMasterCommandModeIndex = enabledCommandModes.indexOf(GAME_MASTER);
let blueCommandModeIndex = enabledCommandModes.indexOf(BLUE_COMMANDER);
if (gameMasterCommandModeIndex >= 0) getApp().getServerManager().setActiveCommandMode(GAME_MASTER);
@@ -349,12 +373,10 @@ export function Header() {
}}
>
RED Commander
- {enabledCommandModes.length > 0 && (
+ {enabledCommandModes.length > 1 && (
<>
{loadingNewCommandMode ? (
-
+
) : (
)}
@@ -463,7 +485,11 @@ export function Header() {
onClick={(event) => unitTypeFilterClickHandler(event, entry[0])}
checked={!mapHiddenTypes[entry[0]]}
icon={entry[1]}
- tooltip={"Hide/show " + entry[0] + " units. Tip: holding ctrl key while clicking will hide other unit categories. To show all units again, hold ctrl while clicking a displayed unit category."}
+ tooltip={
+ "Hide/show " +
+ entry[0] +
+ " units. Tip: holding ctrl key while clicking will hide other unit categories. To show all units again, hold ctrl while clicking a displayed unit category."
+ }
/>
);
})}
diff --git a/frontend/react/src/ui/panels/optionsmenu.tsx b/frontend/react/src/ui/panels/optionsmenu.tsx
index 0f5eaa06..98fec5b0 100644
--- a/frontend/react/src/ui/panels/optionsmenu.tsx
+++ b/frontend/react/src/ui/panels/optionsmenu.tsx
@@ -4,8 +4,8 @@ import { OlCheckbox } from "../components/olcheckbox";
import { OlRangeSlider } from "../components/olrangeslider";
import { OlNumberInput } from "../components/olnumberinput";
import { getApp } from "../../olympusapp";
-import { MAP_OPTIONS_DEFAULTS, OlympusState, OptionsSubstate } from "../../constants/constants";
-import { BindShortcutRequestEvent, MapOptionsChangedEvent, ShortcutsChangedEvent } from "../../events";
+import { COMMAND_MODE_OPTIONS_DEFAULTS, GAME_MASTER, MAP_OPTIONS_DEFAULTS, OlympusState, OptionsSubstate } from "../../constants/constants";
+import { BindShortcutRequestEvent, CommandModeOptionsChangedEvent, MapOptionsChangedEvent, ShortcutsChangedEvent } from "../../events";
import { OlAccordion } from "../components/olaccordion";
import { Shortcut } from "../../shortcut/shortcut";
import { OlSearchBar } from "../components/olsearchbar";
@@ -29,6 +29,7 @@ export function OptionsMenu(props: { open: boolean; onClose: () => void; childre
const [filterString, setFilterString] = useState("");
const [admin, setAdmin] = useState(false);
const [password, setPassword] = useState("");
+ const [commandModeOptions, setCommandModeOptions] = useState(COMMAND_MODE_OPTIONS_DEFAULTS);
const checkPassword = (password: string) => {
var hash = sha256.create();
@@ -56,6 +57,10 @@ export function OptionsMenu(props: { open: boolean; onClose: () => void; childre
useEffect(() => {
MapOptionsChangedEvent.on((mapOptions) => setMapOptions({ ...mapOptions }));
ShortcutsChangedEvent.on((shortcuts) => setShortcuts({ ...shortcuts }));
+
+ CommandModeOptionsChangedEvent.on((commandModeOptions) => {
+ setCommandModeOptions(commandModeOptions);
+ });
}, []);
return (
@@ -222,36 +227,40 @@ export function OptionsMenu(props: { open: boolean; onClose: () => void; childre
{}}>
Show racetracks
{
- mapOptions.AWACSCoalition === "blue" && getApp().getMap().setOption("AWACSCoalition", "neutral");
- mapOptions.AWACSCoalition === "neutral" && getApp().getMap().setOption("AWACSCoalition", "red");
- mapOptions.AWACSCoalition === "red" && getApp().getMap().setOption("AWACSCoalition", "blue");
- }}
- >
-
-
-
{
- mapOptions.AWACSCoalition === "blue" && getApp().getMap().setOption("AWACSCoalition", "neutral");
- mapOptions.AWACSCoalition === "neutral" && getApp().getMap().setOption("AWACSCoalition", "red");
- mapOptions.AWACSCoalition === "red" && getApp().getMap().setOption("AWACSCoalition", "blue");
- }}
- coalition={mapOptions.AWACSCoalition}
- />
- Coalition of unit bullseye info
+ <>
+ {commandModeOptions.commandMode === GAME_MASTER && (
+ {
+ mapOptions.AWACSCoalition === "blue" && getApp().getMap().setOption("AWACSCoalition", "neutral");
+ mapOptions.AWACSCoalition === "neutral" && getApp().getMap().setOption("AWACSCoalition", "red");
+ mapOptions.AWACSCoalition === "red" && getApp().getMap().setOption("AWACSCoalition", "blue");
+ }}
+ >
+
+
+
{
+ mapOptions.AWACSCoalition === "blue" && getApp().getMap().setOption("AWACSCoalition", "neutral");
+ mapOptions.AWACSCoalition === "neutral" && getApp().getMap().setOption("AWACSCoalition", "red");
+ mapOptions.AWACSCoalition === "red" && getApp().getMap().setOption("AWACSCoalition", "blue");
+ }}
+ coalition={mapOptions.AWACSCoalition}
+ />
+ Coalition of unit bullseye info
+
+
+
{" "}
+
Change the coalition of the bullseye to use to provide bullseye information in the unit tooltip.
+
+
-
-
{" "}
-
Change the coalition of the bullseye to use to provide bullseye information in the unit tooltip.
-
-
-
+ )}
+ >
{
+ this.#redrawMarker();
+ });
}
/********************** Abstract methods *************************/
@@ -881,7 +886,7 @@ export abstract class Unit extends CustomMarker {
targetingRange: this.#targetingRange,
aimMethodRange: this.#aimMethodRange,
acquisitionRange: this.#acquisitionRange,
- airborne: this.#airborne
+ airborne: this.#airborne,
};
}
@@ -1782,7 +1787,8 @@ export abstract class Unit extends CustomMarker {
element.querySelector(".unit-vvi")?.setAttribute("style", `height: ${15 + this.#speed / 5}px;`);
/* Set the unit name or callsign */
- if (element.querySelector(".unit-callsign")) (element.querySelector(".unit-callsign") as HTMLElement).innerText = getApp().getMap().getOptions().showUnitCallsigns? this.#callsign: this.#unitName;
+ if (element.querySelector(".unit-callsign"))
+ (element.querySelector(".unit-callsign") as HTMLElement).innerText = getApp().getMap().getOptions().showUnitCallsigns ? this.#callsign : this.#unitName;
/* Set fuel data */
element.querySelector(".unit-fuel-level")?.setAttribute("style", `width: ${this.#fuel}%`);