Skip to content

Commit

Permalink
refactor: payload page
Browse files Browse the repository at this point in the history
  • Loading branch information
2hwk committed Apr 4, 2024
1 parent 94d4993 commit 27d8a3e
Show file tree
Hide file tree
Showing 14 changed files with 483 additions and 450 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -197,25 +197,12 @@
},
{
"seats": [
{
"type": 1
},
{
"type": 1
},
{
"type": 1
},
{
"type": 1,
"yOffset": 19
},
{
"type": 1
},
{
"type": 1
}
{ "type": 1},
{ "type": 1},
{ "type": 1},
{ "type": 1, "yOffset": 19},
{ "type": 1},
{ "type": 1}
],
"x": 0,
"y": 0,
Expand All @@ -224,25 +211,12 @@
},
{
"seats": [
{
"type": 1
},
{
"type": 1
},
{
"type": 1
},
{
"type": 1,
"yOffset": 19
},
{
"type": 1
},
{
"type": 1
}
{ "type": 1},
{ "type": 1},
{ "type": 1},
{ "type": 1, "yOffset": 19},
{ "type": 1},
{ "type": 1}
],
"x": 0,
"y": 0,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,12 @@
{
"configMajorVersion": 0,
"configMinorVersion": 1,
"_type": 1,
"_canvas": {
"width": 1000,
"height": 150,
"canvasX": 243,
"canvasY": 78
},
"chartLimits": {
"weight": {
"min": 35000,
Expand Down Expand Up @@ -66,5 +71,88 @@
"y": 0.29
}
}
}
},
"_seatDisplay": [
{
// NarrowbodyEconomy
len: 25.4,
wid: 19.2,
padX: 6.8,
padY: 0,
imageX: 25.4,
imageY: 19.2,
},
{
// NarrowbodyEconomyEmergency
len: 25.4,
wid: 19.2,
padX: 13.8,
padY: 0,
imageX: 25.4,
imageY: 19.2,
},
{
// WidebodyEconomy
len: 16,
wid: 12.125,
padX: 2,
padY: 0,
imageX: 16,
imageY: 12.125,
},
{
// WidebodyEconomyEmergency
len: 16,
wid: 12.125,
padX: 2,
padY: 0,
imageX: 16,
imageY: 12.125,
},
{
// WidebodyBusinessFlatRight
len: 24,
wid: 23.22,
padX: 1,
padY: 0,
imageX: 24,
imageY: 23.22,
},
{
// WidebodyBusinessFlatLeft
len: 24,
wid: 23.22,
padX: 1,
padY: 0,
imageX: 24,
imageY: 23.22,
},
{
// WidebodySuiteRight
len: 35,
wid: 20,
padX: 2,
padY: 0,
imageX: 50,
imageY: 50,
},
{
// WidebodySuiteLeft
len: 35,
wid: 20,
padX: 5,
padY: 0,
imageX: 50,
imageY: 50,
},
{
// WidebodyPremiumEconomy
len: 18,
wid: 13.64,
padX: 2,
padY: 0,
imageX: 18,
imageY: 13.64,
}
]
}
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,12 @@
{
"configMajorVersion": 0,
"configMinorVersion": 1,
"_type": 2,
"_canvas": {
"width": 1000,
"height": 150,
"canvasX": 146,
"canvasY": 71
},
"chartLimits": {
"weight": {
"min": 235000,
Expand All @@ -41,5 +46,88 @@
"mlw": { "x1": 0.75, "x2": 0.12, "y": 0.47 },
"mzfw": { "x1": 0.75, "x2": 0.12, "y": 0.57 }
}
}
},
"_seatDisplay": [
{
// NarrowbodyEconomy
len: 25.4,
wid: 19.2,
padX: 6.8,
padY: 0,
imageX: 25.4,
imageY: 19.2,
},
{
// NarrowbodyEconomyEmergency
len: 25.4,
wid: 19.2,
padX: 13.8,
padY: 0,
imageX: 25.4,
imageY: 19.2,
},
{
// WidebodyEconomy
len: 16,
wid: 12.125,
padX: 2,
padY: 0,
imageX: 16,
imageY: 12.125,
},
{
// WidebodyEconomyEmergency
len: 16,
wid: 12.125,
padX: 2,
padY: 0,
imageX: 16,
imageY: 12.125,
},
{
// WidebodyBusinessFlatRight
len: 24,
wid: 23.22,
padX: 1,
padY: 0,
imageX: 24,
imageY: 23.22,
},
{
// WidebodyBusinessFlatLeft
len: 24,
wid: 23.22,
padX: 1,
padY: 0,
imageX: 24,
imageY: 23.22,
},
{
// WidebodySuiteRight
len: 35,
wid: 20,
padX: 2,
padY: 0,
imageX: 50,
imageY: 50,
},
{
// WidebodySuiteLeft
len: 35,
wid: 20,
padX: 5,
padY: 0,
imageX: 50,
imageY: 50,
},
{
// WidebodyPremiumEconomy
len: 18,
wid: 13.64,
padX: 2,
padY: 0,
imageX: 18,
imageY: 13.64,
}
]
}
Original file line number Diff line number Diff line change
@@ -1,15 +1,15 @@
// Copyright (c) 2023-2024 FlyByWire Simulations
// SPDX-License-Identifier: GPL-3.0

import { usePersistentProperty, useSimVar, Units } from '@flybywiresim/fbw-sdk';
import { usePersistentProperty, useSimVar, Units, PayloadChartLimits, AirframePerformanceEnvelope } from '@flybywiresim/fbw-sdk';
import React, { useEffect, useRef, useState } from 'react';
import { CanvasConst, PerformanceEnvelope, ChartLimits } from './Constants';
import { CanvasConst } from './Constants';

interface ChartWidgetProps {
width: number,
height: number,
envelope: PerformanceEnvelope,
limits: ChartLimits,
envelope: AirframePerformanceEnvelope,
limits: PayloadChartLimits,
gw: number,
cg: number,
mldw: number,
Expand Down Expand Up @@ -276,9 +276,9 @@ export const ChartWidget: React.FC<ChartWidgetProps> = ({
{cgAxis}
{weightAxis}
<p key="wu" className="absolute top-0 font-mono text-sm font-medium" style={weightUnits}>{usingMetric ? 'x 1000 kgs' : 'x 1000 lbs'}</p>
<p key="mtow" className="absolute top-0 font-mono font-medium text-theme-highlight drop-shadow" style={mtow}>{flightPhase <= 1 || flightPhase >= 7 ? 'MTOW' : 'FLIGHT'}</p>
<p key="mtow" className="text-theme-highlight absolute top-0 font-mono font-medium drop-shadow" style={mtow}>{flightPhase <= 1 || flightPhase >= 7 ? 'MTOW' : 'FLIGHT'}</p>
<p key="mldw" className="absolute top-0 font-mono font-medium text-lime-500" style={mlw}>MLDW</p>
<p key="mzfw" className="absolute top-0 font-mono font-medium text-theme-text" style={mzfw}>MZFW</p>
<p key="mzfw" className="text-theme-text absolute top-0 font-mono font-medium" style={mzfw}>MZFW</p>
</div>
);
};
Original file line number Diff line number Diff line change
Expand Up @@ -4,13 +4,12 @@
/* eslint-disable max-len */
import React, { useCallback, useEffect, useMemo, useState } from 'react';
import { CloudArrowDown } from 'react-bootstrap-icons';
import { SeatFlags, Units, usePersistentNumberProperty, usePersistentProperty, useSeatFlags, useSimVar } from '@flybywiresim/fbw-sdk';
import { CargoStationInfo, PaxStationInfo, SeatFlags, Units, usePersistentNumberProperty, usePersistentProperty, useSeatFlags, useSimVar } from '@flybywiresim/fbw-sdk';
import { setPayloadImported, useAppDispatch, Card, t, TooltipWrapper, SelectGroup, SelectItem, PromptModal, useModals } from '@flybywiresim/flypad';
import { SeatOutlineBg } from '../../../../Assets/SeatOutlineBg';
import { BoardingInput, MiscParamsInput, PayloadInputTable } from '../PayloadElements';
import { CargoWidget } from './CargoWidget';
import { ChartWidget } from '../Chart/ChartWidget';
import { CargoStationInfo, PaxStationInfo } from '../Seating/Constants';
import { SeatMapWidget } from '../Seating/SeatMapWidget';
import { PayloadProps } from '../PayloadPage';

Expand Down Expand Up @@ -188,7 +187,7 @@ export const A320Payload: React.FC<PayloadProps> = ({
fillStation(i, parseFloat(Number((Math.ceil((seatMap[i].capacity / maxPax) * 1e2) / 1e2).toExponential(2)).toPrecision(3)), numOfPax);
}
fillStation(0, 1, paxRemaining);
}, [maxPax, ...seatMap, totalPaxDesired]);
}, [maxPax, seatMap, totalPaxDesired]);

const setTargetCargo = useCallback((numberOfPax: number, freight: number, perBagWeight: number = paxBagWeight) => {
const bagWeight = numberOfPax * perBagWeight;
Expand All @@ -206,7 +205,7 @@ export const A320Payload: React.FC<PayloadProps> = ({
fillCargo(i, cargoMap[i].weight / maxCargo, loadableCargoWeight);
}
fillCargo(0, 1, remainingWeight);
}, [maxCargo, ...cargoMap, ...cargoDesired, paxBagWeight]);
}, [maxCargo, cargoMap, ...cargoDesired, paxBagWeight]);

const processZfw = useCallback((newZfw) => {
let paxCargoWeight = newZfw - emptyWeight;
Expand Down Expand Up @@ -455,14 +454,25 @@ export const A320Payload: React.FC<PayloadProps> = ({
return [base, primary, secondary];
}, [theme]);

if (airframeInfo === null) return (<></>);
return (
<div>
<div className="h-content-section-reduced relative">
<div className="mb-10">
<div className="relative flex flex-col">
<SeatOutlineBg stroke={getTheme(theme)[0]} highlight="#69BD45" />
<SeatMapWidget seatMap={seatMap} desiredFlags={desiredFlags} activeFlags={activeFlags} onClickSeat={onClickSeat} theme={getTheme(theme)} isMainDeck canvasX={243} canvasY={78} />
<SeatMapWidget
payloadSeatDisplay={flypadInfo.payloadSeatDisplay}
seatMap={seatMap}
desiredFlags={desiredFlags}
activeFlags={activeFlags}
onClickSeat={onClickSeat}
theme={getTheme(theme)}
isMainDeck
width={flypadInfo.payloadPlaneCanvas.width}
height={flypadInfo.payloadPlaneCanvas.height}
canvasX={flypadInfo.payloadPlaneCanvas.canvasX}
canvasY={flypadInfo.payloadPlaneCanvas.canvasY}
/>
</div>
</div>
<CargoWidget cargo={cargo} cargoDesired={cargoDesired} cargoMap={cargoMap} onClickCargo={onClickCargo} />
Expand Down Expand Up @@ -592,7 +602,7 @@ export const A320Payload: React.FC<PayloadProps> = ({
width={525}
height={511}
envelope={airframeInfo.designLimits.performanceEnvelope}
limits={flypadInfo.chartLimits}
limits={flypadInfo.payloadChartLimits}
cg={boardingStarted ? Math.round(gwCgMac * 100) / 100 : Math.round(desiredGwCgMac * 100) / 100}
gw={boardingStarted ? Math.round(gw) : Math.round(gwDesired)}
mldwCg={boardingStarted ? Math.round(gwCgMac * 100) / 100 : Math.round(desiredGwCgMac * 100) / 100}
Expand Down
Loading

0 comments on commit 27d8a3e

Please sign in to comment.