ADS-B AIRCRAFT TRACKING
+
+
+
AIRCRAFT IMAGE
+
+
+
✈️
+
Select an aircraft to view photo
+
+
+
+ ![Aircraft photo]()
+
+
+
+
+
+
+
📷
+
No photo available
+
Registration not found in database
+
+
+
@@ -7218,6 +7247,7 @@
if (!selectedMainAircraft || !adsbAircraft[selectedMainAircraft]) {
infoPanel.innerHTML = '
Click an aircraft to view details
';
+ showMainAircraftPhotoState('placeholder');
return;
}
@@ -7251,6 +7281,96 @@
${a.type ? `
Aircraft: ${a.type}
` : ''}
ICAO: ${selectedMainAircraft}
`;
+
+ // Fetch aircraft photo if registration is available
+ if (a.registration) {
+ fetchMainAircraftPhoto(a.registration);
+ } else {
+ // No registration - show placeholder or no photo state
+ showMainAircraftPhotoState('noregistration');
+ }
+ }
+
+ // Cache for aircraft photos to avoid repeated API calls
+ const mainPhotoCache = {};
+
+ // Show different states for the aircraft photo panel
+ function showMainAircraftPhotoState(state) {
+ const placeholder = document.getElementById('mainAircraftPhotoPlaceholder');
+ const wrapper = document.getElementById('mainAircraftPhotoWrapper');
+ const loading = document.getElementById('mainAircraftPhotoLoading');
+ const noPhoto = document.getElementById('mainAircraftPhotoNoPhoto');
+
+ if (!placeholder || !wrapper || !loading || !noPhoto) return;
+
+ placeholder.style.display = state === 'placeholder' ? 'block' : 'none';
+ wrapper.style.display = state === 'photo' ? 'block' : 'none';
+ loading.style.display = state === 'loading' ? 'block' : 'none';
+ noPhoto.style.display = (state === 'nophoto' || state === 'noregistration') ? 'block' : 'none';
+
+ // Update no photo message for no registration case
+ if (state === 'noregistration' && noPhoto) {
+ noPhoto.innerHTML = `
+
📷
+
No photo available
+
Aircraft registration unknown
+ `;
+ } else if (state === 'nophoto' && noPhoto) {
+ noPhoto.innerHTML = `
+
📷
+
No photo available
+
Registration not found in database
+ `;
+ }
+ }
+
+ // Fetch aircraft photo from the API
+ async function fetchMainAircraftPhoto(registration) {
+ const img = document.getElementById('mainAircraftPhoto');
+ const link = document.getElementById('mainAircraftPhotoLink');
+ const credit = document.getElementById('mainAircraftPhotoCredit');
+ const regDisplay = document.getElementById('mainAircraftPhotoReg');
+
+ if (!img) return;
+
+ // Check cache first
+ if (mainPhotoCache[registration]) {
+ const cached = mainPhotoCache[registration];
+ if (cached.thumbnail) {
+ img.src = cached.thumbnail;
+ link.href = cached.link || '#';
+ credit.textContent = cached.photographer ? `Photo: ${cached.photographer}` : '';
+ if (regDisplay) regDisplay.textContent = registration;
+ showMainAircraftPhotoState('photo');
+ } else {
+ showMainAircraftPhotoState('nophoto');
+ }
+ return;
+ }
+
+ // Show loading state
+ showMainAircraftPhotoState('loading');
+
+ try {
+ const response = await fetch(`/adsb/aircraft-photo/${encodeURIComponent(registration)}`);
+ const data = await response.json();
+
+ // Cache the result
+ mainPhotoCache[registration] = data;
+
+ if (data.success && data.thumbnail) {
+ img.src = data.thumbnail;
+ link.href = data.link || '#';
+ credit.textContent = data.photographer ? `Photo: ${data.photographer}` : '';
+ if (regDisplay) regDisplay.textContent = registration;
+ showMainAircraftPhotoState('photo');
+ } else {
+ showMainAircraftPhotoState('nophoto');
+ }
+ } catch (err) {
+ console.debug('Failed to fetch aircraft photo:', err);
+ showMainAircraftPhotoState('nophoto');
+ }
}
function addAircraftToOutput(aircraft) {