/**
* VLM UI: Bildanalyse-Panel mit Upload, Zwei-Stufen-Workflow und Overpass-Kopplung.
*/
const VlmUI = {
_panel: null,
_dropZone: null,
_currentAnalysis: null,
_isAnalyzing: false,
init: function() {
this._createPanel();
},
show: function() {
if (!this._panel) this.init();
this._panel.style.display = 'block';
},
hide: function() {
if (this._panel) this._panel.style.display = 'none';
},
_createPanel: function() {
var panel = document.getElementById('vlm-panel');
if (!panel) return;
this._panel = panel;
panel.innerHTML =
'' +
'
BILDANALYSE (VLM)
' +
'
' +
'
' +
'
' +
'
Bild hierher ziehen
' +
'
oder klicken zum Waehlen (PNG/JPG/WEBP, max 10MB)
' +
'
' +
'
' +
'
Analysiere Bild...
' +
'
' +
'
' +
'
SZENE
' +
'
' +
'
ERKANNTE OBJEKTE
' +
'
' +
'
' +
'
' +
'
' +
'
' +
'' + file.name +
' (' + (file.size / 1024).toFixed(0) + ' KB)
';
previewEl.style.display = 'block';
};
reader.readAsDataURL(file);
},
_getViewportInfo: function() {
if (!Globe.viewer) return '';
var cam = Globe.viewer.camera;
var carto = cam.positionCartographic;
if (!carto) return '';
var lat = Cesium.Math.toDegrees(carto.latitude).toFixed(2);
var lon = Cesium.Math.toDegrees(carto.longitude).toFixed(2);
var alt = (carto.height / 1000).toFixed(0);
return 'Lat ' + lat + ', Lon ' + lon + ', Hoehe ' + alt + ' km';
},
_uploadAndAnalyze: function(file) {
this._isAnalyzing = true;
this._dropZone.style.display = 'none';
var loadingEl = document.getElementById('vlm-loading');
if (loadingEl) loadingEl.style.display = 'block';
var formData = new FormData();
formData.append('file', file);
formData.append('viewport_info', this._getViewportInfo());
var self = this;
fetch('/api/vlm/analyze', {
method: 'POST',
body: formData,
})
.then(function(r) {
if (r.status === 413) {
throw new Error('Bild zu gross fuer Upload. Bitte kleineres Bild verwenden.');
}
if (r.status === 429) {
throw new Error('Eine Analyse laeuft bereits. Bitte warten.');
}
if (!r.ok) {
return r.text().then(function(txt) {
try { var d = JSON.parse(txt); throw new Error(d.detail || 'Fehler ' + r.status); }
catch(e) { if (e.message && !e.message.startsWith('Unexpected')) throw e; throw new Error('Server-Fehler ' + r.status); }
});
}
return r.json();
})
.then(function(data) {
self._currentAnalysis = data;
self._showResults(data);
})
.catch(function(e) {
alert('VLM-Fehler: ' + e.message);
self._reset();
})
.finally(function() {
self._isAnalyzing = false;
if (loadingEl) loadingEl.style.display = 'none';
});
},
_showResults: function(data) {
var resultsEl = document.getElementById('vlm-results');
var resetBtn = document.getElementById('vlm-reset-btn');
if (!resultsEl) return;
// EXIF-Metadaten
var exifHtml = '';
if (data.exif) {
var e = data.exif;
var ep = [];
if (e.has_gps) ep.push('GPS: ' + e.latitude + ', ' + e.longitude + '');
if (e.altitude) ep.push('Hoehe: ' + e.altitude + 'm');
if (e.camera_model) ep.push(e.camera_make ? e.camera_make + ' ' + e.camera_model : e.camera_model);
if (e.focal_length) ep.push(e.focal_length + 'mm');
if (e.timestamp) ep.push(e.timestamp.replace('T', ' '));
if (e.compass_heading) ep.push('Heading: ' + e.compass_heading + '\u00B0');
if (ep.length > 0) {
exifHtml = 'EXIF METADATEN
' +
'
' + ep.join(' · ') + '
EXIF
Keine Metadaten gefunden
LANDSCHAFTSMERKMALE
' +
'' + cl.join('
') + '
';
}
}
// Szene
var sceneEl = document.getElementById('vlm-scene');
if (sceneEl) {
sceneEl.innerHTML = exifHtml +
'' + (data.scene_description || 'Keine Beschreibung') +
(data.terrain ? ' | Gelaende: ' + data.terrain : '') +
(data.estimated_location_type ? ' | Region: ' + data.estimated_location_type : '') +
'
' + cluesHtml;
}
// Objekte
var objectsEl = document.getElementById('vlm-objects');
if (objectsEl) {
var html = '';
var objects = data.objects || [];
objects.forEach(function(obj, idx) {
var confClass = 'vlm-confidence-' + obj.confidence;
var confLabel = { high: 'HIGH', medium: 'MED', low: 'LOW' }[obj.confidence] || '?';
var checked = obj.confidence !== 'low' ? ' checked' : '';
var milBadge = obj.military_relevant ? 'MIL' : '';
html += '' +
'
' +
'
' +
'
' + obj.type.replace(/_/g, ' ') + '
' +
'
' + obj.description + '
' +
'
' +
'
' + confLabel + '' +
milBadge +
'
Keine Objekte erkannt
';
}
objectsEl.innerHTML = html;
}
resultsEl.style.display = 'block';
if (resetBtn) resetBtn.style.display = 'block';
},
_confirmAndSearch: function() {
if (!this._currentAnalysis) return;
// Ausgewaehlte Objekte sammeln
var objects = this._currentAnalysis.objects || [];
var selected = [];
objects.forEach(function(obj, idx) {
var cb = document.getElementById('vlm-obj-' + idx);
if (cb && cb.checked) {
selected.push(obj);
}
});
if (selected.length === 0) {
alert('Bitte mindestens ein Objekt auswaehlen');
return;
}
// BBox: Standard weltweit (null), optional auf Viewport einschraenken
var bbox = null;
var bboxCb = document.getElementById('vlm-use-bbox');
if (bboxCb && bboxCb.checked && Globe.viewer) {
var rect = Globe.viewer.camera.computeViewRectangle();
if (rect) {
bbox = [
Cesium.Math.toDegrees(rect.south),
Cesium.Math.toDegrees(rect.west),
Cesium.Math.toDegrees(rect.north),
Cesium.Math.toDegrees(rect.east),
];
}
}
var btn = document.getElementById('vlm-search-btn');
if (btn) { btn.disabled = true; btn.textContent = 'SUCHE LAEUFT...'; }
var searchResult = document.getElementById('vlm-search-result');
if (searchResult) { searchResult.style.display = 'block'; searchResult.textContent = 'Generiere Overpass-Queries...'; searchResult.style.color = 'var(--text-dim)'; }
// 1. Queries generieren
var startTime = Date.now();
fetch('/api/vlm/generate-queries', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ objects: selected, bbox: bbox, estimated_location_type: VlmUI._currentAnalysis.estimated_location_type || null }),
})
.then(function(r) {
if (!r.ok) return r.json().then(function(d) { throw new Error(d.detail || 'Fehler'); });
return r.json();
})
.then(function(data) {
var regionInfo = data.region ? ' (Region: ' + data.region + ')' : ' (weltweit)';
if (searchResult) searchResult.textContent = 'Query generiert (' + data.tag_count + ' Tags)' + regionInfo + '. Suche OSM-Daten...';
// 2. Overpass-Query direkt ausfuehren
OverpassLayer.setColor('#e040fb');
return fetch('/api/overpass/query', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ query: data.query, bbox: bbox }),
});
})
.then(function(r) {
if (r.status === 429) {
return r.json().then(function(d) { throw new Error(d.detail || 'Rate-Limit'); });
}
if (!r.ok) {
return r.json().then(function(d) { throw new Error(d.detail || 'Overpass-Fehler'); });
}
return r.json();
})
.then(function(data) {
var elapsed = ((Date.now() - startTime) / 1000).toFixed(1);
OverpassLayer.render(data);
if (searchResult) {
var text = data.total + ' Orte gefunden (' + elapsed + 's)';
if (data.cached) text += ' [Cache]';
if (data.truncated) text += ' [Limit erreicht]';
searchResult.textContent = text;
searchResult.style.color = 'var(--accent)';
}
var countEl = document.getElementById('count-vlm');
if (countEl) countEl.textContent = data.total;
})
.catch(function(e) {
if (searchResult) {
searchResult.textContent = 'Fehler: ' + e.message;
searchResult.style.color = '#ff5252';
}
})
.finally(function() {
if (btn) { btn.disabled = false; btn.textContent = 'AUF GLOBE SUCHEN'; }
});
},
_reset: function() {
this._currentAnalysis = null;
this._isAnalyzing = false;
if (this._dropZone) this._dropZone.style.display = 'block';
var els = ['vlm-preview', 'vlm-loading', 'vlm-results', 'vlm-search-result'];
els.forEach(function(id) {
var el = document.getElementById(id);
if (el) el.style.display = 'none';
});
var resetBtn = document.getElementById('vlm-reset-btn');
if (resetBtn) resetBtn.style.display = 'none';
var fileInput = document.getElementById('vlm-file-input');
if (fileInput) fileInput.value = '';
var countEl = document.getElementById('count-vlm');
if (countEl) countEl.textContent = '-';
// Overpass-Ergebnisse loeschen
if (typeof OverpassLayer !== 'undefined') OverpassLayer.clear();
},
};