/** * Monitor-Layer: OSINT-Daten mit ortsspezifischen Artikeln. */ const MonitorLayer = { _viewer: null, _points: null, _labels: null, _interval: null, _count: 0, _data: [], _incidents: [], _handler: null, start(viewer) { if (this._points) return; this._viewer = viewer; this._points = viewer.scene.primitives.add(new Cesium.PointPrimitiveCollection()); this._labels = viewer.scene.primitives.add(new Cesium.LabelCollection()); var self = this; this._handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas); this._handler.setInputAction(function(click) { self._onClick(click.position); }, Cesium.ScreenSpaceEventType.LEFT_CLICK); }, stop() { if (this._interval) { clearInterval(this._interval); this._interval = null; } if (this._handler) { this._handler.destroy(); this._handler = null; } if (this._points && this._viewer) { this._viewer.scene.primitives.remove(this._points); this._points = null; } if (this._labels && this._viewer) { this._viewer.scene.primitives.remove(this._labels); this._labels = null; } this._count = 0; this._data = []; this._incidents = []; }, _fetchForLage(lageId) { var self = this; var loadEl = document.getElementById('loading-monitor'); var statusEl = document.getElementById('status-monitor'); if (loadEl) loadEl.classList.add('active'); if (statusEl) { statusEl.textContent = 'Lade Lage-Daten...'; statusEl.classList.add('active'); } fetch('/api/monitor-feed?incident_id=' + lageId) .then(function(r) { return r.json(); }) .then(function(data) { self._data = data.features || []; self._incidents = data.incidents || []; self._count = self._data.length; self._render(); var title = self._incidents.length ? self._incidents[0].title : ''; if (statusEl) statusEl.textContent = self._count + ' Orte' + (title ? ' (' + title + ')' : ''); }) .catch(function(e) { console.warn('Monitor error:', e); if (statusEl) statusEl.textContent = 'Fehler'; }) .finally(function() { if (loadEl) loadEl.classList.remove('active'); setTimeout(function() { if (statusEl) statusEl.classList.remove('active'); }, 8000); }); }, _fetch() { var lageId = (typeof Globe !== 'undefined' && Globe._currentLageId) ? Globe._currentLageId : ''; if (lageId) this._fetchForLage(lageId); }, _onClick(position) { if (!this._viewer || !this._data.length) return; var cartesian = this._viewer.scene.pickPosition(position); if (!cartesian) { var ray = this._viewer.scene.camera.getPickRay(position); cartesian = this._viewer.scene.globe.pick(ray, this._viewer.scene); } if (!cartesian) return; var carto = Cesium.Cartographic.fromCartesian(cartesian); var clickLat = Cesium.Math.toDegrees(carto.latitude); var clickLon = Cesium.Math.toDegrees(carto.longitude); var best = null, bestDist = 999; for (var i = 0; i < this._data.length; i++) { var f = this._data[i]; var c = f.geometry.coordinates; var d = Math.abs(c[1] - clickLat) + Math.abs(c[0] - clickLon); if (d < bestDist) { bestDist = d; best = f; } } if (!best || bestDist > 2) return; var p = best.properties; var catColors = { primary: '#ff2222', secondary: '#ff8800', tertiary: '#4499ff', mentioned: '#888888' }; var color = catColors[p.category] || '#888'; var html = '
'; html += '' + (p.name || '?') + ''; if (p.country) html += ' (' + p.country + ')'; html += '
' + (p.article_count || 0) + ' Artikel'; // Ortsspezifische Artikel var articles = p.articles || []; if (articles.length) { html += '
'; articles.forEach(function(a) { html += '
'; html += '
' + (a.headline || '?') + '
'; if (a.summary) { html += '
' + a.summary + '
'; } html += '
'; if (a.source) html += a.source; if (a.date) html += ' | ' + new Date(a.date).toLocaleDateString('de-DE'); html += '
'; }); html += '
'; } html += '
'; this._viewer.trackedEntity = undefined; this._viewer.selectedEntity = new Cesium.Entity({ name: (p.name || '?') + ' — ' + (p.incident_title || ''), description: html, }); }, _render() { if (!this._points) return; this._points.removeAll(); this._labels.removeAll(); var colors = { 'primary': Cesium.Color.fromCssColorString('#ff2222'), 'secondary': Cesium.Color.fromCssColorString('#ff8800'), 'tertiary': Cesium.Color.fromCssColorString('#4499ff'), 'mentioned': Cesium.Color.fromCssColorString('#888888'), }; for (var i = 0; i < this._data.length; i++) { var f = this._data[i]; var coords = f.geometry.coordinates; var p = f.properties; var color = colors[p.category] || colors.mentioned; var count = p.article_count || 1; var size = Math.min(Math.max(Math.sqrt(count) * 3, 6), 18); this._points.add({ position: Cesium.Cartesian3.fromDegrees(coords[0], coords[1], 1000), pixelSize: size, color: color, outlineColor: Cesium.Color.WHITE.withAlpha(0.6), outlineWidth: 1, }); if (count >= 2) { this._labels.add({ position: Cesium.Cartesian3.fromDegrees(coords[0], coords[1], 1000), text: (p.name || '?') + ' (' + count + ')', font: '11px sans-serif', fillColor: color, outlineColor: Cesium.Color.BLACK, outlineWidth: 3, style: Cesium.LabelStyle.FILL_AND_OUTLINE, pixelOffset: new Cesium.Cartesian2(0, -size - 6), scale: 0.8, horizontalOrigin: Cesium.HorizontalOrigin.CENTER, distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 3000000), }); } } }, };