base sys done. shift to vs code

frontend/public/app.js

@@ -0,0 +1,56 @@
+// app.js
+import { API_BASE_URL } from "./config.js";
+
+console.log('🔥 app.js loaded');
+
+// Optional: set Ion token (if using Ion)
+Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJkZjk0MDM3OC1kZDE1LTRhMjItODg3NC1iMjUzNmI1NzUwMjgiLCJpZCI6MzE2ODE3LCJpYXQiOjE3NTEyMzM5OTh9.UDLPRYrMOcLAjuCWAZa2f159W0bULWSMNv3iiQcAAP8';
+
+
+
+// Create empty viewer with no base layer
+const viewer = new Cesium.Viewer("cesiumContainer", {
+  imageryProvider: false,
+  baseLayerPicker: false,
+  terrainProvider: new Cesium.EllipsoidTerrainProvider()
+});
+
+console.log('✅ Viewer created:', viewer);
+
+// Create OSM imagery layer
+const osmLayer = new Cesium.ImageryLayer(
+  new Cesium.UrlTemplateImageryProvider({
+    url: "https://a.tile.openstreetmap.org/{z}/{x}/{y}.png",
+    credit: "© OpenStreetMap contributors"
+  })
+);
+
+// Add imagery layer manually
+viewer.imageryLayers.add(osmLayer);
+
+console.log('✅ OSM Layer Added:', osmLayer);
+console.log('✅ Imagery Layers:', viewer.imageryLayers.length);
+
+
+
+// Load CZML from FastAPI endpoint
+fetch(`${API_BASE_URL}/czml/test`)  
+  .then(response => {
+    if (!response.ok) {
+      throw new Error("Network response was not ok");
+    }
+    return response.json();
+  })
+  .then(czmlData => {
+    // Load the CZML data into a Cesium data source
+    const czmlSource = new Cesium.CzmlDataSource();
+    czmlSource.load(czmlData).then(() => {
+      viewer.dataSources.add(czmlSource);
+      viewer.zoomTo(czmlSource);
+    });
+  })
+  .catch(error => {
+    console.error("Failed to load CZML:", error);
+  });
+
+