feat: return/tmpy-fpln button

flybywiresim · Nov 30, 2024 · 38aab20 · 38aab20
1 parent ba46a38
commit 38aab20
Show file tree

Hide file tree

Showing 3 changed files with 59 additions and 8 deletions.
diff --git a/fbw-a380x/src/systems/instruments/src/MFD/pages/FMS/F-PLN/MfdFmsFplnFixInfo.tsx b/fbw-a380x/src/systems/instruments/src/MFD/pages/FMS/F-PLN/MfdFmsFplnFixInfo.tsx
@@ -25,6 +25,7 @@ import { WaypointEntryUtils } from '@fmgc/flightplanning/WaypointEntryUtils';
 
 import './MfdFmsFplnFixInfo.scss';
 import { ObservableFlightPlanManager } from '@fmgc/flightplanning/ObservableFlightPlanManager';
+import { FlightPlanFooter } from '../../common/FlightPlanFooter';
 
 export class MfdFmsFplnFixInfo extends FmsPage {
   private readonly flightPlanManager = new ObservableFlightPlanManager(
@@ -105,6 +106,7 @@ export class MfdFmsFplnFixInfo extends FmsPage {
 
                     <InputField<number, number, false>
                       class="mfd-fms-fpln-fix-info-radial-1"
+                      alignText="flex-start"
                       disabled={this.flightPlan.fixInfos[value].map((it) => it?.fix === undefined)}
                       readonlyValue={this.flightPlan.fixInfos[value].map(
                         (it) => it?.radials?.[0]?.magneticBearing ?? null,
@@ -136,6 +138,7 @@ export class MfdFmsFplnFixInfo extends FmsPage {
 
                     <InputField<number, number, false>
                       class="mfd-fms-fpln-fix-info-radial-2"
+                      alignText="flex-start"
                       disabled={this.flightPlan.fixInfos[value].map(
                         (it) => it?.fix === undefined || (it.radials?.length ?? 0) < 1,
                       )}
@@ -178,6 +181,7 @@ export class MfdFmsFplnFixInfo extends FmsPage {
 
                     <InputField<number, number, false>
                       class="mfd-fms-fpln-fix-info-radius-1"
+                      alignText="flex-start"
                       disabled={this.flightPlan.fixInfos[value].map((it) => it?.fix === undefined)}
                       readonlyValue={this.flightPlan.fixInfos[value].map((it) => it?.radii?.[0]?.radius ?? null)}
                       onModified={(radius) => {
@@ -220,13 +224,7 @@ export class MfdFmsFplnFixInfo extends FmsPage {
           ))}
         </TopTabNavigator>
 
-        <Button
-          label="RETURN"
-          onClick={() => {
-            this.props.mfd.uiService.navigateTo(`fms/${this.props.mfd.uiService.activeUri.get().category}/f-pln`);
-          }}
-          buttonStyle="width: 130px; margin-left: 12px;"
-        />
+        <FlightPlanFooter bus={this.props.bus} mfd={this.props.mfd} fmcService={this.props.fmcService} />
 
         {/* end page content */}
         <Footer bus={this.props.bus} mfd={this.props.mfd} fmcService={this.props.fmcService} />

diff --git a/fbw-a380x/src/systems/instruments/src/MFD/pages/common/Button.tsx b/fbw-a380x/src/systems/instruments/src/MFD/pages/common/Button.tsx
@@ -104,7 +104,7 @@ export class Button extends DisplayComponent<ButtonProps> {
 
     this.subs.push(
       this.visible.sub((val) => {
-        this.topRef.instance.style.visibility = val ? 'visible' : 'hidden';
+        this.topRef.instance.style.visibility = val ? 'inherit' : 'hidden';
       }, true),
     );
 

diff --git a/fbw-a380x/src/systems/instruments/src/MFD/pages/common/FlightPlanFooter.tsx b/fbw-a380x/src/systems/instruments/src/MFD/pages/common/FlightPlanFooter.tsx
@@ -0,0 +1,53 @@
+import { DisplayComponent, EventBus, FSComponent, VNode } from '@microsoft/msfs-sdk';
+import { Button } from './Button';
+import { ObservableFlightPlanManager } from '@fmgc/flightplanning/ObservableFlightPlanManager';
+import { FmcServiceInterface } from '../../FMC/FmcServiceInterface';
+import { FmsDisplayInterface } from '@fmgc/flightplanning/interface/FmsDisplayInterface';
+import { MfdDisplayInterface } from '../../MFD';
+
+export interface FlightPlanFooterProps {
+  bus: EventBus;
+
+  mfd: FmsDisplayInterface & MfdDisplayInterface;
+
+  fmcService: FmcServiceInterface;
+}
+
+export class FlightPlanFooter extends DisplayComponent<FlightPlanFooterProps> {
+  private readonly flightPlanManager = new ObservableFlightPlanManager(
+    this.props.bus,
+    this.props.fmcService.master!.flightPlanService,
+  );
+
+  public render(): VNode | null {
+    return (
+      <div class="fr" style="justify-content: space-between;">
+        <div
+          class="mfd-fpln-hold-button-with-creative-class-name-which-is-as-long-as-style-attribute"
+          style={{ visibility: this.flightPlanManager.temporaryPlanExists.map((it) => (it ? 'hidden' : 'visible')) }}
+        >
+          <Button
+            label="RETURN"
+            onClick={() => {
+              this.props.fmcService.master?.resetRevisedWaypoint();
+              this.props.mfd.uiService.navigateTo('back');
+            }}
+          />
+        </div>
+        <div
+          class="mfd-fpln-hold-button-with-creative-class-name-which-is-as-long-as-style-attribute"
+          style={{ visibility: this.flightPlanManager.temporaryPlanExists.map((it) => (it ? 'visible' : 'hidden')) }}
+        >
+          <Button
+            label="TMPY F-PLN"
+            onClick={() => {
+              this.props.fmcService.master?.resetRevisedWaypoint();
+              this.props.mfd.uiService.navigateTo(`fms/${this.props.mfd.uiService.activeUri.get().category}/f-pln`);
+            }}
+            buttonStyle="color: yellow"
+          />
+        </div>
+      </div>
+    );
+  }
+}