AegisSight-Globe/static/js/app.js

/**
 * AegisSight Globe — Haupt-App: CesiumJS Viewer, Layer-Management, UI.
 */
const Globe = {
    viewer: null,
    layers: {},
    _statsInterval: null,
    _labelsLayer: null,

    init() {
        // Cesium Ion Token
        Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiIyZTRlZTk4ZC01YjBjLTQ0Y2EtYjdlYi1kNDAwYTIwZjA3YjkiLCJpZCI6NDA4MzI4LCJpYXQiOjE3NzQzNDcyMzR9.eXzrtBDzNsBCbvUHu_Hc-A5gTcBDkspS7IrPDbc5y8M';

        // Viewer erstellen
        this.viewer = new Cesium.Viewer('cesiumContainer', {
            terrain: Cesium.Terrain.fromWorldTerrain(),
            animation: false,
            timeline: false,
            fullscreenButton: false,
            geocoder: false,
            homeButton: false,
            infoBox: true,
            selectionIndicator: true,
            navigationHelpButton: false,
            sceneModePicker: false,
            baseLayerPicker: false,
            skyBox: new Cesium.SkyBox({
                sources: {
                    positiveX: Cesium.buildModuleUrl('Assets/Textures/SkyBox/tycho2t3_80_px.jpg'),
                    negativeX: Cesium.buildModuleUrl('Assets/Textures/SkyBox/tycho2t3_80_mx.jpg'),
                    positiveY: Cesium.buildModuleUrl('Assets/Textures/SkyBox/tycho2t3_80_py.jpg'),
                    negativeY: Cesium.buildModuleUrl('Assets/Textures/SkyBox/tycho2t3_80_my.jpg'),
                    positiveZ: Cesium.buildModuleUrl('Assets/Textures/SkyBox/tycho2t3_80_pz.jpg'),
                    negativeZ: Cesium.buildModuleUrl('Assets/Textures/SkyBox/tycho2t3_80_mz.jpg'),
                }
            }),
        });

        // Atmosphere und Beleuchtung
        this.viewer.scene.globe.enableLighting = false;
        this.viewer.scene.fog.enabled = true;
        this.viewer.scene.globe.showGroundAtmosphere = true;
        this.viewer.clock.shouldAnimate = true;

        // Kamera auf Europa
        this.viewer.camera.flyTo({
            destination: Cesium.Cartesian3.fromDegrees(10.0, 48.0, 8000000),
            duration: 0,
        });

        // Koordinaten-Anzeige bei Mausbewegung
        var coordsEl = document.getElementById('coords-display');
        var scene = this.viewer.scene;
        var handler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
        handler.setInputAction(function(movement) {
            var cartesian = scene.pickPosition(movement.endPosition);
            if (!cartesian) {
                var ray = scene.camera.getPickRay(movement.endPosition);
                cartesian = scene.globe.pick(ray, scene);
            }
            if (cartesian) {
                var carto = Cesium.Cartographic.fromCartesian(cartesian);
                var lat = Cesium.Math.toDegrees(carto.latitude).toFixed(4);
                var lon = Cesium.Math.toDegrees(carto.longitude).toFixed(4);
                coordsEl.textContent = 'LAT: ' + lat + '  LON: ' + lon;
            }
        }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);

        // Layer Checkboxen
        this._setupLayerToggles();

        // Fullscreen
        document.getElementById('btn-fullscreen').addEventListener('click', function() {
            if (!document.fullscreenElement) { document.documentElement.requestFullscreen(); }
            else { document.exitFullscreen(); }
        });

        // Stats Update
        this._statsInterval = setInterval(function() { Globe._updateStats(); }, 5000);

        // Layer starten (die mit checked)

        this._toggleLabels(true);
        document.getElementById('bottom-stats').textContent = 'Globe initialisiert — Lade Daten...';
    },

    _toggleLabels(on) {
        if (on && !this._labelsLayer) {
            this._labelsLayer = this.viewer.imageryLayers.addImageryProvider(
                new Cesium.UrlTemplateImageryProvider({
                    url: 'https://server.arcgisonline.com/ArcGIS/rest/services/Reference/World_Boundaries_and_Places/MapServer/tile/{z}/{y}/{x}',
                    minimumLevel: 1,
                    maximumLevel: 18,
                    tileWidth: 256,
                    tileHeight: 256,
                    credit: 'Esri',
                })
            );
            this._labelsLayer.alpha = 0.95;
            this._labelsLayer.minificationFilter = Cesium.TextureMinificationFilter.LINEAR;
            this._labelsLayer.magnificationFilter = Cesium.TextureMagnificationFilter.LINEAR;
        } else if (!on && this._labelsLayer) {
            this.viewer.imageryLayers.remove(this._labelsLayer);
            this._labelsLayer = null;
        }
    },

    _setupLayerToggles() {
        var toggles = {
            'layer-flights': function(on) { on ? FlightsLayer.start(Globe.viewer) : FlightsLayer.stop(); },
            'layer-ships': function(on) { on ? ShipsLayer.start(Globe.viewer) : ShipsLayer.stop(); },
            'layer-quakes': function(on) { on ? QuakesLayer.start(Globe.viewer) : QuakesLayer.stop(); },
            'layer-gdelt': function(on) { on ? GdeltLayer.start(Globe.viewer) : GdeltLayer.stop(); },
            'layer-daynight': function(on) { Globe.viewer.scene.globe.enableLighting = on; },
            'layer-labels': function(on) { Globe._toggleLabels(on); },
        };
        Object.keys(toggles).forEach(function(id) {
            var cb = document.getElementById(id);
            if (cb) cb.addEventListener('change', function() { toggles[id](this.checked); });
        });
    },

    _updateStats() {
        var parts = [];
        if (typeof FlightsLayer !== 'undefined' && FlightsLayer._count > 0) {
            parts.push(FlightsLayer._count.toLocaleString('de-DE') + ' Flugzeuge');
            document.getElementById('count-flights').textContent = FlightsLayer._count.toLocaleString('de-DE');
        }
        if (typeof ShipsLayer !== 'undefined' && ShipsLayer._count > 0) {
            parts.push(ShipsLayer._count.toLocaleString('de-DE') + ' Schiffe');
            document.getElementById('count-ships').textContent = ShipsLayer._count.toLocaleString('de-DE');
        }
        if (typeof QuakesLayer !== 'undefined' && QuakesLayer._count > 0) {
            document.getElementById('count-quakes').textContent = QuakesLayer._count.toLocaleString('de-DE');
        }
        if (typeof GdeltLayer !== 'undefined' && GdeltLayer._count > 0) {
            document.getElementById('count-gdelt').textContent = GdeltLayer._count.toLocaleString('de-DE');
        }
        if (parts.length) {
            document.getElementById('bottom-stats').textContent = parts.join('  |  ');
        }
    },
};

document.addEventListener('DOMContentLoaded', function() { Globe.init(); });