Freighter
This commit is contained in:
@@ -0,0 +1,244 @@
|
||||
import { FC, useEffect, useState } from 'react';
|
||||
import {
|
||||
COHERENT_COMM_BUS_WASM_CALL,
|
||||
COMM_BUS_UPDATE_TARGET_EVENT,
|
||||
GSX_SERVICE_CALLED,
|
||||
GSX_SERVICE_FINISHED,
|
||||
} from '../../constants';
|
||||
import { LoadingState } from '../../types/general';
|
||||
import { WASMDataF } from '../../types/WASMData';
|
||||
import { inRangeOf, loadAircraft, unloadAircraft } from '../../utils/utils';
|
||||
import ActionBar from '../actionbar/ActionBar';
|
||||
|
||||
interface StationEntryProps {
|
||||
WASMData: WASMDataF;
|
||||
loadingState: LoadingState;
|
||||
setLoadingState: (newState: LoadingState) => void;
|
||||
}
|
||||
|
||||
const StationEntryF: FC<StationEntryProps> = ({ WASMData, loadingState, setLoadingState }) => {
|
||||
const [upper1, setUpper1] = useState(WASMData.targetPayload.upper1);
|
||||
const [upper2, setUpper2] = useState(WASMData.targetPayload.upper2);
|
||||
const [upper3, setUpper3] = useState(WASMData.targetPayload.upper3);
|
||||
const [upper4, setUpper4] = useState(WASMData.targetPayload.upper4);
|
||||
const [lowerForward, setLowerForward] = useState(WASMData.targetPayload.lowerForward);
|
||||
const [lowerRear, setLowerRear] = useState(WASMData.targetPayload.lowerRear);
|
||||
const [fuel, setFuel] = useState(Math.round(WASMData.livePayload.fuel));
|
||||
const [fuelEnabled, setFuelEnabled] = useState(true);
|
||||
|
||||
const ZFW = () => {
|
||||
if (loadingState !== 'loaded' && !GSXActive()) return Math.round(WASMData.targetPayload.total);
|
||||
|
||||
return Math.round(WASMData.livePayload.total);
|
||||
};
|
||||
const ZFWValid = () => {
|
||||
return ZFW() <= WASMData.limits.maxZFW;
|
||||
};
|
||||
const GW = () => {
|
||||
return fuel + ZFW();
|
||||
};
|
||||
const GWValid = () => {
|
||||
return GW() <= WASMData.limits.maxTOW;
|
||||
};
|
||||
|
||||
const GSXActive = () => {
|
||||
return (
|
||||
(WASMData.GSX.boardingState >= GSX_SERVICE_CALLED || WASMData.GSX.deboardingState >= GSX_SERVICE_CALLED) &&
|
||||
WASMData.GSX.deboardingState !== GSX_SERVICE_FINISHED
|
||||
);
|
||||
};
|
||||
|
||||
const handleInput = (input: string, maxValue: number, setter: (value: number) => void) => {
|
||||
if (!input) {
|
||||
setter(0);
|
||||
return;
|
||||
}
|
||||
|
||||
const converted = parseInt(input);
|
||||
if (converted) {
|
||||
if (converted < 0) setter(0);
|
||||
else if (converted > maxValue) setter(maxValue);
|
||||
else setter(converted);
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => updateData(), [upper1, upper2, upper3, upper4, lowerForward, lowerRear]);
|
||||
useEffect(
|
||||
() =>
|
||||
setFuel((prev) => {
|
||||
if (prev > WASMData.limits.maxFuel) return WASMData.limits.maxFuel;
|
||||
return prev;
|
||||
}),
|
||||
[WASMData.userData.isER]
|
||||
);
|
||||
useEffect(() => {
|
||||
setFuelEnabled(inRangeOf(Math.round(WASMData.livePayload.fuel), fuel));
|
||||
}, [WASMData.livePayload.fuel]);
|
||||
|
||||
const updateData = () => {
|
||||
Coherent.call(
|
||||
COHERENT_COMM_BUS_WASM_CALL,
|
||||
COMM_BUS_UPDATE_TARGET_EVENT,
|
||||
JSON.stringify({
|
||||
mode: 2,
|
||||
business1: upper1,
|
||||
business2: upper2,
|
||||
economy1: upper3,
|
||||
economy2: upper4,
|
||||
forwardCargo: lowerForward,
|
||||
rearCargo: lowerRear,
|
||||
})
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="block flex w-full flex-col opacity-100 transition-opacity duration-150 ease-linear mb-4">
|
||||
<div className="relative flex w-full items-center justify-between rounded-md bg-zinc-600 p-2 px-4">
|
||||
<label>Fuel ({WASMData.userData.isImperial ? 'lbs' : 'kg'})</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder=""
|
||||
className={`w-1/2 rounded-lg border border-white bg-zinc-700 px-3 py-2 text-right`}
|
||||
value={fuel}
|
||||
onChange={(e) => handleInput(e.target.value, WASMData.limits.maxFuel, setFuel)}
|
||||
disabled={loadingState !== 'preview' || GSXActive()}
|
||||
/>
|
||||
<button
|
||||
className="middle none center rounded-lg bg-green-600 px-6 py-3 font-sans text-xs font-bold uppercase text-white shadow-md shadow-green-500/20 transition-all hover:shadow-lg hover:shadow-green-500/40 focus:opacity-[0.85] focus:shadow-none active:opacity-[0.85] active:shadow-none disabled:pointer-events-none disabled:opacity-50 disabled:shadow-none"
|
||||
data-ripple-light="true"
|
||||
onClick={() => {
|
||||
SimVar.SetSimVarValue(
|
||||
'L:MD11_EFB_PAYLOAD_FUEL',
|
||||
'lbs',
|
||||
WASMData.userData.isImperial ? fuel : fuel * 2.20462262185
|
||||
);
|
||||
SimVar.SetSimVarValue('L:MD11_EFB_READ_READY', 'bool', true);
|
||||
setFuelEnabled(WASMData.livePayload.fuel === fuel);
|
||||
}}
|
||||
disabled={loadingState !== 'preview' || !fuelEnabled || GSXActive()}
|
||||
>
|
||||
Load Fuel
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="block flex w-full flex-col opacity-100 transition-opacity duration-150 ease-linear mb-4">
|
||||
<div className="relative flex w-full items-center justify-between rounded-t-md bg-zinc-600 p-2 px-4">
|
||||
<label>Upper 1</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder=""
|
||||
className="w-1/2 rounded-lg border border-white bg-zinc-700 px-3 py-2 text-right focus:border-blue-600 focus:ring-blue-600"
|
||||
value={upper1}
|
||||
onChange={(e) => handleInput(e.target.value, WASMData.limits.upper1, setUpper1)}
|
||||
disabled={loadingState !== 'preview' || GSXActive()}
|
||||
/>
|
||||
</div>
|
||||
<div className="relative flex w-full items-center justify-between bg-zinc-700 p-2 px-4">
|
||||
<label>Upper 2</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder=""
|
||||
className="w-1/2 rounded-lg border border-white bg-zinc-700 px-3 py-2 text-right focus:border-blue-600 focus:ring-blue-600"
|
||||
value={upper2}
|
||||
onChange={(e) => handleInput(e.target.value, WASMData.limits.upper2, setUpper2)}
|
||||
disabled={loadingState !== 'preview' || GSXActive()}
|
||||
/>
|
||||
</div>
|
||||
<div className="relative flex w-full items-center justify-between bg-zinc-600 p-2 px-4">
|
||||
<label>Upper 3</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder=""
|
||||
className="w-1/2 rounded-lg border border-white bg-zinc-700 px-3 py-2 text-right focus:border-blue-600 focus:ring-blue-600"
|
||||
value={upper3}
|
||||
onChange={(e) => handleInput(e.target.value, WASMData.limits.upper3, setUpper3)}
|
||||
disabled={loadingState !== 'preview' || GSXActive()}
|
||||
/>
|
||||
</div>
|
||||
<div className="relative flex w-full items-center justify-between bg-zinc-700 p-2 px-4">
|
||||
<label>Upper 4</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder=""
|
||||
className="w-1/2 rounded-lg border border-white bg-zinc-700 px-3 py-2 text-right focus:border-blue-600 focus:ring-blue-600"
|
||||
value={upper4}
|
||||
onChange={(e) => handleInput(e.target.value, WASMData.limits.upper4, setUpper4)}
|
||||
disabled={loadingState !== 'preview' || GSXActive()}
|
||||
/>
|
||||
</div>
|
||||
<div className="relative flex w-full items-center justify-between bg-zinc-600 p-2 px-4">
|
||||
<label>Forward Cargo ({WASMData.userData.isImperial ? 'lbs' : 'kg'})</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder=""
|
||||
className="w-1/2 rounded-lg border border-white bg-zinc-700 px-3 py-2 text-right focus:border-blue-600 focus:ring-blue-600"
|
||||
value={lowerForward}
|
||||
onChange={(e) => handleInput(e.target.value, WASMData.limits.lowerForward, setLowerForward)}
|
||||
disabled={loadingState !== 'preview' || GSXActive()}
|
||||
/>
|
||||
</div>
|
||||
<div className="relative flex w-full items-center justify-between rounded-b-md bg-zinc-700 p-2 px-4">
|
||||
<label>Aft Cargo ({WASMData.userData.isImperial ? 'lbs' : 'kg'})</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder=""
|
||||
className="w-1/2 rounded-lg border border-white bg-zinc-700 px-3 py-2 text-right focus:border-blue-600 focus:ring-blue-600"
|
||||
value={lowerRear}
|
||||
onChange={(e) => handleInput(e.target.value, WASMData.limits.lowerRear, setLowerRear)}
|
||||
disabled={loadingState !== 'preview' || GSXActive()}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="block flex w-full flex-col opacity-100 transition-opacity duration-150 ease-linear mb-4">
|
||||
<div className="relative flex w-full items-center justify-between rounded-t-md bg-zinc-600 p-2 px-4">
|
||||
<label>
|
||||
{loadingState !== 'loaded' && !GSXActive() ? 'Expected' : 'Actual'} ZFW (
|
||||
{WASMData.userData.isImperial ? 'lbs' : 'kg'})
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder=""
|
||||
className={`w-1/2 rounded-lg border ${ZFWValid() ? 'border-white' : 'border-red-500 text-red-500'} bg-zinc-700 px-3 py-2 text-right`}
|
||||
disabled
|
||||
value={ZFW()}
|
||||
/>
|
||||
</div>
|
||||
<div className="relative flex w-full items-center justify-between rounded-b-md bg-zinc-700 p-2 px-4">
|
||||
<label>
|
||||
{loadingState !== 'loaded' && !GSXActive() ? 'Expected' : 'Actual'} GW (
|
||||
{WASMData.userData.isImperial ? 'lbs' : 'kg'})
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder=""
|
||||
className={`w-1/2 rounded-lg border ${GWValid() ? 'border-white' : 'border-red-500 text-red-500'} bg-zinc-700 px-3 py-2 text-right`}
|
||||
disabled
|
||||
value={GW()}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ActionBar
|
||||
loadingState={loadingState}
|
||||
loadDisabled={!ZFWValid() || !GWValid()}
|
||||
GSXSync={WASMData.options.GSXSync}
|
||||
GSXActive={GSXActive()}
|
||||
load={() => {
|
||||
setLoadingState('loaded');
|
||||
|
||||
loadAircraft();
|
||||
}}
|
||||
unload={() => {
|
||||
setLoadingState('preview');
|
||||
|
||||
unloadAircraft();
|
||||
}}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default StationEntryF;
|
||||
Reference in New Issue
Block a user