fix(a380x/mfd): Change soft key behaviour to page & add individual line scroll through KCCU in FPLN

.github/CHANGELOG.md

@@ -140,6 +140,7 @@
 1. [EFB] Set EFB Auto Brightness to default to On - @MrJigs7 (MrJigs)
 1. [FMS] Allow airport to be loaded as fixes in instrument procedures - @tracernz (Mike)
 1. [A380X/ND] Fix Terr text wrong position on terrain radar - @MrJigs7 (MrJigs.)
+1. [A380X/FMS] Add page scroll via soft keys & individual scroll via KCCU on MFD F-PLN - @BravoMike99 (bruno_pt99)
 
 ## 0.12.0
 

fbw-a380x/src/systems/instruments/src/MFD/pages/FMS/F-PLN/MfdFmsFpln.tsx

@@ -34,6 +34,7 @@ import { Units, LegType, TurnDirection, AltitudeDescriptor } from '@flybywiresim
 import { MfdFmsFplnVertRev } from 'instruments/src/MFD/pages/FMS/F-PLN/MfdFmsFplnVertRev';
 import { AltitudeConstraint, SpeedConstraint } from '@fmgc/flightplanning/data/constraint';
 import { ConditionalComponent } from '../../../../MsfsAvionicsCommon/UiWidgets/ConditionalComponent';
+import { InternalKccuKeyEvent } from 'instruments/src/MFD/shared/MFDSimvarPublisher';
 
 interface MfdFmsFplnProps extends AbstractMfdPageProps {}
 
@@ -117,8 +118,6 @@ export class MfdFmsFpln extends FmsPage<MfdFmsFplnProps> {
       return;
     }
 
-    console.time('F-PLN:onNewData');
-
     // update(...) is the most costly function. First performance improvement: Don't render everything completely new every time, just update with refs
     // Delete and re-render FPLN lines only if:
     // a) activeLegIndex changes
@@ -135,6 +134,13 @@ export class MfdFmsFpln extends FmsPage<MfdFmsFplnProps> {
       return;
     }
 
+    // If we ended beyond flightplan end due to TMPY deletion, scroll back to fit the flightplan
+    const lastAllowableIndex = this.getLastDisplayAllowableIndex();
+    if (this.displayFplnFromLineIndex.get() > this.getLastDisplayAllowableIndex()) {
+      this.displayFplnFromLineIndex.set(lastAllowableIndex);
+      return;
+    }
+
     this.update(this.displayFplnFromLineIndex.get(), onlyUpdatePredictions);
 
     this.lastRenderedActiveLegIndex = this.loadedFlightPlan.activeLegIndex ?? null;
@@ -176,7 +182,6 @@ export class MfdFmsFpln extends FmsPage<MfdFmsFplnProps> {
       );
     }
     this.checkScrollButtons();
-    console.timeEnd('F-PLN:onNewData');
   }
 
   private update(startAtIndex: number, onlyUpdatePredictions = true): void {
@@ -637,7 +642,7 @@ export class MfdFmsFpln extends FmsPage<MfdFmsFplnProps> {
       this.scrollToDest();
     }
 
-    const sub = this.props.bus.getSubscriber<ClockEvents>();
+    const sub = this.props.bus.getSubscriber<ClockEvents & InternalKccuKeyEvent>();
     this.subs.push(
       sub
         .on('realTime')
@@ -646,14 +651,28 @@ export class MfdFmsFpln extends FmsPage<MfdFmsFplnProps> {
           this.onNewData();
         }),
     );
+
+    this.subs.push(
+      sub.on('kccuKeyEvent').handle((k) => {
+        if (k === 'UP') {
+          this.displayFplnFromLineIndex.set(this.displayFplnFromLineIndex.get() - 1);
+        } else if (k === 'DOWN') {
+          this.displayFplnFromLineIndex.set(
+            Math.min(this.displayFplnFromLineIndex.get() + 1, this.getLastDisplayAllowableIndex()),
+          );
+        }
+      }),
+    );
   }
 
   checkScrollButtons() {
     // Line index for "FROM" waypoint
     this.disabledScrollUp.set(
       !this.lineData || this.displayFplnFromLineIndex.get() <= (this.loadedFlightPlan?.activeLegIndex ?? 1) - 1,
     );
-    this.disabledScrollDown.set(!this.lineData || this.displayFplnFromLineIndex.get() >= this.lineData.length - 1);
+    this.disabledScrollDown.set(
+      !this.lineData || this.displayFplnFromLineIndex.get() >= this.getLastDisplayAllowableIndex(),
+    );
   }
 
   private spdAltButton(): VNode {
@@ -774,6 +793,30 @@ export class MfdFmsFpln extends FmsPage<MfdFmsFplnProps> {
     }
   }
 
+  private scrollPage(up: boolean) {
+    if (!this.loadedFlightPlan) {
+      return;
+    }
+
+    if (this.lineData) {
+      let targetIndex;
+      if (up) {
+        targetIndex = this.displayFplnFromLineIndex.get() + 1 - this.renderedLineData.length;
+      } else {
+        targetIndex = this.displayFplnFromLineIndex.get() + this.renderedLineData.length - 1;
+        const maxBottomIndex = this.getLastDisplayAllowableIndex();
+        if (targetIndex > maxBottomIndex) {
+          targetIndex = maxBottomIndex;
+        }
+      }
+      this.displayFplnFromLineIndex.set(Math.max(targetIndex, 0));
+    }
+  }
+
+  private getLastDisplayAllowableIndex() {
+    return this.lineData.length - this.renderedLineData.length;
+  }
+
   render(): VNode {
     return (
       <>
@@ -904,13 +947,13 @@ export class MfdFmsFpln extends FmsPage<MfdFmsFplnProps> {
             <div style="display: flex; flex-direction: row; margin-top: 5px; margin-bottom: 5px;">
               <IconButton
                 icon="double-down"
-                onClick={() => this.displayFplnFromLineIndex.set(this.displayFplnFromLineIndex.get() + 1)}
+                onClick={() => this.scrollPage(false)}
                 disabled={this.disabledScrollDown}
                 containerStyle="width: 60px; height: 60px;"
               />
               <IconButton
                 icon="double-up"
-                onClick={() => this.displayFplnFromLineIndex.set(this.displayFplnFromLineIndex.get() - 1)}
+                onClick={() => this.scrollPage(true)}
                 disabled={this.disabledScrollUp}
                 containerStyle="width: 60px; height: 60px;"
               />