[Feature/sat] Satellite prediction

src/App.jsx

@@ -321,7 +321,7 @@ const App = () => {
 
   const propagation = usePropagation(config.location, dxLocation, config.propagation);
   const mySpots = useMySpots(config.callsign);
-  const satellites = useSatellites(config.location);
+  const satellites = useSatellites(config.location, config.satellite);
   const localWeather = useWeather(config.location, config.allUnits);
   const dxWeather = useWeather(dxLocation, config.allUnits);
   const localAlerts = useWeatherAlerts(config.location);

src/DockableApp.jsx

@@ -661,6 +661,7 @@ export const DockableApp = ({
   const renderWorldMap = () => (
     <div style={{ height: '100%', width: '100%', position: 'relative' }}>
       <WorldMap
+        config={config}
         deLocation={config.location}
         dxLocation={dxLocation}
         onDXChange={handleDXChange}

src/components/SettingsPanel.jsx

@@ -49,6 +49,8 @@ export const SettingsPanel = ({
   const [gridSquare, setGridSquare] = useState(config?.locator || '');
   const [lat, setLat] = useState(config?.location?.lat ?? 0);
   const [lon, setLon] = useState(config?.location?.lon ?? 0);
+  const [stationAlt, setStationAlt] = useState(config?.location?.stationAlt ?? 100);
+  const [minElev, setMinElev] = useState(config?.satellite?.minElev ?? 5.0);
   const [layout, setLayout] = useState(config?.layout || 'modern');
   const [mouseZoom, setMouseZoom] = useState(config?.mouseZoom || 50);
   const [timezone, setTimezone] = useState(config?.timezone || '');
@@ -180,6 +182,8 @@ export const SettingsPanel = ({
       setheaderSize(config.headerSize || 1.0);
       setLat(config.location?.lat ?? 0);
       setLon(config.location?.lon ?? 0);
+      setStationAlt(config.location?.stationAlt ?? 100);
+      setMinElev(config.satellite?.minElev ?? 5.0);
       setLayout(config.layout || 'modern');
       setMouseZoom(config.mouseZoom || 50);
       setTimezone(config.timezone || '');
@@ -420,7 +424,8 @@ export const SettingsPanel = ({
       headerSize: headerSize,
       swapHeaderClocks,
       showMutualReception,
-      location: { lat: parseFloat(lat), lon: parseFloat(lon) },
+      location: { lat: parseFloat(lat) || 0, lon: parseFloat(lon) || 0, stationAlt: parseInt(stationAlt) || 100 },
+      satellite: { minElev: isNaN(parseFloat(minElev)) ? 5.0 : parseFloat(minElev) },
       theme,
       customTheme,
       layout,
@@ -3390,6 +3395,79 @@ export const SettingsPanel = ({
                             Footprints
                           </label>
                         </div>
+
+                        {/* station altitude and minimum elevation inputs */}
+                        <div
+                          style={{ display: 'grid', gridTemplateColumns: '1fr 1fr', gap: '12px', marginBottom: '12px' }}
+                        >
+                          <div>
+                            <label
+                              style={{
+                                display: 'block',
+                                marginBottom: '6px',
+                                color: 'var(--text-muted)',
+                                fontSize: '11px',
+                                textTransform: 'uppercase',
+                              }}
+                            >
+                              Station Altitude [m]
+                            </label>
+                            <input
+                              type="number"
+                              step="1"
+                              min="-500"
+                              max="9000"
+                              value={isNaN(stationAlt) ? '' : stationAlt}
+                              onChange={(e) =>
+                                setStationAlt(isNaN(e.target.valueAsNumber) ? 100 : e.target.valueAsNumber)
+                              }
+                              style={{
+                                width: '100%',
+                                padding: '10px',
+                                background: 'var(--bg-tertiary)',
+                                border: '1px solid var(--border-color)',
+                                borderRadius: '6px',
+                                color: 'var(--text-primary)',
+                                fontSize: '14px',
+                                fontFamily: 'JetBrains Mono, monospace',
+                                boxSizing: 'border-box',
+                              }}
+                            />
+                          </div>
+                          <div>
+                            <label
+                              style={{
+                                display: 'block',
+                                marginBottom: '6px',
+                                color: 'var(--text-muted)',
+                                fontSize: '11px',
+                                textTransform: 'uppercase',
+                              }}
+                            >
+                              Minimum Elevation [°]
+                            </label>
+                            <input
+                              type="number"
+                              step="0.1"
+                              min="-5.0"
+                              max="89.0"
+                              value={isNaN(minElev) ? '' : minElev}
+                              onChange={(e) => setMinElev(isNaN(e.target.valueAsNumber) ? 5.0 : e.target.valueAsNumber)}
+                              style={{
+                                width: '100%',
+                                padding: '10px',
+                                background: 'var(--bg-tertiary)',
+                                border: '1px solid var(--border-color)',
+                                borderRadius: '6px',
+                                color: 'var(--text-primary)',
+                                fontSize: '14px',
+                                fontFamily: 'JetBrains Mono, monospace',
+                                boxSizing: 'border-box',
+                              }}
+                            />
+                          </div>
+                        </div>
+
                         {/* Lead Time Slider WIP
 						<div style={{ marginTop: '8px' }}>
 						  <label style={{

src/components/WorldMap.jsx

@@ -92,6 +92,7 @@ import { mapDefs as WWFFDefs } from './WWFFPanel.jsx';
 const POPUP_AUTO_CLOSE_MS = 20_000;
 
 export const WorldMap = ({
+  config,
   deLocation,
   dxLocation,
   onDXChange,
@@ -2211,25 +2212,44 @@ export const WorldMap = ({
       {/* Key includes projection so hooks fully remount when map instance changes.
           This resets internal refs (layerGroupRef, controlRef) that are bound to a
           specific Leaflet map — without this, layers stay on the hidden old map. */}
-      {getAllLayers().map((layerDef) => (
-        <PluginLayer
-          key={`${layerDef.id}-${isAzimuthal ? 'az' : 'merc'}`}
-          plugin={layerDef}
-          enabled={pluginLayerStates[layerDef.id]?.enabled ?? layerDef.defaultEnabled}
-          opacity={pluginLayerStates[layerDef.id]?.opacity ?? layerDef.defaultOpacity}
-          onDXChange={onDXChange}
-          mapBandFilter={mapBandFilter}
-          config={pluginLayerStates[layerDef.id]?.config ?? layerDef.config}
-          map={isAzimuthal ? azimuthalMapRef.current : mapInstanceRef.current}
-          satellites={satellites}
-          allUnits={allUnits}
-          callsign={callsign}
-          locator={deLocator}
-          deLat={deLocation?.lat ?? null}
-          deLon={deLocation?.lon ?? null}
-          lowMemoryMode={lowMemoryMode}
-        />
-      ))}
+      {getAllLayers().map((layerDef) => {
+        // Merge location config into satellite layer to keep config access consistent
+        const layerConfig = pluginLayerStates[layerDef.id]?.config ?? layerDef.config;
+        const finalConfig =
+          layerDef.id === 'satellites' && deLocation
+            ? {
+                ...layerConfig,
+                location: {
+                  lat: deLocation.lat,
+                  lon: deLocation.lon,
+                  stationAlt: deLocation.stationAlt || 100,
+                },
+                satellite: {
+                  minElev: config?.satellite?.minElev ?? layerConfig?.satellite?.minElev ?? 5,
+                },
+              }
+            : layerConfig;
+
+        return (
+          <PluginLayer
+            key={`${layerDef.id}-${isAzimuthal ? 'az' : 'merc'}`}
+            plugin={layerDef}
+            enabled={pluginLayerStates[layerDef.id]?.enabled ?? layerDef.defaultEnabled}
+            opacity={pluginLayerStates[layerDef.id]?.opacity ?? layerDef.defaultOpacity}
+            onDXChange={onDXChange}
+            mapBandFilter={mapBandFilter}
+            config={finalConfig}
+            map={isAzimuthal ? azimuthalMapRef.current : mapInstanceRef.current}
+            satellites={satellites}
+            allUnits={allUnits}
+            callsign={callsign}
+            locator={deLocator}
+            deLat={deLocation?.lat ?? null}
+            deLon={deLocation?.lon ?? null}
+            lowMemoryMode={lowMemoryMode}
+          />
+        );
+      })}
 
       {/* Unified map control dock */}
       {!isAzimuthal && (

src/hooks/useSatellites.js

@@ -11,7 +11,7 @@ function round(value, decimals) {
   return Math.round(value * factor) / factor;
 }
 
-export const useSatellites = (observerLocation) => {
+export const useSatellites = (observerLocation, satelliteConfig) => {
   const [data, setData] = useState([]);
   const [loading, setLoading] = useState(true);
   const [tleData, setTleData] = useState({});
@@ -51,7 +51,7 @@ export const useSatellites = (observerLocation) => {
       const observerGd = {
         longitude: satellite.degreesToRadians(observerLocation.lon),
         latitude: satellite.degreesToRadians(observerLocation.lat),
-        height: 0.1, // km above sea level
+        height: (observerLocation.stationAlt ?? 100) / 1000, // above sea level [km], stationAlt is [m]), defaults to 100m
       };
 
       Object.entries(tleData).forEach(([name, tle]) => {
@@ -82,10 +82,13 @@ export const useSatellites = (observerLocation) => {
           const elevation = satellite.radiansToDegrees(lookAngles.elevation);
           const rangeSat = lookAngles.rangeSat;
 
-          // Calculate range-rate and doppler factor, only if satellite is above horizon
+          const isVisible = elevation >= (satelliteConfig?.minElev ?? 5.0); // visible only if above minimum elevation
+
+          // Calculate range-rate and doppler factor, only if satellite is visible
           let dopplerFactor = 1;
           let rangeRate = 0;
-          if (elevation > 0) {
+
+          if (isVisible) {
             const observerEcf = satellite.geodeticToEcf(observerGd);
             const velocityEcf = satellite.eciToEcf(velocityEci, gmst);
             dopplerFactor = satellite.dopplerFactor(observerEcf, positionEcf, velocityEcf);
@@ -125,6 +128,8 @@ export const useSatellites = (observerLocation) => {
 
           positions.push({
             name: tle.name || name,
+            tle1: line1,
+            tle2: line2,
             lat,
             lon,
             alt: round(alt, 1),
@@ -134,7 +139,7 @@ export const useSatellites = (observerLocation) => {
             range: round(rangeSat, 1),
             rangeRate: round(rangeRate, 3),
             dopplerFactor: round(dopplerFactor, 9),
-            isVisible: elevation > 0,
+            isVisible, // visible if above minimum elevation
             isPopular: tle.priority <= 2,
             track,
             footprintRadius: Math.round(footprintRadius),

src/layouts/ClassicLayout.jsx

@@ -899,6 +899,7 @@ export default function ClassicLayout(props) {
         {/* CENTER: World Map */}
         <div style={{ position: 'relative', overflow: 'hidden' }}>
           <WorldMap
+            config={config}
             deLocation={config.location}
             dxLocation={dxLocation}
             onDXChange={handleDXChange}
@@ -1415,6 +1416,7 @@ export default function ClassicLayout(props) {
         {/* MAP */}
         <div style={{ flex: 1, position: 'relative' }}>
           <WorldMap
+            config={config}
             deLocation={config.location}
             dxLocation={dxLocation}
             onDXChange={handleDXChange}
@@ -2088,6 +2090,7 @@ export default function ClassicLayout(props) {
         {/* Map */}
         <div style={{ flex: 1, position: 'relative' }}>
           <WorldMap
+            config={config}
             deLocation={config.location}
             dxLocation={dxLocation}
             onDXChange={handleDXChange}

src/layouts/EmcommLayout.jsx

@@ -457,6 +457,7 @@ export default function EmcommLayout(props) {
         {/* MAP */}
         <div style={{ position: 'relative', overflow: 'hidden' }}>
           <WorldMap
+            config={config}
             deLocation={config.location}
             dxLocation={dxLocation}
             onDXChange={handleDXChange}

src/layouts/ModernLayout.jsx

@@ -147,6 +147,7 @@ export default function ModernLayout(props) {
   const mapComponent = (style) => (
     <div style={{ position: 'relative', borderRadius: '6px', overflow: 'hidden', ...style }}>
       <WorldMap
+        config={config}
         deLocation={config.location}
         dxLocation={dxLocation}
         onDXChange={handleDXChange}