Base

PackageSources/html_ui/Pages/VCockpit/Instruments/aircraft_efb/TFDi_MD11_efb/efb.html

@@ -0,0 +1,11 @@
+<script type="text/html" id="TFDi_MD11_efb">
+    <div id="MSFS_REACT_MOUNT">
+        <h1>If you're seeing this, instrument didn't load.</h1>
+    </div>
+</script>
+
+
+
+<link rel="stylesheet" href="/Pages/VCockpit/Instruments/aircraft_efb/TFDi_MD11_efb/efb.css" />
+<link rel="stylesheet" href="/Pages/VCockpit/Instruments/aircraft_efb/TFDi_MD11_efb/index.css" />
+<script type="text/html" import-script="/Pages/VCockpit/Instruments/aircraft_efb/TFDi_MD11_efb/efb.js" import-async="false"></script>

PackageSources/js-bundle/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tfdidesign-md11-load-manager",
-  "version": "0.1.22",
+  "version": "0.1.28",
   "description": "",
   "main": "index.js",
   "type": "module",

PackageSources/js-bundle/rollup.config.js

@@ -14,7 +14,9 @@ import svgs from 'svg-slim';
 
 const { NODE_ENV: targetEnv = 'development' } = process.env;
 const outDirBase = '../html_ui';
-const panelDirBase = `${outDirBase}/InGamePanels/tfdidesign-md11-load-manager-panel`;
+const panelDirBaseNorm = `${outDirBase}/InGamePanels/tfdidesign-md11-load-manager-panel`;
+const panelDirBaseSplit = `${outDirBase}/Pages/VCockpit/Instruments/aircraft_efb/TFDi_MD11_efb`;
+const panelDirBase = process.env.SPLIT ? panelDirBaseSplit : panelDirBaseNorm;
 
 function svgSlim(code, id) {
   if (!id.endsWith('.svg')) return code;

PackageSources/js-bundle/src/App.tsx

@@ -9,11 +9,7 @@ import {
 } from './constants';
 import { WASMDataF, WASMDataPax } from './types/WASMData';
 
-interface IAppProps {
+const App: FC = () => {
-  commBus: ViewListener.ViewListener;
-}
-
-const App: FC<IAppProps> = ({ commBus }) => {
   const [SBUsername, setSBUsername] = useState<string>();
   const [WASMData, setWASMData] = useState<WASMDataPax | WASMDataF>();
   const [isReady, setIsReady] = useState(false);
@@ -29,6 +25,8 @@ const App: FC<IAppProps> = ({ commBus }) => {
   useEffect(() => {
     console.log('Initializing CommBus');
 
+    const commBus = RegisterViewListener('JS_LISTENER_COMM_BUS');
+
     commBus.on(TFDI_SIMBRIEF_USERNAME_EVENT, usernameCallback);
     commBus.on(COMM_BUS_LIVE_DATA_EVENT, wasmCallback);
 
@@ -39,6 +37,8 @@ const App: FC<IAppProps> = ({ commBus }) => {
     return () => {
       commBus.off(TFDI_SIMBRIEF_USERNAME_EVENT, usernameCallback);
       commBus.off(COMM_BUS_LIVE_DATA_EVENT, wasmCallback);
+
+      commBus.unregister();
     };
   }, []);
 

PackageSources/js-bundle/src/components/SBEntry/SBEntryF.tsx

@@ -2,7 +2,7 @@ import { FC, useEffect, useState } from 'react';
 import { GSX_SERVICE_CALLED, GSX_SERVICE_FINISHED } from '../../constants';
 import { WASMDataF } from '../../types/WASMData';
 import { LoadingState, SimBrief } from '../../types/general';
-import { ImportFlightPlan } from '../../utils/TFDISBImport';
+import { ImportFlightPlanKH } from '../../utils/TFDISBImport';
 import { CoherentCallSBEntryF, inRangeOf, loadAircraft, unloadAircraft } from '../../utils/utils';
 import CGSelect from '../CGSelect/CGSelect';
 import ActionBar from '../actionbar/ActionBar';
@@ -59,7 +59,7 @@ const SBEntryF: FC<SBEntryProps> = ({ WASMData, loadingState, username, setLoadi
   const handleSB = async () => {
     setSBInFlight(true);
 
-    const SBResponse = await ImportFlightPlan(
+    const SBResponse = await ImportFlightPlanKH(
       username,
       WASMData.limits.maxZFW,
       WASMData.limits.maxTOW,

PackageSources/js-bundle/src/components/SBEntry/SBEntryPax.tsx

@@ -2,7 +2,7 @@ import { FC, useEffect, useState } from 'react';
 import { GSX_SERVICE_CALLED, GSX_SERVICE_FINISHED } from '../../constants';
 import { WASMDataPax } from '../../types/WASMData';
 import { LoadingState, SimBrief } from '../../types/general';
-import { ImportFlightPlan } from '../../utils/TFDISBImport';
+import { ImportFlightPlanKH } from '../../utils/TFDISBImport';
 import { CoherentCallSBEntryPax, inRangeOf, loadAircraft, unloadAircraft } from '../../utils/utils';
 import CGSelect from '../CGSelect/CGSelect';
 import ActionBar from '../actionbar/ActionBar';
@@ -59,7 +59,7 @@ const SBEntryPax: FC<SBEntryProps> = ({ WASMData, loadingState, username, setLoa
   const handleSB = async () => {
     setSBInFlight(true);
 
-    const SBResponse = await ImportFlightPlan(
+    const SBResponse = await ImportFlightPlanKH(
       username,
       WASMData.limits.maxZFW,
       WASMData.limits.maxTOW,

PackageSources/js-bundle/src/index.ts

@@ -3,8 +3,6 @@ import { createRoot } from 'react-dom/client';
 import App from './App';
 
 class TFDiDesignMD11LoadManagerPanel extends TemplateElement {
-  private commBus: ViewListener.ViewListener | undefined;
-
   constructor() {
     super();
   }
@@ -12,20 +10,16 @@ class TFDiDesignMD11LoadManagerPanel extends TemplateElement {
   connectedCallback() {
     super.connectedCallback();
 
-    this.commBus = RegisterViewListener('JS_LISTENER_COMM_BUS');
-
     const container = document.getElementById('react');
     if (container) {
       console.log('Starting React');
       const root = createRoot(container);
-      root.render(createElement(App, { commBus: this.commBus }));
+      root.render(createElement(App));
     }
   }
 
   disconnectedCallback() {
     super.disconnectedCallback();
-
-    this.commBus?.unregister();
   }
 }
 

PackageSources/js-bundle/src/utils/TFDISBImport.ts

@@ -1,4 +1,4 @@
-const getSimBriefFlightPlan = async (simBriefUsername: string) => {
+const getSimBriefFlightPlanKH = async (simBriefUsername: string) => {
   const flightPlanURL = `https://www.simbrief.com/api/xml.fetcher.php?username=${simBriefUsername}&json=1`;
   let response: Response;
   let success = false;
@@ -15,14 +15,14 @@ const getSimBriefFlightPlan = async (simBriefUsername: string) => {
   };
 };
 
-export const ImportFlightPlan = async (
+export const ImportFlightPlanKH = async (
   username: string,
   maxZFW: number,
   maxTOW: number,
   maxFuel: number,
   isImperial: boolean
 ) => {
-  const flightPlan = await getSimBriefFlightPlan(username);
+  const flightPlan = await getSimBriefFlightPlanKH(username);
   if (!flightPlan.success) {
     return {
       type: 'error',

PackageSources/js-bundle/tsconfig.json

@@ -12,7 +12,7 @@
     // "disableReferencedProjectLoad": true,             /* Reduce the number of projects loaded automatically by TypeScript. */
 
     /* Language and Environment */
-    "target": "es6",
+    "target": "es2017",
     /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */
     "lib": ["es2017", "dom"],
     /* Specify a set of bundled library declaration files that describe the target runtime environment. */
@@ -29,7 +29,7 @@
     // "moduleDetection": "auto",                        /* Control what method is used to detect module-format JS files. */
 
     /* Modules */
-    "module": "es6",
+    "module": "es2015",
     /* Specify what module code is generated. */
     // "rootDir": "./",                                  /* Specify the root folder within your source files. */
     "moduleResolution": "node",
@@ -65,7 +65,7 @@
     // "sourceMap": true,                                /* Create source map files for emitted JavaScript files. */
     // "inlineSourceMap": true,                          /* Include sourcemap files inside the emitted JavaScript. */
     // "outFile": "./",                                  /* Specify a file that bundles all outputs into one JavaScript file. If 'declaration' is true, also designates a file that bundles all .d.ts output. */
-    "outDir": "../html_ui/InGamePanels/tfdidesign-md11-load-manager-panel",
+    // "outDir": "../html_ui/InGamePanels/tfdidesign-md11-load-manager-panel",
     /* Specify an output folder for all emitted files. */
     // "removeComments": true,                           /* Disable emitting comments. */
     // "noEmit": true,                                   /* Disable emitting files from a compilation. */

README.md

@@ -13,9 +13,7 @@ Build in sim
 
 TODO:
 
-- EFB integration (BRANCH)
+- Fix duplicate names
-  - Check if including bundle is getting loaded
+- Fix SB import (move to TFDi function proper)
-  - Add to bundle global scoped react "import"
+- Adj. Dispatch page to navigate to Payload page
-    - Automate this?
+- TEST
-  - Add to EFB.js and EFB.html
-    - Automate this?