diff --git a/static/js/layers/monitor.js b/static/js/layers/monitor.js index 13859e0..8cd7ccb 100644 --- a/static/js/layers/monitor.js +++ b/static/js/layers/monitor.js @@ -1,6 +1,6 @@ /** * Monitor-Layer: OSINT-Daten aus dem AegisSight Monitor. - * Zeigt geoparsete Standorte aus Nachrichtenlagen auf dem Globus. + * Zeigt geoparsete Standorte mit Zusammenfassungen auf dem Globus. */ const MonitorLayer = { _viewer: null, @@ -10,6 +10,7 @@ const MonitorLayer = { _count: 0, _data: [], _incidents: [], + _handler: null, start(viewer) { if (this._points) return; @@ -18,16 +19,107 @@ const MonitorLayer = { this._labels = viewer.scene.primitives.add(new Cesium.LabelCollection()); this._fetch(); var self = this; - this._interval = setInterval(function() { self._fetch(); }, 120000); // 2min + this._interval = setInterval(function() { self._fetch(); }, 120000); + + // Klick-Handler + 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 = []; }, + _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); + + // Naechsten Monitor-Punkt finden + 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 incident = null; + for (var j = 0; j < this._incidents.length; j++) { + if (this._incidents[j].id === p.incident_id) { incident = this._incidents[j]; break; } + } + + // Info-Panel bauen + var catColors = { primary: '#ff2222', secondary: '#ff8800', tertiary: '#4499ff', mentioned: '#888888' }; + var catLabels = { primary: 'Hauptgeschehen', secondary: 'Reaktionen', tertiary: 'Beteiligte', mentioned: 'Erwaehnt' }; + var catColor = catColors[p.category] || '#888'; + var catLabel = catLabels[p.category] || p.category; + + var html = '