From 78e4b4535eb82a0bbc203c5e38ab20a6bdc4e31c Mon Sep 17 00:00:00 2001
From: davidgalindo-git <>
Date: Thu, 15 Jan 2026 09:48:51 +0100
Subject: [PATCH 01/61] feat:added cesium access token

---
 .env                          | 1 +
 src/components/mapPreview.vue | 5 ++++-
 2 files changed, 5 insertions(+), 1 deletion(-)
 create mode 100644 .env

diff --git a/.env b/.env
new file mode 100644
index 0000000..9b0c925
--- /dev/null
+++ b/.env
@@ -0,0 +1 @@
+VITE_CESIUM_ACCESS_TOKEN=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI4YzI2NDVjZS01MjI2LTQ1NWItOTBiMS0wMjU4YjMxMDZlMzYiLCJpZCI6Mzc4OTAzLCJpYXQiOjE3Njg0NjI3NzR9.KaG069qEZVmlYE0ggui3x9SYUuIrtv0HTRJOaDOrDKs
diff --git a/src/components/mapPreview.vue b/src/components/mapPreview.vue
index 88ecd9d..8d1c6e6 100644
--- a/src/components/mapPreview.vue
+++ b/src/components/mapPreview.vue
@@ -14,6 +14,9 @@ const onViewerReady = (readyObj) => {
     destination: readyObj.Cesium.Cartesian3.fromDegrees(6.500465335539498, 46.82166054184684, 10000)
   })
 }
+
+const cesiumToken = import.meta.env.VITE_CESIUM_ACCESS_TOKEN;
+
 const props = defineProps({
   lng: 46.82166054184684,
   lat:  6.500465335539498
@@ -28,7 +31,7 @@ const camera = {
 
 <template>
 
-  <vc-viewer access-token="YOUR_ACCESS_TOKEN"
+  <vc-viewer :access-token="cesiumToken"
              ref="viewerRef"
              @ready="onViewerReady" :camera="camera">
       <vc-layer-imagery>

From 3ca16a3d41bfe0d9e3eaaa4273d802e20027b213 Mon Sep 17 00:00:00 2001
From: Jorisbly <joris.bailly.2001@gmail.com>
Date: Thu, 15 Jan 2026 09:51:35 +0100
Subject: [PATCH 02/61] feat(): Add a navbar

---
 src/components/NavBar.vue | 9 +++++++++
 1 file changed, 9 insertions(+)
 create mode 100644 src/components/NavBar.vue

diff --git a/src/components/NavBar.vue b/src/components/NavBar.vue
new file mode 100644
index 0000000..ceff3bb
--- /dev/null
+++ b/src/components/NavBar.vue
@@ -0,0 +1,9 @@
+<script setup>
+
+</script>
+
+<template>
+  <div class="navbar bg-base-100 shadow-sm">
+    <a class="btn btn-ghost text-xl">Planium</a>
+  </div>
+</template>

From 2ef3fe1884452179476265bbd756bc3f77c4cd0d Mon Sep 17 00:00:00 2001
From: Jorisbly <joris.bailly.2001@gmail.com>
Date: Thu, 15 Jan 2026 09:55:34 +0100
Subject: [PATCH 03/61] feat(): Add NavBar to the view

---
 src/App.vue | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/App.vue b/src/App.vue
index e800331..e0676ec 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,10 +1,12 @@
 <script setup>
 import CoordinateForm from "@/components/CoordinateForm.vue";
+import NavBar from "@/components/NavBar.vue";
 
 </script>
 
 <template>
   <main class="flex flex-col w-full items-center justify-center min-h-screen py-2">
+      <NavBar/>
       <CoordinateForm />
   </main>
 </template>

From ec55ade3b440d8cfd569d89a9a300c03e59233a9 Mon Sep 17 00:00:00 2001
From: Jorisbly <joris.bailly.2001@gmail.com>
Date: Thu, 15 Jan 2026 09:55:51 +0100
Subject: [PATCH 04/61] feat(): Change positioning and sizing

---
 src/components/CoordinateForm.vue | 32 ++++++++++++++++---------------
 1 file changed, 17 insertions(+), 15 deletions(-)

diff --git a/src/components/CoordinateForm.vue b/src/components/CoordinateForm.vue
index 9004f38..d01a61f 100644
--- a/src/components/CoordinateForm.vue
+++ b/src/components/CoordinateForm.vue
@@ -4,24 +4,26 @@ import {ref} from "vue";
 // Check later to use the given inputs for location
 const lat = ref(0.0)
 const lng = ref(0.0)
+
 </script>
 
 <template>
-      <div class="px-6 text-center lg:text-left">
-        <h1 class="text-center py-2 text-5xl font-bold">Planium</h1>
-      </div>
-      <div class="bg-base-100 w-full max-w-sm shrink-0 px-6">
-        <div class="">
-          <fieldset class="fieldset">
-            <label class="label">Latitude</label>
-            <input @input="lat" type="text" class="input" placeholder="0.0.0.0" />
-            <label class="label">Longitude</label>
-            <input @input="lng" type="text" class="input" placeholder="0.0.0.0" />
-            <button class="btn btn-neutral mt-4">Find</button>
-          </fieldset>
-        </div>
+  <div class="flex flex-row w-[70%] justify-center items-center p-6">
+      <div class="bg-base-100 w-full max-w-sm shrink-0">
+        <fieldset class="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4">
+          <legend class="fieldset-legend">Your position</legend>
+
+          <label class="label">Latitude</label>
+          <input :value="lat" type="text" class="input" placeholder="42.161836383" />
+
+          <label class="label">Longitude</label>
+          <input :value="lng" type="text" class="input" placeholder="6.13838333" />
+
+          <button class="btn btn-neutral mt-4">Find</button>
+        </fieldset>
       </div>
-  <div id="cesiumContainer" class="px-6 w-full">
-    <mapPreview :lng :lat />
+    <div id="cesiumContainer" class="flex w-full">
+       <mapPreview :lng :lat />
+    </div>
   </div>
 </template>
\ No newline at end of file

From f7c9c75ab8615cb8cab8017aa02201028f813686 Mon Sep 17 00:00:00 2001
From: Jorisbly <joris.bailly.2001@gmail.com>
Date: Thu, 15 Jan 2026 10:06:52 +0100
Subject: [PATCH 05/61] feat(): Change default heading

---
 src/components/mapPreview.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/mapPreview.vue b/src/components/mapPreview.vue
index 55bb2a7..0c91df0 100644
--- a/src/components/mapPreview.vue
+++ b/src/components/mapPreview.vue
@@ -24,7 +24,7 @@ const onViewerReady = (readyObj) => {
         100, //height
     ),
     orientation: {
-      heading: Cesium.Math.toRadians(10.0),
+      heading: Cesium.Math.toRadians(0.0),
       pitch: Cesium.Math.toRadians(10.0),
       roll: 0.0
     }

From 37287f8ed102316963bf927afd780bea2354299f Mon Sep 17 00:00:00 2001
From: davidgalindo-git <>
Date: Thu, 15 Jan 2026 09:49:25 +0100
Subject: [PATCH 06/61] Added moon asset loader. Closes #15

---
 src/components/mapPreview.vue | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/src/components/mapPreview.vue b/src/components/mapPreview.vue
index 8d1c6e6..8da0a3a 100644
--- a/src/components/mapPreview.vue
+++ b/src/components/mapPreview.vue
@@ -27,6 +27,12 @@ const camera = {
       pitch: -45,
       roll: 0
 }
+
+// MOON ASSET
+const tileset = viewer.scene.primitives.add(
+    await Cesium.Cesium3DTileset.fromIonAssetId(2684829),
+);
+
 </script>
 
 <template>

From 9583052ddd4db3048c689bb5589e5dae0991e38d Mon Sep 17 00:00:00 2001
From: davidgalindo-git <>
Date: Thu, 15 Jan 2026 10:22:16 +0100
Subject: [PATCH 07/61] fix:"Moon asset is now only loaded not added to viewer.
 Closes #15"

---
 src/components/mapPreview.vue | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/src/components/mapPreview.vue b/src/components/mapPreview.vue
index 8da0a3a..99bbbb2 100644
--- a/src/components/mapPreview.vue
+++ b/src/components/mapPreview.vue
@@ -29,9 +29,7 @@ const camera = {
 }
 
 // MOON ASSET
-const tileset = viewer.scene.primitives.add(
-    await Cesium.Cesium3DTileset.fromIonAssetId(2684829),
-);
+const tileset = await Cesium.Cesium3DTileset.fromIonAssetId(2684829);
 
 </script>
 

From 0128dce247c7926e13502d0fdeff1729e41141ad Mon Sep 17 00:00:00 2001
From: davidgalindo-git <>
Date: Thu, 15 Jan 2026 10:24:34 +0100
Subject: [PATCH 08/61] fix:"erased pasted code"

---
 src/components/mapPreview.vue | 11 -----------
 1 file changed, 11 deletions(-)

diff --git a/src/components/mapPreview.vue b/src/components/mapPreview.vue
index d3444f8..d3cf4ba 100644
--- a/src/components/mapPreview.vue
+++ b/src/components/mapPreview.vue
@@ -33,17 +33,6 @@ const onViewerReady = (readyObj) => {
 
 const cesiumToken = import.meta.env.VITE_CESIUM_ACCESS_TOKEN;
 
-const props = defineProps({
-  lng: 46.82166054184684,
-  lat:  6.500465335539498
-})
-const camera = {
-  position: { lng: props.lng, lat: props.lat, height: 5000 },
-  heading: 0,
-      pitch: -45,
-      roll: 0
-}
-
 // MOON ASSET
 const tileset = await Cesium.Cesium3DTileset.fromIonAssetId(2684829);
 

From 7390241bf06843cc57d854a9f287368b9903cd68 Mon Sep 17 00:00:00 2001
From: davidgalindo-git <>
Date: Thu, 15 Jan 2026 09:48:51 +0100
Subject: [PATCH 09/61] feat:added cesium access token

---
 .env                          | 1 +
 src/components/mapPreview.vue | 4 +++-
 2 files changed, 4 insertions(+), 1 deletion(-)
 create mode 100644 .env

diff --git a/.env b/.env
new file mode 100644
index 0000000..9b0c925
--- /dev/null
+++ b/.env
@@ -0,0 +1 @@
+VITE_CESIUM_ACCESS_TOKEN=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI4YzI2NDVjZS01MjI2LTQ1NWItOTBiMS0wMjU4YjMxMDZlMzYiLCJpZCI6Mzc4OTAzLCJpYXQiOjE3Njg0NjI3NzR9.KaG069qEZVmlYE0ggui3x9SYUuIrtv0HTRJOaDOrDKs
diff --git a/src/components/mapPreview.vue b/src/components/mapPreview.vue
index 55bb2a7..fdbd048 100644
--- a/src/components/mapPreview.vue
+++ b/src/components/mapPreview.vue
@@ -4,6 +4,8 @@ import {onMounted, ref} from "vue";
 const viewerRef = ref(null)
 const isViewerReady = ref(false)
 
+const cesiumToken = import.meta.env.VITE_CESIUM_ACCESS_TOKEN;
+
 const props = defineProps({
   lng: 46.82166054184684,
   lat:  6.500465335539498
@@ -37,7 +39,7 @@ const onViewerReady = (readyObj) => {
 
 <template>
 
-  <vc-viewer access-token="YOUR_ACCESS_TOKEN"
+  <vc-viewer :access-token="cesiumToken"
              ref="viewerRef"
              @ready="onViewerReady">
       <vc-layer-imagery>

From 5c5d636455cdd00edb1a221919747adaa503235b Mon Sep 17 00:00:00 2001
From: davidgalindo-git <>
Date: Thu, 15 Jan 2026 09:49:25 +0100
Subject: [PATCH 10/61] Added moon asset loader. Closes #15

---
 src/components/mapPreview.vue | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/components/mapPreview.vue b/src/components/mapPreview.vue
index fdbd048..3cb362f 100644
--- a/src/components/mapPreview.vue
+++ b/src/components/mapPreview.vue
@@ -33,6 +33,8 @@ const onViewerReady = (readyObj) => {
   })
 }
 
+// MOON ASSET
+const tileset = await Cesium.Cesium3DTileset.fromIonAssetId(2684829);
 
 
 </script>

From 92c7db14233843e6ebc2fac933aa08985cdff6d4 Mon Sep 17 00:00:00 2001
From: davidgalindo-git <>
Date: Thu, 15 Jan 2026 11:08:51 +0100
Subject: [PATCH 11/61] fix:added reactive mount check for viewer and cesium
 before loading asset

---
 src/components/mapPreview.vue | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

diff --git a/src/components/mapPreview.vue b/src/components/mapPreview.vue
index 3cb362f..a2b1987 100644
--- a/src/components/mapPreview.vue
+++ b/src/components/mapPreview.vue
@@ -1,6 +1,6 @@
 <script setup>
 import {VcViewer, VcCompass, VcNavigation, VcTerrainProviderCesium, VcLayerImagery, VcImageryProviderOsm} from "vue-cesium";
-import {onMounted, ref} from "vue";
+import {onMounted, ref, watchEffect} from "vue";
 const viewerRef = ref(null)
 const isViewerReady = ref(false)
 
@@ -34,8 +34,22 @@ const onViewerReady = (readyObj) => {
 }
 
 // MOON ASSET
-const tileset = await Cesium.Cesium3DTileset.fromIonAssetId(2684829);
+watchEffect(async () => { // wait for viewer to be ready before loading asset
+  if (viewerRef.value) {
+    try {
+      // init Cesium and viewer from the component promise
+      const { Cesium, viewer } = await viewerRef.value.creatingPromise;
 
+      if (Cesium) {
+        // load 3D tileset using Cesium Ion Asset ID
+        const tileset = await Cesium.Cesium3DTileset.fromIonAssetId(2684829);
+        console.log("Moon Tileset Loaded");
+      }
+    } catch (error) {
+      console.error("Error loading tileset:", error);
+    }
+  }
+});
 
 </script>
 

From 02bdb70a18e5104434cd84c7a4cf22126d1d6756 Mon Sep 17 00:00:00 2001
From: David Galindo <155019077+davidgalindo-git@users.noreply.github.com>
Date: Thu, 15 Jan 2026 11:11:37 +0100
Subject: [PATCH 12/61] Update Cesium access token in .env file

Replaced the Cesium access token with a placeholder.
---
 .env | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.env b/.env
index 9b0c925..488df96 100644
--- a/.env
+++ b/.env
@@ -1 +1 @@
-VITE_CESIUM_ACCESS_TOKEN=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI4YzI2NDVjZS01MjI2LTQ1NWItOTBiMS0wMjU4YjMxMDZlMzYiLCJpZCI6Mzc4OTAzLCJpYXQiOjE3Njg0NjI3NzR9.KaG069qEZVmlYE0ggui3x9SYUuIrtv0HTRJOaDOrDKs
+VITE_CESIUM_ACCESS_TOKEN="YOUR_CESIUM_ACCESS_TOKEN"

From c758e6aac06f290aaf9318ae7efcc6897b107f55 Mon Sep 17 00:00:00 2001
From: Jorisbly <joris.bailly.2001@gmail.com>
Date: Thu, 15 Jan 2026 11:43:29 +0100
Subject: [PATCH 13/61] feat(): React to location changes

---
 src/components/CoordinateForm.vue | 24 ++++++++++++------
 src/components/mapPreview.vue     | 41 ++++++++++++++++++++++---------
 2 files changed, 46 insertions(+), 19 deletions(-)

diff --git a/src/components/CoordinateForm.vue b/src/components/CoordinateForm.vue
index d01a61f..ced058c 100644
--- a/src/components/CoordinateForm.vue
+++ b/src/components/CoordinateForm.vue
@@ -2,28 +2,36 @@
 import MapPreview from "@/components/mapPreview.vue";
 import {ref} from "vue";
 // Check later to use the given inputs for location
-const lat = ref(0.0)
-const lng = ref(0.0)
+const lat = ref(0)
+const lng = ref(0)
 
+const location = ref({
+  lat: undefined,
+  lng: undefined
+})
+
+function send(){
+  location.value = {lat: parseFloat(lat.value), lng: parseFloat(lng.value)}
+}
 </script>
 
 <template>
-  <div class="flex flex-row w-[70%] justify-center items-center p-6">
+  <div class="flex flex-row w-full justify-center items-center p-6">
       <div class="bg-base-100 w-full max-w-sm shrink-0">
         <fieldset class="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4">
           <legend class="fieldset-legend">Your position</legend>
 
           <label class="label">Latitude</label>
-          <input :value="lat" type="text" class="input" placeholder="42.161836383" />
+          <input v-model="lat" type="number" class="input" placeholder="42.161836383" />
 
           <label class="label">Longitude</label>
-          <input :value="lng" type="text" class="input" placeholder="6.13838333" />
+          <input v-model="lng" type="number" class="input" placeholder="6.13838333" />
 
-          <button class="btn btn-neutral mt-4">Find</button>
+          <button type="submit" @click="send()" class="btn btn-neutral mt-4">Find</button>
         </fieldset>
       </div>
-    <div id="cesiumContainer" class="flex w-full">
-       <mapPreview :lng :lat />
+    <div id="cesiumContainer" class="flex w-[70%]">
+       <mapPreview v-bind="location" />
     </div>
   </div>
 </template>
\ No newline at end of file
diff --git a/src/components/mapPreview.vue b/src/components/mapPreview.vue
index 0c91df0..60a8a4f 100644
--- a/src/components/mapPreview.vue
+++ b/src/components/mapPreview.vue
@@ -1,14 +1,15 @@
 <script setup>
 import {VcViewer, VcCompass, VcNavigation, VcTerrainProviderCesium, VcLayerImagery, VcImageryProviderOsm} from "vue-cesium";
-import {onMounted, ref} from "vue";
+import {onMounted, ref, watch} from "vue";
 const viewerRef = ref(null)
 const isViewerReady = ref(false)
-
-const props = defineProps({
-  lng: 46.82166054184684,
-  lat:  6.500465335539498
+const viewer = ref()
+const location = defineProps({
+  lng: undefined,
+  lat:  undefined
 })
 
+
 onMounted(() => {
   viewerRef.value.creatingPromise.then((readyObj) => {
     isViewerReady.value = true
@@ -17,10 +18,27 @@ onMounted(() => {
 })
 
 const onViewerReady = (readyObj) => {
+  flyTo(readyObj, location.lat, location.lng)
+  viewer.value = readyObj
+}
+
+watch(
+    [() => location.lat, () => location.lng],
+    ([newLat, newLng]) => {
+      if (viewer.value && newLat && newLng) {
+        flyTo(viewer.value, newLat, newLng)
+      }
+    }
+)
+
+
+function flyTo(readyObj, lat, lng){
+try {
+
   readyObj.viewer.camera.flyTo({
     destination: readyObj.Cesium.Cartesian3.fromDegrees(
-        6.500465335539498, // longitude
-        46.82166054184684, //latitude
+        lng ?? 6.500465335539498, // longitude
+        lat ?? 46.82166054184684, //latitude
         100, //height
     ),
     orientation: {
@@ -30,19 +48,20 @@ const onViewerReady = (readyObj) => {
     }
   })
 }
+catch(e) {
+  console.log(e)
+}
 
-
+}
 
 </script>
 
 <template>
-
-  <vc-viewer access-token="YOUR_ACCESS_TOKEN"
+  <vc-viewer access-token="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI4MzYzYjQ5Yi1hYzkzLTRhODctYWNkNi04ZWRmM2VhNmU2MzEiLCJpZCI6Mzc3NTg1LCJpYXQiOjE3NjgyMDg0NjN9.-_Sbjc8qnYU-KGxD2wBzXxvDPcGkasVe2vZCEY9KtmI"
              ref="viewerRef"
              @ready="onViewerReady">
       <vc-layer-imagery>
         <vc-imagery-provider-osm>
-
         </vc-imagery-provider-osm>
       </vc-layer-imagery>
       <vc-imagery-provider-amap />

From 4887e74f880f95eb11cd67f5304bf63d497c5468 Mon Sep 17 00:00:00 2001
From: Jorisbly <joris.bailly.2001@gmail.com>
Date: Thu, 15 Jan 2026 12:02:48 +0100
Subject: [PATCH 14/61] chore(): Ignore .env file

---
 .gitignore | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.gitignore b/.gitignore
index a3f7a51..7aa671e 100644
--- a/.gitignore
+++ b/.gitignore
@@ -27,7 +27,7 @@ coverage
 *.tsbuildinfo
 
 .eslintcache
-
+.env
 # Cypress
 /cypress/videos/
 /cypress/screenshots/

From c670c1631ea15970af116089944f70b80a5cb818 Mon Sep 17 00:00:00 2001
From: Jorisbly <joris.bailly.2001@gmail.com>
Date: Thu, 15 Jan 2026 12:05:35 +0100
Subject: [PATCH 15/61] fix(): Fix cached .env

---
 .env       | 1 -
 .gitignore | 1 -
 2 files changed, 2 deletions(-)
 delete mode 100644 .env

diff --git a/.env b/.env
deleted file mode 100644
index 488df96..0000000
--- a/.env
+++ /dev/null
@@ -1 +0,0 @@
-VITE_CESIUM_ACCESS_TOKEN="YOUR_CESIUM_ACCESS_TOKEN"
diff --git a/.gitignore b/.gitignore
index 7aa671e..64ed0f2 100644
--- a/.gitignore
+++ b/.gitignore
@@ -25,7 +25,6 @@ coverage
 *.sw?
 
 *.tsbuildinfo
-
 .eslintcache
 .env
 # Cypress

From bea274f74dccdaccac56905618a76843d08cba49 Mon Sep 17 00:00:00 2001
From: Jorisbly <joris.bailly.2001@gmail.com>
Date: Thu, 15 Jan 2026 12:08:05 +0100
Subject: [PATCH 16/61] chore():Add a .env.example file

---
 .env.example | 1 +
 1 file changed, 1 insertion(+)
 create mode 100644 .env.example

diff --git a/.env.example b/.env.example
new file mode 100644
index 0000000..0553cb3
--- /dev/null
+++ b/.env.example
@@ -0,0 +1 @@
+VITE_CESIUM_ACCESS_TOKEN="YOUR_CESIUM_ACCESS_TOKEN"
\ No newline at end of file

From e8cfa0264fe7bcc6144e8eb74933bf513c31f866 Mon Sep 17 00:00:00 2001
From: "sofian.hussein@eduvaud.ch" <sofian.hussein@eduvaud.ch>
Date: Thu, 15 Jan 2026 15:40:16 +0100
Subject: [PATCH 17/61] feat(): add FastAPI backend for live flight data
 fetching

---
 API/fetchFlights.py | 60 +++++++++++++++++++++++++++++++++++++++++++++
 API/main.py         | 53 +++++++++++++++++++++++++++++++++++++++
 2 files changed, 113 insertions(+)
 create mode 100644 API/fetchFlights.py
 create mode 100644 API/main.py

diff --git a/API/fetchFlights.py b/API/fetchFlights.py
new file mode 100644
index 0000000..429684f
--- /dev/null
+++ b/API/fetchFlights.py
@@ -0,0 +1,60 @@
+"""
+Author : Sofian Hussein
+Date : 14.01.2026
+Project : FastAPI Flights Backend
+Desc : API data fetching script
+"""
+import requests
+
+
+def get_flights(user_lat, user_long):
+    """
+    Fetch flight data from OpenSky Network API for Switzerland region
+
+    Returns:
+        Dict containing list of flights with their data
+    """
+    url = "https://opensky-network.org/api/states/all"
+
+    """
+    Compute the bounding box for fetching flight data from the OpenSky Network API
+    based on the user's location. The goal is to define a rectangular region that
+    covers the visible sky towards the south from the user's position.
+    
+    In this example, we use Ste-Croix as a reference point,
+    Geneva Airport is excluded from the area to avoid having aircraft on the ground.
+    """
+    params = {
+        "lamin": user_lat-0.52,
+        "lomin": user_long-1,
+        "lamax": user_lat,
+        "lomax": user_long+1
+    }
+
+    # search for data at the URL specified with the parameters
+    response = requests.get(url, params=params)
+
+    # extract only the JSON of the response
+    data = response.json()
+
+    if not data.get("states"):
+        return []
+
+    # list that contains all flights
+    flights = []
+
+    # loop that iterates through the json
+    for state in data["states"]:
+        # creating a dictionary that stores only useful data
+        flight = {
+            "origin_country": state[2],
+            "lat": state[5],
+            "long": state[6],
+            "alt": state[7]/1000 if state[7] else state[7],
+            "velocity": state[9],
+            "heading": state[10]
+        }
+        # add the flight to the list of aircraft
+        flights.append(flight)
+
+    return flights
diff --git a/API/main.py b/API/main.py
new file mode 100644
index 0000000..56e72bd
--- /dev/null
+++ b/API/main.py
@@ -0,0 +1,53 @@
+"""
+Author : Sofian Hussein
+Date : 15.01.2026
+Project : FastAPI Flights Backend
+Description: Backend service to fetch and serve live flight data using OpenSky API.
+"""
+import uvicorn
+from fastapi import FastAPI, Query
+from fetchFlights import get_flights
+
+app = FastAPI()
+
+
+@app.get("/flights")
+def get_flights_endpoint(
+        lat: float = Query(None, description="User latitude"),
+        long: float = Query(None, description="User longitude")
+):
+    """
+    route that allows planes to be recovered
+
+    :param lat: latitude of the user
+    :param long: longitude of the user
+    :return: a dict of all the flights
+    """
+    # Default to Ste-Croix if no coordinates provided
+    if lat is None or long is None:
+        lat, long = 46.82, 6.5
+
+    # Fetch flights for the given coordinates
+    flights = get_flights(lat, long)
+
+    # If no data is found
+    if not flights:
+        return {"message": "No data found"}
+
+    return flights
+
+
+@app.get("/")
+def read_root():
+    """
+    Default route
+
+    :return: "message": "FastAPI Flights Backend Running"
+    """
+    return {"message": "FastAPI Flights Backend Running"}
+
+
+"""
+Source Claude : How to change the listening port with Fastapi ?
+"""
+uvicorn.run(app, port=8080)

From 17b27aa778687cd869da1a14a1733aea2c4d72fc Mon Sep 17 00:00:00 2001
From: "sofian.hussein@eduvaud.ch" <sofian.hussein@eduvaud.ch>
Date: Thu, 15 Jan 2026 16:04:28 +0100
Subject: [PATCH 18/61] fix(): allow API access from local network

---
 API/main.py | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/API/main.py b/API/main.py
index 56e72bd..0fae441 100644
--- a/API/main.py
+++ b/API/main.py
@@ -50,4 +50,4 @@ def read_root():
 """
 Source Claude : How to change the listening port with Fastapi ?
 """
-uvicorn.run(app, port=8080)
+uvicorn.run(app, host="0.0.0.0", port=8080)

From dfc3b2ecc8054bfc022d59f81e35ee1e1af67f00 Mon Sep 17 00:00:00 2001
From: David Galindo <155019077+davidgalindo-git@users.noreply.github.com>
Date: Thu, 15 Jan 2026 16:15:55 +0100
Subject: [PATCH 19/61] moon display 3d with start view to south (#24)

* feat:moon asset added

* feat:moved moon above evian and rescaled to make it visible

* fix:cesium functions sources + moon visible from start

---------

Co-authored-by: davidgalindo-git <>
---
 src/components/mapPreview.vue | 27 ++++++++++++++++++++++++---
 1 file changed, 24 insertions(+), 3 deletions(-)

diff --git a/src/components/mapPreview.vue b/src/components/mapPreview.vue
index abe49db..636a5ed 100644
--- a/src/components/mapPreview.vue
+++ b/src/components/mapPreview.vue
@@ -43,7 +43,7 @@ try {
         100, //height
     ),
     orientation: {
-      heading: Cesium.Math.toRadians(0.0),
+      heading: Cesium.Math.toRadians(180.0), // South
       pitch: Cesium.Math.toRadians(10.0),
       roll: 0.0
     }
@@ -53,7 +53,7 @@ catch(e) {
   console.log(e)
 }
 
-// MOON ASSET
+// MOON ASSET (insp. from https://cesium.com/platform/cesium-ion/content/cesium-moon/)
 watchEffect(async () => { // wait for viewer to be ready before loading asset
   if (viewerRef.value) {
     try {
@@ -61,9 +61,30 @@ watchEffect(async () => { // wait for viewer to be ready before loading asset
       const { Cesium, viewer } = await viewerRef.value.creatingPromise;
 
       if (Cesium) {
+        // clear previous tilesets
+        viewer.scene.primitives.removeAll(); //src: https://cesium.com/learn/ion-sdk/ref-doc/PrimitiveCollection.html
+
         // load 3D tileset using Cesium Ion Asset ID
         const tileset = await Cesium.Cesium3DTileset.fromIonAssetId(2684829);
-        console.log("Moon Tileset Loaded");
+
+        // add 3D tileset to viewer
+        viewer.scene.primitives.add(tileset);
+
+        // relocate to default location
+        const location = Cesium.Cartesian3.fromDegrees( //src: https://cesium.com/learn/ion-sdk/ref-doc/Cartesian3.html
+            6.583672,
+            46.393440,
+            10000 // 10km above ground
+        );
+        const modelMatrix = Cesium.Transforms.eastNorthUpToFixedFrame(location); //src: https://cesium.com/learn/ion-sdk/ref-doc/Transforms.html
+
+        // scale down to 0.1% of size (3.475km wide)
+        const scale = 0.001;
+        tileset.modelMatrix = Cesium.Matrix4.multiplyByUniformScale( //src: https://cesium.com/learn/ion-sdk/ref-doc/Matrix4.html
+            modelMatrix,
+            scale,
+            new Cesium.Matrix4()
+        );
       }
     } catch (error) {
       console.error("Error loading tileset:", error);

From 72579425cef7ec98012c4ad9ba507b8ada81f027 Mon Sep 17 00:00:00 2001
From: Joris Bailly <90181523+JorisBly@users.noreply.github.com>
Date: Fri, 16 Jan 2026 15:02:13 +0100
Subject: [PATCH 20/61] Feature/Refactoring (#34)

* refactor():Use a proper way to initilaise cesium and viewer

* feat():Create map terrain component

* feat():Component for ion-imagery

* feat():Component for to call all imagery

* feat():Create component for alerts

* feat():Create scene and tileset .js files for their logic

* feat():Create a Tilesets.vue to call all tilesets components

* feat():Create function for camera

* feat():Create function for scene

* feat():Create a compass component

* feat():Create the button to get current location

* feat():Create component to handle all navigations component

* feat():Add function to get a tilset position from any API

* feat():Create a generic tileset component

* feat(): Create the components to contain all tilesets in the scene

* feat(): Create component for terrain

* refactor(): Refactor the mapPreview

* fix(): Bring back removingMoving

* refactor(): Change name of mapPreview to Viewer.vue

* refactor(): Change name of mapTerrain to Terrain.vue

* refactor(): Remove call of Google3dTiles.vue

* refactor(): Remove useless code

* fix(): Add strict comparaison

* refactor(): Put console.error for invalid

* refactor(): Create a Cartesian3 object
---
 src/components/Alert.vue                   |  17 +++
 src/components/CoordinateForm.vue          |   4 +-
 src/components/Viewer.vue                  |  92 +++++++++++++++++
 src/components/imagery/Imagery.vue         |  10 ++
 src/components/imagery/IonImagery.vue      |  11 ++
 src/components/mapPreview.vue              | 115 ---------------------
 src/components/navigation/Compass.vue      |  11 ++
 src/components/navigation/MyLocation.vue   |   7 ++
 src/components/navigation/Navigation.vue   |  10 ++
 src/components/primitive/Google3dTiles.vue |  15 +++
 src/components/primitive/Tileset.vue       |  50 +++++++++
 src/components/primitive/Tilesets.vue      |  13 +++
 src/components/terrain/Terrain.vue         |  20 ++++
 src/utils/camera.js                        |  20 ++++
 src/utils/scene.js                         |  21 ++++
 src/utils/tileset.js                       |   7 ++
 16 files changed, 306 insertions(+), 117 deletions(-)
 create mode 100644 src/components/Alert.vue
 create mode 100644 src/components/Viewer.vue
 create mode 100644 src/components/imagery/Imagery.vue
 create mode 100644 src/components/imagery/IonImagery.vue
 delete mode 100644 src/components/mapPreview.vue
 create mode 100644 src/components/navigation/Compass.vue
 create mode 100644 src/components/navigation/MyLocation.vue
 create mode 100644 src/components/navigation/Navigation.vue
 create mode 100644 src/components/primitive/Google3dTiles.vue
 create mode 100644 src/components/primitive/Tileset.vue
 create mode 100644 src/components/primitive/Tilesets.vue
 create mode 100644 src/components/terrain/Terrain.vue
 create mode 100644 src/utils/camera.js
 create mode 100644 src/utils/scene.js
 create mode 100644 src/utils/tileset.js

diff --git a/src/components/Alert.vue b/src/components/Alert.vue
new file mode 100644
index 0000000..5713994
--- /dev/null
+++ b/src/components/Alert.vue
@@ -0,0 +1,17 @@
+<script setup>
+  const props = defineProps({
+    error: "Error! Task failed successfully.",
+    duration: 5
+  })
+
+  
+</script>
+
+<template>
+  <div role="alert" class="alert alert-error">
+    <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 shrink-0 stroke-current" fill="none" viewBox="0 0 24 24">
+      <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z" />
+    </svg>
+    <span>Error! Task failed successfully.</span>
+  </div>
+</template>
diff --git a/src/components/CoordinateForm.vue b/src/components/CoordinateForm.vue
index ced058c..58dab02 100644
--- a/src/components/CoordinateForm.vue
+++ b/src/components/CoordinateForm.vue
@@ -1,5 +1,5 @@
 <script setup>
-import MapPreview from "@/components/mapPreview.vue";
+import Viewer from "@/components/Viewer.vue";
 import {ref} from "vue";
 // Check later to use the given inputs for location
 const lat = ref(0)
@@ -31,7 +31,7 @@ function send(){
         </fieldset>
       </div>
     <div id="cesiumContainer" class="flex w-[70%]">
-       <mapPreview v-bind="location" />
+       <Viewer v-bind="location" />
     </div>
   </div>
 </template>
\ No newline at end of file
diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
new file mode 100644
index 0000000..ef0bffd
--- /dev/null
+++ b/src/components/Viewer.vue
@@ -0,0 +1,92 @@
+<script setup>
+import {VcViewer} from "vue-cesium";
+import {ref, watch} from "vue";
+import {prepareScene, removeMoving} from "@/utils/scene.js";
+import Imagery from "@/components/imagery/Imagery.vue";
+import Tilesets from "@/components/primitive/Tilesets.vue";
+import {flyTo} from "@/utils/camera.js";
+import Navigation from "@/components/navigation/Navigation.vue";
+const viewerRef = ref(null)
+const isViewerReady = ref(false)
+const cesiumToken = import.meta.env.VITE_CESIUM_ACCESS_TOKEN;
+const Vcviewer = ref()
+const cesium = ref()
+const location = defineProps({
+  lng: undefined,
+  lat:  undefined
+})
+
+
+
+watch(
+    [() => location.lat, () => location.lng],
+    ([newLat, newLng]) => {
+      if (Vcviewer.value && newLat !== 0 && newLng !== 0) {
+        flyTo(Vcviewer.value.camera,cesium.value, newLat, newLng)
+      }else {
+        console.error(
+            "Unable to update camera position: viewer is not ready or location is invalid.",
+            {
+              viewerReady: !!Vcviewer.value,
+              lat: newLat,
+              lng: newLng
+            }
+        );
+      }
+    }
+)
+
+const onViewerReady = async ({ Cesium, viewer }) => {
+  if (viewerRef.value) {
+    try {
+      const { Cesium, viewer } = await viewerRef.value.creatingPromise;
+      if (Cesium) {
+        viewer.scene.requestRenderMode = true; // Ne rendu que si nécessaire
+        viewer.scene.maximumRenderTimeChange = Infinity;
+        viewer.scene.globe.maximumScreenSpaceError = 24; // AUGMENTE CETTE VALEUR (16 à 32) pour réduire les requêtes
+        viewer.scene.globe.tileCacheSize = 1000;
+        viewer.scene.globe.preloadAncestors = false;
+        await prepareScene(viewer.scene)
+        removeMoving(viewer.scene)
+      }
+
+      flyTo(viewer.camera, Cesium , location.lat, location.lng)
+      isViewerReady.value = true
+      Vcviewer.value = viewer
+      cesium.value = Cesium
+
+    } catch (error) {
+      console.error("Error loading tileset:", error);
+    }
+  }
+};
+
+
+</script>
+
+<template>
+  <vc-viewer
+      :showCredit="false"
+      :enableMouseEvent="false"
+      :scene3DOnly="true"
+      :access-token="cesiumToken"
+             ref="viewerRef"
+             @ready="onViewerReady">
+
+    <template v-if="isViewerReady">
+      <Imagery/>
+      <Tilesets/>
+      <Navigation/>
+      <!--      Suspense wait for the different async call inside each component-->
+      <Suspense>
+        <Tilesets/>
+        <template #fallback>
+          <div>Loading...</div>
+        </template>
+      </Suspense>
+
+    </template>
+  </vc-viewer>
+
+</template>
+
diff --git a/src/components/imagery/Imagery.vue b/src/components/imagery/Imagery.vue
new file mode 100644
index 0000000..aae1f27
--- /dev/null
+++ b/src/components/imagery/Imagery.vue
@@ -0,0 +1,10 @@
+<script setup>
+import {VcLayerImagery} from "vue-cesium";
+import IonImagery from "@/components/imagery/IonImagery.vue";
+</script>
+
+<template>
+  <vc-layer-imagery>
+<!--    <IonImagery assetId="2"></IonImagery>-->
+  </vc-layer-imagery>
+</template>
diff --git a/src/components/imagery/IonImagery.vue b/src/components/imagery/IonImagery.vue
new file mode 100644
index 0000000..f6b9d8a
--- /dev/null
+++ b/src/components/imagery/IonImagery.vue
@@ -0,0 +1,11 @@
+<script setup>
+import {VcImageryProviderIon} from "vue-cesium";
+defineProps({
+  assetId: ""
+})
+</script>
+
+<template>
+  <vc-imagery-provider-ion assetId="2">
+  </vc-imagery-provider-ion>
+</template>
diff --git a/src/components/mapPreview.vue b/src/components/mapPreview.vue
deleted file mode 100644
index 636a5ed..0000000
--- a/src/components/mapPreview.vue
+++ /dev/null
@@ -1,115 +0,0 @@
-<script setup>
-import {VcViewer, VcCompass, VcNavigation, VcTerrainProviderCesium, VcLayerImagery, VcImageryProviderOsm} from "vue-cesium";
-import {onMounted, ref, watch,watchEffect} from "vue";
-const viewerRef = ref(null)
-const isViewerReady = ref(false)
-const cesiumToken = import.meta.env.VITE_CESIUM_ACCESS_TOKEN;
-const viewer = ref()
-const location = defineProps({
-  lng: undefined,
-  lat:  undefined
-})
-
-
-onMounted(() => {
-  viewerRef.value.creatingPromise.then((readyObj) => {
-    isViewerReady.value = true
-  })
-
-})
-
-const onViewerReady = (readyObj) => {
-  flyTo(readyObj, location.lat, location.lng)
-  viewer.value = readyObj
-}
-
-watch(
-    [() => location.lat, () => location.lng],
-    ([newLat, newLng]) => {
-      if (viewer.value && newLat && newLng) {
-        flyTo(viewer.value, newLat, newLng)
-      }
-    }
-)
-
-
-function flyTo(readyObj, lat, lng){
-try {
-
-  readyObj.viewer.camera.flyTo({
-    destination: readyObj.Cesium.Cartesian3.fromDegrees(
-        lng ?? 6.500465335539498, // longitude
-        lat ?? 46.82166054184684, //latitude
-        100, //height
-    ),
-    orientation: {
-      heading: Cesium.Math.toRadians(180.0), // South
-      pitch: Cesium.Math.toRadians(10.0),
-      roll: 0.0
-    }
-  })
-}
-catch(e) {
-  console.log(e)
-}
-
-// MOON ASSET (insp. from https://cesium.com/platform/cesium-ion/content/cesium-moon/)
-watchEffect(async () => { // wait for viewer to be ready before loading asset
-  if (viewerRef.value) {
-    try {
-      // init Cesium and viewer from the component promise
-      const { Cesium, viewer } = await viewerRef.value.creatingPromise;
-
-      if (Cesium) {
-        // clear previous tilesets
-        viewer.scene.primitives.removeAll(); //src: https://cesium.com/learn/ion-sdk/ref-doc/PrimitiveCollection.html
-
-        // load 3D tileset using Cesium Ion Asset ID
-        const tileset = await Cesium.Cesium3DTileset.fromIonAssetId(2684829);
-
-        // add 3D tileset to viewer
-        viewer.scene.primitives.add(tileset);
-
-        // relocate to default location
-        const location = Cesium.Cartesian3.fromDegrees( //src: https://cesium.com/learn/ion-sdk/ref-doc/Cartesian3.html
-            6.583672,
-            46.393440,
-            10000 // 10km above ground
-        );
-        const modelMatrix = Cesium.Transforms.eastNorthUpToFixedFrame(location); //src: https://cesium.com/learn/ion-sdk/ref-doc/Transforms.html
-
-        // scale down to 0.1% of size (3.475km wide)
-        const scale = 0.001;
-        tileset.modelMatrix = Cesium.Matrix4.multiplyByUniformScale( //src: https://cesium.com/learn/ion-sdk/ref-doc/Matrix4.html
-            modelMatrix,
-            scale,
-            new Cesium.Matrix4()
-        );
-      }
-    } catch (error) {
-      console.error("Error loading tileset:", error);
-    }
-  }
-});
-}
-
-</script>
-
-<template>
-  <vc-viewer :access-token="cesiumToken"
-             ref="viewerRef"
-             @ready="onViewerReady">
-      <vc-layer-imagery>
-        <vc-imagery-provider-osm>
-        </vc-imagery-provider-osm>
-      </vc-layer-imagery>
-      <vc-imagery-provider-amap />
-    <template v-if="isViewerReady">
-      <vc-compass></vc-compass>
-      <vc-navigation></vc-navigation>
-      <vc-terrain-provider-cesium></vc-terrain-provider-cesium>
-    </template>
-  </vc-viewer>
-
-</template>
-
diff --git a/src/components/navigation/Compass.vue b/src/components/navigation/Compass.vue
new file mode 100644
index 0000000..71a5f2a
--- /dev/null
+++ b/src/components/navigation/Compass.vue
@@ -0,0 +1,11 @@
+<script setup>
+
+import {VcCompass} from "vue-cesium";
+</script>
+
+<template>
+  <vc-compass
+      :outer-options="{ size: '150px'}"
+      :inner-options="{icon: 'fa fa-compass', size: '60px', background: 'transparent', color: '#009688'}"
+  ></vc-compass>
+</template>
diff --git a/src/components/navigation/MyLocation.vue b/src/components/navigation/MyLocation.vue
new file mode 100644
index 0000000..59f51de
--- /dev/null
+++ b/src/components/navigation/MyLocation.vue
@@ -0,0 +1,7 @@
+<script setup>
+
+</script>
+
+<template>
+  <vc-my-location color="#9C27B0" position="top-left" :offset="[0, 60]" label="Location" stack :round="false" background="#F2C037"></vc-my-location>
+</template>
diff --git a/src/components/navigation/Navigation.vue b/src/components/navigation/Navigation.vue
new file mode 100644
index 0000000..0ac1808
--- /dev/null
+++ b/src/components/navigation/Navigation.vue
@@ -0,0 +1,10 @@
+<script setup>
+
+import Compass from "@/components/navigation/Compass.vue";
+import MyLocation from "@/components/navigation/MyLocation.vue";
+</script>
+
+<template>
+  <MyLocation/>
+  <Compass/>
+</template>
diff --git a/src/components/primitive/Google3dTiles.vue b/src/components/primitive/Google3dTiles.vue
new file mode 100644
index 0000000..c649ed6
--- /dev/null
+++ b/src/components/primitive/Google3dTiles.vue
@@ -0,0 +1,15 @@
+<script setup>
+import {VcPrimitiveTileset} from "vue-cesium";
+defineProps({
+  assetId: Number
+})
+debugger
+</script>
+
+<template>
+  <vc-primitive-tileset
+      ref="primitive"
+      :assetId="assetId"
+  >
+  </vc-primitive-tileset>
+</template>
diff --git a/src/components/primitive/Tileset.vue b/src/components/primitive/Tileset.vue
new file mode 100644
index 0000000..8c906ee
--- /dev/null
+++ b/src/components/primitive/Tileset.vue
@@ -0,0 +1,50 @@
+<script setup>
+import {VcPrimitiveTileset} from "vue-cesium";
+import {Cartesian3} from "cesium";
+
+const cesiumToken = import.meta.env.VITE_CESIUM_ACCESS_TOKEN;
+ const props = defineProps({
+    assetId: Number,
+    currentLocation: Cartesian3,
+    tilesetCartesian: {
+      x: Number,
+      y: Number,
+      z: Number
+    }
+      })
+
+const onReady = ({ cesiumObject: tileset }) => {
+  const tilesetPosition = new Cesium.Cartesian3(
+      props.tilesetCartesian.x,
+      props.tilesetCartesian.y,
+      props.tilesetCartesian.z
+  )
+  const cartographic = Cesium.Cartographic.fromCartesian(tilesetPosition) // put real moon place if possible
+  const surface = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, cartographic.height)
+  const offset = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, 1000)
+  const translation = Cesium.Cartesian3.subtract(offset, surface, new Cesium.Cartesian3())
+  const translationMatrix = Cesium.Matrix4.fromTranslation(translation)
+
+  const scaleFactor = 0.1
+  const scaleMatrix = Cesium.Matrix4.fromUniformScale(scaleFactor)
+  tileset.modelMatrix = Cesium.Matrix4.multiply(
+      translationMatrix,
+      scaleMatrix,
+      new Cesium.Matrix4()
+  )
+
+}
+</script>
+
+<template>
+  <vc-primitive-tileset
+      ref="primitive"
+      :assetId="assetId"
+      :accessToken="cesiumToken"
+      @ready="onReady"
+  ></vc-primitive-tileset>
+</template>
+
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/src/components/primitive/Tilesets.vue b/src/components/primitive/Tilesets.vue
new file mode 100644
index 0000000..257f72d
--- /dev/null
+++ b/src/components/primitive/Tilesets.vue
@@ -0,0 +1,13 @@
+<script async setup>
+
+import Google3dTiles from "@/components/primitive/Google3dTiles.vue";
+import Tileset from "@/components/primitive/Tileset.vue";
+import {getTilesetCartesian} from "@/utils/tileset.js";
+
+let moonLocation = await getTilesetCartesian()
+
+</script>
+
+<template>
+  <Tileset  :tilesetCartesian="moonLocation" :assetId="2684829"/>
+</template>
diff --git a/src/components/terrain/Terrain.vue b/src/components/terrain/Terrain.vue
new file mode 100644
index 0000000..cee8b16
--- /dev/null
+++ b/src/components/terrain/Terrain.vue
@@ -0,0 +1,20 @@
+<script setup>
+import {onMounted, ref} from "vue";
+import {VcTerrainProviderCesium} from "vue-cesium";
+
+const imageryProvider = ref(null)
+const props = defineProps({
+  cesium : {}
+})
+
+onMounted(async ()=> {
+  imageryProvider.value = await Cesium.ArcGisMapServerImageryProvider.fromUrl(
+      "https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer"
+  )
+})
+
+</script>
+
+<template>
+  <vc-terrain-provider-cesium ref="provider"></vc-terrain-provider-cesium>
+</template>
diff --git a/src/utils/camera.js b/src/utils/camera.js
new file mode 100644
index 0000000..fa69434
--- /dev/null
+++ b/src/utils/camera.js
@@ -0,0 +1,20 @@
+export function flyTo(camera, cesium, lat, lng){
+    try {
+        camera.flyTo({
+            destination: cesium.Cartesian3.fromDegrees(
+                lng ??  6.500465335539498, // longitude
+                lat ??46.82166054184684, //latitude
+                1000, //height
+            ),
+            orientation: {
+                heading: Cesium.Math.toRadians(180.0), // Orientation to the south
+                pitch: Cesium.Math.toRadians(15.0),
+                roll: 0.0
+            }
+        })
+    }
+    catch(e) {
+        console.log(e)
+    }
+
+}
\ No newline at end of file
diff --git a/src/utils/scene.js b/src/utils/scene.js
new file mode 100644
index 0000000..c1e9cee
--- /dev/null
+++ b/src/utils/scene.js
@@ -0,0 +1,21 @@
+export async function prepareScene(scene){
+    scene.primitives.removeAll();
+    scene.contextOptions = {
+        allowTextureFilterAnisotropic: false,
+        cameraUnderground: false
+    }
+}
+
+export function addTilesetToScene(scene, tileset){
+    try {
+        scene.primitives.add(tileset);
+    }catch{
+        console.log("Error adding tileset")
+    }
+
+}
+
+//Prevent the user to move in the scene
+export function removeMoving(scene){
+    scene.screenSpaceCameraController.enableRotate = false;
+}
diff --git a/src/utils/tileset.js b/src/utils/tileset.js
new file mode 100644
index 0000000..00a6def
--- /dev/null
+++ b/src/utils/tileset.js
@@ -0,0 +1,7 @@
+export async function get3dTilesetById(id) {
+   return await Cesium.Cesium3DTileset.fromIonAssetId(id)
+}
+
+export async function getTilesetCartesian(){
+    return {x:-29,y: 8, z:25}
+}
\ No newline at end of file

From 30e6ae04c50778f43885a3ac4e364327979c1b9e Mon Sep 17 00:00:00 2001
From: Joris Bailly <90181523+JorisBly@users.noreply.github.com>
Date: Tue, 20 Jan 2026 07:27:47 +0100
Subject: [PATCH 21/61] Feature/place moon (#38)

* fix(): Make 2d map appear

* feat(): Make moon placed in real place

* refactor(): Extract logic to make Tileset not too specific

* refactor(): Change my ming and create a Moon component with real moon

* refactor(): Remove useless function

* fix(): Remove debugger

* fix(): Remove cesiumPath from VueCesium configuration

* feat(): Put assetid directly in the called component

* feat(): Create function load plane to display plane and can make them fly
---
 src/components/Viewer.vue                  |  48 +++++-----
 src/components/imagery/Imagery.vue         |   4 +-
 src/components/imagery/IonImagery.vue      |   6 +-
 src/components/primitive/Google3dTiles.vue |   2 +-
 src/components/primitive/Moon.vue          |  45 +++++++++
 src/components/primitive/Tileset.vue       |  50 ----------
 src/components/primitive/Tilesets.vue      |  10 +-
 src/main.js                                |   1 +
 src/utils/scene.js                         | 106 +++++++++++++++++++++
 src/utils/tileset.js                       |   4 +-
 10 files changed, 187 insertions(+), 89 deletions(-)
 create mode 100644 src/components/primitive/Moon.vue
 delete mode 100644 src/components/primitive/Tileset.vue

diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index ef0bffd..0beec6f 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -1,11 +1,14 @@
 <script setup>
 import {VcViewer} from "vue-cesium";
 import {ref, watch} from "vue";
-import {prepareScene, removeMoving} from "@/utils/scene.js";
+import {loadPlanes, prepareScene, removeMoving} from "@/utils/scene.js";
 import Imagery from "@/components/imagery/Imagery.vue";
 import Tilesets from "@/components/primitive/Tilesets.vue";
 import {flyTo} from "@/utils/camera.js";
 import Navigation from "@/components/navigation/Navigation.vue";
+import Terrain from "@/components/terrain/Terrain.vue";
+import Dynamic from "@/components/Overlay/Dynamic.vue";
+
 const viewerRef = ref(null)
 const isViewerReady = ref(false)
 const cesiumToken = import.meta.env.VITE_CESIUM_ACCESS_TOKEN;
@@ -13,17 +16,16 @@ const Vcviewer = ref()
 const cesium = ref()
 const location = defineProps({
   lng: undefined,
-  lat:  undefined
+  lat: undefined
 })
 
 
-
 watch(
     [() => location.lat, () => location.lng],
     ([newLat, newLng]) => {
       if (Vcviewer.value && newLat !== 0 && newLng !== 0) {
-        flyTo(Vcviewer.value.camera,cesium.value, newLat, newLng)
-      }else {
+        flyTo(Vcviewer.value.camera, cesium.value, newLat, newLng)
+      } else {
         console.error(
             "Unable to update camera position: viewer is not ready or location is invalid.",
             {
@@ -36,24 +38,20 @@ watch(
     }
 )
 
-const onViewerReady = async ({ Cesium, viewer }) => {
+const onViewerReady = async ({Cesium, viewer}) => {
   if (viewerRef.value) {
+
     try {
-      const { Cesium, viewer } = await viewerRef.value.creatingPromise;
       if (Cesium) {
-        viewer.scene.requestRenderMode = true; // Ne rendu que si nécessaire
-        viewer.scene.maximumRenderTimeChange = Infinity;
-        viewer.scene.globe.maximumScreenSpaceError = 24; // AUGMENTE CETTE VALEUR (16 à 32) pour réduire les requêtes
-        viewer.scene.globe.tileCacheSize = 1000;
-        viewer.scene.globe.preloadAncestors = false;
         await prepareScene(viewer.scene)
         removeMoving(viewer.scene)
       }
 
-      flyTo(viewer.camera, Cesium , location.lat, location.lng)
+      flyTo(viewer.camera, Cesium, location.lat, location.lng)
       isViewerReady.value = true
       Vcviewer.value = viewer
       cesium.value = Cesium
+     await loadPlanes(viewer)
 
     } catch (error) {
       console.error("Error loading tileset:", error);
@@ -69,21 +67,21 @@ const onViewerReady = async ({ Cesium, viewer }) => {
       :showCredit="false"
       :enableMouseEvent="false"
       :scene3DOnly="true"
+      ref="viewerRef"
       :access-token="cesiumToken"
-             ref="viewerRef"
-             @ready="onViewerReady">
+      @ready="onViewerReady">
 
     <template v-if="isViewerReady">
-      <Imagery/>
-      <Tilesets/>
-      <Navigation/>
-      <!--      Suspense wait for the different async call inside each component-->
-      <Suspense>
-        <Tilesets/>
-        <template #fallback>
-          <div>Loading...</div>
-        </template>
-      </Suspense>
+          <Imagery/>
+          <Terrain/>
+          <Navigation/>
+<!--      <Dynamic/>-->
+<!--        <Suspense>-->
+<!--          <Tilesets/>-->
+<!--          <template #fallback>-->
+<!--            Loading...-->
+<!--          </template>-->
+<!--        </Suspense>-->
 
     </template>
   </vc-viewer>
diff --git a/src/components/imagery/Imagery.vue b/src/components/imagery/Imagery.vue
index aae1f27..ed44979 100644
--- a/src/components/imagery/Imagery.vue
+++ b/src/components/imagery/Imagery.vue
@@ -1,10 +1,12 @@
 <script setup>
 import {VcLayerImagery} from "vue-cesium";
 import IonImagery from "@/components/imagery/IonImagery.vue";
+
+
 </script>
 
 <template>
   <vc-layer-imagery>
-<!--    <IonImagery assetId="2"></IonImagery>-->
+    <IonImagery :assetId="2"></IonImagery>
   </vc-layer-imagery>
 </template>
diff --git a/src/components/imagery/IonImagery.vue b/src/components/imagery/IonImagery.vue
index f6b9d8a..a3dd46c 100644
--- a/src/components/imagery/IonImagery.vue
+++ b/src/components/imagery/IonImagery.vue
@@ -1,11 +1,11 @@
 <script setup>
 import {VcImageryProviderIon} from "vue-cesium";
-defineProps({
-  assetId: ""
+const props = defineProps({
+  assetId: Number
 })
 </script>
 
 <template>
-  <vc-imagery-provider-ion assetId="2">
+  <vc-imagery-provider-ion :assetId="props.assetId">
   </vc-imagery-provider-ion>
 </template>
diff --git a/src/components/primitive/Google3dTiles.vue b/src/components/primitive/Google3dTiles.vue
index c649ed6..075ec6a 100644
--- a/src/components/primitive/Google3dTiles.vue
+++ b/src/components/primitive/Google3dTiles.vue
@@ -3,7 +3,7 @@ import {VcPrimitiveTileset} from "vue-cesium";
 defineProps({
   assetId: Number
 })
-debugger
+
 </script>
 
 <template>
diff --git a/src/components/primitive/Moon.vue b/src/components/primitive/Moon.vue
new file mode 100644
index 0000000..524c8c5
--- /dev/null
+++ b/src/components/primitive/Moon.vue
@@ -0,0 +1,45 @@
+<script setup>
+import {VcPrimitiveTileset} from "vue-cesium";
+
+const cesiumToken = import.meta.env.VITE_CESIUM_ACCESS_TOKEN;
+
+const onReady = ({ cesiumObject: tileset }) => {
+  const now = Cesium.JulianDate.now();
+  const moonPosInertial = Cesium.Simon1994PlanetaryPositions.computeMoonPositionInEarthInertialFrame(now);
+  const icrfToFixed = Cesium.Transforms.computeIcrfToFixedMatrix(now);
+  const moonPositionReal = new Cesium.Cartesian3();
+  if (Cesium.defined(icrfToFixed)) {
+    Cesium.Matrix3.multiplyByVector(icrfToFixed, moonPosInertial, moonPositionReal);
+  }
+
+  const cartographic = Cesium.Cartographic.fromCartesian(moonPositionReal);
+  const finalPosition = Cesium.Cartesian3.fromRadians(
+      cartographic.longitude,
+      cartographic.latitude,
+      150000
+  );
+  const translationMatrix = Cesium.Matrix4.fromTranslation(finalPosition)
+
+  const scaleFactor = 0.01
+  const scaleMatrix = Cesium.Matrix4.fromUniformScale(scaleFactor)
+  tileset.modelMatrix = Cesium.Matrix4.multiply(
+      translationMatrix,
+      scaleMatrix,
+      new Cesium.Matrix4()
+  )
+
+}
+</script>
+
+<template>
+  <vc-primitive-tileset
+      ref="primitive"
+      :assetId="2684829"
+      :accessToken="cesiumToken"
+      @ready="onReady"
+  ></vc-primitive-tileset>
+</template>
+
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/src/components/primitive/Tileset.vue b/src/components/primitive/Tileset.vue
deleted file mode 100644
index 8c906ee..0000000
--- a/src/components/primitive/Tileset.vue
+++ /dev/null
@@ -1,50 +0,0 @@
-<script setup>
-import {VcPrimitiveTileset} from "vue-cesium";
-import {Cartesian3} from "cesium";
-
-const cesiumToken = import.meta.env.VITE_CESIUM_ACCESS_TOKEN;
- const props = defineProps({
-    assetId: Number,
-    currentLocation: Cartesian3,
-    tilesetCartesian: {
-      x: Number,
-      y: Number,
-      z: Number
-    }
-      })
-
-const onReady = ({ cesiumObject: tileset }) => {
-  const tilesetPosition = new Cesium.Cartesian3(
-      props.tilesetCartesian.x,
-      props.tilesetCartesian.y,
-      props.tilesetCartesian.z
-  )
-  const cartographic = Cesium.Cartographic.fromCartesian(tilesetPosition) // put real moon place if possible
-  const surface = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, cartographic.height)
-  const offset = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, 1000)
-  const translation = Cesium.Cartesian3.subtract(offset, surface, new Cesium.Cartesian3())
-  const translationMatrix = Cesium.Matrix4.fromTranslation(translation)
-
-  const scaleFactor = 0.1
-  const scaleMatrix = Cesium.Matrix4.fromUniformScale(scaleFactor)
-  tileset.modelMatrix = Cesium.Matrix4.multiply(
-      translationMatrix,
-      scaleMatrix,
-      new Cesium.Matrix4()
-  )
-
-}
-</script>
-
-<template>
-  <vc-primitive-tileset
-      ref="primitive"
-      :assetId="assetId"
-      :accessToken="cesiumToken"
-      @ready="onReady"
-  ></vc-primitive-tileset>
-</template>
-
-<style scoped>
-
-</style>
\ No newline at end of file
diff --git a/src/components/primitive/Tilesets.vue b/src/components/primitive/Tilesets.vue
index 257f72d..3f24e71 100644
--- a/src/components/primitive/Tilesets.vue
+++ b/src/components/primitive/Tilesets.vue
@@ -1,13 +1,9 @@
 <script async setup>
+import Moon from "@/components/primitive/Moon.vue";
 
-import Google3dTiles from "@/components/primitive/Google3dTiles.vue";
-import Tileset from "@/components/primitive/Tileset.vue";
-import {getTilesetCartesian} from "@/utils/tileset.js";
-
-let moonLocation = await getTilesetCartesian()
 
 </script>
 
-<template>
-  <Tileset  :tilesetCartesian="moonLocation" :assetId="2684829"/>
+<template >
+  <Moon/>
 </template>
diff --git a/src/main.js b/src/main.js
index e26c3c4..a91ffc7 100644
--- a/src/main.js
+++ b/src/main.js
@@ -8,5 +8,6 @@ import lang from 'vue-cesium/es/locale/lang/en-us.mjs';
 const app = createApp(App)
 app.mount('#app')
 app.use(VueCesium,{
+    accessToken: import.meta.env.VITE_CESIUM_ACCESS_TOKEN,
     locale: lang
 })
diff --git a/src/utils/scene.js b/src/utils/scene.js
index c1e9cee..d9c1fea 100644
--- a/src/utils/scene.js
+++ b/src/utils/scene.js
@@ -1,4 +1,11 @@
 export async function prepareScene(scene){
+    //------------Uncomment if performance is low---------------------
+    // scene.requestRenderMode = true; // Ne rendu que si nécessaire
+    // scene.maximumRenderTimeChange = Infinity;
+    // scene.globe.maximumScreenSpaceError = 24; // AUGMENTE CETTE VALEUR (16 à 32) pour réduire les requêtes
+    // scene.globe.tileCacheSize = 1000;
+    // scene.globe.preloadAncestors = false;
+    // scene.globe.loadingDescendantLimit = 20;
     scene.primitives.removeAll();
     scene.contextOptions = {
         allowTextureFilterAnisotropic: false,
@@ -19,3 +26,102 @@ export function addTilesetToScene(scene, tileset){
 export function removeMoving(scene){
     scene.screenSpaceCameraController.enableRotate = false;
 }
+export async function loadPlanes(viewer){
+
+    const url = "https://opensky-network.org/api/states/all?lamin=46.5&lomin=6.5&lamax=47.5&lomax=7.5";
+    const airplaneUri = await Cesium.IonResource.fromAssetId(4359085);
+    const response = await fetch(url);
+    const data = {
+        time: 1768771804,
+        states: [
+            ["4952d0", "TAP556  ", "Portugal", 1768771803, 1768771804, 7.0329, 46.6013, 11582.48, false, 217.97, 60.29, 0, null, 11490.96, "2276", false, 0],
+            ["3c65c8", "DLH44X  ", "Germany", 1768771803, 1768771803, 7.3766, 46.8955, 11871.96, false, 220.15, 239.84, 0, null, 11772.9, "1000", false, 0],
+            ["440036", "EJU47NM ", "Austria", 1768771803, 1768771803, 7.4283, 47.0293, 7917.18, false, 210.5, 231.45, 9.43, null, 7962.9, "3062", false, 0],
+            ["4b027c", "EJU58HR ", "Switzerland", 1768771803, 1768771803, 7.2721, 46.9609, 4800.6, false, 174.94, 1.0, -7.8, null, 4892.04, "1000", false, 0]
+        ]
+    };
+    // const data = await response.json();
+    const formattedFlights = data.states.map(flight => {
+        return {
+            callsign: flight[1].trim(), // Nom de l'avion
+            longitude: flight[5],             // Longitude
+            latitude: flight[6],             // Latitude
+            height: flight[7]           // Hauteur (Altitude)
+        };
+    });
+
+
+    const osmBuildings = await Cesium.createOsmBuildingsAsync();
+    viewer.scene.primitives.add(osmBuildings);
+
+    // const flightData = JSON.parse(
+    //     '[{"longitude":-122.39053,"latitude":37.61779,"height":-27.32},{"longitude":-122.39035,"latitude":37.61803,"height":-27.32},{"longitude":-122.39019,"latitude":37.61826,"height":-27.32},{"longitude":-122.39006,"latitude":37.6185,"height":-27.32},{"longitude":-122.38985,"latitude":37.61864,"height":-27.32},{"longitude":-122.39005,"latitude":37.61874,"height":-27.32},{"longitude":-122.39027,"latitude":37.61884,"height":-27.32},{"longitude":-122.39057,"latitude":37.61898,"height":-27.32},{"longitude":-122.39091,"latitude":37.61912,"height":-27.32},{"longitude":-122.39121,"latitude":37.61926,"height":-27.32},{"longitude":-122.39153,"latitude":37.61937,"height":-27.32},{"longitude":-122.39175,"latitude":37.61948,"height":-27.32},{"longitude":-122.39207,"latitude":37.6196,"height":-27.32},{"longitude":-122.39247,"latitude":37.61983,"height":-27.32},{"longitude":-122.39253,"latitude":37.62005,"height":-27.32},{"longitude":-122.39226,"latitude":37.62048,"height":-27.32},{"longitude":-122.39207,"latitude":37.62075,"height":-27.32},{"longitude":-122.39186,"latitude":37.62106,"height":-27.32},{"longitude":-122.39172,"latitude":37.62127,"height":-27.32},{"longitude":-122.39141,"latitude":37.62174,"height":-27.32},{"longitude":-122.39097,"latitude":37.62227,"height":-27.32},{"longitude":-122.39061,"latitude":37.6224,"height":-27.31},{"longitude":-122.39027,"latitude":37.62249,"height":-27.31},{"longitude":-122.38993,"latitude":37.62256,"height":-27.31},{"longitude":-122.3895,"latitude":37.62267,"height":-27.31},{"longitude":-122.3889,"latitude":37.62256,"height":-27.31},{"longitude":-122.38854,"latitude":37.62242,"height":-27.31},{"longitude":-122.38814,"latitude":37.62225,"height":-27.31},{"longitude":-122.38778,"latitude":37.62209,"height":-27.31},{"longitude":-122.38744,"latitude":37.62195,"height":-27.31},{"longitude":-122.38671,"latitude":37.62164,"height":-27.31},{"longitude":-122.38638,"latitude":37.62151,"height":-27.31},{"longitude":-122.38604,"latitude":37.62136,"height":-27.31},{"longitude":-122.38571,"latitude":37.62123,"height":-27.31},{"longitude":-122.38512,"latitude":37.62098,"height":-27.31},{"longitude":-122.3848,"latitude":37.62084,"height":-27.31},{"longitude":-122.38453,"latitude":37.62074,"height":-27.31},{"longitude":-122.38425,"latitude":37.62062,"height":-27.3},{"longitude":-122.38397,"latitude":37.62049,"height":-27.3},{"longitude":-122.38372,"latitude":37.62039,"height":-27.3},{"longitude":-122.3835,"latitude":37.6203,"height":-27.3},{"longitude":-122.38324,"latitude":37.62019,"height":-27.3},{"longitude":-122.38271,"latitude":37.61996,"height":-27.3},{"longitude":-122.38248,"latitude":37.61986,"height":-27.3},{"longitude":-122.38191,"latitude":37.61962,"height":-27.3},{"longitude":-122.38159,"latitude":37.6195,"height":-27.3},{"longitude":-122.38126,"latitude":37.61935,"height":-27.3},{"longitude":-122.38058,"latitude":37.61906,"height":-27.3},{"longitude":-122.38026,"latitude":37.61894,"height":-27.3},{"longitude":-122.37955,"latitude":37.61863,"height":-27.3},{"longitude":-122.37913,"latitude":37.61847,"height":-27.3},{"longitude":-122.3781,"latitude":37.61813,"height":-27.3},{"longitude":-122.37763,"latitude":37.61799,"height":-27.29},{"longitude":-122.37663,"latitude":37.61768,"height":-27.29},{"longitude":-122.37617,"latitude":37.61753,"height":-27.29},{"longitude":-122.37561,"latitude":37.61736,"height":-27.29},{"longitude":-122.37532,"latitude":37.61727,"height":-27.29},{"longitude":-122.37506,"latitude":37.61718,"height":-27.29},{"longitude":-122.37468,"latitude":37.61704,"height":-27.29},{"longitude":-122.37436,"latitude":37.61689,"height":-27.29},{"longitude":-122.37402,"latitude":37.61674,"height":-27.29},{"longitude":-122.37362,"latitude":37.61657,"height":-27.29},{"longitude":-122.3732,"latitude":37.6164,"height":-27.29},{"longitude":-122.37235,"latitude":37.61604,"height":-27.29},{"longitude":-122.37198,"latitude":37.61588,"height":-27.29},{"longitude":-122.3716,"latitude":37.61573,"height":-27.28},{"longitude":-122.3712,"latitude":37.61555,"height":-27.28},{"longitude":-122.37032,"latitude":37.61518,"height":-27.28},{"longitude":-122.36938,"latitude":37.61476,"height":-27.28},{"longitude":-122.36872,"latitude":37.6143,"height":-27.28},{"longitude":-122.36811,"latitude":37.61387,"height":-27.28},{"longitude":-122.36747,"latitude":37.61352,"height":-27.28},{"longitude":-122.36672,"latitude":37.61321,"height":-27.28},{"longitude":-122.36602,"latitude":37.61292,"height":-27.28},{"longitude":-122.3655,"latitude":37.61269,"height":-27.28},{"longitude":-122.36498,"latitude":37.61247,"height":-27.27},{"longitude":-122.3639,"latitude":37.61203,"height":-27.27},{"longitude":-122.36337,"latitude":37.6118,"height":-27.27},{"longitude":-122.36254,"latitude":37.61146,"height":-27.27},{"longitude":-122.36203,"latitude":37.61124,"height":-27.27},{"longitude":-122.36154,"latitude":37.61103,"height":-27.27},{"longitude":-122.36106,"latitude":37.61082,"height":-27.27},{"longitude":-122.36029,"latitude":37.61052,"height":-27.27},{"longitude":-122.35989,"latitude":37.61048,"height":-27.27},{"longitude":-122.35953,"latitude":37.61055,"height":-27.27},{"longitude":-122.35922,"latitude":37.61074,"height":-27.26},{"longitude":-122.35893,"latitude":37.61117,"height":-27.26},{"longitude":-122.35875,"latitude":37.61144,"height":-27.26},{"longitude":-122.35865,"latitude":37.61171,"height":-27.26},{"longitude":-122.35889,"latitude":37.612,"height":-27.26},{"longitude":-122.35923,"latitude":37.61211,"height":-27.26},{"longitude":-122.35954,"latitude":37.61222,"height":-27.26},{"longitude":-122.36029,"latitude":37.61253,"height":-27.27},{"longitude":-122.36184,"latitude":37.61317,"height":-27.27},{"longitude":-122.36823,"latitude":37.61588,"height":-27.28},{"longitude":-122.37163,"latitude":37.61728,"height":-27.28},{"longitude":-122.38041,"latitude":37.62096,"height":-27.3},{"longitude":-122.38548,"latitude":37.6231,"height":-27.31},{"longitude":-122.3905,"latitude":37.6252,"height":10.79},{"longitude":-122.39517,"latitude":37.62721,"height":56.5},{"longitude":-122.40037,"latitude":37.62955,"height":125.07},{"longitude":-122.40507,"latitude":37.63171,"height":186.03},{"longitude":-122.41457,"latitude":37.63623,"height":292.69},{"longitude":-122.42428,"latitude":37.64062,"height":384.12},{"longitude":-122.42896,"latitude":37.64261,"height":429.83},{"longitude":-122.43398,"latitude":37.6447,"height":483.17},{"longitude":-122.44357,"latitude":37.64859,"height":582.21},{"longitude":-122.45319,"latitude":37.65243,"height":643.16},{"longitude":-122.4639,"latitude":37.65678,"height":719.35},{"longitude":-122.47395,"latitude":37.66081,"height":803.15},{"longitude":-122.47922,"latitude":37.66286,"height":841.25},{"longitude":-122.48441,"latitude":37.66489,"height":879.34},{"longitude":-122.49505,"latitude":37.66933,"height":970.77},{"longitude":-122.5003,"latitude":37.67162,"height":993.62},{"longitude":-122.51083,"latitude":37.67647,"height":1024.08},{"longitude":-122.51626,"latitude":37.67999,"height":1039.31},{"longitude":-122.52048,"latitude":37.68431,"height":1046.93},{"longitude":-122.52323,"latitude":37.68939,"height":1069.79},{"longitude":-122.52456,"latitude":37.69482,"height":1092.65},{"longitude":-122.5255,"latitude":37.70298,"height":1115.52},{"longitude":-122.52602,"latitude":37.70943,"height":1138.38},{"longitude":-122.52634,"latitude":37.71574,"height":1161.25},{"longitude":-122.51643,"latitude":37.73744,"height":1245.12},{"longitude":-122.50723,"latitude":37.74465,"height":1283.25},{"longitude":-122.50024,"latitude":37.74957,"height":1313.75},{"longitude":-122.4864,"latitude":37.75959,"height":1397.6},{"longitude":-122.47231,"latitude":37.77008,"height":1504.31},{"longitude":-122.45805,"latitude":37.78079,"height":1626.25},{"longitude":-122.44339,"latitude":37.79173,"height":1755.82},{"longitude":-122.42878,"latitude":37.80263,"height":1893.01},{"longitude":-122.41031,"latitude":37.81632,"height":2045.44},{"longitude":-122.39535,"latitude":37.82744,"height":2175},{"longitude":-122.3808,"latitude":37.8382,"height":2304.56},{"longitude":-122.36244,"latitude":37.85177,"height":2472.23},{"longitude":-122.34698,"latitude":37.86317,"height":2601.79},{"longitude":-122.33206,"latitude":37.87422,"height":2716.11},{"longitude":-122.31736,"latitude":37.88505,"height":2830.42},{"longitude":-122.29758,"latitude":37.89967,"height":2982.85},{"longitude":-122.28344,"latitude":37.91011,"height":3089.54},{"longitude":-122.2672,"latitude":37.9221,"height":3142.9},{"longitude":-122.25107,"latitude":37.93401,"height":3196.25},{"longitude":-122.235,"latitude":37.94586,"height":3241.98},{"longitude":-122.21102,"latitude":37.96354,"height":3318.19},{"longitude":-122.19532,"latitude":37.97507,"height":3386.77},{"longitude":-122.17095,"latitude":37.99296,"height":3523.94},{"longitude":-122.15459,"latitude":38.00497,"height":3630.63},{"longitude":-122.10188,"latitude":38.04364,"height":3927.88},{"longitude":-122.05068,"latitude":38.08113,"height":4247.98},{"longitude":-121.99834,"latitude":38.11944,"height":4552.84},{"longitude":-121.94544,"latitude":38.15803,"height":4842.46},{"longitude":-121.89173,"latitude":38.19722,"height":5116.83},{"longitude":-121.83744,"latitude":38.23672,"height":5368.34},{"longitude":-121.78076,"latitude":38.27786,"height":5619.88},{"longitude":-121.67054,"latitude":38.35774,"height":6001.09},{"longitude":-121.56262,"latitude":38.4366,"height":6488.97},{"longitude":-121.46884,"latitude":38.52786,"height":6984.57},{"longitude":-121.37305,"latitude":38.62742,"height":7442.27},{"longitude":-121.27969,"latitude":38.72305,"height":7869.52},{"longitude":-121.18384,"latitude":38.82103,"height":8114.16},{"longitude":-121.0849,"latitude":38.92167,"height":8419.92},{"longitude":-120.98819,"latitude":39.01978,"height":8664.74},{"longitude":-120.88629,"latitude":39.12269,"height":8917.28},{"longitude":-120.77951,"latitude":39.23016,"height":9108.83},{"longitude":-120.67163,"latitude":39.33836,"height":9376.26},{"longitude":-120.5672,"latitude":39.44264,"height":9612.99},{"longitude":-120.4577,"latitude":39.55152,"height":9910.45},{"longitude":-120.35071,"latitude":39.65748,"height":10040.03},{"longitude":-120.24274,"latitude":39.76404,"height":10040.03},{"longitude":-120.12367,"latitude":39.86746,"height":10040.02},{"longitude":-119.9956,"latitude":39.97069,"height":10040.05},{"longitude":-119.86682,"latitude":40.07272,"height":10040.2},{"longitude":-119.74329,"latitude":40.17004,"height":10040.38},{"longitude":-119.61475,"latitude":40.27084,"height":10040.57},{"longitude":-119.48225,"latitude":40.37425,"height":10040.77},{"longitude":-119.36212,"latitude":40.46764,"height":10040.95},{"longitude":-119.23717,"latitude":40.56432,"height":10041.15},{"longitude":-119.11108,"latitude":40.66152,"height":10041.4},{"longitude":-118.9834,"latitude":40.75946,"height":10041.66},{"longitude":-118.85547,"latitude":40.85713,"height":10041.97},{"longitude":-118.72528,"latitude":40.95625,"height":10042.26},{"longitude":-118.59631,"latitude":41.05385,"height":10042.52},{"longitude":-118.46595,"latitude":41.15213,"height":10042.76},{"longitude":-118.34192,"latitude":41.24524,"height":10042.98},{"longitude":-118.21114,"latitude":41.34295,"height":10043.29},{"longitude":-118.20084,"latitude":41.35063,"height":10043.32},{"longitude":-118.03749,"latitude":41.47218,"height":10043.8},{"longitude":-118.02363,"latitude":41.48293,"height":10043.85},{"longitude":-118.00575,"latitude":41.49732,"height":10043.91},{"longitude":-117.99279,"latitude":41.50822,"height":10043.95},{"longitude":-117.88224,"latitude":41.62019,"height":10044.46},{"longitude":-117.77487,"latitude":41.73303,"height":10044.97},{"longitude":-117.71091,"latitude":41.79902,"height":10045.22},{"longitude":-117.54896,"latitude":41.96512,"height":10045.77},{"longitude":-117.44167,"latitude":42.07448,"height":10046.02},{"longitude":-117.33009,"latitude":42.18782,"height":10046.24},{"longitude":-117.22356,"latitude":42.29567,"height":10046.47},{"longitude":-117.11202,"latitude":42.40792,"height":10046.72},{"longitude":-117.00414,"latitude":42.51599,"height":10047.01},{"longitude":-116.89089,"latitude":42.62896,"height":10047.23},{"longitude":-116.78223,"latitude":42.73691,"height":10047.44},{"longitude":-116.67059,"latitude":42.84728,"height":10047.47},{"longitude":-116.56448,"latitude":42.95175,"height":10047.46},{"longitude":-116.45987,"latitude":43.05432,"height":10047.4},{"longitude":-116.35005,"latitude":43.16137,"height":10047.34},{"longitude":-116.24506,"latitude":43.26334,"height":10047.36},{"longitude":-116.13922,"latitude":43.36574,"height":10047.47},{"longitude":-116.03102,"latitude":43.46997,"height":10047.65},{"longitude":-115.91975,"latitude":43.58192,"height":10047.9},{"longitude":-115.81421,"latitude":43.69277,"height":10048.15},{"longitude":-115.70801,"latitude":43.80258,"height":10048.42},{"longitude":-115.59547,"latitude":43.91822,"height":10048.71},{"longitude":-115.48815,"latitude":44.02803,"height":10048.97},{"longitude":-115.38025,"latitude":44.13795,"height":10049.29},{"longitude":-115.26595,"latitude":44.25382,"height":10049.57},{"longitude":-115.15695,"latitude":44.36372,"height":10049.78},{"longitude":-115.04876,"latitude":44.47243,"height":10049.92},{"longitude":-114.94008,"latitude":44.5811,"height":10049.96},{"longitude":-114.83057,"latitude":44.68991,"height":10049.93},{"longitude":-114.72199,"latitude":44.79744,"height":10049.89},{"longitude":-114.61474,"latitude":44.90318,"height":10049.86},{"longitude":-114.50775,"latitude":45.0081,"height":10049.83},{"longitude":-114.39586,"latitude":45.11742,"height":10049.89},{"longitude":-114.28724,"latitude":45.22288,"height":10049.95},{"longitude":-114.1452,"latitude":45.36018,"height":10050.06},{"longitude":-114.03063,"latitude":45.47031,"height":10050.15},{"longitude":-113.91023,"latitude":45.56812,"height":10050.28},{"longitude":-113.77957,"latitude":45.67081,"height":10050.45},{"longitude":-113.65418,"latitude":45.76769,"height":10050.63},{"longitude":-113.52166,"latitude":45.86923,"height":10050.8},{"longitude":-113.39298,"latitude":45.9674,"height":10050.95},{"longitude":-113.25732,"latitude":46.07053,"height":10051},{"longitude":-113.12656,"latitude":46.16925,"height":10050.95},{"longitude":-112.99599,"latitude":46.26736,"height":10050.88},{"longitude":-112.85692,"latitude":46.37138,"height":10050.79},{"longitude":-112.72378,"latitude":46.47044,"height":10050.7},{"longitude":-112.59017,"latitude":46.56935,"height":10050.71},{"longitude":-112.45451,"latitude":46.66919,"height":10050.75},{"longitude":-112.40219,"latitude":46.7075,"height":10050.75},{"longitude":-112.18308,"latitude":46.86731,"height":10050.72},{"longitude":-112.04336,"latitude":46.9686,"height":10050.62},{"longitude":-111.91223,"latitude":47.07069,"height":10050.47},{"longitude":-111.78719,"latitude":47.17534,"height":10050.26},{"longitude":-111.65659,"latitude":47.28245,"height":10050.09},{"longitude":-111.52737,"latitude":47.38783,"height":10049.95},{"longitude":-111.39635,"latitude":47.49399,"height":10049.81},{"longitude":-111.26383,"latitude":47.60092,"height":10049.73},{"longitude":-111.13261,"latitude":47.70612,"height":10049.56},{"longitude":-110.9972,"latitude":47.81413,"height":10049.38},{"longitude":-110.86276,"latitude":47.92076,"height":10049.15},{"longitude":-110.72704,"latitude":48.02771,"height":10048.89},{"longitude":-110.59324,"latitude":48.13269,"height":10048.71},{"longitude":-110.45213,"latitude":48.24274,"height":10048.51},{"longitude":-110.29809,"latitude":48.36214,"height":10048.31},{"longitude":-110.15818,"latitude":48.46991,"height":10048.12},{"longitude":-110.01434,"latitude":48.58001,"height":10047.89},{"longitude":-109.87766,"latitude":48.68405,"height":10047.65},{"longitude":-109.73201,"latitude":48.79427,"height":10047.4},{"longitude":-109.59253,"latitude":48.89912,"height":10047.26},{"longitude":-109.4451,"latitude":49.00946,"height":10047.11},{"longitude":-109.29828,"latitude":49.12085,"height":10047.1},{"longitude":-109.15861,"latitude":49.22635,"height":10047.09},{"longitude":-109.00909,"latitude":49.33844,"height":10047.04},{"longitude":-108.86092,"latitude":49.44878,"height":10046.98},{"longitude":-108.71825,"latitude":49.55443,"height":10046.88},{"longitude":-108.56899,"latitude":49.66429,"height":10046.72},{"longitude":-108.42393,"latitude":49.77044,"height":10046.57},{"longitude":-108.27145,"latitude":49.88123,"height":10046.36},{"longitude":-108.1247,"latitude":49.98719,"height":10046.11},{"longitude":-107.97197,"latitude":50.09683,"height":10045.75},{"longitude":-107.82331,"latitude":50.20291,"height":10045.33},{"longitude":-107.68083,"latitude":50.30452,"height":10044.86},{"longitude":-107.47946,"latitude":50.46744,"height":10044.09},{"longitude":-107.34006,"latitude":50.57956,"height":10043.61},{"longitude":-107.20117,"latitude":50.69032,"height":10043.17},{"longitude":-107.06024,"latitude":50.80199,"height":10042.81},{"longitude":-106.91856,"latitude":50.91358,"height":10042.53},{"longitude":-106.7762,"latitude":51.02502,"height":10042.3},{"longitude":-106.63352,"latitude":51.136,"height":10042.14},{"longitude":-106.48335,"latitude":51.25195,"height":10042},{"longitude":-106.33897,"latitude":51.36282,"height":10041.91},{"longitude":-106.19385,"latitude":51.47346,"height":10041.81},{"longitude":-106.05192,"latitude":51.58099,"height":10041.72},{"longitude":-105.89882,"latitude":51.69621,"height":10041.62},{"longitude":-105.75058,"latitude":51.80705,"height":10041.51},{"longitude":-105.60936,"latitude":51.91196,"height":10041.39},{"longitude":-105.45824,"latitude":52.02352,"height":10041.25},{"longitude":-105.30106,"latitude":52.13869,"height":10041.07},{"longitude":-105.14606,"latitude":52.25153,"height":10040.87},{"longitude":-104.99657,"latitude":52.35965,"height":10040.58},{"longitude":-104.83852,"latitude":52.47313,"height":10040.27},{"longitude":-104.68841,"latitude":52.58019,"height":10039.9},{"longitude":-104.5369,"latitude":52.68745,"height":10039.52},{"longitude":-104.38322,"latitude":52.79568,"height":10039.14},{"longitude":-104.36918,"latitude":52.80551,"height":10039.1},{"longitude":-104.14574,"latitude":52.96129,"height":10038.5},{"longitude":-104.08882,"latitude":53.00075,"height":10038.34},{"longitude":-103.66236,"latitude":53.29321,"height":10037.06},{"longitude":-103.50163,"latitude":53.40198,"height":10036.52},{"longitude":-103.34328,"latitude":53.50841,"height":10035.99},{"longitude":-103.18163,"latitude":53.61635,"height":10035.45},{"longitude":-103.01807,"latitude":53.72468,"height":10034.91},{"longitude":-102.85287,"latitude":53.83333,"height":10034.47},{"longitude":-102.6947,"latitude":53.93663,"height":10034.08},{"longitude":-102.67634,"latitude":53.94859,"height":10034.03},{"longitude":-102.48911,"latitude":54.06987,"height":10033.65},{"longitude":-102.2399,"latitude":54.22977,"height":10033.22},{"longitude":-102.07179,"latitude":54.33659,"height":10032.94},{"longitude":-101.89569,"latitude":54.44769,"height":10032.64},{"longitude":-101.70779,"latitude":54.56534,"height":10032.33},{"longitude":-101.63161,"latitude":54.61276,"height":10032.22},{"longitude":-100.99348,"latitude":55.0037,"height":10031.42},{"longitude":-100.81579,"latitude":55.11273,"height":10031.19},{"longitude":-100.63565,"latitude":55.22264,"height":10030.93},{"longitude":-100.44937,"latitude":55.33539,"height":10030.6},{"longitude":-100.2748,"latitude":55.44008,"height":10030.29},{"longitude":-100.0996,"latitude":55.54445,"height":10030},{"longitude":-99.92199,"latitude":55.64932,"height":10029.73},{"longitude":-99.74412,"latitude":55.75351,"height":10029.49},{"longitude":-99.56592,"latitude":55.85728,"height":10029.14},{"longitude":-99.39177,"latitude":55.95775,"height":10028.76},{"longitude":-99.21032,"latitude":56.0617,"height":10028.26},{"longitude":-99.03151,"latitude":56.16321,"height":10027.69},{"longitude":-98.85481,"latitude":56.26291,"height":10027.12},{"longitude":-98.75731,"latitude":56.3175,"height":10026.81},{"longitude":-92.14444,"latitude":59.53107,"height":10623.76},{"longitude":-91.9352,"latitude":59.61856,"height":10623.89},{"longitude":-91.7233,"latitude":59.7063,"height":10624.05},{"longitude":-91.50816,"latitude":59.79458,"height":10624.26},{"longitude":-91.29959,"latitude":59.87933,"height":10624.49},{"longitude":-91.08373,"latitude":59.96636,"height":10624.75},{"longitude":-90.88204,"latitude":60.06123,"height":10624.98},{"longitude":-90.70332,"latitude":60.17049,"height":10625.19},{"longitude":-90.51695,"latitude":60.27779,"height":10625.42},{"longitude":-90.33527,"latitude":60.38063,"height":10625.63},{"longitude":-90.149,"latitude":60.48518,"height":10625.84},{"longitude":-90.02708,"latitude":60.5532,"height":10625.97},{"longitude":-89.74967,"latitude":60.70626,"height":10626.24},{"longitude":-89.617,"latitude":60.77884,"height":10626.34},{"longitude":-87.30364,"latitude":61.97255,"height":10628.64},{"longitude":-59.43304,"latitude":68.13538,"height":10694.36},{"longitude":-59.06637,"latitude":68.17969,"height":10695.72},{"longitude":-58.69851,"latitude":68.22324,"height":10696.85},{"longitude":-58.32642,"latitude":68.26625,"height":10697.56},{"longitude":-57.95463,"latitude":68.30823,"height":10697.89},{"longitude":-57.58284,"latitude":68.34924,"height":10698.01},{"longitude":-57.21012,"latitude":68.38943,"height":10698.12},{"longitude":-56.83685,"latitude":68.42862,"height":10698.38},{"longitude":-56.46272,"latitude":68.46693,"height":10698.76},{"longitude":-56.08337,"latitude":68.50484,"height":10699.18},{"longitude":-55.70435,"latitude":68.54182,"height":10699.41},{"longitude":-55.31946,"latitude":68.57824,"height":10699.27},{"longitude":-54.92968,"latitude":68.61415,"height":10698.75},{"longitude":-54.5568,"latitude":68.64748,"height":10698.01},{"longitude":-54.16822,"latitude":68.6814,"height":10697.2},{"longitude":-53.78302,"latitude":68.71394,"height":10696.55},{"longitude":-53.39172,"latitude":68.7459,"height":10696.21},{"longitude":-52.99648,"latitude":68.77739,"height":10696.22},{"longitude":-52.60954,"latitude":68.80714,"height":10696.5},{"longitude":-52.21953,"latitude":68.83614,"height":10696.91},{"longitude":-51.83844,"latitude":68.86361,"height":10697.44},{"longitude":-51.44309,"latitude":68.89105,"height":10698.12},{"longitude":-51.04564,"latitude":68.91775,"height":10698.95},{"longitude":-50.65205,"latitude":68.94307,"height":10699.93},{"longitude":-50.26114,"latitude":68.96736,"height":10700.99},{"longitude":-49.862,"latitude":68.9873,"height":10702.1},{"longitude":-49.45413,"latitude":68.99833,"height":10703.2},{"longitude":-49.04689,"latitude":69.00851,"height":10704.25},{"longitude":-48.65419,"latitude":69.01737,"height":10705.2},{"longitude":-48.29727,"latitude":69.02459,"height":10706.04},{"longitude":-29.1449,"latitude":67.84658,"height":11341.65},{"longitude":-28.98855,"latitude":67.82117,"height":11341.68},{"longitude":-28.52525,"latitude":67.74468,"height":11341.68},{"longitude":-28.04757,"latitude":67.66386,"height":11341.81},{"longitude":-27.71401,"latitude":67.60634,"height":11342.03},{"longitude":-27.37356,"latitude":67.54655,"height":11342.31},{"longitude":-27.0469,"latitude":67.48827,"height":11342.56},{"longitude":-26.72125,"latitude":67.42923,"height":11342.67},{"longitude":-26.39715,"latitude":67.36942,"height":11342.64},{"longitude":-26.07518,"latitude":67.30913,"height":11342.52},{"longitude":-25.7552,"latitude":67.24829,"height":11342.39},{"longitude":-25.49839,"latitude":67.19872,"height":11342.44},{"longitude":-25.02888,"latitude":67.10655,"height":11342.85},{"longitude":-24.71243,"latitude":67.04324,"height":11343.37},{"longitude":-24.39717,"latitude":66.97925,"height":11343.99},{"longitude":-24.08335,"latitude":66.91452,"height":11344.62},{"longitude":-23.77346,"latitude":66.84965,"height":11345.14},{"longitude":-23.46293,"latitude":66.78374,"height":11345.54},{"longitude":-23.15693,"latitude":66.71787,"height":11345.83},{"longitude":-22.84894,"latitude":66.65057,"height":11346.07},{"longitude":-22.54657,"latitude":66.58357,"height":11346.3},{"longitude":-22.24051,"latitude":66.51475,"height":11346.53},{"longitude":-21.94095,"latitude":66.44648,"height":11346.77},{"longitude":-21.64486,"latitude":66.37798,"height":11347},{"longitude":-21.34827,"latitude":66.30853,"height":11347.2},{"longitude":-21.05129,"latitude":66.23799,"height":11347.38},{"longitude":-20.76073,"latitude":66.168,"height":11347.56},{"longitude":-20.46514,"latitude":66.09585,"height":11347.79},{"longitude":-20.17269,"latitude":66.02355,"height":11348.04},{"longitude":-19.8698,"latitude":65.9599,"height":11348.29},{"longitude":-19.54587,"latitude":65.91103,"height":11348.51},{"longitude":-19.22667,"latitude":65.86047,"height":11348.73},{"longitude":-18.90771,"latitude":65.8089,"height":11348.91},{"longitude":-18.5854,"latitude":65.75574,"height":11349.05},{"longitude":-18.26923,"latitude":65.70277,"height":11349.11},{"longitude":-17.94079,"latitude":65.64685,"height":11349.12},{"longitude":-17.62601,"latitude":65.59234,"height":11349.1},{"longitude":-17.31125,"latitude":65.53702,"height":11349.04},{"longitude":-16.99459,"latitude":65.48039,"height":11348.95},{"longitude":-16.68549,"latitude":65.42427,"height":11348.86},{"longitude":-16.37524,"latitude":65.36705,"height":11348.81},{"longitude":-16.07058,"latitude":65.31001,"height":11348.81},{"longitude":-15.76197,"latitude":65.25128,"height":11348.82},{"longitude":-15.45353,"latitude":65.19176,"height":11348.76},{"longitude":-15.1474,"latitude":65.1318,"height":11348.59},{"longitude":-14.84413,"latitude":65.07147,"height":11348.29},{"longitude":-14.5448,"latitude":65.01105,"height":11347.88},{"longitude":-14.23416,"latitude":64.9474,"height":11347.31},{"longitude":-13.92803,"latitude":64.88374,"height":11346.75},{"longitude":-13.63037,"latitude":64.82101,"height":11346.29},{"longitude":-13.33048,"latitude":64.75685,"height":11345.94},{"longitude":-13.03505,"latitude":64.69281,"height":11345.71},{"longitude":-12.74288,"latitude":64.62856,"height":11345.56},{"longitude":-12.4541,"latitude":64.56418,"height":11345.46},{"longitude":-12.16604,"latitude":64.49899,"height":11345.34},{"longitude":-11.86913,"latitude":64.43105,"height":11345.14},{"longitude":-11.61442,"latitude":64.37192,"height":11344.91},{"longitude":-10.65684,"latitude":64.14345,"height":11343.62},{"longitude":-10.36856,"latitude":64.07259,"height":11343.14},{"longitude":-10.08732,"latitude":64.00272,"height":11342.68},{"longitude":-9.80299,"latitude":63.93689,"height":11342.26},{"longitude":-9.51532,"latitude":63.87328,"height":11341.9},{"longitude":-9.2317,"latitude":63.80892,"height":11341.63},{"longitude":-8.94171,"latitude":63.74226,"height":11341.42},{"longitude":-8.68986,"latitude":63.68351,"height":11341.25},{"longitude":-8.68986,"latitude":63.68351,"height":11341.25},{"longitude":-8.68986,"latitude":63.68351,"height":11341.25},{"longitude":-7.92336,"latitude":63.50079,"height":11340.42},{"longitude":-7.64275,"latitude":63.43227,"height":11339.93},{"longitude":-7.3626,"latitude":63.36295,"height":11339.44},{"longitude":-7.07893,"latitude":63.29186,"height":11338.96},{"longitude":-6.79746,"latitude":63.22041,"height":11338.59},{"longitude":-6.51996,"latitude":63.14909,"height":11338.35},{"longitude":-6.2396,"latitude":63.07619,"height":11338.19},{"longitude":-5.96405,"latitude":63.00343,"height":11338.03},{"longitude":-5.68573,"latitude":62.92918,"height":11337.78},{"longitude":-5.41433,"latitude":62.8559,"height":11337.48},{"longitude":-5.14192,"latitude":62.78137,"height":11337.16},{"longitude":-4.87172,"latitude":62.70662,"height":11336.81},{"longitude":-4.59666,"latitude":62.62958,"height":11336.46},{"longitude":-4.32555,"latitude":62.55266,"height":11336.15},{"longitude":-4.05406,"latitude":62.47478,"height":11335.77},{"longitude":-3.78426,"latitude":62.39643,"height":11335.2},{"longitude":-3.51362,"latitude":62.31692,"height":11334.51},{"longitude":-3.23642,"latitude":62.23443,"height":11333.7},{"longitude":-2.95807,"latitude":62.15054,"height":11332.93},{"longitude":-2.68351,"latitude":62.0668,"height":11332.33},{"longitude":-2.40287,"latitude":61.98033,"height":11331.99},{"longitude":-2.12929,"latitude":61.89487,"height":11332.02},{"longitude":-1.85286,"latitude":61.80753,"height":11332.24},{"longitude":-1.58244,"latitude":61.72105,"height":11332.59},{"longitude":-1.29796,"latitude":61.629,"height":11332.95},{"longitude":-0.99897,"latitude":61.53575,"height":11333.24},{"longitude":-0.72598,"latitude":61.44937,"height":11333.32},{"longitude":-0.4629,"latitude":61.36505,"height":11333.18},{"longitude":-0.20344,"latitude":61.28091,"height":11332.86},{"longitude":0.06082,"latitude":61.19394,"height":11332.32},{"longitude":0.30075,"latitude":61.10381,"height":11331.7},{"longitude":0.55559,"latitude":61.00829,"height":11331.04},{"longitude":0.80816,"latitude":60.91292,"height":11330.49},{"longitude":1.05645,"latitude":60.81812,"height":11330.09},{"longitude":1.20163,"latitude":60.76212,"height":11329.93},{"longitude":1.55545,"latitude":60.62428,"height":11329.72},{"longitude":1.7891,"latitude":60.53211,"height":11329.61},{"longitude":2.11271,"latitude":60.40288,"height":11329.37},{"longitude":2.34208,"latitude":60.31018,"height":11329.1},{"longitude":2.58365,"latitude":60.2115,"height":11328.73},{"longitude":2.82178,"latitude":60.11334,"height":11328.3},{"longitude":3.05901,"latitude":60.01431,"height":11327.89},{"longitude":3.30066,"latitude":59.91238,"height":11327.52},{"longitude":3.54318,"latitude":59.80911,"height":11327.27},{"longitude":3.81699,"latitude":59.69128,"height":11327.18},{"longitude":4.04382,"latitude":59.59264,"height":11327.21},{"longitude":4.26781,"latitude":59.49413,"height":11327.28},{"longitude":4.48981,"latitude":59.39563,"height":11327.33},{"longitude":4.71266,"latitude":59.29577,"height":11327.27},{"longitude":4.9339,"latitude":59.19569,"height":11327.12},{"longitude":5.15121,"latitude":59.09647,"height":11326.93},{"longitude":5.369,"latitude":58.99593,"height":11326.76},{"longitude":5.58712,"latitude":58.89445,"height":11326.64},{"longitude":5.80106,"latitude":58.79399,"height":11326.63},{"longitude":6.01209,"latitude":58.69382,"height":11326.61},{"longitude":6.22302,"latitude":58.59279,"height":11326.54},{"longitude":6.43561,"latitude":58.49014,"height":11326.41},{"longitude":6.64318,"latitude":58.38904,"height":11326.06},{"longitude":6.85901,"latitude":58.28279,"height":11325.58},{"longitude":7.06518,"latitude":58.18048,"height":11325.08},{"longitude":7.33904,"latitude":58.04292,"height":11324.34},{"longitude":7.54349,"latitude":57.93929,"height":11323.87},{"longitude":7.75497,"latitude":57.83101,"height":11323.44},{"longitude":7.96483,"latitude":57.72258,"height":11323.05},{"longitude":8.21414,"latitude":57.59252,"height":11322.7},{"longitude":8.41748,"latitude":57.48535,"height":11322.44},{"longitude":8.61745,"latitude":57.3788,"height":11322.24},{"longitude":8.82158,"latitude":57.26926,"height":11322.04},{"longitude":8.97506,"latitude":57.19446,"height":11321.91},{"longitude":9.00507,"latitude":57.18388,"height":11321.88},{"longitude":9.26585,"latitude":57.09398,"height":10613},{"longitude":9.50849,"latitude":57.00964,"height":9820.32},{"longitude":9.78744,"latitude":56.91142,"height":9141.98},{"longitude":10.01519,"latitude":56.83041,"height":8555.11},{"longitude":10.23368,"latitude":56.75202,"height":8044.42},{"longitude":10.44206,"latitude":56.67646,"height":7510.89},{"longitude":10.6392,"latitude":56.6044,"height":6977.33},{"longitude":10.83072,"latitude":56.53383,"height":6359.92},{"longitude":11.00705,"latitude":56.4684,"height":5826.32},{"longitude":11.18348,"latitude":56.4025,"height":5368.92},{"longitude":11.27506,"latitude":56.36806,"height":5224.04},{"longitude":11.35806,"latitude":56.33677,"height":5223.95},{"longitude":11.43522,"latitude":56.30759,"height":5223.86},{"longitude":11.51525,"latitude":56.27714,"height":5200.91},{"longitude":11.6019,"latitude":56.2441,"height":4804.58},{"longitude":11.69271,"latitude":56.20927,"height":4347.29},{"longitude":11.77829,"latitude":56.17645,"height":4034.79},{"longitude":11.86415,"latitude":56.14343,"height":3806.12},{"longitude":11.94858,"latitude":56.11081,"height":3524.1},{"longitude":11.9781,"latitude":56.0994,"height":3394.53},{"longitude":12.00814,"latitude":56.08772,"height":3295.44},{"longitude":12.03852,"latitude":56.07591,"height":3196.35},{"longitude":12.06931,"latitude":56.06392,"height":3142.99},{"longitude":12.09844,"latitude":56.05261,"height":3120.1},{"longitude":12.12674,"latitude":56.04163,"height":3097.22},{"longitude":12.15362,"latitude":56.03114,"height":3074.33},{"longitude":12.18075,"latitude":56.02059,"height":3051.45},{"longitude":12.20744,"latitude":56.01016,"height":3028.56},{"longitude":12.23328,"latitude":56.00001,"height":2998.06},{"longitude":12.25825,"latitude":55.99019,"height":2944.7},{"longitude":12.28366,"latitude":55.98023,"height":2868.48},{"longitude":12.30761,"latitude":55.97082,"height":2746.55},{"longitude":12.33224,"latitude":55.96115,"height":2616.99},{"longitude":12.35754,"latitude":55.95117,"height":2472.19},{"longitude":12.38201,"latitude":55.94156,"height":2335.01},{"longitude":12.41163,"latitude":55.9299,"height":2190.21},{"longitude":12.43567,"latitude":55.92041,"height":2053.03},{"longitude":12.46058,"latitude":55.91052,"height":1938.7},{"longitude":12.48321,"latitude":55.90156,"height":1824.38},{"longitude":12.50836,"latitude":55.89155,"height":1694.82},{"longitude":12.53124,"latitude":55.88246,"height":1595.74},{"longitude":12.5542,"latitude":55.87334,"height":1504.28},{"longitude":12.56703,"latitude":55.86827,"height":1458.55},{"longitude":12.58939,"latitude":55.85938,"height":1351.85},{"longitude":12.60165,"latitude":55.85454,"height":1306.12},{"longitude":12.62398,"latitude":55.84569,"height":1214.66},{"longitude":12.63316,"latitude":55.84206,"height":1176.55},{"longitude":12.64551,"latitude":55.83714,"height":1130.81},{"longitude":12.66682,"latitude":55.82863,"height":1062.21},{"longitude":12.68605,"latitude":55.82094,"height":1016.47},{"longitude":12.70785,"latitude":55.81224,"height":955.49},{"longitude":12.72658,"latitude":55.80473,"height":924.99},{"longitude":12.73615,"latitude":55.80093,"height":902.12},{"longitude":12.74526,"latitude":55.79728,"height":871.63},{"longitude":12.76362,"latitude":55.78995,"height":841.13},{"longitude":12.77244,"latitude":55.78638,"height":818.26},{"longitude":12.78259,"latitude":55.78234,"height":795.39},{"longitude":12.80016,"latitude":55.7753,"height":734.41},{"longitude":12.80954,"latitude":55.77102,"height":703.92},{"longitude":12.81495,"latitude":55.7673,"height":673.43},{"longitude":12.82013,"latitude":55.76074,"height":642.94},{"longitude":12.81747,"latitude":55.7384,"height":612.43},{"longitude":12.8148,"latitude":55.73186,"height":597.19},{"longitude":12.81186,"latitude":55.72503,"height":597.18},{"longitude":12.80388,"latitude":55.71316,"height":597.17},{"longitude":12.78018,"latitude":55.69752,"height":581.93},{"longitude":12.77219,"latitude":55.69258,"height":536.21},{"longitude":12.7571,"latitude":55.68304,"height":475.24},{"longitude":12.75097,"latitude":55.67903,"height":429.52},{"longitude":12.727,"latitude":55.66365,"height":307.61},{"longitude":12.6853,"latitude":55.63683,"height":86.64},{"longitude":12.64044,"latitude":55.60784,"height":40.93},{"longitude":12.63927,"latitude":55.60707,"height":40.93},{"longitude":12.63853,"latitude":55.60685,"height":40.93},{"longitude":12.63777,"latitude":55.60692,"height":40.93},{"longitude":12.63715,"latitude":55.60722,"height":40.93},{"longitude":12.63595,"latitude":55.6083,"height":40.94},{"longitude":12.6364,"latitude":55.60869,"height":40.94},{"longitude":12.63698,"latitude":55.60918,"height":40.94},{"longitude":12.63788,"latitude":55.60994,"height":40.94},{"longitude":12.63842,"latitude":55.61042,"height":40.94},{"longitude":12.63904,"latitude":55.61097,"height":40.93},{"longitude":12.64046,"latitude":55.6122,"height":40.93},{"longitude":12.64114,"latitude":55.61282,"height":40.93},{"longitude":12.64187,"latitude":55.61343,"height":40.93},{"longitude":12.64267,"latitude":55.61413,"height":40.93},{"longitude":12.64345,"latitude":55.61482,"height":40.93},{"longitude":12.64487,"latitude":55.61603,"height":40.93},{"longitude":12.64535,"latitude":55.61645,"height":40.93},{"longitude":12.64568,"latitude":55.61689,"height":40.93},{"longitude":12.64554,"latitude":55.61756,"height":40.93},{"longitude":12.64539,"latitude":55.61799,"height":40.93},{"longitude":12.6452,"latitude":55.61862,"height":40.93},{"longitude":12.64503,"latitude":55.61921,"height":40.94},{"longitude":12.64507,"latitude":55.61959,"height":40.94},{"longitude":12.64531,"latitude":55.61997,"height":40.94},{"longitude":12.6457,"latitude":55.62033,"height":40.94},{"longitude":12.64616,"latitude":55.62074,"height":40.94},{"longitude":12.64662,"latitude":55.62112,"height":40.94},{"longitude":12.64732,"latitude":55.62171,"height":40.93},{"longitude":12.64784,"latitude":55.62218,"height":40.93},{"longitude":12.64791,"latitude":55.62269,"height":40.94},{"longitude":12.64786,"latitude":55.62305,"height":40.94},{"longitude":12.64782,"latitude":55.62333,"height":40.94},{"longitude":12.6478,"latitude":55.62367,"height":40.94},{"longitude":12.64776,"latitude":55.62396,"height":40.94},{"longitude":12.64774,"latitude":55.62442,"height":40.94},{"longitude":12.64774,"latitude":55.62472,"height":40.94},{"longitude":12.64788,"latitude":55.62494,"height":40.94},{"longitude":12.6483,"latitude":55.62496,"height":40.94},{"longitude":12.64852,"latitude":55.62494,"height":40.94},{"longitude":12.64878,"latitude":55.62493,"height":40.94},{"longitude":12.64904,"latitude":55.62492,"height":40.94},{"longitude":12.64928,"latitude":55.62491,"height":40.94},{"longitude":12.64936,"latitude":55.6249,"height":40.94},{"longitude":12.64949,"latitude":55.62442,"height":40.94},{"longitude":12.64936,"latitude":55.6247,"height":40.94}]'
+    // );
+
+    /* Initialize the viewer clock:
+      Assume the radar samples are 30 seconds apart, and calculate the entire flight duration based on that assumption.
+      Get the start and stop date times of the flight, where the start is the known flight departure time (converted from PST
+        to UTC) and the stop is the start plus the calculated duration. (Note that Cesium uses Julian dates. See
+        https://simple.wikipedia.org/wiki/Julian_day.)
+      Initialize the viewer's clock by setting its start and stop to the flight start and stop times we just calculated.
+      Also, set the viewer's current time to the start time and take the user to that time.
+    */
+    const timeStepInSeconds = 30;
+    // const totalSeconds = timeStepInSeconds * (flightData.length - 1);
+    const start = Cesium.JulianDate.now();
+    const stop = Cesium.JulianDate.addSeconds(start, 10000000000, new Cesium.JulianDate());
+
+    viewer.clock.startTime = start.clone();
+    // viewer.clock.stopTime = stop.clone();
+    viewer.clock.currentTime = start.clone();
+
+    // viewer.timeline.zoomTo(start, stop);
+    // Speed up the playback speed 50x.
+    viewer.clock.multiplier = 2;
+    // Start playing the scene.
+    viewer.clock.shouldAnimate = true;
+
+    // The SampledPositionedProperty stores the position and timestamp for each sample along the radar sample series.
+
+    for (let i = 0; i < formattedFlights.length; i++) {
+        const positionProperty = new Cesium.SampledPositionProperty();
+
+        const dataPoint = formattedFlights[i];
+
+        // Declare the time for this individual sample and store it in a new JulianDate instance.
+        const time = Cesium.JulianDate.addSeconds(start, i * timeStepInSeconds, new Cesium.JulianDate());
+
+        const position = Cesium.Cartesian3.fromDegrees(dataPoint.longitude, dataPoint.latitude, dataPoint.height);
+        // Store the position along with its timestamp.
+        // Here we add the positions all upfront, but these can be added at run-time as samples are received from a server.
+        positionProperty.addSample(time, position);
+
+        viewer.entities.add({
+            description: `Location: (${dataPoint.longitude}, ${dataPoint.latitude}, ${dataPoint.height})`,
+            position: position,
+            point: { pixelSize: 10, color: Cesium.Color.RED }
+        });
+
+           await loadModel(viewer, start, stop, position, airplaneUri);
+
+    }
+
+
+
+}
+
+async function loadModel(viewer, start, stop, positionProperty, airplaneUri) {
+    // Load the glTF model from Cesium ion.
+    const airplaneEntity = viewer.entities.add({
+        // availability: new Cesium.TimeIntervalCollection([ new Cesium.TimeInterval({ start: start, stop: stop }) ]),
+        position: positionProperty,
+        // Attach the 3D model instead of the green point.
+        model: { uri: airplaneUri,minimumPixelSize: 200  },
+        // Automatically compute the orientation from the position.
+        // orientation: new Cesium.VelocityOrientationProperty(positionProperty),
+        path: new Cesium.PathGraphics({ width: 3 })
+    });
+
+    // viewer.trackedEntity = airplaneEntity;
+}
+
diff --git a/src/utils/tileset.js b/src/utils/tileset.js
index 00a6def..178363b 100644
--- a/src/utils/tileset.js
+++ b/src/utils/tileset.js
@@ -3,5 +3,5 @@ export async function get3dTilesetById(id) {
 }
 
 export async function getTilesetCartesian(){
-    return {x:-29,y: 8, z:25}
-}
\ No newline at end of file
+    return {x:-24,y: 12, z:45}
+}

From ca0da6fe5e7e656b0e53a4cb9650ea3650374b35 Mon Sep 17 00:00:00 2001
From: Joris Bailly <90181523+JorisBly@users.noreply.github.com>
Date: Tue, 20 Jan 2026 07:35:52 +0100
Subject: [PATCH 22/61] fix(): Fix import (#39)

---
 src/components/Viewer.vue | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index 0beec6f..edb7ae3 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -3,11 +3,9 @@ import {VcViewer} from "vue-cesium";
 import {ref, watch} from "vue";
 import {loadPlanes, prepareScene, removeMoving} from "@/utils/scene.js";
 import Imagery from "@/components/imagery/Imagery.vue";
-import Tilesets from "@/components/primitive/Tilesets.vue";
 import {flyTo} from "@/utils/camera.js";
 import Navigation from "@/components/navigation/Navigation.vue";
 import Terrain from "@/components/terrain/Terrain.vue";
-import Dynamic from "@/components/Overlay/Dynamic.vue";
 
 const viewerRef = ref(null)
 const isViewerReady = ref(false)

From 943f50f4dbe595467b2073d1bf98c3022d99a0ca Mon Sep 17 00:00:00 2001
From: Joris Bailly <90181523+JorisBly@users.noreply.github.com>
Date: Tue, 20 Jan 2026 11:06:11 +0100
Subject: [PATCH 23/61] Feature/moon as entities (#44)

* feat(): Make moon as a entity

* feat(): Call new Moon.vue

* feat(): Call component Moon.vue
---
 src/components/Viewer.vue         | 12 ++---
 src/components/primitive/Moon.vue | 76 +++++++++++++++----------------
 src/utils/scene.js                |  7 +--
 3 files changed, 41 insertions(+), 54 deletions(-)

diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index edb7ae3..c9ff17b 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -6,6 +6,7 @@ import Imagery from "@/components/imagery/Imagery.vue";
 import {flyTo} from "@/utils/camera.js";
 import Navigation from "@/components/navigation/Navigation.vue";
 import Terrain from "@/components/terrain/Terrain.vue";
+import Moon from "@/components/primitive/Moon.vue";
 
 const viewerRef = ref(null)
 const isViewerReady = ref(false)
@@ -42,7 +43,7 @@ const onViewerReady = async ({Cesium, viewer}) => {
     try {
       if (Cesium) {
         await prepareScene(viewer.scene)
-        removeMoving(viewer.scene)
+        // removeMoving(viewer.scene)
       }
 
       flyTo(viewer.camera, Cesium, location.lat, location.lng)
@@ -73,14 +74,7 @@ const onViewerReady = async ({Cesium, viewer}) => {
           <Imagery/>
           <Terrain/>
           <Navigation/>
-<!--      <Dynamic/>-->
-<!--        <Suspense>-->
-<!--          <Tilesets/>-->
-<!--          <template #fallback>-->
-<!--            Loading...-->
-<!--          </template>-->
-<!--        </Suspense>-->
-
+      <Moon/>
     </template>
   </vc-viewer>
 
diff --git a/src/components/primitive/Moon.vue b/src/components/primitive/Moon.vue
index 524c8c5..5529b27 100644
--- a/src/components/primitive/Moon.vue
+++ b/src/components/primitive/Moon.vue
@@ -1,45 +1,41 @@
-<script setup>
-import {VcPrimitiveTileset} from "vue-cesium";
+<script setup >
+
+import {ref} from "vue";
+
+const point = ref(null)
+const label = ref(null)
+const billboard = ref(null)
+const cartographic = ref(null)
+const now = Cesium.JulianDate.now();
+const moonPos = Cesium.Simon1994PlanetaryPositions.computeMoonPositionInEarthInertialFrame(now);
+cartographic.value = Cesium.Cartographic.fromCartesian(moonPos);
+
+       point.value = {
+        pixelSize: 28,
+        color: 'blue'
+      }
+      label.value = {
+        text: 'Moon ',
+        pixelOffset: [0, 80]
+      }
+      billboard.value = {
+        image: 'https://zouyaoji.top/vue-cesium/favicon.png',
+        scale: 1
+      }
 
-const cesiumToken = import.meta.env.VITE_CESIUM_ACCESS_TOKEN;
-
-const onReady = ({ cesiumObject: tileset }) => {
-  const now = Cesium.JulianDate.now();
-  const moonPosInertial = Cesium.Simon1994PlanetaryPositions.computeMoonPositionInEarthInertialFrame(now);
-  const icrfToFixed = Cesium.Transforms.computeIcrfToFixedMatrix(now);
-  const moonPositionReal = new Cesium.Cartesian3();
-  if (Cesium.defined(icrfToFixed)) {
-    Cesium.Matrix3.multiplyByVector(icrfToFixed, moonPosInertial, moonPositionReal);
-  }
-
-  const cartographic = Cesium.Cartographic.fromCartesian(moonPositionReal);
-  const finalPosition = Cesium.Cartesian3.fromRadians(
-      cartographic.longitude,
-      cartographic.latitude,
-      150000
-  );
-  const translationMatrix = Cesium.Matrix4.fromTranslation(finalPosition)
-
-  const scaleFactor = 0.01
-  const scaleMatrix = Cesium.Matrix4.fromUniformScale(scaleFactor)
-  tileset.modelMatrix = Cesium.Matrix4.multiply(
-      translationMatrix,
-      scaleMatrix,
-      new Cesium.Matrix4()
-  )
-
-}
 </script>
-
 <template>
-  <vc-primitive-tileset
-      ref="primitive"
-      :assetId="2684829"
-      :accessToken="cesiumToken"
-      @ready="onReady"
-  ></vc-primitive-tileset>
+<!--  <el-row ref="viewerContainer" class="demo-viewer">-->
+      <vc-entity
+          ref="entity"
+
+          :position="{lng: cartographic.longitude, lat: cartographic.latitude, height: cartographic.height}"
+          :point="point"
+          :label="label"
+
+      >
+        <!-- :coordinates = "{ west: 130, south: 20, east: 80, north: 25 }" -->
+<!--        <vc-graphics-rectangle :coordinates="[130, 20, 80, 25]" material="green"></vc-graphics-rectangle>-->
+      </vc-entity>
 </template>
 
-<style scoped>
-
-</style>
\ No newline at end of file
diff --git a/src/utils/scene.js b/src/utils/scene.js
index d9c1fea..8f79ea2 100644
--- a/src/utils/scene.js
+++ b/src/utils/scene.js
@@ -52,11 +52,8 @@ export async function loadPlanes(viewer){
 
 
     const osmBuildings = await Cesium.createOsmBuildingsAsync();
-    viewer.scene.primitives.add(osmBuildings);
-
-    // const flightData = JSON.parse(
-    //     '[{"longitude":-122.39053,"latitude":37.61779,"height":-27.32},{"longitude":-122.39035,"latitude":37.61803,"height":-27.32},{"longitude":-122.39019,"latitude":37.61826,"height":-27.32},{"longitude":-122.39006,"latitude":37.6185,"height":-27.32},{"longitude":-122.38985,"latitude":37.61864,"height":-27.32},{"longitude":-122.39005,"latitude":37.61874,"height":-27.32},{"longitude":-122.39027,"latitude":37.61884,"height":-27.32},{"longitude":-122.39057,"latitude":37.61898,"height":-27.32},{"longitude":-122.39091,"latitude":37.61912,"height":-27.32},{"longitude":-122.39121,"latitude":37.61926,"height":-27.32},{"longitude":-122.39153,"latitude":37.61937,"height":-27.32},{"longitude":-122.39175,"latitude":37.61948,"height":-27.32},{"longitude":-122.39207,"latitude":37.6196,"height":-27.32},{"longitude":-122.39247,"latitude":37.61983,"height":-27.32},{"longitude":-122.39253,"latitude":37.62005,"height":-27.32},{"longitude":-122.39226,"latitude":37.62048,"height":-27.32},{"longitude":-122.39207,"latitude":37.62075,"height":-27.32},{"longitude":-122.39186,"latitude":37.62106,"height":-27.32},{"longitude":-122.39172,"latitude":37.62127,"height":-27.32},{"longitude":-122.39141,"latitude":37.62174,"height":-27.32},{"longitude":-122.39097,"latitude":37.62227,"height":-27.32},{"longitude":-122.39061,"latitude":37.6224,"height":-27.31},{"longitude":-122.39027,"latitude":37.62249,"height":-27.31},{"longitude":-122.38993,"latitude":37.62256,"height":-27.31},{"longitude":-122.3895,"latitude":37.62267,"height":-27.31},{"longitude":-122.3889,"latitude":37.62256,"height":-27.31},{"longitude":-122.38854,"latitude":37.62242,"height":-27.31},{"longitude":-122.38814,"latitude":37.62225,"height":-27.31},{"longitude":-122.38778,"latitude":37.62209,"height":-27.31},{"longitude":-122.38744,"latitude":37.62195,"height":-27.31},{"longitude":-122.38671,"latitude":37.62164,"height":-27.31},{"longitude":-122.38638,"latitude":37.62151,"height":-27.31},{"longitude":-122.38604,"latitude":37.62136,"height":-27.31},{"longitude":-122.38571,"latitude":37.62123,"height":-27.31},{"longitude":-122.38512,"latitude":37.62098,"height":-27.31},{"longitude":-122.3848,"latitude":37.62084,"height":-27.31},{"longitude":-122.38453,"latitude":37.62074,"height":-27.31},{"longitude":-122.38425,"latitude":37.62062,"height":-27.3},{"longitude":-122.38397,"latitude":37.62049,"height":-27.3},{"longitude":-122.38372,"latitude":37.62039,"height":-27.3},{"longitude":-122.3835,"latitude":37.6203,"height":-27.3},{"longitude":-122.38324,"latitude":37.62019,"height":-27.3},{"longitude":-122.38271,"latitude":37.61996,"height":-27.3},{"longitude":-122.38248,"latitude":37.61986,"height":-27.3},{"longitude":-122.38191,"latitude":37.61962,"height":-27.3},{"longitude":-122.38159,"latitude":37.6195,"height":-27.3},{"longitude":-122.38126,"latitude":37.61935,"height":-27.3},{"longitude":-122.38058,"latitude":37.61906,"height":-27.3},{"longitude":-122.38026,"latitude":37.61894,"height":-27.3},{"longitude":-122.37955,"latitude":37.61863,"height":-27.3},{"longitude":-122.37913,"latitude":37.61847,"height":-27.3},{"longitude":-122.3781,"latitude":37.61813,"height":-27.3},{"longitude":-122.37763,"latitude":37.61799,"height":-27.29},{"longitude":-122.37663,"latitude":37.61768,"height":-27.29},{"longitude":-122.37617,"latitude":37.61753,"height":-27.29},{"longitude":-122.37561,"latitude":37.61736,"height":-27.29},{"longitude":-122.37532,"latitude":37.61727,"height":-27.29},{"longitude":-122.37506,"latitude":37.61718,"height":-27.29},{"longitude":-122.37468,"latitude":37.61704,"height":-27.29},{"longitude":-122.37436,"latitude":37.61689,"height":-27.29},{"longitude":-122.37402,"latitude":37.61674,"height":-27.29},{"longitude":-122.37362,"latitude":37.61657,"height":-27.29},{"longitude":-122.3732,"latitude":37.6164,"height":-27.29},{"longitude":-122.37235,"latitude":37.61604,"height":-27.29},{"longitude":-122.37198,"latitude":37.61588,"height":-27.29},{"longitude":-122.3716,"latitude":37.61573,"height":-27.28},{"longitude":-122.3712,"latitude":37.61555,"height":-27.28},{"longitude":-122.37032,"latitude":37.61518,"height":-27.28},{"longitude":-122.36938,"latitude":37.61476,"height":-27.28},{"longitude":-122.36872,"latitude":37.6143,"height":-27.28},{"longitude":-122.36811,"latitude":37.61387,"height":-27.28},{"longitude":-122.36747,"latitude":37.61352,"height":-27.28},{"longitude":-122.36672,"latitude":37.61321,"height":-27.28},{"longitude":-122.36602,"latitude":37.61292,"height":-27.28},{"longitude":-122.3655,"latitude":37.61269,"height":-27.28},{"longitude":-122.36498,"latitude":37.61247,"height":-27.27},{"longitude":-122.3639,"latitude":37.61203,"height":-27.27},{"longitude":-122.36337,"latitude":37.6118,"height":-27.27},{"longitude":-122.36254,"latitude":37.61146,"height":-27.27},{"longitude":-122.36203,"latitude":37.61124,"height":-27.27},{"longitude":-122.36154,"latitude":37.61103,"height":-27.27},{"longitude":-122.36106,"latitude":37.61082,"height":-27.27},{"longitude":-122.36029,"latitude":37.61052,"height":-27.27},{"longitude":-122.35989,"latitude":37.61048,"height":-27.27},{"longitude":-122.35953,"latitude":37.61055,"height":-27.27},{"longitude":-122.35922,"latitude":37.61074,"height":-27.26},{"longitude":-122.35893,"latitude":37.61117,"height":-27.26},{"longitude":-122.35875,"latitude":37.61144,"height":-27.26},{"longitude":-122.35865,"latitude":37.61171,"height":-27.26},{"longitude":-122.35889,"latitude":37.612,"height":-27.26},{"longitude":-122.35923,"latitude":37.61211,"height":-27.26},{"longitude":-122.35954,"latitude":37.61222,"height":-27.26},{"longitude":-122.36029,"latitude":37.61253,"height":-27.27},{"longitude":-122.36184,"latitude":37.61317,"height":-27.27},{"longitude":-122.36823,"latitude":37.61588,"height":-27.28},{"longitude":-122.37163,"latitude":37.61728,"height":-27.28},{"longitude":-122.38041,"latitude":37.62096,"height":-27.3},{"longitude":-122.38548,"latitude":37.6231,"height":-27.31},{"longitude":-122.3905,"latitude":37.6252,"height":10.79},{"longitude":-122.39517,"latitude":37.62721,"height":56.5},{"longitude":-122.40037,"latitude":37.62955,"height":125.07},{"longitude":-122.40507,"latitude":37.63171,"height":186.03},{"longitude":-122.41457,"latitude":37.63623,"height":292.69},{"longitude":-122.42428,"latitude":37.64062,"height":384.12},{"longitude":-122.42896,"latitude":37.64261,"height":429.83},{"longitude":-122.43398,"latitude":37.6447,"height":483.17},{"longitude":-122.44357,"latitude":37.64859,"height":582.21},{"longitude":-122.45319,"latitude":37.65243,"height":643.16},{"longitude":-122.4639,"latitude":37.65678,"height":719.35},{"longitude":-122.47395,"latitude":37.66081,"height":803.15},{"longitude":-122.47922,"latitude":37.66286,"height":841.25},{"longitude":-122.48441,"latitude":37.66489,"height":879.34},{"longitude":-122.49505,"latitude":37.66933,"height":970.77},{"longitude":-122.5003,"latitude":37.67162,"height":993.62},{"longitude":-122.51083,"latitude":37.67647,"height":1024.08},{"longitude":-122.51626,"latitude":37.67999,"height":1039.31},{"longitude":-122.52048,"latitude":37.68431,"height":1046.93},{"longitude":-122.52323,"latitude":37.68939,"height":1069.79},{"longitude":-122.52456,"latitude":37.69482,"height":1092.65},{"longitude":-122.5255,"latitude":37.70298,"height":1115.52},{"longitude":-122.52602,"latitude":37.70943,"height":1138.38},{"longitude":-122.52634,"latitude":37.71574,"height":1161.25},{"longitude":-122.51643,"latitude":37.73744,"height":1245.12},{"longitude":-122.50723,"latitude":37.74465,"height":1283.25},{"longitude":-122.50024,"latitude":37.74957,"height":1313.75},{"longitude":-122.4864,"latitude":37.75959,"height":1397.6},{"longitude":-122.47231,"latitude":37.77008,"height":1504.31},{"longitude":-122.45805,"latitude":37.78079,"height":1626.25},{"longitude":-122.44339,"latitude":37.79173,"height":1755.82},{"longitude":-122.42878,"latitude":37.80263,"height":1893.01},{"longitude":-122.41031,"latitude":37.81632,"height":2045.44},{"longitude":-122.39535,"latitude":37.82744,"height":2175},{"longitude":-122.3808,"latitude":37.8382,"height":2304.56},{"longitude":-122.36244,"latitude":37.85177,"height":2472.23},{"longitude":-122.34698,"latitude":37.86317,"height":2601.79},{"longitude":-122.33206,"latitude":37.87422,"height":2716.11},{"longitude":-122.31736,"latitude":37.88505,"height":2830.42},{"longitude":-122.29758,"latitude":37.89967,"height":2982.85},{"longitude":-122.28344,"latitude":37.91011,"height":3089.54},{"longitude":-122.2672,"latitude":37.9221,"height":3142.9},{"longitude":-122.25107,"latitude":37.93401,"height":3196.25},{"longitude":-122.235,"latitude":37.94586,"height":3241.98},{"longitude":-122.21102,"latitude":37.96354,"height":3318.19},{"longitude":-122.19532,"latitude":37.97507,"height":3386.77},{"longitude":-122.17095,"latitude":37.99296,"height":3523.94},{"longitude":-122.15459,"latitude":38.00497,"height":3630.63},{"longitude":-122.10188,"latitude":38.04364,"height":3927.88},{"longitude":-122.05068,"latitude":38.08113,"height":4247.98},{"longitude":-121.99834,"latitude":38.11944,"height":4552.84},{"longitude":-121.94544,"latitude":38.15803,"height":4842.46},{"longitude":-121.89173,"latitude":38.19722,"height":5116.83},{"longitude":-121.83744,"latitude":38.23672,"height":5368.34},{"longitude":-121.78076,"latitude":38.27786,"height":5619.88},{"longitude":-121.67054,"latitude":38.35774,"height":6001.09},{"longitude":-121.56262,"latitude":38.4366,"height":6488.97},{"longitude":-121.46884,"latitude":38.52786,"height":6984.57},{"longitude":-121.37305,"latitude":38.62742,"height":7442.27},{"longitude":-121.27969,"latitude":38.72305,"height":7869.52},{"longitude":-121.18384,"latitude":38.82103,"height":8114.16},{"longitude":-121.0849,"latitude":38.92167,"height":8419.92},{"longitude":-120.98819,"latitude":39.01978,"height":8664.74},{"longitude":-120.88629,"latitude":39.12269,"height":8917.28},{"longitude":-120.77951,"latitude":39.23016,"height":9108.83},{"longitude":-120.67163,"latitude":39.33836,"height":9376.26},{"longitude":-120.5672,"latitude":39.44264,"height":9612.99},{"longitude":-120.4577,"latitude":39.55152,"height":9910.45},{"longitude":-120.35071,"latitude":39.65748,"height":10040.03},{"longitude":-120.24274,"latitude":39.76404,"height":10040.03},{"longitude":-120.12367,"latitude":39.86746,"height":10040.02},{"longitude":-119.9956,"latitude":39.97069,"height":10040.05},{"longitude":-119.86682,"latitude":40.07272,"height":10040.2},{"longitude":-119.74329,"latitude":40.17004,"height":10040.38},{"longitude":-119.61475,"latitude":40.27084,"height":10040.57},{"longitude":-119.48225,"latitude":40.37425,"height":10040.77},{"longitude":-119.36212,"latitude":40.46764,"height":10040.95},{"longitude":-119.23717,"latitude":40.56432,"height":10041.15},{"longitude":-119.11108,"latitude":40.66152,"height":10041.4},{"longitude":-118.9834,"latitude":40.75946,"height":10041.66},{"longitude":-118.85547,"latitude":40.85713,"height":10041.97},{"longitude":-118.72528,"latitude":40.95625,"height":10042.26},{"longitude":-118.59631,"latitude":41.05385,"height":10042.52},{"longitude":-118.46595,"latitude":41.15213,"height":10042.76},{"longitude":-118.34192,"latitude":41.24524,"height":10042.98},{"longitude":-118.21114,"latitude":41.34295,"height":10043.29},{"longitude":-118.20084,"latitude":41.35063,"height":10043.32},{"longitude":-118.03749,"latitude":41.47218,"height":10043.8},{"longitude":-118.02363,"latitude":41.48293,"height":10043.85},{"longitude":-118.00575,"latitude":41.49732,"height":10043.91},{"longitude":-117.99279,"latitude":41.50822,"height":10043.95},{"longitude":-117.88224,"latitude":41.62019,"height":10044.46},{"longitude":-117.77487,"latitude":41.73303,"height":10044.97},{"longitude":-117.71091,"latitude":41.79902,"height":10045.22},{"longitude":-117.54896,"latitude":41.96512,"height":10045.77},{"longitude":-117.44167,"latitude":42.07448,"height":10046.02},{"longitude":-117.33009,"latitude":42.18782,"height":10046.24},{"longitude":-117.22356,"latitude":42.29567,"height":10046.47},{"longitude":-117.11202,"latitude":42.40792,"height":10046.72},{"longitude":-117.00414,"latitude":42.51599,"height":10047.01},{"longitude":-116.89089,"latitude":42.62896,"height":10047.23},{"longitude":-116.78223,"latitude":42.73691,"height":10047.44},{"longitude":-116.67059,"latitude":42.84728,"height":10047.47},{"longitude":-116.56448,"latitude":42.95175,"height":10047.46},{"longitude":-116.45987,"latitude":43.05432,"height":10047.4},{"longitude":-116.35005,"latitude":43.16137,"height":10047.34},{"longitude":-116.24506,"latitude":43.26334,"height":10047.36},{"longitude":-116.13922,"latitude":43.36574,"height":10047.47},{"longitude":-116.03102,"latitude":43.46997,"height":10047.65},{"longitude":-115.91975,"latitude":43.58192,"height":10047.9},{"longitude":-115.81421,"latitude":43.69277,"height":10048.15},{"longitude":-115.70801,"latitude":43.80258,"height":10048.42},{"longitude":-115.59547,"latitude":43.91822,"height":10048.71},{"longitude":-115.48815,"latitude":44.02803,"height":10048.97},{"longitude":-115.38025,"latitude":44.13795,"height":10049.29},{"longitude":-115.26595,"latitude":44.25382,"height":10049.57},{"longitude":-115.15695,"latitude":44.36372,"height":10049.78},{"longitude":-115.04876,"latitude":44.47243,"height":10049.92},{"longitude":-114.94008,"latitude":44.5811,"height":10049.96},{"longitude":-114.83057,"latitude":44.68991,"height":10049.93},{"longitude":-114.72199,"latitude":44.79744,"height":10049.89},{"longitude":-114.61474,"latitude":44.90318,"height":10049.86},{"longitude":-114.50775,"latitude":45.0081,"height":10049.83},{"longitude":-114.39586,"latitude":45.11742,"height":10049.89},{"longitude":-114.28724,"latitude":45.22288,"height":10049.95},{"longitude":-114.1452,"latitude":45.36018,"height":10050.06},{"longitude":-114.03063,"latitude":45.47031,"height":10050.15},{"longitude":-113.91023,"latitude":45.56812,"height":10050.28},{"longitude":-113.77957,"latitude":45.67081,"height":10050.45},{"longitude":-113.65418,"latitude":45.76769,"height":10050.63},{"longitude":-113.52166,"latitude":45.86923,"height":10050.8},{"longitude":-113.39298,"latitude":45.9674,"height":10050.95},{"longitude":-113.25732,"latitude":46.07053,"height":10051},{"longitude":-113.12656,"latitude":46.16925,"height":10050.95},{"longitude":-112.99599,"latitude":46.26736,"height":10050.88},{"longitude":-112.85692,"latitude":46.37138,"height":10050.79},{"longitude":-112.72378,"latitude":46.47044,"height":10050.7},{"longitude":-112.59017,"latitude":46.56935,"height":10050.71},{"longitude":-112.45451,"latitude":46.66919,"height":10050.75},{"longitude":-112.40219,"latitude":46.7075,"height":10050.75},{"longitude":-112.18308,"latitude":46.86731,"height":10050.72},{"longitude":-112.04336,"latitude":46.9686,"height":10050.62},{"longitude":-111.91223,"latitude":47.07069,"height":10050.47},{"longitude":-111.78719,"latitude":47.17534,"height":10050.26},{"longitude":-111.65659,"latitude":47.28245,"height":10050.09},{"longitude":-111.52737,"latitude":47.38783,"height":10049.95},{"longitude":-111.39635,"latitude":47.49399,"height":10049.81},{"longitude":-111.26383,"latitude":47.60092,"height":10049.73},{"longitude":-111.13261,"latitude":47.70612,"height":10049.56},{"longitude":-110.9972,"latitude":47.81413,"height":10049.38},{"longitude":-110.86276,"latitude":47.92076,"height":10049.15},{"longitude":-110.72704,"latitude":48.02771,"height":10048.89},{"longitude":-110.59324,"latitude":48.13269,"height":10048.71},{"longitude":-110.45213,"latitude":48.24274,"height":10048.51},{"longitude":-110.29809,"latitude":48.36214,"height":10048.31},{"longitude":-110.15818,"latitude":48.46991,"height":10048.12},{"longitude":-110.01434,"latitude":48.58001,"height":10047.89},{"longitude":-109.87766,"latitude":48.68405,"height":10047.65},{"longitude":-109.73201,"latitude":48.79427,"height":10047.4},{"longitude":-109.59253,"latitude":48.89912,"height":10047.26},{"longitude":-109.4451,"latitude":49.00946,"height":10047.11},{"longitude":-109.29828,"latitude":49.12085,"height":10047.1},{"longitude":-109.15861,"latitude":49.22635,"height":10047.09},{"longitude":-109.00909,"latitude":49.33844,"height":10047.04},{"longitude":-108.86092,"latitude":49.44878,"height":10046.98},{"longitude":-108.71825,"latitude":49.55443,"height":10046.88},{"longitude":-108.56899,"latitude":49.66429,"height":10046.72},{"longitude":-108.42393,"latitude":49.77044,"height":10046.57},{"longitude":-108.27145,"latitude":49.88123,"height":10046.36},{"longitude":-108.1247,"latitude":49.98719,"height":10046.11},{"longitude":-107.97197,"latitude":50.09683,"height":10045.75},{"longitude":-107.82331,"latitude":50.20291,"height":10045.33},{"longitude":-107.68083,"latitude":50.30452,"height":10044.86},{"longitude":-107.47946,"latitude":50.46744,"height":10044.09},{"longitude":-107.34006,"latitude":50.57956,"height":10043.61},{"longitude":-107.20117,"latitude":50.69032,"height":10043.17},{"longitude":-107.06024,"latitude":50.80199,"height":10042.81},{"longitude":-106.91856,"latitude":50.91358,"height":10042.53},{"longitude":-106.7762,"latitude":51.02502,"height":10042.3},{"longitude":-106.63352,"latitude":51.136,"height":10042.14},{"longitude":-106.48335,"latitude":51.25195,"height":10042},{"longitude":-106.33897,"latitude":51.36282,"height":10041.91},{"longitude":-106.19385,"latitude":51.47346,"height":10041.81},{"longitude":-106.05192,"latitude":51.58099,"height":10041.72},{"longitude":-105.89882,"latitude":51.69621,"height":10041.62},{"longitude":-105.75058,"latitude":51.80705,"height":10041.51},{"longitude":-105.60936,"latitude":51.91196,"height":10041.39},{"longitude":-105.45824,"latitude":52.02352,"height":10041.25},{"longitude":-105.30106,"latitude":52.13869,"height":10041.07},{"longitude":-105.14606,"latitude":52.25153,"height":10040.87},{"longitude":-104.99657,"latitude":52.35965,"height":10040.58},{"longitude":-104.83852,"latitude":52.47313,"height":10040.27},{"longitude":-104.68841,"latitude":52.58019,"height":10039.9},{"longitude":-104.5369,"latitude":52.68745,"height":10039.52},{"longitude":-104.38322,"latitude":52.79568,"height":10039.14},{"longitude":-104.36918,"latitude":52.80551,"height":10039.1},{"longitude":-104.14574,"latitude":52.96129,"height":10038.5},{"longitude":-104.08882,"latitude":53.00075,"height":10038.34},{"longitude":-103.66236,"latitude":53.29321,"height":10037.06},{"longitude":-103.50163,"latitude":53.40198,"height":10036.52},{"longitude":-103.34328,"latitude":53.50841,"height":10035.99},{"longitude":-103.18163,"latitude":53.61635,"height":10035.45},{"longitude":-103.01807,"latitude":53.72468,"height":10034.91},{"longitude":-102.85287,"latitude":53.83333,"height":10034.47},{"longitude":-102.6947,"latitude":53.93663,"height":10034.08},{"longitude":-102.67634,"latitude":53.94859,"height":10034.03},{"longitude":-102.48911,"latitude":54.06987,"height":10033.65},{"longitude":-102.2399,"latitude":54.22977,"height":10033.22},{"longitude":-102.07179,"latitude":54.33659,"height":10032.94},{"longitude":-101.89569,"latitude":54.44769,"height":10032.64},{"longitude":-101.70779,"latitude":54.56534,"height":10032.33},{"longitude":-101.63161,"latitude":54.61276,"height":10032.22},{"longitude":-100.99348,"latitude":55.0037,"height":10031.42},{"longitude":-100.81579,"latitude":55.11273,"height":10031.19},{"longitude":-100.63565,"latitude":55.22264,"height":10030.93},{"longitude":-100.44937,"latitude":55.33539,"height":10030.6},{"longitude":-100.2748,"latitude":55.44008,"height":10030.29},{"longitude":-100.0996,"latitude":55.54445,"height":10030},{"longitude":-99.92199,"latitude":55.64932,"height":10029.73},{"longitude":-99.74412,"latitude":55.75351,"height":10029.49},{"longitude":-99.56592,"latitude":55.85728,"height":10029.14},{"longitude":-99.39177,"latitude":55.95775,"height":10028.76},{"longitude":-99.21032,"latitude":56.0617,"height":10028.26},{"longitude":-99.03151,"latitude":56.16321,"height":10027.69},{"longitude":-98.85481,"latitude":56.26291,"height":10027.12},{"longitude":-98.75731,"latitude":56.3175,"height":10026.81},{"longitude":-92.14444,"latitude":59.53107,"height":10623.76},{"longitude":-91.9352,"latitude":59.61856,"height":10623.89},{"longitude":-91.7233,"latitude":59.7063,"height":10624.05},{"longitude":-91.50816,"latitude":59.79458,"height":10624.26},{"longitude":-91.29959,"latitude":59.87933,"height":10624.49},{"longitude":-91.08373,"latitude":59.96636,"height":10624.75},{"longitude":-90.88204,"latitude":60.06123,"height":10624.98},{"longitude":-90.70332,"latitude":60.17049,"height":10625.19},{"longitude":-90.51695,"latitude":60.27779,"height":10625.42},{"longitude":-90.33527,"latitude":60.38063,"height":10625.63},{"longitude":-90.149,"latitude":60.48518,"height":10625.84},{"longitude":-90.02708,"latitude":60.5532,"height":10625.97},{"longitude":-89.74967,"latitude":60.70626,"height":10626.24},{"longitude":-89.617,"latitude":60.77884,"height":10626.34},{"longitude":-87.30364,"latitude":61.97255,"height":10628.64},{"longitude":-59.43304,"latitude":68.13538,"height":10694.36},{"longitude":-59.06637,"latitude":68.17969,"height":10695.72},{"longitude":-58.69851,"latitude":68.22324,"height":10696.85},{"longitude":-58.32642,"latitude":68.26625,"height":10697.56},{"longitude":-57.95463,"latitude":68.30823,"height":10697.89},{"longitude":-57.58284,"latitude":68.34924,"height":10698.01},{"longitude":-57.21012,"latitude":68.38943,"height":10698.12},{"longitude":-56.83685,"latitude":68.42862,"height":10698.38},{"longitude":-56.46272,"latitude":68.46693,"height":10698.76},{"longitude":-56.08337,"latitude":68.50484,"height":10699.18},{"longitude":-55.70435,"latitude":68.54182,"height":10699.41},{"longitude":-55.31946,"latitude":68.57824,"height":10699.27},{"longitude":-54.92968,"latitude":68.61415,"height":10698.75},{"longitude":-54.5568,"latitude":68.64748,"height":10698.01},{"longitude":-54.16822,"latitude":68.6814,"height":10697.2},{"longitude":-53.78302,"latitude":68.71394,"height":10696.55},{"longitude":-53.39172,"latitude":68.7459,"height":10696.21},{"longitude":-52.99648,"latitude":68.77739,"height":10696.22},{"longitude":-52.60954,"latitude":68.80714,"height":10696.5},{"longitude":-52.21953,"latitude":68.83614,"height":10696.91},{"longitude":-51.83844,"latitude":68.86361,"height":10697.44},{"longitude":-51.44309,"latitude":68.89105,"height":10698.12},{"longitude":-51.04564,"latitude":68.91775,"height":10698.95},{"longitude":-50.65205,"latitude":68.94307,"height":10699.93},{"longitude":-50.26114,"latitude":68.96736,"height":10700.99},{"longitude":-49.862,"latitude":68.9873,"height":10702.1},{"longitude":-49.45413,"latitude":68.99833,"height":10703.2},{"longitude":-49.04689,"latitude":69.00851,"height":10704.25},{"longitude":-48.65419,"latitude":69.01737,"height":10705.2},{"longitude":-48.29727,"latitude":69.02459,"height":10706.04},{"longitude":-29.1449,"latitude":67.84658,"height":11341.65},{"longitude":-28.98855,"latitude":67.82117,"height":11341.68},{"longitude":-28.52525,"latitude":67.74468,"height":11341.68},{"longitude":-28.04757,"latitude":67.66386,"height":11341.81},{"longitude":-27.71401,"latitude":67.60634,"height":11342.03},{"longitude":-27.37356,"latitude":67.54655,"height":11342.31},{"longitude":-27.0469,"latitude":67.48827,"height":11342.56},{"longitude":-26.72125,"latitude":67.42923,"height":11342.67},{"longitude":-26.39715,"latitude":67.36942,"height":11342.64},{"longitude":-26.07518,"latitude":67.30913,"height":11342.52},{"longitude":-25.7552,"latitude":67.24829,"height":11342.39},{"longitude":-25.49839,"latitude":67.19872,"height":11342.44},{"longitude":-25.02888,"latitude":67.10655,"height":11342.85},{"longitude":-24.71243,"latitude":67.04324,"height":11343.37},{"longitude":-24.39717,"latitude":66.97925,"height":11343.99},{"longitude":-24.08335,"latitude":66.91452,"height":11344.62},{"longitude":-23.77346,"latitude":66.84965,"height":11345.14},{"longitude":-23.46293,"latitude":66.78374,"height":11345.54},{"longitude":-23.15693,"latitude":66.71787,"height":11345.83},{"longitude":-22.84894,"latitude":66.65057,"height":11346.07},{"longitude":-22.54657,"latitude":66.58357,"height":11346.3},{"longitude":-22.24051,"latitude":66.51475,"height":11346.53},{"longitude":-21.94095,"latitude":66.44648,"height":11346.77},{"longitude":-21.64486,"latitude":66.37798,"height":11347},{"longitude":-21.34827,"latitude":66.30853,"height":11347.2},{"longitude":-21.05129,"latitude":66.23799,"height":11347.38},{"longitude":-20.76073,"latitude":66.168,"height":11347.56},{"longitude":-20.46514,"latitude":66.09585,"height":11347.79},{"longitude":-20.17269,"latitude":66.02355,"height":11348.04},{"longitude":-19.8698,"latitude":65.9599,"height":11348.29},{"longitude":-19.54587,"latitude":65.91103,"height":11348.51},{"longitude":-19.22667,"latitude":65.86047,"height":11348.73},{"longitude":-18.90771,"latitude":65.8089,"height":11348.91},{"longitude":-18.5854,"latitude":65.75574,"height":11349.05},{"longitude":-18.26923,"latitude":65.70277,"height":11349.11},{"longitude":-17.94079,"latitude":65.64685,"height":11349.12},{"longitude":-17.62601,"latitude":65.59234,"height":11349.1},{"longitude":-17.31125,"latitude":65.53702,"height":11349.04},{"longitude":-16.99459,"latitude":65.48039,"height":11348.95},{"longitude":-16.68549,"latitude":65.42427,"height":11348.86},{"longitude":-16.37524,"latitude":65.36705,"height":11348.81},{"longitude":-16.07058,"latitude":65.31001,"height":11348.81},{"longitude":-15.76197,"latitude":65.25128,"height":11348.82},{"longitude":-15.45353,"latitude":65.19176,"height":11348.76},{"longitude":-15.1474,"latitude":65.1318,"height":11348.59},{"longitude":-14.84413,"latitude":65.07147,"height":11348.29},{"longitude":-14.5448,"latitude":65.01105,"height":11347.88},{"longitude":-14.23416,"latitude":64.9474,"height":11347.31},{"longitude":-13.92803,"latitude":64.88374,"height":11346.75},{"longitude":-13.63037,"latitude":64.82101,"height":11346.29},{"longitude":-13.33048,"latitude":64.75685,"height":11345.94},{"longitude":-13.03505,"latitude":64.69281,"height":11345.71},{"longitude":-12.74288,"latitude":64.62856,"height":11345.56},{"longitude":-12.4541,"latitude":64.56418,"height":11345.46},{"longitude":-12.16604,"latitude":64.49899,"height":11345.34},{"longitude":-11.86913,"latitude":64.43105,"height":11345.14},{"longitude":-11.61442,"latitude":64.37192,"height":11344.91},{"longitude":-10.65684,"latitude":64.14345,"height":11343.62},{"longitude":-10.36856,"latitude":64.07259,"height":11343.14},{"longitude":-10.08732,"latitude":64.00272,"height":11342.68},{"longitude":-9.80299,"latitude":63.93689,"height":11342.26},{"longitude":-9.51532,"latitude":63.87328,"height":11341.9},{"longitude":-9.2317,"latitude":63.80892,"height":11341.63},{"longitude":-8.94171,"latitude":63.74226,"height":11341.42},{"longitude":-8.68986,"latitude":63.68351,"height":11341.25},{"longitude":-8.68986,"latitude":63.68351,"height":11341.25},{"longitude":-8.68986,"latitude":63.68351,"height":11341.25},{"longitude":-7.92336,"latitude":63.50079,"height":11340.42},{"longitude":-7.64275,"latitude":63.43227,"height":11339.93},{"longitude":-7.3626,"latitude":63.36295,"height":11339.44},{"longitude":-7.07893,"latitude":63.29186,"height":11338.96},{"longitude":-6.79746,"latitude":63.22041,"height":11338.59},{"longitude":-6.51996,"latitude":63.14909,"height":11338.35},{"longitude":-6.2396,"latitude":63.07619,"height":11338.19},{"longitude":-5.96405,"latitude":63.00343,"height":11338.03},{"longitude":-5.68573,"latitude":62.92918,"height":11337.78},{"longitude":-5.41433,"latitude":62.8559,"height":11337.48},{"longitude":-5.14192,"latitude":62.78137,"height":11337.16},{"longitude":-4.87172,"latitude":62.70662,"height":11336.81},{"longitude":-4.59666,"latitude":62.62958,"height":11336.46},{"longitude":-4.32555,"latitude":62.55266,"height":11336.15},{"longitude":-4.05406,"latitude":62.47478,"height":11335.77},{"longitude":-3.78426,"latitude":62.39643,"height":11335.2},{"longitude":-3.51362,"latitude":62.31692,"height":11334.51},{"longitude":-3.23642,"latitude":62.23443,"height":11333.7},{"longitude":-2.95807,"latitude":62.15054,"height":11332.93},{"longitude":-2.68351,"latitude":62.0668,"height":11332.33},{"longitude":-2.40287,"latitude":61.98033,"height":11331.99},{"longitude":-2.12929,"latitude":61.89487,"height":11332.02},{"longitude":-1.85286,"latitude":61.80753,"height":11332.24},{"longitude":-1.58244,"latitude":61.72105,"height":11332.59},{"longitude":-1.29796,"latitude":61.629,"height":11332.95},{"longitude":-0.99897,"latitude":61.53575,"height":11333.24},{"longitude":-0.72598,"latitude":61.44937,"height":11333.32},{"longitude":-0.4629,"latitude":61.36505,"height":11333.18},{"longitude":-0.20344,"latitude":61.28091,"height":11332.86},{"longitude":0.06082,"latitude":61.19394,"height":11332.32},{"longitude":0.30075,"latitude":61.10381,"height":11331.7},{"longitude":0.55559,"latitude":61.00829,"height":11331.04},{"longitude":0.80816,"latitude":60.91292,"height":11330.49},{"longitude":1.05645,"latitude":60.81812,"height":11330.09},{"longitude":1.20163,"latitude":60.76212,"height":11329.93},{"longitude":1.55545,"latitude":60.62428,"height":11329.72},{"longitude":1.7891,"latitude":60.53211,"height":11329.61},{"longitude":2.11271,"latitude":60.40288,"height":11329.37},{"longitude":2.34208,"latitude":60.31018,"height":11329.1},{"longitude":2.58365,"latitude":60.2115,"height":11328.73},{"longitude":2.82178,"latitude":60.11334,"height":11328.3},{"longitude":3.05901,"latitude":60.01431,"height":11327.89},{"longitude":3.30066,"latitude":59.91238,"height":11327.52},{"longitude":3.54318,"latitude":59.80911,"height":11327.27},{"longitude":3.81699,"latitude":59.69128,"height":11327.18},{"longitude":4.04382,"latitude":59.59264,"height":11327.21},{"longitude":4.26781,"latitude":59.49413,"height":11327.28},{"longitude":4.48981,"latitude":59.39563,"height":11327.33},{"longitude":4.71266,"latitude":59.29577,"height":11327.27},{"longitude":4.9339,"latitude":59.19569,"height":11327.12},{"longitude":5.15121,"latitude":59.09647,"height":11326.93},{"longitude":5.369,"latitude":58.99593,"height":11326.76},{"longitude":5.58712,"latitude":58.89445,"height":11326.64},{"longitude":5.80106,"latitude":58.79399,"height":11326.63},{"longitude":6.01209,"latitude":58.69382,"height":11326.61},{"longitude":6.22302,"latitude":58.59279,"height":11326.54},{"longitude":6.43561,"latitude":58.49014,"height":11326.41},{"longitude":6.64318,"latitude":58.38904,"height":11326.06},{"longitude":6.85901,"latitude":58.28279,"height":11325.58},{"longitude":7.06518,"latitude":58.18048,"height":11325.08},{"longitude":7.33904,"latitude":58.04292,"height":11324.34},{"longitude":7.54349,"latitude":57.93929,"height":11323.87},{"longitude":7.75497,"latitude":57.83101,"height":11323.44},{"longitude":7.96483,"latitude":57.72258,"height":11323.05},{"longitude":8.21414,"latitude":57.59252,"height":11322.7},{"longitude":8.41748,"latitude":57.48535,"height":11322.44},{"longitude":8.61745,"latitude":57.3788,"height":11322.24},{"longitude":8.82158,"latitude":57.26926,"height":11322.04},{"longitude":8.97506,"latitude":57.19446,"height":11321.91},{"longitude":9.00507,"latitude":57.18388,"height":11321.88},{"longitude":9.26585,"latitude":57.09398,"height":10613},{"longitude":9.50849,"latitude":57.00964,"height":9820.32},{"longitude":9.78744,"latitude":56.91142,"height":9141.98},{"longitude":10.01519,"latitude":56.83041,"height":8555.11},{"longitude":10.23368,"latitude":56.75202,"height":8044.42},{"longitude":10.44206,"latitude":56.67646,"height":7510.89},{"longitude":10.6392,"latitude":56.6044,"height":6977.33},{"longitude":10.83072,"latitude":56.53383,"height":6359.92},{"longitude":11.00705,"latitude":56.4684,"height":5826.32},{"longitude":11.18348,"latitude":56.4025,"height":5368.92},{"longitude":11.27506,"latitude":56.36806,"height":5224.04},{"longitude":11.35806,"latitude":56.33677,"height":5223.95},{"longitude":11.43522,"latitude":56.30759,"height":5223.86},{"longitude":11.51525,"latitude":56.27714,"height":5200.91},{"longitude":11.6019,"latitude":56.2441,"height":4804.58},{"longitude":11.69271,"latitude":56.20927,"height":4347.29},{"longitude":11.77829,"latitude":56.17645,"height":4034.79},{"longitude":11.86415,"latitude":56.14343,"height":3806.12},{"longitude":11.94858,"latitude":56.11081,"height":3524.1},{"longitude":11.9781,"latitude":56.0994,"height":3394.53},{"longitude":12.00814,"latitude":56.08772,"height":3295.44},{"longitude":12.03852,"latitude":56.07591,"height":3196.35},{"longitude":12.06931,"latitude":56.06392,"height":3142.99},{"longitude":12.09844,"latitude":56.05261,"height":3120.1},{"longitude":12.12674,"latitude":56.04163,"height":3097.22},{"longitude":12.15362,"latitude":56.03114,"height":3074.33},{"longitude":12.18075,"latitude":56.02059,"height":3051.45},{"longitude":12.20744,"latitude":56.01016,"height":3028.56},{"longitude":12.23328,"latitude":56.00001,"height":2998.06},{"longitude":12.25825,"latitude":55.99019,"height":2944.7},{"longitude":12.28366,"latitude":55.98023,"height":2868.48},{"longitude":12.30761,"latitude":55.97082,"height":2746.55},{"longitude":12.33224,"latitude":55.96115,"height":2616.99},{"longitude":12.35754,"latitude":55.95117,"height":2472.19},{"longitude":12.38201,"latitude":55.94156,"height":2335.01},{"longitude":12.41163,"latitude":55.9299,"height":2190.21},{"longitude":12.43567,"latitude":55.92041,"height":2053.03},{"longitude":12.46058,"latitude":55.91052,"height":1938.7},{"longitude":12.48321,"latitude":55.90156,"height":1824.38},{"longitude":12.50836,"latitude":55.89155,"height":1694.82},{"longitude":12.53124,"latitude":55.88246,"height":1595.74},{"longitude":12.5542,"latitude":55.87334,"height":1504.28},{"longitude":12.56703,"latitude":55.86827,"height":1458.55},{"longitude":12.58939,"latitude":55.85938,"height":1351.85},{"longitude":12.60165,"latitude":55.85454,"height":1306.12},{"longitude":12.62398,"latitude":55.84569,"height":1214.66},{"longitude":12.63316,"latitude":55.84206,"height":1176.55},{"longitude":12.64551,"latitude":55.83714,"height":1130.81},{"longitude":12.66682,"latitude":55.82863,"height":1062.21},{"longitude":12.68605,"latitude":55.82094,"height":1016.47},{"longitude":12.70785,"latitude":55.81224,"height":955.49},{"longitude":12.72658,"latitude":55.80473,"height":924.99},{"longitude":12.73615,"latitude":55.80093,"height":902.12},{"longitude":12.74526,"latitude":55.79728,"height":871.63},{"longitude":12.76362,"latitude":55.78995,"height":841.13},{"longitude":12.77244,"latitude":55.78638,"height":818.26},{"longitude":12.78259,"latitude":55.78234,"height":795.39},{"longitude":12.80016,"latitude":55.7753,"height":734.41},{"longitude":12.80954,"latitude":55.77102,"height":703.92},{"longitude":12.81495,"latitude":55.7673,"height":673.43},{"longitude":12.82013,"latitude":55.76074,"height":642.94},{"longitude":12.81747,"latitude":55.7384,"height":612.43},{"longitude":12.8148,"latitude":55.73186,"height":597.19},{"longitude":12.81186,"latitude":55.72503,"height":597.18},{"longitude":12.80388,"latitude":55.71316,"height":597.17},{"longitude":12.78018,"latitude":55.69752,"height":581.93},{"longitude":12.77219,"latitude":55.69258,"height":536.21},{"longitude":12.7571,"latitude":55.68304,"height":475.24},{"longitude":12.75097,"latitude":55.67903,"height":429.52},{"longitude":12.727,"latitude":55.66365,"height":307.61},{"longitude":12.6853,"latitude":55.63683,"height":86.64},{"longitude":12.64044,"latitude":55.60784,"height":40.93},{"longitude":12.63927,"latitude":55.60707,"height":40.93},{"longitude":12.63853,"latitude":55.60685,"height":40.93},{"longitude":12.63777,"latitude":55.60692,"height":40.93},{"longitude":12.63715,"latitude":55.60722,"height":40.93},{"longitude":12.63595,"latitude":55.6083,"height":40.94},{"longitude":12.6364,"latitude":55.60869,"height":40.94},{"longitude":12.63698,"latitude":55.60918,"height":40.94},{"longitude":12.63788,"latitude":55.60994,"height":40.94},{"longitude":12.63842,"latitude":55.61042,"height":40.94},{"longitude":12.63904,"latitude":55.61097,"height":40.93},{"longitude":12.64046,"latitude":55.6122,"height":40.93},{"longitude":12.64114,"latitude":55.61282,"height":40.93},{"longitude":12.64187,"latitude":55.61343,"height":40.93},{"longitude":12.64267,"latitude":55.61413,"height":40.93},{"longitude":12.64345,"latitude":55.61482,"height":40.93},{"longitude":12.64487,"latitude":55.61603,"height":40.93},{"longitude":12.64535,"latitude":55.61645,"height":40.93},{"longitude":12.64568,"latitude":55.61689,"height":40.93},{"longitude":12.64554,"latitude":55.61756,"height":40.93},{"longitude":12.64539,"latitude":55.61799,"height":40.93},{"longitude":12.6452,"latitude":55.61862,"height":40.93},{"longitude":12.64503,"latitude":55.61921,"height":40.94},{"longitude":12.64507,"latitude":55.61959,"height":40.94},{"longitude":12.64531,"latitude":55.61997,"height":40.94},{"longitude":12.6457,"latitude":55.62033,"height":40.94},{"longitude":12.64616,"latitude":55.62074,"height":40.94},{"longitude":12.64662,"latitude":55.62112,"height":40.94},{"longitude":12.64732,"latitude":55.62171,"height":40.93},{"longitude":12.64784,"latitude":55.62218,"height":40.93},{"longitude":12.64791,"latitude":55.62269,"height":40.94},{"longitude":12.64786,"latitude":55.62305,"height":40.94},{"longitude":12.64782,"latitude":55.62333,"height":40.94},{"longitude":12.6478,"latitude":55.62367,"height":40.94},{"longitude":12.64776,"latitude":55.62396,"height":40.94},{"longitude":12.64774,"latitude":55.62442,"height":40.94},{"longitude":12.64774,"latitude":55.62472,"height":40.94},{"longitude":12.64788,"latitude":55.62494,"height":40.94},{"longitude":12.6483,"latitude":55.62496,"height":40.94},{"longitude":12.64852,"latitude":55.62494,"height":40.94},{"longitude":12.64878,"latitude":55.62493,"height":40.94},{"longitude":12.64904,"latitude":55.62492,"height":40.94},{"longitude":12.64928,"latitude":55.62491,"height":40.94},{"longitude":12.64936,"latitude":55.6249,"height":40.94},{"longitude":12.64949,"latitude":55.62442,"height":40.94},{"longitude":12.64936,"latitude":55.6247,"height":40.94}]'
-    // );
+    // Uncomment if you want 3d buildings dispalyed
+    // viewer.scene.primitives.add(osmBuildings);
 
     /* Initialize the viewer clock:
       Assume the radar samples are 30 seconds apart, and calculate the entire flight duration based on that assumption.

From 738f2a1f05ca22ba9daa2c508d3c9f9de0557fbf Mon Sep 17 00:00:00 2001
From: Sofian Hussein <sofian.hussein@eduvaud.ch>
Date: Tue, 20 Jan 2026 11:13:06 +0100
Subject: [PATCH 24/61] Features/fetch planes position (#33)

* feat(): Add vertical rate to the return of `get_flights`

* docs(get_flights): Add more details to the `get_flights` header

* docs(get_flights): Small display change

* docs(get_flights): Add Field Descriptions section
---
 API/fetchFlights.py | 26 ++++++++++++++++++++++----
 1 file changed, 22 insertions(+), 4 deletions(-)

diff --git a/API/fetchFlights.py b/API/fetchFlights.py
index 429684f..064defc 100644
--- a/API/fetchFlights.py
+++ b/API/fetchFlights.py
@@ -11,8 +11,25 @@ def get_flights(user_lat, user_long):
     """
     Fetch flight data from OpenSky Network API for Switzerland region
 
+    Args:
+        user_lat: User latitude in degrees
+        user_long: User longitude in degrees
+
     Returns:
-        Dict containing list of flights with their data
+        List of dictionaries containing flight data
+
+    Example:
+        [{'origin_country': 'Portugal', 'lat': 46.8, 'long': 7.0111, 'alt': 10.51, 'velocity': 196.84,
+        'heading': 231.15, 'vertical_rate': 2.28},...]
+
+    Field Descriptions:
+        "origin_country": country of origin of the plane
+        "lat": plane latitude (°) -90 to 90
+        "long": plane longitude (°) -180 to 180
+        "alt": plane altitude (km)
+        "velocity": plane speed (m/s)
+        "heading": plane heading (°) 0 to 360, true north
+        "vertical_rate": Vertical speed (m/s)
     """
     url = "https://opensky-network.org/api/states/all"
 
@@ -48,11 +65,12 @@ def get_flights(user_lat, user_long):
         # creating a dictionary that stores only useful data
         flight = {
             "origin_country": state[2],
-            "lat": state[5],
-            "long": state[6],
+            "lat": state[6],
+            "long": state[5],
             "alt": state[7]/1000 if state[7] else state[7],
             "velocity": state[9],
-            "heading": state[10]
+            "heading": state[10],
+            "vertical_rate": state[11]
         }
         # add the flight to the list of aircraft
         flights.append(flight)

From e213bf3ea4cd7ad4d2fec84b690d0b34c464f64a Mon Sep 17 00:00:00 2001
From: David Galindo <155019077+davidgalindo-git@users.noreply.github.com>
Date: Wed, 21 Jan 2026 14:36:14 +0100
Subject: [PATCH 25/61] fetch moon api data (python) and moon phase widget (vue
 component) (#37)

* feat:moon asset added

* feat:moved moon above evian and rescaled to make it visible

* fix:cesium functions sources + moon visible from start

* feat:fetch Moon data api

* fix:undo log file generation

* feat:added get_moon_data func. Returns datetime, ra, dec and phase for hard coded params.

* fix:start time, stop time and step are external params

* refactor:modified comments and prevent params format errors

* fix:"session request with retries to prevent ssl error + comments"

* feat:"convert ra and dec to cesium and return all necessary info"

* chore:"params comments"

* moon phase assets

* moon phase display

* moon phase assets del

* chore : "moon phase comments and env vars"

* Delete .idea/Planium.iml

---------

Co-authored-by: davidgalindo-git <>
---
 .env.example                 |   5 +-
 .idea/Planium.iml            |   8 --
 API/fetchMoon.py             | 179 +++++++++++++++++++++++++++++++++++
 src/components/MoonPhase.vue | 114 ++++++++++++++++++++++
 src/components/Viewer.vue    |   2 +
 5 files changed, 299 insertions(+), 9 deletions(-)
 delete mode 100644 .idea/Planium.iml
 create mode 100644 API/fetchMoon.py
 create mode 100644 src/components/MoonPhase.vue

diff --git a/.env.example b/.env.example
index 0553cb3..e1ac669 100644
--- a/.env.example
+++ b/.env.example
@@ -1 +1,4 @@
-VITE_CESIUM_ACCESS_TOKEN="YOUR_CESIUM_ACCESS_TOKEN"
\ No newline at end of file
+VITE_CESIUM_ACCESS_TOKEN="YOUR_CESIUM_ACCESS_TOKEN"
+
+VITE_MOON_PHASE_APP_ID="YOUR_APP_ID"
+VITE_MOON_PHASE_APP_SECRET="YOUR_MOON_APP_SECRET"
\ No newline at end of file
diff --git a/.idea/Planium.iml b/.idea/Planium.iml
deleted file mode 100644
index c956989..0000000
--- a/.idea/Planium.iml
+++ /dev/null
@@ -1,8 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<module type="WEB_MODULE" version="4">
-  <component name="NewModuleRootManager">
-    <content url="file://$MODULE_DIR$" />
-    <orderEntry type="inheritedJdk" />
-    <orderEntry type="sourceFolder" forTests="false" />
-  </component>
-</module>
\ No newline at end of file
diff --git a/API/fetchMoon.py b/API/fetchMoon.py
new file mode 100644
index 0000000..daa5ea9
--- /dev/null
+++ b/API/fetchMoon.py
@@ -0,0 +1,179 @@
+import math
+
+import numpy as np
+import requests
+from requests.adapters import HTTPAdapter
+from urllib3 import Retry
+
+
+def get_moon_data(start_time, stop_time, step): # src: https://ssd-api.jpl.nasa.gov/doc/horizons.html
+    """
+    Fetch Moon's RA, DEC and phase from Horizon API
+
+    :param start_time: min time value for moon fetching (start)
+    :param stop_time: max time value for moon fetching (end)
+    :param step: time step for moon fetching (hours)
+    :return: dict containing list of moon's data at specific times
+    """
+    url = 'https://ssd.jpl.nasa.gov/api/horizons.api'
+
+    API_fetch_params = {
+            'format': 'json',
+            'COMMAND': "'301'",         # Moon
+            'OBJ_DATA': 'NO',
+            'MAKE_EPHEM': 'YES',
+            'EPHEM_TYPE': 'OBSERVER',
+            'CENTER': "'500@399'",      # Earth's center coordinates
+            'START_TIME': f"'{start_time}'",   # From 'YYYY-MM-DD'
+            'STOP_TIME': f"'{stop_time}'",    # To 'YYYY-MM-DD'
+            'STEP_SIZE': f"'{step}'",        # Step (ex.'1h')
+            'QUANTITIES': "'1,9'",    # 1 = RA/DEC, Quantity 9 = Brightness/Phase
+        }
+
+    # setup retries to handle SSLError or connection drops
+    # src: https://urllib3.readthedocs.io/en/stable/reference/urllib3.util.html
+    # src: https://requests.readthedocs.io/en/latest/user/advanced/
+    session = requests.Session()
+    retries = Retry(
+        total=5,    # if a request fails, try 5 more times
+        backoff_factor=1, # wait between tries to prevent overloading the system
+        status_forcelist=[502, 503, 504] # only retry if server returns 502, 503, 504 error status (bad gateway/service unavailable)
+    )
+    # apply for any url 'http://'
+    session.mount('http://', HTTPAdapter(max_retries=retries))
+
+    try:
+        response = requests.get(
+            url,
+            params=API_fetch_params, # pass api's custom params
+            timeout=15 # trigger retry if server doesn't respond in 15s
+        )
+        response.raise_for_status() # raise Exception for any error
+        data = response.json() # parse json response
+    except Exception as e:
+        print(e)
+        return []
+
+    # check if 'result' key exists
+    if not data.get('result'):
+        return []
+
+    result = data.get('result', '')
+    # check if data keyword 'SOE' was returned
+    if '$$SOE' not in result:
+        return []
+
+    lines = data.get('result', '').split('\n') # Split text in lines
+
+    moon_data = [] # dic with data to return
+
+    is_data_zone = False # data zone flag
+    for line in lines:
+        if '$$SOE' in line: # start of data
+            is_data_zone = True
+            continue
+        if '$$EOE' in line: # end of data
+            is_data_zone = False
+            break
+
+        if is_data_zone:
+            # ex: 2026-Jan-15 10:00     16 59 59.11 -27 49 59.3   -7.374   6.202\n
+            values = []
+            for v in line.split(): # loop through split values
+                if v.strip(): # only keep if it's not an empty string
+                    values.append(v)
+
+             # NASA column mapping for Quantities 1,9:
+                 # values[0,1] = Date, Time
+                 # values[2,3,4] = RA (h, m, s)
+                 # values[5,6,7] = DEC (d, m, s)
+                 # values[8] = APmag
+                 # values[9] = S-br
+                 # values[10] = Illu% (Phase)
+
+            if len(values) >= 10:
+                try:
+                    # Convert RA (sexagesimal) to decimal
+                    ra_decimal = (
+                    float(values[2]) # h (hours)
+                    + float(values[3])/60    # min to h
+                    + float(values[4])/3600  # seconds to h
+                    )
+
+                    # Convert DEC (sexagesimal) to decimal
+                    # handle negative DEC for decimal addition
+                    if "-" in values[5]:
+                        sign=-1
+                    else:
+                        sign=1
+
+                    dec_decimal = (
+                    abs(float(values[5]))  # d (degrees) absolute value
+                    + float(values[6])/60 # arcminutes to d
+                    + float(values[7])/3600 # arcseconds to d
+                    )
+
+                    dec_decimal *= sign # apply sign
+
+                    # structure return data
+                    entry = {
+                        'datetime': f"{values[0]} {values[1]}", # 'YYYY-MM-DD HH:SS'
+                        'ra': round(ra_decimal, 6),   # 6 Decimal Right Ascension (hours)
+                        'dec': round(dec_decimal,6),  # 6 Decimal Declination (degrees)
+                        'phase': float(values[-1]) # Phase decimal percentage (0.00 - 100.00)
+                    }
+                    moon_data.append(entry)
+                except Exception as e:
+                    print(f"Error: {e}")
+                    continue
+    return moon_data
+
+def get_cesium_moon_coordinates(moon_data, altitude_m):
+    """
+    Converts RA/Dec to X, Y, Z coordinates
+    :param moon_data: datetime, ra, dec, phase
+    :param altitude_m: altitude above Earth's surface in meters
+    :return: dict with timestamp, X, Y, Z coordinates and moon phase
+    """
+    # Earth radius in meters
+    earth_radius = 6371000
+    # total distance from Earth's center to Moon
+    r = earth_radius + altitude_m
+
+    cesium_coordinates = []
+
+    for entry in moon_data:
+        # convert moon coordinates to radians src: src: https://skyandtelescope.org/astronomy-resources/right-ascension-declination-celestial-coordinates/
+        # RA [hours] to degrees
+        ra_deg = entry['ra'] * 15
+        # RA [degrees] to radians
+        ra_rad = math.radians(ra_deg)
+        # Dec [degrees] to radians
+        dec_rad = math.radians(entry['dec'])
+
+        # convert spherical to cartesian src: https://mathworld.wolfram.com/SphericalCoordinates.html
+        # x = r * cos(dec) * cos(ra)
+        # y = r * cos(dec) * sin(ra)
+        # z = r * sin(dec)
+        x = r * math.cos(dec_rad) * math.cos(ra_rad)
+        y = r * math.cos(dec_rad) * math.sin(ra_rad)
+        z = r * math.sin(dec_rad)
+
+        cesium_coordinates.append({
+            'timestamp': entry['datetime'],
+            'x': round(x, 6),
+            'y': round(y, 6),
+            'z': round(z, 6),
+            'phase': entry['phase']
+        })
+
+    return cesium_coordinates
+
+"""
+# test
+raw = get_moon_data('2026-01-15', '2026-01-20', '1h')
+if raw:
+    cesium_coordinates = get_cesium_moon_coordinates(raw, 10000)
+    print(f"Sample Coord: {cesium_coordinates[0]}")
+    print(f"Total points: {len(cesium_coordinates)}")
+"""
diff --git a/src/components/MoonPhase.vue b/src/components/MoonPhase.vue
new file mode 100644
index 0000000..8463afa
--- /dev/null
+++ b/src/components/MoonPhase.vue
@@ -0,0 +1,114 @@
+<script setup>
+import { ref, onMounted } from 'vue';
+
+const moonImageUrl = ref(null); // stores the final processed image URL
+const isLoading = ref(true); // boolean flag to track the loading state of requests
+const error = ref(null); // exception messages container
+
+const fetchMoonPhase = async () => {
+  /* Fetch Moon's phase from AstronomyAPI
+  * documentation: https://docs.astronomyapi.com/endpoints/studio/moon-phase
+  * */
+  // credentials for authentication
+  const appId = import.meta.env.VITE_MOON_PHASE_APP_ID; // your app id
+  const appSecret = import.meta.env.VITE_MOON_PHASE_APP_SECRET; // your app secret
+
+  // check if missing credentials
+  if (!appId || !appSecret) {
+    error.value = "API Credentials missing";
+    isLoading.value = false;
+    return;
+  }
+
+  // create base64 string from ID and Secret variables (binary to ASCII)
+  // src: https://developer.mozilla.org/en-US/docs/Web/API/Window/btoa
+  const hash = btoa(`${appId}:${appSecret}`);
+
+  // get current date (required parameter)
+  // new Date().toISOString() returns standard timestamp
+  // split('T')[0] returns "YYYY-MM-DD" part
+  const today = new Date().toISOString().split('T')[0];
+
+  try {
+    // POST request to AstronomyAPI
+    // src: https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch
+    const response = await fetch("https://api.astronomyapi.com/api/v2/studio/moon-phase", {
+      method: "POST",
+      headers: {
+        "Authorization": `Basic ${hash}`,
+        "Content-Type": "application/json"
+      },
+
+      // src: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify
+      body: JSON.stringify({ // prepare params as json body
+        "format": "png",  // moon phase asset format
+        "style": { // custom visual parameters for display container
+          "moonStyle": "default", // best quality moon display type (default - shaded - sketch)
+          "backgroundStyle": "stars", // star decoration (stars - solid)
+          "backgroundColor": "black",
+          "headingColor": "white",
+          "textColor": "white"
+        },
+        "observer": {
+          "latitude": 6.56774, // TODO change to reactive variable
+          "longitude": 79.88956, // TODO change to reactive variable
+          "date": today // current date
+        },
+        "view": {
+          "type": "portrait-simple", // template for vertical data display (portrait-simple - landscape-simple)
+          "orientation": "north-up" // (north-up - south-up)
+        }
+      })
+    });
+
+    // validate server's response
+    if (!response.ok) throw new Error("Failed to generate moon image");
+
+    // json parsing
+    const result = await response.json();
+    // update image value (assign new image to reactive reference)
+    moonImageUrl.value = result.data.imageUrl;
+  } catch (err) {
+    // store error message catched
+    error.value = err.message;
+  } finally {
+    // always exit loading state (set loading to false regardless of request result)
+    isLoading.value = false;
+  }
+};
+
+// fetchMoonPhase executes automatically after component is successfully mounted
+onMounted(fetchMoonPhase);
+</script>
+
+<template>
+  <div class="absolute bottom-6 left-6 z-[1000] pointer-events-auto">
+    <div class="bg-black/70 backdrop-blur-md border border-white/20 p-2 rounded-xl shadow-2xl transition-all hover:scale-105 duration-300 w-40">
+
+      <div v-if="isLoading" class="flex flex-col items-center justify-center h-48 space-y-2">
+        <div class="w-6 h-6 border-2 border-white/30 border-t-white rounded-full animate-spin"></div>
+        <span class="text-[10px] text-white/50 uppercase tracking-widest">Loading Moon</span>
+      </div>
+
+      <div v-else-if="error" class="text-[10px] text-red-400 p-2 text-center">
+        {{ error }}
+      </div>
+
+      <div v-else class="relative overflow-hidden rounded-lg">
+        <img
+            :src="moonImageUrl"
+            alt="Current Moon Phase"
+            class="w-full h-auto block"
+        />
+      </div>
+
+    </div>
+  </div>
+</template>
+
+<style scoped>
+/* ensure the component doesn't interfere with map clicks unless hovered */
+.z-1000 {
+  z-index: 1000;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index c9ff17b..d258777 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -7,6 +7,7 @@ import {flyTo} from "@/utils/camera.js";
 import Navigation from "@/components/navigation/Navigation.vue";
 import Terrain from "@/components/terrain/Terrain.vue";
 import Moon from "@/components/primitive/Moon.vue";
+import MoonPhase from "@/components/MoonPhase.vue";
 
 const viewerRef = ref(null)
 const isViewerReady = ref(false)
@@ -76,6 +77,7 @@ const onViewerReady = async ({Cesium, viewer}) => {
           <Navigation/>
       <Moon/>
     </template>
+    <MoonPhase/>
   </vc-viewer>
 
 </template>

From 65df978e48ac42efd68274fc263d2fc69d2f94ea Mon Sep 17 00:00:00 2001
From: David Galindo <155019077+davidgalindo-git@users.noreply.github.com>
Date: Wed, 21 Jan 2026 14:41:53 +0100
Subject: [PATCH 26/61] Moon phase uses reactive lat and lng (#55)

* feat:moon asset added

* feat:moved moon above evian and rescaled to make it visible

* fix:cesium functions sources + moon visible from start

* feat:fetch Moon data api

* fix:undo log file generation

* feat:added get_moon_data func. Returns datetime, ra, dec and phase for hard coded params.

* fix:start time, stop time and step are external params

* refactor:modified comments and prevent params format errors

* fix:"session request with retries to prevent ssl error + comments"

* feat:"convert ra and dec to cesium and return all necessary info"

* chore:"params comments"

* moon phase assets

* moon phase display

* moon phase assets del

* chore : "moon phase comments and env vars"

* fix: "lat and lng variables are reactive to form depending on viewer state"

* Delete .idea/Planium.iml

---------

Co-authored-by: davidgalindo-git <>
---
 src/components/MoonPhase.vue | 34 +++++++++++++++++++++++++++-------
 src/components/Viewer.vue    |  1 +
 2 files changed, 28 insertions(+), 7 deletions(-)

diff --git a/src/components/MoonPhase.vue b/src/components/MoonPhase.vue
index 8463afa..57a6bb2 100644
--- a/src/components/MoonPhase.vue
+++ b/src/components/MoonPhase.vue
@@ -1,11 +1,33 @@
 <script setup>
-import { ref, onMounted } from 'vue';
+import {ref, onMounted, watch} from 'vue';
+import {flyTo} from "@/utils/camera.js";
 
 const moonImageUrl = ref(null); // stores the final processed image URL
 const isLoading = ref(true); // boolean flag to track the loading state of requests
 const error = ref(null); // exception messages container
-
-const fetchMoonPhase = async () => {
+const location = defineProps({ // user's location ( CoordinateForm -> Viewer -> MoonPhase))
+  lng: undefined,
+  lat: undefined
+})
+
+watch(
+    [() => location.lat, () => location.lng],
+    ([newLat, newLng]) => {
+      if (newLat !== 0 && newLng !== 0) {
+        fetchMoonPhase(newLat, newLng);
+      } else {
+        console.error(
+            "Unable to update moon phase: location is invalid.",
+            {
+              lat: newLat,
+              lng: newLng
+            }
+        );
+      }
+    }
+)
+
+const fetchMoonPhase = async (lat, lng) => {
   /* Fetch Moon's phase from AstronomyAPI
   * documentation: https://docs.astronomyapi.com/endpoints/studio/moon-phase
   * */
@@ -50,8 +72,8 @@ const fetchMoonPhase = async () => {
           "textColor": "white"
         },
         "observer": {
-          "latitude": 6.56774, // TODO change to reactive variable
-          "longitude": 79.88956, // TODO change to reactive variable
+          "latitude": lat,
+          "longitude": lng,
           "date": today // current date
         },
         "view": {
@@ -77,8 +99,6 @@ const fetchMoonPhase = async () => {
   }
 };
 
-// fetchMoonPhase executes automatically after component is successfully mounted
-onMounted(fetchMoonPhase);
 </script>
 
 <template>
diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index d258777..013e6d4 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -76,6 +76,7 @@ const onViewerReady = async ({Cesium, viewer}) => {
           <Terrain/>
           <Navigation/>
       <Moon/>
+      <MoonPhase v-bind="location" />
     </template>
     <MoonPhase/>
   </vc-viewer>

From 70ecd57c4d107f20e5e23d7c8c63861dbf0ae982 Mon Sep 17 00:00:00 2001
From: Joris Bailly <90181523+JorisBly@users.noreply.github.com>
Date: Wed, 21 Jan 2026 15:55:24 +0100
Subject: [PATCH 27/61] Feature/fetch planes location (#57)

* feat(): Fetch data from api

* feat(): Get Id of the flight

* fix(): Allow cross origin of the front

* feat(): Create a requirements.txt

* feat(): Move plane when received a new position

* feat(): Call the move plane function

* feat(): Get exception and status code when an error occurred

* feat(): Do nothing if an eror occurred during fetch

* feat(): Make run both frontend and backend with one command

* feat(): Update requirments.txt

* feat(): Remove dividing by 1000 for altitude

* feat(): Make request every 30 seconde

* fix(): rename Vcviewer -> mapViewer

* fix(): Remove debugger

* fix(): Remove useless stuff

* fix(): Remove useless billboard
---
 API/fetchFlights.py               |   5 +-
 API/main.py                       |  18 +-
 API/requirements.txt              |  44 +++++
 package-lock.json                 | 276 +++++++++++++++++++++++++++++-
 package.json                      |   6 +-
 src/components/Viewer.vue         |  24 +--
 src/components/primitive/Moon.vue |  12 +-
 src/utils/api.js                  |  19 ++
 src/utils/scene.js                | 168 +++++++++---------
 9 files changed, 470 insertions(+), 102 deletions(-)
 create mode 100644 API/requirements.txt
 create mode 100644 src/utils/api.js

diff --git a/API/fetchFlights.py b/API/fetchFlights.py
index 064defc..4e83b7d 100644
--- a/API/fetchFlights.py
+++ b/API/fetchFlights.py
@@ -51,6 +51,8 @@ def get_flights(user_lat, user_long):
     # search for data at the URL specified with the parameters
     response = requests.get(url, params=params)
 
+    if response.status_code != 200:
+        return response
     # extract only the JSON of the response
     data = response.json()
 
@@ -64,10 +66,11 @@ def get_flights(user_lat, user_long):
     for state in data["states"]:
         # creating a dictionary that stores only useful data
         flight = {
+            "id": state[1],
             "origin_country": state[2],
             "lat": state[6],
             "long": state[5],
-            "alt": state[7]/1000 if state[7] else state[7],
+            "alt": state[7],
             "velocity": state[9],
             "heading": state[10],
             "vertical_rate": state[11]
diff --git a/API/main.py b/API/main.py
index 0fae441..f731f72 100644
--- a/API/main.py
+++ b/API/main.py
@@ -5,11 +5,24 @@
 Description: Backend service to fetch and serve live flight data using OpenSky API.
 """
 import uvicorn
-from fastapi import FastAPI, Query
+from fastapi import FastAPI, Query, HTTPException
 from fetchFlights import get_flights
+from fastapi.middleware.cors import CORSMiddleware
 
 app = FastAPI()
 
+origins = [
+    "http://localhost:5173",
+    "http://127.0.0.1:5173",
+]
+
+app.add_middleware(
+    CORSMiddleware,
+    allow_origins=origins,
+    allow_credentials=True,
+    allow_methods=["*"],
+    allow_headers=["*"],
+)
 
 @app.get("/flights")
 def get_flights_endpoint(
@@ -29,7 +42,8 @@ def get_flights_endpoint(
 
     # Fetch flights for the given coordinates
     flights = get_flights(lat, long)
-
+    if flights.status_code == 429:
+        raise HTTPException(status_code=429, detail="Item not found")
     # If no data is found
     if not flights:
         return {"message": "No data found"}
diff --git a/API/requirements.txt b/API/requirements.txt
new file mode 100644
index 0000000..8412cf9
--- /dev/null
+++ b/API/requirements.txt
@@ -0,0 +1,44 @@
+annotated-doc==0.0.4
+annotated-types==0.7.0
+anyio==4.12.1
+certifi==2026.1.4
+charset-normalizer==3.4.4
+click==8.3.1
+colorama==0.4.6
+dnspython==2.8.0
+email-validator==2.3.0
+fastapi==0.128.0
+fastapi-cli==0.0.20
+fastapi-cloud-cli==0.11.0
+fastar==0.8.0
+h11==0.16.0
+httpcore==1.0.9
+httptools==0.7.1
+httpx==0.28.1
+idna==3.11
+Jinja2==3.1.6
+markdown-it-py==4.0.0
+MarkupSafe==3.0.3
+mdurl==0.1.2
+pydantic==2.12.5
+pydantic-extra-types==2.11.0
+pydantic-settings==2.12.0
+pydantic_core==2.41.5
+Pygments==2.19.2
+python-dotenv==1.2.1
+python-multipart==0.0.21
+PyYAML==6.0.3
+requests==2.32.5
+rich==14.2.0
+rich-toolkit==0.17.1
+rignore==0.7.6
+sentry-sdk==2.50.0
+shellingham==1.5.4
+starlette==0.50.0
+typer==0.21.1
+typing-inspection==0.4.2
+typing_extensions==4.15.0
+urllib3==2.6.3
+uvicorn==0.40.0
+watchfiles==1.1.1
+websockets==16.0
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index 87bf38e..b7aa506 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,6 +9,7 @@
       "version": "0.0.0",
       "dependencies": {
         "cesium": "^1.137.0",
+        "concurrently": "^9.2.1",
         "vue": "^3.5.26",
         "vue-cesium": "^3.2.12"
       },
@@ -2097,6 +2098,30 @@
       "resolved": "https://registry.npmjs.org/@zouyaoji/heatmap.js/-/heatmap.js-2.0.8.tgz",
       "integrity": "sha512-kBQny/zOUFH2OFoVyu6IdGJEcQMENIAASUsaZhk+OuJ9WexsYf6EU2lCyGURcsFly1kTMZKODlV7nBTCgfvJqg=="
     },
+    "node_modules/ansi-regex": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/ansi-styles": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "license": "MIT",
+      "dependencies": {
+        "color-convert": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
     "node_modules/ansis": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/ansis/-/ansis-4.2.0.tgz",
@@ -2272,6 +2297,66 @@
         "node": ">=20.19.0"
       }
     },
+    "node_modules/chalk": {
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
+      "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.1.0",
+        "supports-color": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
+    "node_modules/chalk/node_modules/supports-color": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+      "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+      "license": "MIT",
+      "dependencies": {
+        "has-flag": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/cliui": {
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz",
+      "integrity": "sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==",
+      "license": "ISC",
+      "dependencies": {
+        "string-width": "^4.2.0",
+        "strip-ansi": "^6.0.1",
+        "wrap-ansi": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/color-convert": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+      "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+      "license": "MIT",
+      "dependencies": {
+        "color-name": "~1.1.4"
+      },
+      "engines": {
+        "node": ">=7.0.0"
+      }
+    },
+    "node_modules/color-name": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+      "license": "MIT"
+    },
     "node_modules/commander": {
       "version": "2.20.3",
       "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
@@ -2284,6 +2369,30 @@
       "integrity": "sha512-4hm4VPpIecmlg59CHXnRDnqGplJFrbLG4aFEl5vl6cK1u76ws3LLvX7ikFnTDl5vo39sjWD6AaDPYodJp/NNHg==",
       "license": "MIT"
     },
+    "node_modules/concurrently": {
+      "version": "9.2.1",
+      "resolved": "https://registry.npmjs.org/concurrently/-/concurrently-9.2.1.tgz",
+      "integrity": "sha512-fsfrO0MxV64Znoy8/l1vVIjjHa29SZyyqPgQBwhiDcaW8wJc2W3XWVOGx4M3oJBnv/zdUZIIp1gDeS98GzP8Ng==",
+      "license": "MIT",
+      "dependencies": {
+        "chalk": "4.1.2",
+        "rxjs": "7.8.2",
+        "shell-quote": "1.8.3",
+        "supports-color": "8.1.1",
+        "tree-kill": "1.2.2",
+        "yargs": "17.7.2"
+      },
+      "bin": {
+        "conc": "dist/bin/concurrently.js",
+        "concurrently": "dist/bin/concurrently.js"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/open-cli-tools/concurrently?sponsor=1"
+      }
+    },
     "node_modules/convert-source-map": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
@@ -2438,6 +2547,12 @@
       "dev": true,
       "license": "ISC"
     },
+    "node_modules/emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+      "license": "MIT"
+    },
     "node_modules/enhanced-resolve": {
       "version": "5.18.4",
       "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.18.4.tgz",
@@ -2520,7 +2635,6 @@
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.2.0.tgz",
       "integrity": "sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=6"
@@ -2589,6 +2703,15 @@
         "node": ">=6.9.0"
       }
     },
+    "node_modules/get-caller-file": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
+      "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
+      "license": "ISC",
+      "engines": {
+        "node": "6.* || 8.* || >= 10.*"
+      }
+    },
     "node_modules/graceful-fs": {
       "version": "4.2.11",
       "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz",
@@ -2602,6 +2725,15 @@
       "integrity": "sha512-bzh50DW9kTPM00T8y4o8vQg89Di9oLJVLW/KaOGIXJWP/iqCN6WKYkbNOF04vFLJhwcpYUh9ydh/+5vpOqV4YQ==",
       "license": "MIT"
     },
+    "node_modules/has-flag": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
+      "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/hookable": {
       "version": "5.5.3",
       "resolved": "https://registry.npmjs.org/hookable/-/hookable-5.5.3.tgz",
@@ -2625,6 +2757,15 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/is-fullwidth-code-point": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
+      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/is-inside-container": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/is-inside-container/-/is-inside-container-1.0.0.tgz",
@@ -3286,6 +3427,15 @@
         "quickselect": "^3.0.0"
       }
     },
+    "node_modules/require-directory": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
+      "integrity": "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/rfdc": {
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/rfdc/-/rfdc-1.4.1.tgz",
@@ -3351,6 +3501,15 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/rxjs": {
+      "version": "7.8.2",
+      "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.2.tgz",
+      "integrity": "sha512-dhKf903U/PQZY6boNNtAGdWbG85WAbjT/1xYoZIC7FAY0yWapOBQVsVrDl58W86//e1VpMNBtRV4MaXfdMySFA==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "tslib": "^2.1.0"
+      }
+    },
     "node_modules/semver": {
       "version": "6.3.1",
       "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
@@ -3361,6 +3520,18 @@
         "semver": "bin/semver.js"
       }
     },
+    "node_modules/shell-quote": {
+      "version": "1.8.3",
+      "resolved": "https://registry.npmjs.org/shell-quote/-/shell-quote-1.8.3.tgz",
+      "integrity": "sha512-ObmnIF4hXNg1BqhnHmgbDETF8dLPCggZWBjkQfhZpbszZnYur5DUljTcCHii5LC3J5E0yeO/1LIMyH+UvHQgyw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/sirv": {
       "version": "3.0.2",
       "resolved": "https://registry.npmjs.org/sirv/-/sirv-3.0.2.tgz",
@@ -3395,6 +3566,32 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/superjson": {
       "version": "2.2.6",
       "resolved": "https://registry.npmjs.org/superjson/-/superjson-2.2.6.tgz",
@@ -3408,6 +3605,21 @@
         "node": ">=16"
       }
     },
+    "node_modules/supports-color": {
+      "version": "8.1.1",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz",
+      "integrity": "sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==",
+      "license": "MIT",
+      "dependencies": {
+        "has-flag": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/supports-color?sponsor=1"
+      }
+    },
     "node_modules/tailwindcss": {
       "version": "4.1.18",
       "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-4.1.18.tgz",
@@ -3470,6 +3682,15 @@
         "node": ">=6"
       }
     },
+    "node_modules/tree-kill": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/tree-kill/-/tree-kill-1.2.2.tgz",
+      "integrity": "sha512-L0Orpi8qGpRG//Nd+H90vFB+3iHnue1zSSGmNOOCh1GLJ7rUKVwV2HvijphGQS2UmhUZewS9VgvxYIdgr+fG1A==",
+      "license": "MIT",
+      "bin": {
+        "tree-kill": "cli.js"
+      }
+    },
     "node_modules/tslib": {
       "version": "2.8.1",
       "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
@@ -3768,6 +3989,23 @@
       "integrity": "sha512-1ZUiV1FTwSiSrgWzV9KXJuOF2BVW91KY/mau04BhnmgOdroRQea7Q0s5TVqwGLm0D2tZwObd/tBYXW49sSxp3Q==",
       "license": "MIT"
     },
+    "node_modules/wrap-ansi": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
+      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
     "node_modules/wsl-utils": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/wsl-utils/-/wsl-utils-0.1.0.tgz",
@@ -3784,6 +4022,15 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/y18n": {
+      "version": "5.0.8",
+      "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
+      "integrity": "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=10"
+      }
+    },
     "node_modules/yallist": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz",
@@ -3791,6 +4038,33 @@
       "dev": true,
       "license": "ISC"
     },
+    "node_modules/yargs": {
+      "version": "17.7.2",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz",
+      "integrity": "sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==",
+      "license": "MIT",
+      "dependencies": {
+        "cliui": "^8.0.1",
+        "escalade": "^3.1.1",
+        "get-caller-file": "^2.0.5",
+        "require-directory": "^2.1.1",
+        "string-width": "^4.2.3",
+        "y18n": "^5.0.5",
+        "yargs-parser": "^21.1.1"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/yargs-parser": {
+      "version": "21.1.1",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz",
+      "integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/zrender": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/zrender/-/zrender-6.0.0.tgz",
diff --git a/package.json b/package.json
index e8fdee5..9f0a5e6 100644
--- a/package.json
+++ b/package.json
@@ -7,12 +7,16 @@
     "node": "^20.19.0 || >=22.12.0"
   },
   "scripts": {
-    "dev": "vite",
+    "dev": "npx concurrently \"npm run frontend\" \"npm run backend\"",
+    "frontend": "vite",
+    "backend": "cd API && venv\\Scripts\\activate && pip install -r requirements.txt && py main.py",
+    "install-all": "npm install && cd API && py -m venv venv && venv\\Scripts\\activate && pip install -r API/requirements.txt",
     "build": "vite build",
     "preview": "vite preview"
   },
   "dependencies": {
     "cesium": "^1.137.0",
+    "concurrently": "^9.2.1",
     "vue": "^3.5.26",
     "vue-cesium": "^3.2.12"
   },
diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index 013e6d4..39d260a 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -1,7 +1,7 @@
 <script setup>
 import {VcViewer} from "vue-cesium";
 import {ref, watch} from "vue";
-import {loadPlanes, prepareScene, removeMoving} from "@/utils/scene.js";
+import {loadPlanes, movePlanes, prepareScene, removeMoving} from "@/utils/scene.js";
 import Imagery from "@/components/imagery/Imagery.vue";
 import {flyTo} from "@/utils/camera.js";
 import Navigation from "@/components/navigation/Navigation.vue";
@@ -12,8 +12,8 @@ import MoonPhase from "@/components/MoonPhase.vue";
 const viewerRef = ref(null)
 const isViewerReady = ref(false)
 const cesiumToken = import.meta.env.VITE_CESIUM_ACCESS_TOKEN;
-const Vcviewer = ref()
-const cesium = ref()
+const mapViewer = ref(null)
+const cesium = ref(null)
 const location = defineProps({
   lng: undefined,
   lat: undefined
@@ -23,13 +23,13 @@ const location = defineProps({
 watch(
     [() => location.lat, () => location.lng],
     ([newLat, newLng]) => {
-      if (Vcviewer.value && newLat !== 0 && newLng !== 0) {
-        flyTo(Vcviewer.value.camera, cesium.value, newLat, newLng)
+      if (mapViewer.value && newLat !== 0 && newLng !== 0) {
+        flyTo(mapViewer.value.camera, cesium.value, newLat, newLng)
       } else {
         console.error(
             "Unable to update camera position: viewer is not ready or location is invalid.",
             {
-              viewerReady: !!Vcviewer.value,
+              viewerReady: !!mapViewer.value,
               lat: newLat,
               lng: newLng
             }
@@ -38,6 +38,7 @@ watch(
     }
 )
 
+
 const onViewerReady = async ({Cesium, viewer}) => {
   if (viewerRef.value) {
 
@@ -48,11 +49,13 @@ const onViewerReady = async ({Cesium, viewer}) => {
       }
 
       flyTo(viewer.camera, Cesium, location.lat, location.lng)
-      isViewerReady.value = true
-      Vcviewer.value = viewer
+      mapViewer.value = viewer
       cesium.value = Cesium
-     await loadPlanes(viewer)
-
+      await loadPlanes(viewer)
+      isViewerReady.value = true
+      setInterval(async () => {
+       await movePlanes(viewer)
+      }, 30000)
     } catch (error) {
       console.error("Error loading tileset:", error);
     }
@@ -60,6 +63,7 @@ const onViewerReady = async ({Cesium, viewer}) => {
 };
 
 
+
 </script>
 
 <template>
diff --git a/src/components/primitive/Moon.vue b/src/components/primitive/Moon.vue
index 5529b27..5460c2b 100644
--- a/src/components/primitive/Moon.vue
+++ b/src/components/primitive/Moon.vue
@@ -8,7 +8,8 @@ const billboard = ref(null)
 const cartographic = ref(null)
 const now = Cesium.JulianDate.now();
 const moonPos = Cesium.Simon1994PlanetaryPositions.computeMoonPositionInEarthInertialFrame(now);
-cartographic.value = Cesium.Cartographic.fromCartesian(moonPos);
+
+// cartographic.value = Cesium.Cartographic.fromCartesian(moonPos);
 
        point.value = {
         pixelSize: 28,
@@ -18,24 +19,17 @@ cartographic.value = Cesium.Cartographic.fromCartesian(moonPos);
         text: 'Moon ',
         pixelOffset: [0, 80]
       }
-      billboard.value = {
-        image: 'https://zouyaoji.top/vue-cesium/favicon.png',
-        scale: 1
-      }
 
 </script>
 <template>
 <!--  <el-row ref="viewerContainer" class="demo-viewer">-->
       <vc-entity
           ref="entity"
-
-          :position="{lng: cartographic.longitude, lat: cartographic.latitude, height: cartographic.height}"
+          :position="moonPos"
           :point="point"
           :label="label"
-
       >
         <!-- :coordinates = "{ west: 130, south: 20, east: 80, north: 25 }" -->
-<!--        <vc-graphics-rectangle :coordinates="[130, 20, 80, 25]" material="green"></vc-graphics-rectangle>-->
       </vc-entity>
 </template>
 
diff --git a/src/utils/api.js b/src/utils/api.js
new file mode 100644
index 0000000..716d82f
--- /dev/null
+++ b/src/utils/api.js
@@ -0,0 +1,19 @@
+export async function getFLights(url, params = {}) {
+    const searchParams = new URLSearchParams(params);
+    try {
+        const response = await fetch(`${url}?${searchParams.toString()}`, {
+            method: "GET",
+        });
+
+        if (!response.ok) {
+            throw new Error(`Response status: ${response.status}`);
+        }
+
+        const result = await response.json();
+        console.log(result);
+
+        return result
+    } catch (error) {
+        console.error(error.message);
+    }
+}
\ No newline at end of file
diff --git a/src/utils/scene.js b/src/utils/scene.js
index 8f79ea2..dfd026d 100644
--- a/src/utils/scene.js
+++ b/src/utils/scene.js
@@ -1,3 +1,5 @@
+import {getFLights} from "@/utils/api.js";
+
 export async function prepareScene(scene){
     //------------Uncomment if performance is low---------------------
     // scene.requestRenderMode = true; // Ne rendu que si nécessaire
@@ -27,98 +29,108 @@ export function removeMoving(scene){
     scene.screenSpaceCameraController.enableRotate = false;
 }
 export async function loadPlanes(viewer){
-
-    const url = "https://opensky-network.org/api/states/all?lamin=46.5&lomin=6.5&lamax=47.5&lomax=7.5";
     const airplaneUri = await Cesium.IonResource.fromAssetId(4359085);
-    const response = await fetch(url);
-    const data = {
-        time: 1768771804,
-        states: [
-            ["4952d0", "TAP556  ", "Portugal", 1768771803, 1768771804, 7.0329, 46.6013, 11582.48, false, 217.97, 60.29, 0, null, 11490.96, "2276", false, 0],
-            ["3c65c8", "DLH44X  ", "Germany", 1768771803, 1768771803, 7.3766, 46.8955, 11871.96, false, 220.15, 239.84, 0, null, 11772.9, "1000", false, 0],
-            ["440036", "EJU47NM ", "Austria", 1768771803, 1768771803, 7.4283, 47.0293, 7917.18, false, 210.5, 231.45, 9.43, null, 7962.9, "3062", false, 0],
-            ["4b027c", "EJU58HR ", "Switzerland", 1768771803, 1768771803, 7.2721, 46.9609, 4800.6, false, 174.94, 1.0, -7.8, null, 4892.04, "1000", false, 0]
-        ]
-    };
-    // const data = await response.json();
-    const formattedFlights = data.states.map(flight => {
-        return {
-            callsign: flight[1].trim(), // Nom de l'avion
-            longitude: flight[5],             // Longitude
-            latitude: flight[6],             // Latitude
-            height: flight[7]           // Hauteur (Altitude)
-        };
-    });
-
-
-    const osmBuildings = await Cesium.createOsmBuildingsAsync();
-    // Uncomment if you want 3d buildings dispalyed
-    // viewer.scene.primitives.add(osmBuildings);
-
-    /* Initialize the viewer clock:
-      Assume the radar samples are 30 seconds apart, and calculate the entire flight duration based on that assumption.
-      Get the start and stop date times of the flight, where the start is the known flight departure time (converted from PST
-        to UTC) and the stop is the start plus the calculated duration. (Note that Cesium uses Julian dates. See
-        https://simple.wikipedia.org/wiki/Julian_day.)
-      Initialize the viewer's clock by setting its start and stop to the flight start and stop times we just calculated.
-      Also, set the viewer's current time to the start time and take the user to that time.
-    */
-    const timeStepInSeconds = 30;
-    // const totalSeconds = timeStepInSeconds * (flightData.length - 1);
-    const start = Cesium.JulianDate.now();
-    const stop = Cesium.JulianDate.addSeconds(start, 10000000000, new Cesium.JulianDate());
-
-    viewer.clock.startTime = start.clone();
-    // viewer.clock.stopTime = stop.clone();
-    viewer.clock.currentTime = start.clone();
-
-    // viewer.timeline.zoomTo(start, stop);
-    // Speed up the playback speed 50x.
-    viewer.clock.multiplier = 2;
-    // Start playing the scene.
-    viewer.clock.shouldAnimate = true;
-
-    // The SampledPositionedProperty stores the position and timestamp for each sample along the radar sample series.
-
-    for (let i = 0; i < formattedFlights.length; i++) {
-        const positionProperty = new Cesium.SampledPositionProperty();
-
-        const dataPoint = formattedFlights[i];
-
-        // Declare the time for this individual sample and store it in a new JulianDate instance.
-        const time = Cesium.JulianDate.addSeconds(start, i * timeStepInSeconds, new Cesium.JulianDate());
-
-        const position = Cesium.Cartesian3.fromDegrees(dataPoint.longitude, dataPoint.latitude, dataPoint.height);
-        // Store the position along with its timestamp.
-        // Here we add the positions all upfront, but these can be added at run-time as samples are received from a server.
-        positionProperty.addSample(time, position);
-
-        viewer.entities.add({
-            description: `Location: (${dataPoint.longitude}, ${dataPoint.latitude}, ${dataPoint.height})`,
-            position: position,
-            point: { pixelSize: 10, color: Cesium.Color.RED }
-        });
-
-           await loadModel(viewer, start, stop, position, airplaneUri);
-
+    const data = await getFLights('http://localhost:8080/flights', {long:6.500465335539498 , lat: 46.82166054184684})
+
+    if(data !== undefined) {
+        const osmBuildings = await Cesium.createOsmBuildingsAsync();
+        // Uncomment if you want 3d buildings dispalyed
+        // viewer.scene.primitives.add(osmBuildings);
+
+        /* Initialize the viewer clock:
+          Assume the radar samples are 30 seconds apart, and calculate the entire flight duration based on that assumption.
+          Get the start and stop date times of the flight, where the start is the known flight departure time (converted from PST
+            to UTC) and the stop is the start plus the calculated duration. (Note that Cesium uses Julian dates. See
+            https://simple.wikipedia.org/wiki/Julian_day.)
+          Initialize the viewer's clock by setting its start and stop to the flight start and stop times we just calculated.
+          Also, set the viewer's current time to the start time and take the user to that time.
+        */
+        const timeStepInSeconds = 30;
+        // const totalSeconds = timeStepInSeconds * (flightData.length - 1);
+        const start = Cesium.JulianDate.now();
+        const stop = Cesium.JulianDate.addSeconds(start, 10000000000, new Cesium.JulianDate());
+
+        viewer.clock.startTime = start.clone();
+        viewer.clock.stopTime = stop.clone();
+        viewer.clock.currentTime = start.clone();
+
+        // viewer.timeline.zoomTo(start, stop);
+        // Speed up the playback speed 50x.
+        viewer.clock.multiplier = 2;
+        // Start playing the scene.
+        viewer.clock.shouldAnimate = true;
+
+        // The SampledPositionedProperty stores the position and timestamp for each sample along the radar sample series.
+
+        for (let i = 0; i < data.length; i++) {
+            const positionProperty = new Cesium.SampledPositionProperty();
+
+            const flight = data[i];
+
+            // Declare the time for this individual sample and store it in a new JulianDate instance.
+            // const time = Cesium.JulianDate.addSeconds(start, i * timeStepInSeconds, new Cesium.JulianDate());
+
+            const position = Cesium.Cartesian3.fromDegrees(flight.long, flight.lat, flight.alt);
+            // Store the position along with its timestamp.
+            // Here we add the positions all upfront, but these can be added at run-time as samples are received from a server.
+            positionProperty.addSample(start, position);
+            // Make planes appear even if it's too late
+            positionProperty.forwardExtrapolationType = Cesium.ExtrapolationType.HOLD
+            positionProperty.backwardExtrapolationType = Cesium.ExtrapolationType.HOLD
+
+            viewer.entities.add({
+                description: `Location: (${flight.long}, ${flight.lat}, ${flight.alt})`,
+                position: position,
+                point: {pixelSize: 10, color: Cesium.Color.RED}
+            });
+
+            await loadModel(viewer, start, stop, positionProperty, airplaneUri, flight.id);
+
+        }
     }
 
 
-
 }
 
-async function loadModel(viewer, start, stop, positionProperty, airplaneUri) {
+async function loadModel(viewer, start, stop, positionProperty, airplaneUri, id) {
     // Load the glTF model from Cesium ion.
     const airplaneEntity = viewer.entities.add({
-        // availability: new Cesium.TimeIntervalCollection([ new Cesium.TimeInterval({ start: start, stop: stop }) ]),
+        id: id,
+        availability: new Cesium.TimeIntervalCollection([ new Cesium.TimeInterval({ start: start, stop: stop }) ]),
+        // position: positionProperty,
         position: positionProperty,
         // Attach the 3D model instead of the green point.
-        model: { uri: airplaneUri,minimumPixelSize: 200  },
+        model: {uri: airplaneUri,minimumPixelSize: 200  },
         // Automatically compute the orientation from the position.
-        // orientation: new Cesium.VelocityOrientationProperty(positionProperty),
+        orientation: new Cesium.VelocityOrientationProperty(positionProperty),
         path: new Cesium.PathGraphics({ width: 3 })
     });
 
     // viewer.trackedEntity = airplaneEntity;
 }
 
+export async function movePlanes(viewer){
+
+    const data = await getFLights('http://localhost:8080/flights', {long:6.500465335539498 , lat: 46.82166054184684})
+
+    if (data !== undefined) {
+        data.forEach(flight => {
+            let entity = viewer.entities.values.find((element) => element.id === flight.id)
+            const time = Cesium.JulianDate.now();
+            const nextPos = Cesium.Cartesian3.fromDegrees(flight.long, flight.lat, flight.alt)
+            viewer.entities.add({
+                description: `Location: (${flight.long}, ${flight.lat}, ${flight.alt})`,
+                position: nextPos,
+                point: {pixelSize: 10, color: Cesium.Color.RED},
+                orientation: new Cesium.VelocityOrientationProperty(nextPos)
+            });
+
+            entity.position.addSample(time, nextPos)
+        })
+    }
+}
+
+function addNextPostion(){
+
+}
+

From d39768c94b582cf76b6ffe7cf711ec1e30da14ab Mon Sep 17 00:00:00 2001
From: David Galindo <155019077+davidgalindo-git@users.noreply.github.com>
Date: Thu, 22 Jan 2026 08:49:49 +0100
Subject: [PATCH 28/61] moon display on real-time position (#58)

* fix: "moon current location"

* refactor: "moon current location improved"

---------

Co-authored-by: davidgalindo-git <>
---
 src/components/Viewer.vue         |  19 +++-
 src/components/primitive/Moon.vue | 174 +++++++++++++++++++++++++-----
 2 files changed, 162 insertions(+), 31 deletions(-)

diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index 39d260a..84b969c 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -1,6 +1,6 @@
 <script setup>
 import {VcViewer} from "vue-cesium";
-import {ref, watch} from "vue";
+import {nextTick, ref, watch} from "vue";
 import {loadPlanes, movePlanes, prepareScene, removeMoving} from "@/utils/scene.js";
 import Imagery from "@/components/imagery/Imagery.vue";
 import {flyTo} from "@/utils/camera.js";
@@ -19,6 +19,7 @@ const location = defineProps({
   lat: undefined
 })
 
+const moonComponentRef = ref(null)
 
 watch(
     [() => location.lat, () => location.lng],
@@ -40,14 +41,24 @@ watch(
 
 
 const onViewerReady = async ({Cesium, viewer}) => {
+  isViewerReady.value = true
+  window.cesiumViewer = viewer; // This makes it accessible in the console!
+  window.CesiumGlobal = Cesium;
   if (viewerRef.value) {
-
     try {
       if (Cesium) {
         await prepareScene(viewer.scene)
         // removeMoving(viewer.scene)
       }
-
+      viewer.scene.farToNearRatio = 1000000;
+      viewer.scene.logarithmicDepthBuffer = true;
+      await nextTick()
+      if (moonComponentRef.value){
+        console.log("Found Moon Component, initializing...");
+        moonComponentRef.value.onViewerReady({Cesium, viewer})
+      } else {
+        console.error("Moon Component Ref is NULL. Check if Moon is inside a v-if.");
+      }
       flyTo(viewer.camera, Cesium, location.lat, location.lng)
       mapViewer.value = viewer
       cesium.value = Cesium
@@ -79,7 +90,7 @@ const onViewerReady = async ({Cesium, viewer}) => {
           <Imagery/>
           <Terrain/>
           <Navigation/>
-      <Moon/>
+      <Moon ref="moonComponentRef" />
       <MoonPhase v-bind="location" />
     </template>
     <MoonPhase/>
diff --git a/src/components/primitive/Moon.vue b/src/components/primitive/Moon.vue
index 5460c2b..536c938 100644
--- a/src/components/primitive/Moon.vue
+++ b/src/components/primitive/Moon.vue
@@ -1,35 +1,155 @@
-<script setup >
+<script setup>
+import { ref, onBeforeUnmount, computed } from "vue";
 
-import {ref} from "vue";
+/*
+This component defines Moon's parameters and places it to real location in real time.
+ */
 
-const point = ref(null)
-const label = ref(null)
-const billboard = ref(null)
-const cartographic = ref(null)
-const now = Cesium.JulianDate.now();
-const moonPos = Cesium.Simon1994PlanetaryPositions.computeMoonPositionInEarthInertialFrame(now);
+// reactive references for Moon's visual appearance and position
+const moonPos = ref(null); // 3D position (x, y, z)
+const point = ref(null);  // point space marker (Moon display)
+const label = ref(null);  // display text above Moon
 
-// cartographic.value = Cesium.Cartographic.fromCartesian(moonPos);
+// const debugStatus = ref("Waiting for viewer..."); // DEBUG
+let removeTickListener = null; // for detaching Cesium clock listener when component is destroyed
 
-       point.value = {
-        pixelSize: 28,
-        color: 'blue'
-      }
-      label.value = {
-        text: 'Moon ',
-        pixelOffset: [0, 80]
-      }
+const onViewerReady = ({ Cesium, viewer }) => {
+  if (removeTickListener) return; // prevent attaching duplicate clock listeners
 
+  // debugStatus.value = "Viewer Ready - Tracking Moon..."; // DEBUG
+
+  viewer.scene.farToNearRatio = 1_000_000; // improve depth ratio for large scale scene (Earth to Moon)
+  viewer.scene.logarithmicDepthBuffer = true; // switches depth layer distribution to log for better large scale precision
+
+  // style config
+  // point marker (Moon)
+  point.value = {
+    pixelSize: 40,
+    color: Cesium.Color.fromCssColorString("#B2B2B2"), // Moon gray
+    outlineColor: Cesium.Color.WHITE,
+    outlineWidth: 2,
+    disableDepthTestDistance: Number.POSITIVE_INFINITY // set limit to infinity to ensure Moon is always displayed in front
+  };
+
+  // "Moon" label for easy spotting
+  label.value = {
+    text: "MOON",
+    font: "14pt monospace",
+    fillColor: Cesium.Color.WHITE,
+    outlineWidth: 2,
+    verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
+    pixelOffset: new Cesium.Cartesian2(0, -50)
+  };
+
+  // temporally allocated storage for dynamic variables (avoid creating new objects every time)
+  const scratchMatrix = new Cesium.Matrix3();
+  const scratchFixedMatrix = new Cesium.Matrix3();
+  const scratchCartesian = new Cesium.Cartesian3();
+
+  // frame counter
+  let frame = 0;
+
+  // runs on every Cesium clock tick, computes Moon's position relative to Earth
+  const listener = (clock) => {
+    frame++;
+    if (frame % 5 !== 0) return; // update every 5 frames (avoid over-rendering)
+
+    // try to get current Moon position from scene
+    let pos = viewer.scene.moon.position;
+
+    // use math to calculate if pos isn't readable from scene
+    if (!Cesium.defined(pos)) {
+      pos = Cesium.Simon1994PlanetaryPositions.computeMoonPositionInEarthInertialFrame(clock.currentTime);
+    }
+
+    // stop if Moon's position is still unreadable
+    if (!Cesium.defined(pos)) return;
+
+    // compute transformation matrix from ECEF (Earth-Fixed) to ICRF (inertial) coordinates at current time
+    const icrfToFixed = Cesium.Transforms.computeFixedToIcrfMatrix(
+        clock.currentTime,
+        scratchMatrix
+    );
+
+    // stop if matrix is undefined
+    if (!Cesium.defined(icrfToFixed)) return;
+
+    // transpose matrix to convert from ICRF (inertial) to ECEF (Earth-Fixed)
+    const fixedToIcrf = Cesium.Matrix3.transpose(
+        icrfToFixed,
+        scratchFixedMatrix
+    );
+
+    // apply transformation to Moon's inertial position, result is cartesian coordinate
+    Cesium.Matrix3.multiplyByVector(
+        fixedToIcrf,
+        pos,
+        scratchCartesian
+    );
+
+    // reactive relocation and rerender if position delta > 10 meters
+    if (
+        !moonPos.value ||
+        // square function for strict positive value
+        Cesium.Cartesian3.distanceSquared(moonPos.value, scratchCartesian) > 100
+    ) {
+      moonPos.value = Cesium.Cartesian3.clone(
+          scratchCartesian,
+          moonPos.value || new Cesium.Cartesian3()
+      );
+      // debugStatus.value = "Moon Synced"; // DEBUG
+    }
+  };
+
+  // add clock listener for regular Moon position update
+  viewer.clock.onTick.addEventListener(listener);
+  // save function that removes clock listener when component is destroyed
+  removeTickListener = () => viewer.clock.onTick.removeEventListener(listener);
+
+  /* Uncomment to redirect camera to moon's location
+  // ---- CAMERA FLIGHT TO MOON ----
+  setTimeout(() => {
+    if (!moonPos.value) return;
+
+    debugStatus.value = "Traveling to Moon...";
+
+    const offset = Cesium.Cartesian3.multiplyByScalar(
+        Cesium.Cartesian3.normalize(moonPos.value, new Cesium.Cartesian3()),
+        20_000_000,
+        new Cesium.Cartesian3()
+    );
+
+    viewer.camera.flyTo({
+      destination: Cesium.Cartesian3.subtract(
+          moonPos.value,
+          offset,
+          new Cesium.Cartesian3()
+      ),
+      orientation: {
+        direction: Cesium.Cartesian3.normalize(offset, new Cesium.Cartesian3()),
+        up: Cesium.Cartesian3.UNIT_Z
+      },
+      duration: 5
+    });
+  }, 4000);
+  */
+};
+
+onBeforeUnmount(() => {
+  // ensure clock listener is removed when component is destroyed
+  if (removeTickListener) removeTickListener();
+});
+// expose function to make it accessible outside component with
+// "moonComponentRef.value.onViewerReady({ Cesium, viewer})"
+defineExpose({ onViewerReady });
 </script>
+
 <template>
-<!--  <el-row ref="viewerContainer" class="demo-viewer">-->
-      <vc-entity
-          ref="entity"
-          :position="moonPos"
-          :point="point"
-          :label="label"
-      >
-        <!-- :coordinates = "{ west: 130, south: 20, east: 80, north: 25 }" -->
-      </vc-entity>
+  <!-- render Moon only if there's a valid position -->
+  <vc-entity
+      v-if="moonPos"
+      :position="moonPos"
+      :point="point"
+      :label="label"
+  />
 </template>
-

From abf58b3db3d29fd0f375106f03bdca1f28fb226e Mon Sep 17 00:00:00 2001
From: Joris Bailly <90181523+JorisBly@users.noreply.github.com>
Date: Thu, 22 Jan 2026 10:17:50 +0100
Subject: [PATCH 29/61] Feature/fix plane position (#59)

* fix(): Error breaking

* fix(): Check if viewer.entities is defined

* feat(): Remove planes from viewer when no data received anymore

* feat(): Add future key nneded for opensky fetching with credits

* fix(): Import HTTPException from fastapi

* fix(): Fix command install-all

* chore(): Add requirements and update install-all script

* feat(): Use token from opensky to use credits

* chore(): Add Prerequisites for Cesium and opensky accounts

* refactor(): move adding position in a specific function to isolate it
---
 .env.example              |  5 +++-
 API/fetchFlights.py       | 36 ++++++++++++++++++++++++--
 API/main.py               |  2 --
 README.md                 | 11 +++++++-
 package.json              |  4 +--
 src/components/Viewer.vue |  7 +++---
 src/utils/scene.js        | 53 ++++++++++++++++++++-------------------
 7 files changed, 81 insertions(+), 37 deletions(-)

diff --git a/.env.example b/.env.example
index e1ac669..521082f 100644
--- a/.env.example
+++ b/.env.example
@@ -1,4 +1,7 @@
 VITE_CESIUM_ACCESS_TOKEN="YOUR_CESIUM_ACCESS_TOKEN"
 
 VITE_MOON_PHASE_APP_ID="YOUR_APP_ID"
-VITE_MOON_PHASE_APP_SECRET="YOUR_MOON_APP_SECRET"
\ No newline at end of file
+VITE_MOON_PHASE_APP_SECRET="YOUR_MOON_APP_SECRET"
+
+OPENSKY_CLIENT_ID="YOUR_CLIENT_ID"
+OPENSKY_CLIENT_SECRET="YOU_SECRET"
\ No newline at end of file
diff --git a/API/fetchFlights.py b/API/fetchFlights.py
index 4e83b7d..79347b8 100644
--- a/API/fetchFlights.py
+++ b/API/fetchFlights.py
@@ -5,6 +5,36 @@
 Desc : API data fetching script
 """
 import requests
+from os import path, getenv
+from dotenv import load_dotenv
+from fastapi import HTTPException
+
+dotenv_path = path.join(path.dirname(__file__), '..', '.env')
+load_dotenv(dotenv_path)
+
+
+def get_opensky_token():
+    client_id = getenv("OPENSKY_CLIENT_ID")
+    client_secret = getenv("OPENSKY_CLIENT_SECRET")
+
+    auth_url = "https://auth.opensky-network.org/auth/realms/opensky-network/protocol/openid-connect/token"
+
+    payload = {
+        "grant_type": "client_credentials",
+        "client_id": client_id,
+        "client_secret": client_secret
+    }
+
+    try:
+        response = requests.post(auth_url, data=payload)
+        response.raise_for_status()
+
+        token_data = response.json()
+        return token_data.get("access_token")
+
+    except requests.exceptions.RequestException as e:
+        print(f"Erreur lors de l'authentification : {e}")
+        return None
 
 
 def get_flights(user_lat, user_long):
@@ -47,11 +77,13 @@ def get_flights(user_lat, user_long):
         "lamax": user_lat,
         "lomax": user_long+1
     }
-
+    token = get_opensky_token()
     # search for data at the URL specified with the parameters
-    response = requests.get(url, params=params)
+    response = requests.get(url, params=params, headers={'Authorization': 'Bearer ' + token})
 
     if response.status_code != 200:
+        if response.status_code == 429:
+         raise HTTPException(status_code=429, detail="Item not found")
         return response
     # extract only the JSON of the response
     data = response.json()
diff --git a/API/main.py b/API/main.py
index f731f72..6977a97 100644
--- a/API/main.py
+++ b/API/main.py
@@ -42,8 +42,6 @@ def get_flights_endpoint(
 
     # Fetch flights for the given coordinates
     flights = get_flights(lat, long)
-    if flights.status_code == 429:
-        raise HTTPException(status_code=429, detail="Item not found")
     # If no data is found
     if not flights:
         return {"message": "No data found"}
diff --git a/README.md b/README.md
index d1a3109..1d91add 100644
--- a/README.md
+++ b/README.md
@@ -6,10 +6,19 @@
 - [Vue.js](https://vuejs.org/)
 - [vue-cesium](https://zouyaoji.top/vue-cesium/#/en-US)
 - [DaisyUi](https://daisyui.com/)
+
+## Requirements
+- Node.js 20.19.0+
+- Python 3.10+
+
+## Prerequisites
+    - A Cesium ion account (To Downloads and load assets)
+    - A Opensky account (To get more credits for the API)
+
 ## Project Setup
 
 ```sh
-npm install
+npm run install-all
 ```
 
 ### Compile and Hot-Reload for Development
diff --git a/package.json b/package.json
index 9f0a5e6..b5797b3 100644
--- a/package.json
+++ b/package.json
@@ -9,8 +9,8 @@
   "scripts": {
     "dev": "npx concurrently \"npm run frontend\" \"npm run backend\"",
     "frontend": "vite",
-    "backend": "cd API && venv\\Scripts\\activate && pip install -r requirements.txt && py main.py",
-    "install-all": "npm install && cd API && py -m venv venv && venv\\Scripts\\activate && pip install -r API/requirements.txt",
+    "backend": "cd API && .venv\\Scripts\\activate && pip install -r requirements.txt && py main.py",
+    "install-all": "npm install && cd API && py -m venv .venv && .venv\\Scripts\\activate && pip install -r requirements.txt",
     "build": "vite build",
     "preview": "vite preview"
   },
diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index 84b969c..6d57e5b 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -62,11 +62,13 @@ const onViewerReady = async ({Cesium, viewer}) => {
       flyTo(viewer.camera, Cesium, location.lat, location.lng)
       mapViewer.value = viewer
       cesium.value = Cesium
-      await loadPlanes(viewer)
+      await loadPlanes(mapViewer.value)
       isViewerReady.value = true
+
       setInterval(async () => {
-       await movePlanes(viewer)
+       await movePlanes(mapViewer.value)
       }, 30000)
+
     } catch (error) {
       console.error("Error loading tileset:", error);
     }
@@ -85,7 +87,6 @@ const onViewerReady = async ({Cesium, viewer}) => {
       ref="viewerRef"
       :access-token="cesiumToken"
       @ready="onViewerReady">
-
     <template v-if="isViewerReady">
           <Imagery/>
           <Terrain/>
diff --git a/src/utils/scene.js b/src/utils/scene.js
index dfd026d..97ff82d 100644
--- a/src/utils/scene.js
+++ b/src/utils/scene.js
@@ -51,12 +51,12 @@ export async function loadPlanes(viewer){
         const stop = Cesium.JulianDate.addSeconds(start, 10000000000, new Cesium.JulianDate());
 
         viewer.clock.startTime = start.clone();
-        viewer.clock.stopTime = stop.clone();
+        // viewer.clock.stopTime = stop.clone();
         viewer.clock.currentTime = start.clone();
 
         // viewer.timeline.zoomTo(start, stop);
         // Speed up the playback speed 50x.
-        viewer.clock.multiplier = 2;
+        viewer.clock.multiplier = 1;
         // Start playing the scene.
         viewer.clock.shouldAnimate = true;
 
@@ -78,11 +78,11 @@ export async function loadPlanes(viewer){
             positionProperty.forwardExtrapolationType = Cesium.ExtrapolationType.HOLD
             positionProperty.backwardExtrapolationType = Cesium.ExtrapolationType.HOLD
 
-            viewer.entities.add({
-                description: `Location: (${flight.long}, ${flight.lat}, ${flight.alt})`,
-                position: position,
-                point: {pixelSize: 10, color: Cesium.Color.RED}
-            });
+            // viewer.entities.add({
+            //     description: `Location: (${flight.long}, ${flight.lat}, ${flight.alt})`,
+            //     position: position,
+            //     point: {pixelSize: 10, color: Cesium.Color.RED}
+            // });
 
             await loadModel(viewer, start, stop, positionProperty, airplaneUri, flight.id);
 
@@ -100,37 +100,38 @@ async function loadModel(viewer, start, stop, positionProperty, airplaneUri, id)
         // position: positionProperty,
         position: positionProperty,
         // Attach the 3D model instead of the green point.
-        model: {uri: airplaneUri,minimumPixelSize: 200  },
+        model: {uri: airplaneUri,minimumPixelSize: 100  },
         // Automatically compute the orientation from the position.
         orientation: new Cesium.VelocityOrientationProperty(positionProperty),
-        path: new Cesium.PathGraphics({ width: 3 })
+        path: new Cesium.PathGraphics({ width: 3 , trailTime: 30})
     });
-
-    // viewer.trackedEntity = airplaneEntity;
 }
 
 export async function movePlanes(viewer){
 
     const data = await getFLights('http://localhost:8080/flights', {long:6.500465335539498 , lat: 46.82166054184684})
+    const futureTime = Cesium.JulianDate.addSeconds(
+        viewer.clock.currentTime,
+        31,
+        new Cesium.JulianDate()
+    );
+    if (data !== undefined && viewer.entities !== undefined) {
+        viewer.entities.values.forEach(entity => {
+            const flight = data.find(flight => flight.id === entity.id)
+            if(flight !== undefined){
+                addNextPostion(flight, entity, futureTime)
+            }else{
+                viewer.entities.remove(entity)
+            }
 
-    if (data !== undefined) {
-        data.forEach(flight => {
-            let entity = viewer.entities.values.find((element) => element.id === flight.id)
-            const time = Cesium.JulianDate.now();
-            const nextPos = Cesium.Cartesian3.fromDegrees(flight.long, flight.lat, flight.alt)
-            viewer.entities.add({
-                description: `Location: (${flight.long}, ${flight.lat}, ${flight.alt})`,
-                position: nextPos,
-                point: {pixelSize: 10, color: Cesium.Color.RED},
-                orientation: new Cesium.VelocityOrientationProperty(nextPos)
-            });
-
-            entity.position.addSample(time, nextPos)
         })
+
     }
 }
 
-function addNextPostion(){
-
+function addNextPostion(flight, entity, futureTime){
+    const time = Cesium.JulianDate.now();
+    const nextPos = Cesium.Cartesian3.fromDegrees(flight.long, flight.lat, flight.alt)
+    entity.position.addSample(futureTime, nextPos)
 }
 

From 235077634761fd1e1b725e61beddb835c2d0cee1 Mon Sep 17 00:00:00 2001
From: Jorisbly <joris.bailly.2001@gmail.com>
Date: Thu, 22 Jan 2026 13:30:52 +0100
Subject: [PATCH 30/61] chore(): Remove .idea

---
 .idea/.gitignore            | 10 ----------
 .idea/jsLibraryMappings.xml |  6 ------
 .idea/modules.xml           |  8 --------
 .idea/vcs.xml               |  6 ------
 .vscode/extensions.json     |  3 ---
 5 files changed, 33 deletions(-)
 delete mode 100644 .idea/.gitignore
 delete mode 100644 .idea/jsLibraryMappings.xml
 delete mode 100644 .idea/modules.xml
 delete mode 100644 .idea/vcs.xml
 delete mode 100644 .vscode/extensions.json

diff --git a/.idea/.gitignore b/.idea/.gitignore
deleted file mode 100644
index ab1f416..0000000
--- a/.idea/.gitignore
+++ /dev/null
@@ -1,10 +0,0 @@
-# Default ignored files
-/shelf/
-/workspace.xml
-# Ignored default folder with query files
-/queries/
-# Datasource local storage ignored files
-/dataSources/
-/dataSources.local.xml
-# Editor-based HTTP Client requests
-/httpRequests/
diff --git a/.idea/jsLibraryMappings.xml b/.idea/jsLibraryMappings.xml
deleted file mode 100644
index d23208f..0000000
--- a/.idea/jsLibraryMappings.xml
+++ /dev/null
@@ -1,6 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="JavaScriptLibraryMappings">
-    <includedPredefinedLibrary name="Node.js Core" />
-  </component>
-</project>
\ No newline at end of file
diff --git a/.idea/modules.xml b/.idea/modules.xml
deleted file mode 100644
index f288451..0000000
--- a/.idea/modules.xml
+++ /dev/null
@@ -1,8 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="ProjectModuleManager">
-    <modules>
-      <module fileurl="file://$PROJECT_DIR$/.idea/Planium.iml" filepath="$PROJECT_DIR$/.idea/Planium.iml" />
-    </modules>
-  </component>
-</project>
\ No newline at end of file
diff --git a/.idea/vcs.xml b/.idea/vcs.xml
deleted file mode 100644
index 35eb1dd..0000000
--- a/.idea/vcs.xml
+++ /dev/null
@@ -1,6 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="VcsDirectoryMappings">
-    <mapping directory="" vcs="Git" />
-  </component>
-</project>
\ No newline at end of file
diff --git a/.vscode/extensions.json b/.vscode/extensions.json
deleted file mode 100644
index a7cea0b..0000000
--- a/.vscode/extensions.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
-  "recommendations": ["Vue.volar"]
-}

From e6b7f10812096e419c74d29f177635a0705f552a Mon Sep 17 00:00:00 2001
From: Jorisbly <joris.bailly.2001@gmail.com>
Date: Thu, 22 Jan 2026 13:31:16 +0100
Subject: [PATCH 31/61] chore(): .vscode

---
 .vscode/extensions.json | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 create mode 100644 .vscode/extensions.json

diff --git a/.vscode/extensions.json b/.vscode/extensions.json
new file mode 100644
index 0000000..e69de29

From aac470a93c994c9bb20eaa00b00fd6a68778515b Mon Sep 17 00:00:00 2001
From: Jorisbly <joris.bailly.2001@gmail.com>
Date: Thu, 22 Jan 2026 13:31:43 +0100
Subject: [PATCH 32/61] chore(): remove extension.json from .vscode

---
 .vscode/extensions.json | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 delete mode 100644 .vscode/extensions.json

diff --git a/.vscode/extensions.json b/.vscode/extensions.json
deleted file mode 100644
index e69de29..0000000

From fb54317e466c965049268bbc2682ce9744c4c943 Mon Sep 17 00:00:00 2001
From: Sofian Hussein <sofian.hussein@eduvaud.ch>
Date: Thu, 22 Jan 2026 13:36:11 +0100
Subject: [PATCH 33/61] Feature/modifiy scene (#60)

* feat(): Disable scroll wheel zoom

* feat(): Disable the movement with the mouse

* feat(): Remove compass

* feat(): Add joystick for the orientation

* feat(): Add a CompassIndicator and block the movement with the mouse, keep only the change of direction

* fix(): Fix the problem with the camera and the compass indicator

* fix(): Fix the problem with the CompassIndicator

* fix(): Don't allow the zoom with the scroll wheel

---------

Co-authored-by: omegasofian2304 <pn82bby@eduvaud.ch>
---
 src/App.vue                              |   1 -
 src/components/CameraController.vue      |  60 +++++++++++
 src/components/CompassIndicator.vue      | 122 +++++++++++++++++++++++
 src/components/Viewer.vue                |   6 +-
 src/components/navigation/Compass.vue    |  11 --
 src/components/navigation/Navigation.vue |   2 -
 src/utils/scene.js                       |  13 +++
 7 files changed, 200 insertions(+), 15 deletions(-)
 create mode 100644 src/components/CameraController.vue
 create mode 100644 src/components/CompassIndicator.vue
 delete mode 100644 src/components/navigation/Compass.vue

diff --git a/src/App.vue b/src/App.vue
index e0676ec..c04aa5c 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,7 +1,6 @@
 <script setup>
 import CoordinateForm from "@/components/CoordinateForm.vue";
 import NavBar from "@/components/NavBar.vue";
-
 </script>
 
 <template>
diff --git a/src/components/CameraController.vue b/src/components/CameraController.vue
new file mode 100644
index 0000000..ca81dad
--- /dev/null
+++ b/src/components/CameraController.vue
@@ -0,0 +1,60 @@
+<template>
+  <input
+      type="range"
+      min="-100"
+      max="100"
+      v-model.number="value"
+      class="fixed right-4 top-4 w-65 h-4 bg-gray-600 rounded-lg"
+  />
+</template>
+
+<script setup>
+import { ref, watch } from 'vue'
+
+const props = defineProps({
+  viewer: {
+    type: Object,
+    required: true
+  }
+})
+
+const value = ref(0)
+
+let animationFrameId = null
+
+watch(value, (newValue) => {
+  // Stop previous animation if exists
+  if (animationFrameId) {
+    cancelAnimationFrame(animationFrameId)
+    animationFrameId = null
+  }
+
+  // If slider is between -20 and 20, stop rotation (dead zone)
+  if (newValue >= -20 && newValue <= 20) {
+    return
+  }
+
+  // Start continuous rotation
+  const rotate = () => {
+    // Get current camera orientation
+    const heading = props.viewer.camera.heading
+
+    // Convert slider value to rotation speed
+    const speed = newValue / 5000
+
+    // Update heading (rotate the camera on itself)
+    props.viewer.camera.setView({
+      orientation: {
+        heading: heading + speed,
+        pitch: props.viewer.camera.pitch,
+        roll: props.viewer.camera.roll
+      }
+    })
+
+    // Continue animation
+    animationFrameId = requestAnimationFrame(rotate)
+  }
+
+  rotate()
+})
+</script>
diff --git a/src/components/CompassIndicator.vue b/src/components/CompassIndicator.vue
new file mode 100644
index 0000000..0254c1e
--- /dev/null
+++ b/src/components/CompassIndicator.vue
@@ -0,0 +1,122 @@
+<template>
+  <div class="compass-container">
+    <div class="direction-info">
+      <div class="cardinal-direction">{{ cardinalDirection }}</div>
+      <div class="degree-value">{{ Math.round(heading) }}°</div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, computed, onMounted, onUnmounted, watch } from 'vue';
+import * as Cesium from 'cesium';
+
+const props = defineProps({
+  viewer: {
+    type: Object,
+    required: true
+  }
+});
+
+const heading = ref(0);
+
+const cardinalDirection = computed(() => {
+  const h = heading.value;
+  if (h >= 337.5 || h < 22.5) return 'Nord';
+  if (h < 67.5) return 'Nord-Est';
+  if (h < 112.5) return 'Est';
+  if (h < 157.5) return 'Sud-Est';
+  if (h < 202.5) return 'Sud';
+  if (h < 247.5) return 'Sud-Ouest';
+  if (h < 292.5) return 'Ouest';
+  return 'Nord-Ouest';
+});
+
+const updateOrientation = () => {
+  const camera = props.viewer?.camera;
+  if (!camera) {
+    console.log('Camera not available yet');
+    return;
+  }
+
+  let h = Cesium.Math.toDegrees(camera.heading);
+  if (h < 0) h += 360;
+  heading.value = h;
+};
+
+let removePostRender = null;
+
+const setupListener = () => {
+  // Clean up previous listener
+  if (removePostRender) {
+    removePostRender();
+    removePostRender = null;
+  }
+
+  // Check if viewer and scene are ready
+  if (!props.viewer?.scene) {
+    console.log('Viewer or scene not ready');
+    return;
+  }
+
+  console.log('Setting up compass listener');
+
+  // Initial update
+  updateOrientation();
+
+  // Listen to scene rendering
+  removePostRender = props.viewer.scene.postRender.addEventListener(() => {
+    updateOrientation();
+  });
+};
+
+// Watch for viewer changes
+watch(() => props.viewer, (newViewer) => {
+  if (newViewer?.scene) {
+    console.log('Viewer is now ready, setting up compass');
+    setupListener();
+  }
+}, { immediate: true });
+
+onMounted(() => {
+  setupListener();
+});
+
+onUnmounted(() => {
+  if (removePostRender) {
+    removePostRender();
+  }
+});
+</script>
+
+<style scoped>
+.compass-container {
+  position: absolute;
+  top: 0.5rem;
+  left: 65%;
+  transform: translateX(-50%);
+  z-index: 1000;
+  pointer-events: none;
+}
+
+.direction-info {
+  background: rgba(255, 255, 255, 0.95);
+  padding: 12px 20px;
+  border-radius: 8px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
+  text-align: center;
+  min-width: 120px;
+}
+
+.cardinal-direction {
+  font-weight: bold;
+  font-size: 18px;
+  color: #2c3e50;
+  margin-bottom: 4px;
+}
+
+.degree-value {
+  font-size: 14px;
+  color: #7f8c8d;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index 6d57e5b..17fe4f2 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -8,6 +8,8 @@ import Navigation from "@/components/navigation/Navigation.vue";
 import Terrain from "@/components/terrain/Terrain.vue";
 import Moon from "@/components/primitive/Moon.vue";
 import MoonPhase from "@/components/MoonPhase.vue";
+import CameraController from './CameraController.vue'
+import CompassIndicator from '@/components/CompassIndicator.vue'
 
 const viewerRef = ref(null)
 const isViewerReady = ref(false)
@@ -44,6 +46,7 @@ const onViewerReady = async ({Cesium, viewer}) => {
   isViewerReady.value = true
   window.cesiumViewer = viewer; // This makes it accessible in the console!
   window.CesiumGlobal = Cesium;
+
   if (viewerRef.value) {
     try {
       if (Cesium) {
@@ -96,6 +99,7 @@ const onViewerReady = async ({Cesium, viewer}) => {
     </template>
     <MoonPhase/>
   </vc-viewer>
-
+  <CameraController v-if="isViewerReady" :viewer="mapViewer" />
+  <CompassIndicator v-if="isViewerReady" :viewer="mapViewer" />
 </template>
 
diff --git a/src/components/navigation/Compass.vue b/src/components/navigation/Compass.vue
deleted file mode 100644
index 71a5f2a..0000000
--- a/src/components/navigation/Compass.vue
+++ /dev/null
@@ -1,11 +0,0 @@
-<script setup>
-
-import {VcCompass} from "vue-cesium";
-</script>
-
-<template>
-  <vc-compass
-      :outer-options="{ size: '150px'}"
-      :inner-options="{icon: 'fa fa-compass', size: '60px', background: 'transparent', color: '#009688'}"
-  ></vc-compass>
-</template>
diff --git a/src/components/navigation/Navigation.vue b/src/components/navigation/Navigation.vue
index 0ac1808..f80101a 100644
--- a/src/components/navigation/Navigation.vue
+++ b/src/components/navigation/Navigation.vue
@@ -1,10 +1,8 @@
 <script setup>
 
-import Compass from "@/components/navigation/Compass.vue";
 import MyLocation from "@/components/navigation/MyLocation.vue";
 </script>
 
 <template>
   <MyLocation/>
-  <Compass/>
 </template>
diff --git a/src/utils/scene.js b/src/utils/scene.js
index 97ff82d..16acd10 100644
--- a/src/utils/scene.js
+++ b/src/utils/scene.js
@@ -13,6 +13,19 @@ export async function prepareScene(scene){
         allowTextureFilterAnisotropic: false,
         cameraUnderground: false
     }
+
+    const controller = scene.screenSpaceCameraController;
+
+    // Disable all default controls
+    controller.enableRotate = false;
+    controller.enableTranslate = false;
+    controller.enableZoom = false;
+    controller.enableTilt = false;
+    controller.enableLook = false;
+
+    controller.lookEventTypes = Cesium.CameraEventType.LEFT_DRAG;
+    controller.enableLook = true;
+
 }
 
 export function addTilesetToScene(scene, tileset){

From f93de0e411a076f530692b3764d2903632ddcc1c Mon Sep 17 00:00:00 2001
From: Jorisbly <joris.bailly.2001@gmail.com>
Date: Thu, 22 Jan 2026 13:57:02 +0100
Subject: [PATCH 34/61] chore(): Add commands for linux too

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index b5797b3..db3840c 100644
--- a/package.json
+++ b/package.json
@@ -9,7 +9,7 @@
   "scripts": {
     "dev": "npx concurrently \"npm run frontend\" \"npm run backend\"",
     "frontend": "vite",
-    "backend": "cd API && .venv\\Scripts\\activate && pip install -r requirements.txt && py main.py",
+    "backend": "cd API && (source .venv/bin/activate || .\\\\.venv\\\\Scripts\\\\activate) && python3 main.py || py main.py",
     "install-all": "npm install && cd API && py -m venv .venv && .venv\\Scripts\\activate && pip install -r requirements.txt",
     "build": "vite build",
     "preview": "vite preview"

From c94f4c868bde2f0dad2a1c89c2574d26602116a4 Mon Sep 17 00:00:00 2001
From: Sofian Hussein <sofian.hussein@eduvaud.ch>
Date: Mon, 26 Jan 2026 08:57:30 +0100
Subject: [PATCH 35/61] feat(): Add camera zoom using the mouse wheel (#66)

* feat(): Add camera zoom using the mouse wheel

* fix(): Update asset id
---
 src/utils/scene.js | 37 +++++++++++++++++++++++++++++++++++++
 1 file changed, 37 insertions(+)

diff --git a/src/utils/scene.js b/src/utils/scene.js
index 16acd10..2e83210 100644
--- a/src/utils/scene.js
+++ b/src/utils/scene.js
@@ -14,6 +14,7 @@ export async function prepareScene(scene){
         cameraUnderground: false
     }
 
+
     const controller = scene.screenSpaceCameraController;
 
     // Disable all default controls
@@ -26,6 +27,42 @@ export async function prepareScene(scene){
     controller.lookEventTypes = Cesium.CameraEventType.LEFT_DRAG;
     controller.enableLook = true;
 
+    // source : https://cesium.com/learn/cesiumjs/ref-doc/Camera.html
+    // source : https://developer.mozilla.org/en-US/docs/Web/API/WheelEvent
+
+    // minimum FOV degrees in radian
+    const MIN_FOV = Cesium.Math.toRadians(5);
+
+    // maximum FOV degrees in radian
+    const MAX_FOV = Cesium.Math.toRadians(100);
+
+    // increment in radian for each step of the mouse
+    const STEP = Cesium.Math.toRadians(2);
+
+    const canvas = scene.canvas;
+
+    // listen for mouse wheel events
+    canvas.addEventListener(
+        "wheel",
+        (event) => {
+            event.preventDefault();
+
+            const camera = scene.camera;
+            let fov = camera.frustum.fov;
+
+            // increment the FOV
+            fov += event.deltaY > 0 ? STEP : -STEP;
+
+            // check the limits
+            camera.frustum.fov = Cesium.Math.clamp(
+                fov,
+                MIN_FOV,
+                MAX_FOV
+            );
+        },
+        { passive: false }
+    );
+
 }
 
 export function addTilesetToScene(scene, tileset){

From b32b16ce386b4b83e2d841afe5a63a0ce6da4833 Mon Sep 17 00:00:00 2001
From: David Galindo <155019077+davidgalindo-git@users.noreply.github.com>
Date: Mon, 26 Jan 2026 08:59:24 +0100
Subject: [PATCH 36/61] feat:"moon view center button" (#69)

* feat:"moon view center button"

* refactor:"component name"

---------

Co-authored-by: davidgalindo-git <>
---
 src/components/Viewer.vue                     |  7 ++
 src/components/primitive/Moon.vue             |  2 +-
 src/components/primitive/MoonCenterButton.vue | 71 +++++++++++++++++++
 3 files changed, 79 insertions(+), 1 deletion(-)
 create mode 100644 src/components/primitive/MoonCenterButton.vue

diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index 17fe4f2..275b33f 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -8,6 +8,7 @@ import Navigation from "@/components/navigation/Navigation.vue";
 import Terrain from "@/components/terrain/Terrain.vue";
 import Moon from "@/components/primitive/Moon.vue";
 import MoonPhase from "@/components/MoonPhase.vue";
+import MoonCenterButton from "@/components/primitive/MoonCenterButton.vue";
 import CameraController from './CameraController.vue'
 import CompassIndicator from '@/components/CompassIndicator.vue'
 
@@ -90,12 +91,18 @@ const onViewerReady = async ({Cesium, viewer}) => {
       ref="viewerRef"
       :access-token="cesiumToken"
       @ready="onViewerReady">
+
     <template v-if="isViewerReady">
           <Imagery/>
           <Terrain/>
           <Navigation/>
       <Moon ref="moonComponentRef" />
       <MoonPhase v-bind="location" />
+      <MoonFocusButton
+          :cesiumViewer="mapViewer"
+          :cesium="cesium"
+          :moonComponent="moonComponentRef"
+      />
     </template>
     <MoonPhase/>
   </vc-viewer>
diff --git a/src/components/primitive/Moon.vue b/src/components/primitive/Moon.vue
index 536c938..9f9470a 100644
--- a/src/components/primitive/Moon.vue
+++ b/src/components/primitive/Moon.vue
@@ -141,7 +141,7 @@ onBeforeUnmount(() => {
 });
 // expose function to make it accessible outside component with
 // "moonComponentRef.value.onViewerReady({ Cesium, viewer})"
-defineExpose({ onViewerReady });
+defineExpose({ onViewerReady, moonPos });
 </script>
 
 <template>
diff --git a/src/components/primitive/MoonCenterButton.vue b/src/components/primitive/MoonCenterButton.vue
new file mode 100644
index 0000000..0c61092
--- /dev/null
+++ b/src/components/primitive/MoonCenterButton.vue
@@ -0,0 +1,71 @@
+<script setup>
+import { ref } from "vue";
+
+// data received from parent (Viewer.vue)
+const props = defineProps({
+  cesiumViewer: Object,
+  cesium: Object,
+  moonComponent: Object,
+});
+
+// runs when "Center Moon" button is clicked
+function onClick() {
+  // check missing objects, exit if one or more missing
+  if (!props.cesiumViewer || !props.cesium || !props.moonComponent?.moonPos) {
+    console.log("Viewer, Cesium, or Moon position not ready");
+    return;
+  }
+
+  // locally store camera and moonPos objects for reference
+  const camera = props.cesiumViewer.camera;
+  const moonPos = props.moonComponent.moonPos;
+
+  // check moonPos state (must not be null or undefined)
+  if (!moonPos) {
+    console.log("Moon position is null");
+    return;
+  }
+
+  // get current camera position to ensure it stays the same when camera is redirected
+  const camPos = props.cesium.Cartesian3.clone(camera.position);
+
+  // direction vector calculus (heading the Moon)
+  // subtract camPos from moonPos to get vector pointing from camera to Moon
+  // normalize vector (length to 1 = unit vector)
+  const direction = props.cesium.Cartesian3.normalize(
+      props.cesium.Cartesian3.subtract(moonPos, camPos, new props.cesium.Cartesian3()),
+      new props.cesium.Cartesian3()
+  );
+
+  // get camera's current up vector, if not, use cesium's unit Z vector
+  const up = camera.up || props.cesium.Cartesian3.UNIT_Z;
+
+  // fly camera to current position with orientation to the moon
+  camera.flyTo({
+    destination: camPos, // current camera position
+    orientation: {
+      direction, // new direction pointing to Moon
+      up // vertical axis (Z vector)
+    },
+    duration: 2 // 2 seconds for smooth transition
+  });
+}
+
+</script>
+
+<template>
+  <button
+      class="fixed bottom-6 right-6 z-[2000] bg-blue-600 text-white px-4 py-2 rounded shadow-lg"
+      @click="onClick"
+  >
+    Center Moon
+  </button>
+</template>
+<style>
+.fixed {
+  position: fixed;
+  bottom: 1.5rem;
+  right: 1.5rem;
+  z-index: 9999;
+}
+</style>

From fff463bbf816f00e2985c3f8f5cc1cb50ef0ca61 Mon Sep 17 00:00:00 2001
From: Joris Bailly <90181523+JorisBly@users.noreply.github.com>
Date: Mon, 26 Jan 2026 09:14:59 +0100
Subject: [PATCH 37/61] Feature/fix entities (#74)

* fix(): Add id to the moon

* fix(): Remove extra \\

* refactor(): function

* feat(): Add new planes

* feat(): Hide get loaction button
---
 package.json                             |  2 +-
 src/components/Viewer.vue                |  4 ++--
 src/components/navigation/Navigation.vue |  2 +-
 src/components/primitive/Moon.vue        |  1 +
 src/utils/scene.js                       | 30 +++++++++++++++++-------
 5 files changed, 27 insertions(+), 12 deletions(-)

diff --git a/package.json b/package.json
index db3840c..f5eac66 100644
--- a/package.json
+++ b/package.json
@@ -9,7 +9,7 @@
   "scripts": {
     "dev": "npx concurrently \"npm run frontend\" \"npm run backend\"",
     "frontend": "vite",
-    "backend": "cd API && (source .venv/bin/activate || .\\\\.venv\\\\Scripts\\\\activate) && python3 main.py || py main.py",
+    "backend": "cd API && (source .venv/bin/activate || .venv\\Scripts\\activate) && python3 main.py || py main.py",
     "install-all": "npm install && cd API && py -m venv .venv && .venv\\Scripts\\activate && pip install -r requirements.txt",
     "build": "vite build",
     "preview": "vite preview"
diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index 275b33f..70ac4ce 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -1,7 +1,7 @@
 <script setup>
 import {VcViewer} from "vue-cesium";
 import {nextTick, ref, watch} from "vue";
-import {loadPlanes, movePlanes, prepareScene, removeMoving} from "@/utils/scene.js";
+import {loadPlanes, updatePlanes, prepareScene, removeMoving} from "@/utils/scene.js";
 import Imagery from "@/components/imagery/Imagery.vue";
 import {flyTo} from "@/utils/camera.js";
 import Navigation from "@/components/navigation/Navigation.vue";
@@ -70,7 +70,7 @@ const onViewerReady = async ({Cesium, viewer}) => {
       isViewerReady.value = true
 
       setInterval(async () => {
-       await movePlanes(mapViewer.value)
+       await updatePlanes(mapViewer.value)
       }, 30000)
 
     } catch (error) {
diff --git a/src/components/navigation/Navigation.vue b/src/components/navigation/Navigation.vue
index f80101a..fa1faaf 100644
--- a/src/components/navigation/Navigation.vue
+++ b/src/components/navigation/Navigation.vue
@@ -4,5 +4,5 @@ import MyLocation from "@/components/navigation/MyLocation.vue";
 </script>
 
 <template>
-  <MyLocation/>
+<!--  <MyLocation/>-->
 </template>
diff --git a/src/components/primitive/Moon.vue b/src/components/primitive/Moon.vue
index 9f9470a..332d18c 100644
--- a/src/components/primitive/Moon.vue
+++ b/src/components/primitive/Moon.vue
@@ -148,6 +148,7 @@ defineExpose({ onViewerReady, moonPos });
   <!-- render Moon only if there's a valid position -->
   <vc-entity
       v-if="moonPos"
+      :id="'Moon'"
       :position="moonPos"
       :point="point"
       :label="label"
diff --git a/src/utils/scene.js b/src/utils/scene.js
index 2e83210..acdc30c 100644
--- a/src/utils/scene.js
+++ b/src/utils/scene.js
@@ -20,7 +20,7 @@ export async function prepareScene(scene){
     // Disable all default controls
     controller.enableRotate = false;
     controller.enableTranslate = false;
-    controller.enableZoom = false;
+    controller.enableZoom = true;
     controller.enableTilt = false;
     controller.enableLook = false;
 
@@ -147,7 +147,6 @@ async function loadModel(viewer, start, stop, positionProperty, airplaneUri, id)
     const airplaneEntity = viewer.entities.add({
         id: id,
         availability: new Cesium.TimeIntervalCollection([ new Cesium.TimeInterval({ start: start, stop: stop }) ]),
-        // position: positionProperty,
         position: positionProperty,
         // Attach the 3D model instead of the green point.
         model: {uri: airplaneUri,minimumPixelSize: 100  },
@@ -157,8 +156,7 @@ async function loadModel(viewer, start, stop, positionProperty, airplaneUri, id)
     });
 }
 
-export async function movePlanes(viewer){
-
+export async function updatePlanes(viewer){
     const data = await getFLights('http://localhost:8080/flights', {long:6.500465335539498 , lat: 46.82166054184684})
     const futureTime = Cesium.JulianDate.addSeconds(
         viewer.clock.currentTime,
@@ -166,22 +164,38 @@ export async function movePlanes(viewer){
         new Cesium.JulianDate()
     );
     if (data !== undefined && viewer.entities !== undefined) {
-        viewer.entities.values.forEach(entity => {
+        viewer.entities.values.forEach(async (entity) => {
             const flight = data.find(flight => flight.id === entity.id)
             if(flight !== undefined){
-                addNextPostion(flight, entity, futureTime)
-            }else{
+                await addNextPostion(flight, entity, futureTime)
+            }else if(entity.id !== 'Moon'){
                 viewer.entities.remove(entity)
             }
 
         })
 
+        await addNewPlanes(viewer, data)
     }
 }
 
-function addNextPostion(flight, entity, futureTime){
+async function addNextPostion(flight, entity, futureTime){
     const time = Cesium.JulianDate.now();
     const nextPos = Cesium.Cartesian3.fromDegrees(flight.long, flight.lat, flight.alt)
     entity.position.addSample(futureTime, nextPos)
 }
 
+async function addNewPlanes(viewer, data){
+    const airplaneUri = await Cesium.IonResource.fromAssetId(4359085);
+    data.forEach(async (flight) => {
+        if (viewer.entities.values.find(entity => entity.id === flight.id) === undefined){
+            const positionProperty = new Cesium.SampledPositionProperty();
+            const position = Cesium.Cartesian3.fromDegrees(flight.long, flight.lat, flight.alt)
+            positionProperty.addSample(viewer.clock.currentTime, position);
+            positionProperty.forwardExtrapolationType = Cesium.ExtrapolationType.HOLD
+            positionProperty.backwardExtrapolationType = Cesium.ExtrapolationType.HOLD
+            await loadModel(viewer, viewer.clock.currentTime, viewer.clock.stopTime, positionProperty, airplaneUri, flight.id)
+        }
+    })
+}
+
+

From 06c6d0a052f05e314257f8a3893a6fc2d10cd421 Mon Sep 17 00:00:00 2001
From: David Galindo <155019077+davidgalindo-git@users.noreply.github.com>
Date: Mon, 26 Jan 2026 09:37:54 +0100
Subject: [PATCH 38/61] fix:"moon phase debug (but only works on submit form)"
 (#67)

* fix:"moon phase debug (but only works on submit form)"

* Replace hardcoded API credentials with environment variables

---------

Co-authored-by: davidgalindo-git <>
---
 src/components/MoonPhase.vue | 86 +++++++++++++++++++++++++++---------
 1 file changed, 65 insertions(+), 21 deletions(-)

diff --git a/src/components/MoonPhase.vue b/src/components/MoonPhase.vue
index 57a6bb2..734b816 100644
--- a/src/components/MoonPhase.vue
+++ b/src/components/MoonPhase.vue
@@ -1,36 +1,51 @@
 <script setup>
-import {ref, onMounted, watch} from 'vue';
+import {ref, onMounted, watch, computed} from 'vue';
 import {flyTo} from "@/utils/camera.js";
 
 const moonImageUrl = ref(null); // stores the final processed image URL
-const isLoading = ref(true); // boolean flag to track the loading state of requests
+const isLoading = ref(false); // boolean flag to track the loading state of requests
+const hasRequested = ref(false); // boolean flag to indicate if at least one request has been triggered
 const error = ref(null); // exception messages container
 const location = defineProps({ // user's location ( CoordinateForm -> Viewer -> MoonPhase))
   lng: undefined,
   lat: undefined
 })
 
+// true when valid geographic location has been provided
+const hasValidLocation = computed(() =>
+    typeof location.lat === "number" &&
+    typeof location.lng === "number"
+);
+
+// ensure fetching the moon phase api only once when location is updated
+// prevents duplicate API calls
+let hasFetched = false;
+
+// watcher updates moon phase when lat and lng are updated
 watch(
-    [() => location.lat, () => location.lng],
-    ([newLat, newLng]) => {
-      if (newLat !== 0 && newLng !== 0) {
-        fetchMoonPhase(newLat, newLng);
-      } else {
-        console.error(
-            "Unable to update moon phase: location is invalid.",
-            {
-              lat: newLat,
-              lng: newLng
-            }
-        );
-      }
-    }
-)
+    () => [location.lat, location.lng],
+    ([lat, lng]) => {
+      if (
+          typeof lat !== "number" ||
+          typeof lng !== "number"
+      ) return;
+
+      console.log("[MoonPhase] Auto-fetching moon phase");
+      fetchMoonPhase(lat, lng);
+    },
+    { immediate: true } // runs also when page is reloaded
+);
 
 const fetchMoonPhase = async (lat, lng) => {
   /* Fetch Moon's phase from AstronomyAPI
   * documentation: https://docs.astronomyapi.com/endpoints/studio/moon-phase
   * */
+  console.log("[MoonPhase] Fetching moon phase…");
+
+  hasRequested.value = true;
+  isLoading.value = true;
+  error.value = null;
+
   // credentials for authentication
   const appId = import.meta.env.VITE_MOON_PHASE_APP_ID; // your app id
   const appSecret = import.meta.env.VITE_MOON_PHASE_APP_SECRET; // your app secret
@@ -39,6 +54,7 @@ const fetchMoonPhase = async (lat, lng) => {
   if (!appId || !appSecret) {
     error.value = "API Credentials missing";
     isLoading.value = false;
+    console.error("[MoonPhase] Missing API credentials");
     return;
   }
 
@@ -51,6 +67,12 @@ const fetchMoonPhase = async (lat, lng) => {
   // split('T')[0] returns "YYYY-MM-DD" part
   const today = new Date().toISOString().split('T')[0];
 
+  console.log("[MoonPhase] Request parameters:", {
+    lat,
+    lng,
+    date: today
+  });
+
   try {
     // POST request to AstronomyAPI
     // src: https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch
@@ -83,38 +105,56 @@ const fetchMoonPhase = async (lat, lng) => {
       })
     });
 
+    console.debug("[MoonPhase] API response status:", response.status);
+
     // validate server's response
     if (!response.ok) throw new Error("Failed to generate moon image");
 
     // json parsing
     const result = await response.json();
+
+    console.debug("[MoonPhase] API response payload:", result);
+
     // update image value (assign new image to reactive reference)
     moonImageUrl.value = result.data.imageUrl;
+
+    if (!moonImageUrl.value) {
+      console.warn("[MoonPhase] No image URL returned from API");
+    } else {
+      console.info("[MoonPhase] Moon image updated successfully");
+    }
   } catch (err) {
     // store error message catched
     error.value = err.message;
+    console.error("[MoonPhase] Error fetching moon phase:", err);
   } finally {
     // always exit loading state (set loading to false regardless of request result)
     isLoading.value = false;
+    console.debug("[MoonPhase] Loading finished");
   }
 };
 
 </script>
 
 <template>
-  <div class="absolute bottom-6 left-6 z-[1000] pointer-events-auto">
+  <div
+      v-if="isLoading || error || moonImageUrl || hasRequested"
+      class="absolute bottom-6 left-6 z-[1000] pointer-events-auto"
+  >
     <div class="bg-black/70 backdrop-blur-md border border-white/20 p-2 rounded-xl shadow-2xl transition-all hover:scale-105 duration-300 w-40">
 
       <div v-if="isLoading" class="flex flex-col items-center justify-center h-48 space-y-2">
         <div class="w-6 h-6 border-2 border-white/30 border-t-white rounded-full animate-spin"></div>
-        <span class="text-[10px] text-white/50 uppercase tracking-widest">Loading Moon</span>
+        <span class="text-[10px] text-white/50 uppercase tracking-widest">
+        Loading Moon
+      </span>
       </div>
 
       <div v-else-if="error" class="text-[10px] text-red-400 p-2 text-center">
         {{ error }}
       </div>
 
-      <div v-else class="relative overflow-hidden rounded-lg">
+      <div v-else-if="moonImageUrl" class="relative overflow-hidden rounded-lg">
         <img
             :src="moonImageUrl"
             alt="Current Moon Phase"
@@ -122,6 +162,10 @@ const fetchMoonPhase = async (lat, lng) => {
         />
       </div>
 
+      <div v-else class="text-[10px] text-white/40 text-center p-2">
+        No moon data available
+      </div>
+
     </div>
   </div>
 </template>
@@ -131,4 +175,4 @@ const fetchMoonPhase = async (lat, lng) => {
 .z-1000 {
   z-index: 1000;
 }
-</style>
\ No newline at end of file
+</style>

From 9997756c2777de6fc474762a4b9a385d6460c862 Mon Sep 17 00:00:00 2001
From: Joris Bailly <90181523+JorisBly@users.noreply.github.com>
Date: Mon, 26 Jan 2026 12:03:49 +0100
Subject: [PATCH 39/61] Feature/refactor view layout (#76)

* feat(): Feat use emitter to detect when a new location is sended

* feat(): Use tailwind instead of classic css

* refactor(): Align camera controller with compass

* refactor(): Remove legend

* refactor(): Move components in template when IsViewerReady

* refactor(): Move components in template when IsViewerReady

* refactor(): Remove useless w-full

* refactor(): Add z-index

* refactor(): Change positioning and spacing

* refactor(): Make navbar transparent and fixed

* fix(): Use correct name of import
---
 src/App.vue                         |  6 ++--
 src/components/CameraController.vue |  2 +-
 src/components/CompassIndicator.vue | 16 +++++++---
 src/components/CoordinateForm.vue   | 47 ++++++++++++++++-------------
 src/components/NavBar.vue           |  4 ++-
 src/components/Viewer.vue           | 34 ++++++---------------
 6 files changed, 55 insertions(+), 54 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index c04aa5c..9100670 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,12 +1,12 @@
 <script setup>
-import CoordinateForm from "@/components/CoordinateForm.vue";
 import NavBar from "@/components/NavBar.vue";
+import Viewer from "@/components/Viewer.vue";
 </script>
 
 <template>
-  <main class="flex flex-col w-full items-center justify-center min-h-screen py-2">
+  <main class="flex flex-col items-center h-screen justify-center">
       <NavBar/>
-      <CoordinateForm />
+    <Viewer/>
   </main>
 </template>
 
diff --git a/src/components/CameraController.vue b/src/components/CameraController.vue
index ca81dad..13defb8 100644
--- a/src/components/CameraController.vue
+++ b/src/components/CameraController.vue
@@ -4,7 +4,7 @@
       min="-100"
       max="100"
       v-model.number="value"
-      class="fixed right-4 top-4 w-65 h-4 bg-gray-600 rounded-lg"
+      class="absolute right-4 top-18 w-65 h-4 z-1000 bg-gray-600 rounded-lg"
   />
 </template>
 
diff --git a/src/components/CompassIndicator.vue b/src/components/CompassIndicator.vue
index 0254c1e..dfd8ca1 100644
--- a/src/components/CompassIndicator.vue
+++ b/src/components/CompassIndicator.vue
@@ -1,8 +1,16 @@
 <template>
-  <div class="compass-container">
-    <div class="direction-info">
-      <div class="cardinal-direction">{{ cardinalDirection }}</div>
-      <div class="degree-value">{{ Math.round(heading) }}°</div>
+  <div class="absolute top-18 left-[50%] -translate-x-1/2 z-[1000] pointer-events-none">
+
+    <div class="bg-white/20 backdrop-blur-sm px-5 py-3 rounded-lg shadow-lg text-center min-w-[120px] border border-white/20">
+
+      <div class="font-bold text-lg text-slate-800 leading-tight">
+        {{ cardinalDirection }}
+      </div>
+
+      <div class="text-sm text-blue-500 font-medium">
+        {{ Math.round(heading) }}°
+      </div>
+
     </div>
   </div>
 </template>
diff --git a/src/components/CoordinateForm.vue b/src/components/CoordinateForm.vue
index 58dab02..a0f4224 100644
--- a/src/components/CoordinateForm.vue
+++ b/src/components/CoordinateForm.vue
@@ -1,37 +1,42 @@
 <script setup>
-import Viewer from "@/components/Viewer.vue";
 import {ref} from "vue";
-// Check later to use the given inputs for location
+
 const lat = ref(0)
 const lng = ref(0)
 
-const location = ref({
-  lat: undefined,
-  lng: undefined
+const emit = defineEmits({
+  click: null,
+
+  // Validate submit event
+  submit: ({ lat, lng }) => {
+    if (typeof lat === 'number' && typeof lng === 'number') {
+      return true
+    } else {
+      console.warn('Invalid submit event payload!')
+      return false
+    }
+  }
 })
 
-function send(){
-  location.value = {lat: parseFloat(lat.value), lng: parseFloat(lng.value)}
+function send(lat, lng){
+  emit('submit', { lat, lng })
 }
 </script>
 
 <template>
-  <div class="flex flex-row w-full justify-center items-center p-6">
-      <div class="bg-base-100 w-full max-w-sm shrink-0">
-        <fieldset class="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4">
-          <legend class="fieldset-legend">Your position</legend>
-
+  <div class="absolute top-18 left-[1%] z-10000 bg-transparent ">
+  <div class=" flex flex-row w-xl justify-between items-center bg-white/20 backdrop-blur-sm rounded-box shadow-lg px-2">
+          <fieldset class="flex flex-col gap-1">
           <label class="label">Latitude</label>
-          <input v-model="lat" type="number" class="input" placeholder="42.161836383" />
+          <input v-model="lat" type="number" class="input input-xs" placeholder="42.161836383" />
+            </fieldset>
 
+          <fieldset class="flex flex-col gap-1">
           <label class="label">Longitude</label>
-          <input v-model="lng" type="number" class="input" placeholder="6.13838333" />
-
-          <button type="submit" @click="send()" class="btn btn-neutral mt-4">Find</button>
-        </fieldset>
-      </div>
-    <div id="cesiumContainer" class="flex w-[70%]">
-       <Viewer v-bind="location" />
-    </div>
+          <input v-model="lng" type="number" class="input input-xs" placeholder="6.13838333" />
+          </fieldset>
+          <button type="submit" @click="send(lat, lng)" class="btn btn-neutral mt-8">Find</button>
+  </div>
   </div>
+
 </template>
\ No newline at end of file
diff --git a/src/components/NavBar.vue b/src/components/NavBar.vue
index ceff3bb..6e12ba4 100644
--- a/src/components/NavBar.vue
+++ b/src/components/NavBar.vue
@@ -3,7 +3,9 @@
 </script>
 
 <template>
-  <div class="navbar bg-base-100 shadow-sm">
+  <div class="relative w-full">
+  <div class="fixed h-16 inset-x-0 top-0 navbar bg-slate-100/30 shadow-sm">
     <a class="btn btn-ghost text-xl">Planium</a>
   </div>
+  </div>
 </template>
diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index 70ac4ce..8bd9ef7 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -11,37 +11,20 @@ import MoonPhase from "@/components/MoonPhase.vue";
 import MoonCenterButton from "@/components/primitive/MoonCenterButton.vue";
 import CameraController from './CameraController.vue'
 import CompassIndicator from '@/components/CompassIndicator.vue'
+import CoordinateForm from "@/components/CoordinateForm.vue";
 
 const viewerRef = ref(null)
 const isViewerReady = ref(false)
 const cesiumToken = import.meta.env.VITE_CESIUM_ACCESS_TOKEN;
 const mapViewer = ref(null)
 const cesium = ref(null)
-const location = defineProps({
+const location = {
   lng: undefined,
   lat: undefined
-})
+}
 
 const moonComponentRef = ref(null)
 
-watch(
-    [() => location.lat, () => location.lng],
-    ([newLat, newLng]) => {
-      if (mapViewer.value && newLat !== 0 && newLng !== 0) {
-        flyTo(mapViewer.value.camera, cesium.value, newLat, newLng)
-      } else {
-        console.error(
-            "Unable to update camera position: viewer is not ready or location is invalid.",
-            {
-              viewerReady: !!mapViewer.value,
-              lat: newLat,
-              lng: newLng
-            }
-        );
-      }
-    }
-)
-
 
 const onViewerReady = async ({Cesium, viewer}) => {
   isViewerReady.value = true
@@ -79,7 +62,9 @@ const onViewerReady = async ({Cesium, viewer}) => {
   }
 };
 
-
+function onLocationSubmitted(e){
+  flyTo(mapViewer.value.camera, cesium.value, e.lat, e.lng)
+}
 
 </script>
 
@@ -98,15 +83,16 @@ const onViewerReady = async ({Cesium, viewer}) => {
           <Navigation/>
       <Moon ref="moonComponentRef" />
       <MoonPhase v-bind="location" />
-      <MoonFocusButton
+      <MoonCenterButton
           :cesiumViewer="mapViewer"
           :cesium="cesium"
           :moonComponent="moonComponentRef"
       />
+      <CameraController v-if="isViewerReady" :viewer="mapViewer" />
+      <CompassIndicator v-if="isViewerReady" :viewer="mapViewer" />
+      <CoordinateForm @submit="onLocationSubmitted"/>
     </template>
     <MoonPhase/>
   </vc-viewer>
-  <CameraController v-if="isViewerReady" :viewer="mapViewer" />
-  <CompassIndicator v-if="isViewerReady" :viewer="mapViewer" />
 </template>
 

From 8f2b4b9fd86b5787e7afa635b2a896ce49f8bad9 Mon Sep 17 00:00:00 2001
From: Sofian Hussein <sofian.hussein@eduvaud.ch>
Date: Tue, 27 Jan 2026 14:16:06 +0100
Subject: [PATCH 40/61] Feature/zoom fix (#81)

* fix(): Fix a bug with the zoom

* fix(): Fix a bug with the zoom
---
 src/utils/scene.js | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/src/utils/scene.js b/src/utils/scene.js
index acdc30c..bb20a08 100644
--- a/src/utils/scene.js
+++ b/src/utils/scene.js
@@ -16,17 +16,15 @@ export async function prepareScene(scene){
 
 
     const controller = scene.screenSpaceCameraController;
-
     // Disable all default controls
     controller.enableRotate = false;
     controller.enableTranslate = false;
-    controller.enableZoom = true;
+    controller.enableZoom = false;
     controller.enableTilt = false;
     controller.enableLook = false;
 
     controller.lookEventTypes = Cesium.CameraEventType.LEFT_DRAG;
     controller.enableLook = true;
-
     // source : https://cesium.com/learn/cesiumjs/ref-doc/Camera.html
     // source : https://developer.mozilla.org/en-US/docs/Web/API/WheelEvent
 
@@ -63,6 +61,7 @@ export async function prepareScene(scene){
         { passive: false }
     );
 
+
 }
 
 export function addTilesetToScene(scene, tileset){
@@ -198,4 +197,3 @@ async function addNewPlanes(viewer, data){
     })
 }
 
-

From 2a2d428c53f2190cfcf4253691d74ac165b62a86 Mon Sep 17 00:00:00 2001
From: Joris Bailly <90181523+JorisBly@users.noreply.github.com>
Date: Tue, 27 Jan 2026 14:27:04 +0100
Subject: [PATCH 41/61] Feature/get actual position (#83)

* feat(): Get current user location

* refactor (): Match name long like the backend instead of lng

* feat(): Use current location for planes

* refactor(): Remove console.log for result when asking api

* refactor(): Add a comment to clarify default lat and long

* fix(): First reassign location before updating planes

* refactor(): Remove french comments and unnecessary

* refactor(): Delete unused addTilesetToScene function

* fix(): Check if viewer is defined before updating planes
---
 src/components/CoordinateForm.vue |  2 +-
 src/components/MoonPhase.vue      |  9 +++--
 src/components/Viewer.vue         | 32 +++++++++++------
 src/utils/api.js                  | 26 ++++++++++++--
 src/utils/camera.js               |  4 +--
 src/utils/scene.js                | 58 ++++++++++++++-----------------
 6 files changed, 78 insertions(+), 53 deletions(-)

diff --git a/src/components/CoordinateForm.vue b/src/components/CoordinateForm.vue
index a0f4224..00cc0d1 100644
--- a/src/components/CoordinateForm.vue
+++ b/src/components/CoordinateForm.vue
@@ -19,7 +19,7 @@ const emit = defineEmits({
 })
 
 function send(lat, lng){
-  emit('submit', { lat, lng })
+  emit('submit', { lat, long: lng })
 }
 </script>
 
diff --git a/src/components/MoonPhase.vue b/src/components/MoonPhase.vue
index 734b816..52d608a 100644
--- a/src/components/MoonPhase.vue
+++ b/src/components/MoonPhase.vue
@@ -7,14 +7,14 @@ const isLoading = ref(false); // boolean flag to track the loading state of requ
 const hasRequested = ref(false); // boolean flag to indicate if at least one request has been triggered
 const error = ref(null); // exception messages container
 const location = defineProps({ // user's location ( CoordinateForm -> Viewer -> MoonPhase))
-  lng: undefined,
+  long: undefined,
   lat: undefined
 })
 
 // true when valid geographic location has been provided
 const hasValidLocation = computed(() =>
     typeof location.lat === "number" &&
-    typeof location.lng === "number"
+    typeof location.long === "number"
 );
 
 // ensure fetching the moon phase api only once when location is updated
@@ -23,7 +23,7 @@ let hasFetched = false;
 
 // watcher updates moon phase when lat and lng are updated
 watch(
-    () => [location.lat, location.lng],
+    () => [location.lat, location.long],
     ([lat, lng]) => {
       if (
           typeof lat !== "number" ||
@@ -69,7 +69,7 @@ const fetchMoonPhase = async (lat, lng) => {
 
   console.log("[MoonPhase] Request parameters:", {
     lat,
-    lng,
+    long: lng,
     date: today
   });
 
@@ -114,7 +114,6 @@ const fetchMoonPhase = async (lat, lng) => {
     const result = await response.json();
 
     console.debug("[MoonPhase] API response payload:", result);
-
     // update image value (assign new image to reactive reference)
     moonImageUrl.value = result.data.imageUrl;
 
diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index 8bd9ef7..962cb6d 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -1,6 +1,6 @@
 <script setup>
 import {VcViewer} from "vue-cesium";
-import {nextTick, ref, watch} from "vue";
+import {nextTick, ref} from "vue";
 import {loadPlanes, updatePlanes, prepareScene, removeMoving} from "@/utils/scene.js";
 import Imagery from "@/components/imagery/Imagery.vue";
 import {flyTo} from "@/utils/camera.js";
@@ -12,16 +12,17 @@ import MoonCenterButton from "@/components/primitive/MoonCenterButton.vue";
 import CameraController from './CameraController.vue'
 import CompassIndicator from '@/components/CompassIndicator.vue'
 import CoordinateForm from "@/components/CoordinateForm.vue";
+import {getLocation} from "@/utils/api.js";
 
 const viewerRef = ref(null)
 const isViewerReady = ref(false)
 const cesiumToken = import.meta.env.VITE_CESIUM_ACCESS_TOKEN;
 const mapViewer = ref(null)
 const cesium = ref(null)
-const location = {
-  lng: undefined,
-  lat: undefined
-}
+const location = ref({
+  lat: undefined,
+  long: undefined
+})
 
 const moonComponentRef = ref(null)
 
@@ -35,25 +36,32 @@ const onViewerReady = async ({Cesium, viewer}) => {
     try {
       if (Cesium) {
         await prepareScene(viewer.scene)
-        // removeMoving(viewer.scene)
+        removeMoving(viewer.scene)
       }
+
       viewer.scene.farToNearRatio = 1000000;
       viewer.scene.logarithmicDepthBuffer = true;
       await nextTick()
+
       if (moonComponentRef.value){
         console.log("Found Moon Component, initializing...");
         moonComponentRef.value.onViewerReady({Cesium, viewer})
       } else {
         console.error("Moon Component Ref is NULL. Check if Moon is inside a v-if.");
       }
-      flyTo(viewer.camera, Cesium, location.lat, location.lng)
+
+      location.value = await getLocation(viewer)
       mapViewer.value = viewer
       cesium.value = Cesium
-      await loadPlanes(mapViewer.value)
+
+      flyTo(viewer.camera, Cesium, location.value.lat, location.value.long)
+      await loadPlanes(mapViewer.value, location.value)
       isViewerReady.value = true
 
       setInterval(async () => {
-       await updatePlanes(mapViewer.value)
+        if (mapViewer.value !== undefined){
+          await updatePlanes(mapViewer.value, location.value)
+        }
       }, 30000)
 
     } catch (error) {
@@ -62,8 +70,10 @@ const onViewerReady = async ({Cesium, viewer}) => {
   }
 };
 
-function onLocationSubmitted(e){
-  flyTo(mapViewer.value.camera, cesium.value, e.lat, e.lng)
+async function onLocationSubmitted(e){
+  flyTo(mapViewer.value.camera, cesium.value, e.lat, e.long)
+  location.value = {lat: e.lat, long: e.long}
+  await updatePlanes(mapViewer.value, location.value)
 }
 
 </script>
diff --git a/src/utils/api.js b/src/utils/api.js
index 716d82f..65676dc 100644
--- a/src/utils/api.js
+++ b/src/utils/api.js
@@ -1,3 +1,4 @@
+
 export async function getFLights(url, params = {}) {
     const searchParams = new URLSearchParams(params);
     try {
@@ -10,10 +11,31 @@ export async function getFLights(url, params = {}) {
         }
 
         const result = await response.json();
-        console.log(result);
 
         return result
     } catch (error) {
         console.error(error.message);
     }
-}
\ No newline at end of file
+}
+
+export function getLocation() {
+    return new Promise((resolve, reject) => {
+        if (!navigator.geolocation) {
+            reject(new Error("Geolocation not supported"));
+            return;
+        }
+
+        navigator.geolocation.getCurrentPosition(
+            (position) => {
+                const coords = {
+                    lat: position.coords.latitude,
+                    long: position.coords.longitude
+                };
+                resolve(coords);
+            },
+            (error) => {
+                reject(error);
+            }
+        );
+    });
+}
diff --git a/src/utils/camera.js b/src/utils/camera.js
index fa69434..11c6f74 100644
--- a/src/utils/camera.js
+++ b/src/utils/camera.js
@@ -2,8 +2,8 @@ export function flyTo(camera, cesium, lat, lng){
     try {
         camera.flyTo({
             destination: cesium.Cartesian3.fromDegrees(
-                lng ??  6.500465335539498, // longitude
-                lat ??46.82166054184684, //latitude
+                lng ??  6.500465335539498, // longitude is defaulted to Sainte-Croix if undefined
+                lat ??46.82166054184684, //latitude is defaulted to Sainte-Croix if undefined
                 1000, //height
             ),
             orientation: {
diff --git a/src/utils/scene.js b/src/utils/scene.js
index bb20a08..312e2dc 100644
--- a/src/utils/scene.js
+++ b/src/utils/scene.js
@@ -2,9 +2,9 @@ import {getFLights} from "@/utils/api.js";
 
 export async function prepareScene(scene){
     //------------Uncomment if performance is low---------------------
-    // scene.requestRenderMode = true; // Ne rendu que si nécessaire
+    // scene.requestRenderMode = true;
     // scene.maximumRenderTimeChange = Infinity;
-    // scene.globe.maximumScreenSpaceError = 24; // AUGMENTE CETTE VALEUR (16 à 32) pour réduire les requêtes
+    // scene.globe.maximumScreenSpaceError = 24;
     // scene.globe.tileCacheSize = 1000;
     // scene.globe.preloadAncestors = false;
     // scene.globe.loadingDescendantLimit = 20;
@@ -64,22 +64,13 @@ export async function prepareScene(scene){
 
 }
 
-export function addTilesetToScene(scene, tileset){
-    try {
-        scene.primitives.add(tileset);
-    }catch{
-        console.log("Error adding tileset")
-    }
-
-}
-
 //Prevent the user to move in the scene
 export function removeMoving(scene){
     scene.screenSpaceCameraController.enableRotate = false;
 }
-export async function loadPlanes(viewer){
+export async function loadPlanes(viewer, location){
     const airplaneUri = await Cesium.IonResource.fromAssetId(4359085);
-    const data = await getFLights('http://localhost:8080/flights', {long:6.500465335539498 , lat: 46.82166054184684})
+    const data = await getFLights('http://localhost:8080/flights', {long: location.long , lat: location.lat})
 
     if(data !== undefined) {
         const osmBuildings = await Cesium.createOsmBuildingsAsync();
@@ -155,26 +146,29 @@ async function loadModel(viewer, start, stop, positionProperty, airplaneUri, id)
     });
 }
 
-export async function updatePlanes(viewer){
-    const data = await getFLights('http://localhost:8080/flights', {long:6.500465335539498 , lat: 46.82166054184684})
-    const futureTime = Cesium.JulianDate.addSeconds(
-        viewer.clock.currentTime,
-        31,
-        new Cesium.JulianDate()
-    );
-    if (data !== undefined && viewer.entities !== undefined) {
-        viewer.entities.values.forEach(async (entity) => {
-            const flight = data.find(flight => flight.id === entity.id)
-            if(flight !== undefined){
-                await addNextPostion(flight, entity, futureTime)
-            }else if(entity.id !== 'Moon'){
-                viewer.entities.remove(entity)
-            }
-
-        })
-
-        await addNewPlanes(viewer, data)
+export async function updatePlanes(viewer, location){
+    const data = await getFLights('http://localhost:8080/flights', {long:location.long , lat: location.lat})
+    if (data.length > 0){
+        const futureTime = Cesium.JulianDate.addSeconds(
+            viewer.clock.currentTime,
+            31,
+            new Cesium.JulianDate()
+        );
+        if (data !== undefined && viewer.entities !== undefined) {
+            viewer.entities.values.forEach(async (entity) => {
+                const flight = data.find(flight => flight.id === entity.id)
+                if(flight !== undefined){
+                    await addNextPostion(flight, entity, futureTime)
+                }else if(entity.id !== 'Moon'){
+                    viewer.entities.remove(entity)
+                }
+
+            })
+
+            await addNewPlanes(viewer, data)
+        }
     }
+
 }
 
 async function addNextPostion(flight, entity, futureTime){

From 0f4616c5f1c23f9f8a13855fb7a73db8dc79ff03 Mon Sep 17 00:00:00 2001
From: Sofian Hussein <sofian.hussein@eduvaud.ch>
Date: Wed, 28 Jan 2026 10:51:44 +0100
Subject: [PATCH 42/61] Feature/calculate plane moon (#75)

* feat(): Add the basics calculations to determine if a plane is in front of the moon

* docs(): Fix a comment
---
 src/utils/scene.js | 74 ++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 74 insertions(+)

diff --git a/src/utils/scene.js b/src/utils/scene.js
index 312e2dc..e81148d 100644
--- a/src/utils/scene.js
+++ b/src/utils/scene.js
@@ -177,6 +177,80 @@ async function addNextPostion(flight, entity, futureTime){
     entity.position.addSample(futureTime, nextPos)
 }
 
+function calculateMoonPlane(flight,viewer) {
+    /*
+    Prompt to Claude :
+    If I have a person (P), a plane (A), and the moon (L), I would like to know if the plane is in front of the moon
+    from P's point of view. Please provide the formulas needed for this calculation.
+
+    P = (xₚ, yₚ, zₚ)
+    A = (xₐ, yₐ, zₐ)
+    L = (xₗ, yₗ, zₗ)
+
+    vector person towards airplane = PA = u⃗ = (xₐ - xₚ, yₐ - yₚ, zₐ - zₚ)
+    vector person towards moon = PL = v⃗ = (xₗ - xₚ, yₗ - yₚ, zₗ - zₚ)
+
+    dot product
+    u⃗ · v⃗ = (xₐ - xₚ)(xₗ - xₚ) + (yₐ - yₚ)(yₗ - yₚ) + (zₐ - zₚ)(zₗ - zₚ)
+
+
+    vectors norm
+    ||u⃗|| = √[(xₐ - xₚ)² + (yₐ - yₚ)² + (zₐ - zₚ)²]
+    ||v⃗|| = √[(xₗ - xₚ)² + (yₗ - yₚ)² + (zₗ - zₚ)²]
+
+    calculate angle O
+    O = arccos[(u⃗ · v⃗) / (||u⃗|| × ||v⃗||)]
+
+    compare the angle of the moon with that of the airplane
+    O ≤ 0.0045 (radian)
+    */
+
+    const positionCartesian = Cesium.Cartesian3.fromDegrees(flight.long, flight.lat, flight.alt);
+
+    const x_A = positionCartesian.x;
+    const y_A = positionCartesian.y;
+    const z_A = positionCartesian.z;
+
+    const cameraPos = viewer.camera.position;
+    const x_P = cameraPos.x;
+    const y_P = cameraPos.y;
+    const z_P = cameraPos.z;
+
+
+    let moonPos = viewer.scene.moon.position;
+    if (!moonPos) {
+        moonPos = Cesium.Simon1994PlanetaryPositions.computeMoonPositionInEarthInertialFrame(
+            viewer.clock.currentTime
+        );
+    }
+
+    const x_L = moonPos.x;
+    const y_L = moonPos.y;
+    const z_L = moonPos.z;
+
+    const P_To_A = {
+        x: x_A - x_P,
+        y: y_A - y_P,
+        z: z_A - z_P
+    };
+
+    const P_To_L = {
+        x: x_L - x_P,
+        y: y_L - y_P,
+        z: z_L - z_P
+    };
+
+    const dot = (x_A - x_P)*(x_L-x_P) + (y_A-y_P)*(y_L-y_P) + (z_A-z_P)*(z_L-z_P)
+
+    const norme_u = Math.sqrt((x_A - x_P)**2 + (y_A-y_P)**2 + (z_A-z_P)**2);
+    const norme_v = Math.sqrt((x_L - x_P)**2 + (y_L-y_P)**2 + (z_L-z_P)**2);
+
+    const corner_O = Math.acos(dot / (norme_u * norme_v));
+
+    if (corner_O <= 0.0045) {
+        console.log("Avion devant la lune !!!!")
+    }
+}
 async function addNewPlanes(viewer, data){
     const airplaneUri = await Cesium.IonResource.fromAssetId(4359085);
     data.forEach(async (flight) => {

From 603339e82c6936989e68d74695cfd68561835eb9 Mon Sep 17 00:00:00 2001
From: Sofian Hussein <sofian.hussein@eduvaud.ch>
Date: Wed, 28 Jan 2026 13:48:08 +0100
Subject: [PATCH 43/61] Feature/predict (#89)

* fix(): Fix a bug with the zoom

* feat(): Add the calculations needed to predict the future position of the aircraft.

* docs(): Modify the unit in the comment
---
 API/fetchFlights.py |  2 +-
 src/utils/camera.js |  1 -
 src/utils/scene.js  | 61 +++++++++++++++++++++++++++++++++++++++++++++
 3 files changed, 62 insertions(+), 2 deletions(-)

diff --git a/API/fetchFlights.py b/API/fetchFlights.py
index 79347b8..fbe1111 100644
--- a/API/fetchFlights.py
+++ b/API/fetchFlights.py
@@ -56,7 +56,7 @@ def get_flights(user_lat, user_long):
         "origin_country": country of origin of the plane
         "lat": plane latitude (°) -90 to 90
         "long": plane longitude (°) -180 to 180
-        "alt": plane altitude (km)
+        "alt": plane altitude (m)
         "velocity": plane speed (m/s)
         "heading": plane heading (°) 0 to 360, true north
         "vertical_rate": Vertical speed (m/s)
diff --git a/src/utils/camera.js b/src/utils/camera.js
index 11c6f74..76c4d36 100644
--- a/src/utils/camera.js
+++ b/src/utils/camera.js
@@ -4,7 +4,6 @@ export function flyTo(camera, cesium, lat, lng){
             destination: cesium.Cartesian3.fromDegrees(
                 lng ??  6.500465335539498, // longitude is defaulted to Sainte-Croix if undefined
                 lat ??46.82166054184684, //latitude is defaulted to Sainte-Croix if undefined
-                1000, //height
             ),
             orientation: {
                 heading: Cesium.Math.toRadians(180.0), // Orientation to the south
diff --git a/src/utils/scene.js b/src/utils/scene.js
index e81148d..7ed1656 100644
--- a/src/utils/scene.js
+++ b/src/utils/scene.js
@@ -177,6 +177,67 @@ async function addNextPostion(flight, entity, futureTime){
     entity.position.addSample(futureTime, nextPos)
 }
 
+
+function determinatePlane(flight) {
+    /*
+        Prompt to Claude :
+        I want to predict the geographical position of an aircraft in 30 seconds.
+
+        Available data:
+        - Current position: latitude (degrees), longitude (degrees), altitude (meters)
+        - Ground speed: m/s
+        - Heading: degrees (0° = North, 90° = East)
+        - Vertical speed: m/s
+
+        Provide the complete mathematical formulas to calculate the new latitude, longitude, and altitude,
+        taking into account the curvature of the Earth.
+        */
+    const long = flight.long
+    const lat = flight.lat
+    const alt = flight.alt
+    const speed = flight.velocity
+    const heading = flight.heading
+    const vertical_rate = flight.vertical_rate
+
+    const pi = Math.PI;
+
+    // prediction time in seconds
+    const delta_time = 30;
+
+    // Convert to radians
+    const long_rad = long * pi / 180
+    const lat_rad = lat * pi / 180
+    const heading_rad = heading * pi / 180
+
+    const earth_radius = 6371000  // meters
+
+    // Horizontal distance traveled
+    const distance = speed * delta_time
+
+    // Calculate new latitude
+    const new_lat_rad = Math.asin(
+        Math.sin(lat_rad) * Math.cos(distance / earth_radius) +
+        Math.cos(lat_rad) * Math.sin(distance / earth_radius) * Math.cos(heading_rad)
+    )
+
+    // Calculate new longitude
+    const delta_long = Math.atan2(
+        Math.sin(heading_rad) * Math.sin(distance / earth_radius) * Math.cos(lat_rad),
+        Math.cos(distance / earth_radius) - Math.sin(lat_rad) * Math.sin(new_lat_rad)
+    )
+    const new_long_rad = long_rad + delta_long
+
+    // Calculate new altitude
+    const new_alt = alt + vertical_rate * delta_time
+
+    // Convert result back to degrees
+    const new_lat = new_lat_rad * 180 / pi
+    const new_long = new_long_rad * 180 / pi
+
+    // Return predicted position
+    return Cesium.Cartesian3.fromDegrees(new_long, new_lat, new_alt);
+}
+
 function calculateMoonPlane(flight,viewer) {
     /*
     Prompt to Claude :

From c1e418a033a7e8f2808b049239fc523e958d6509 Mon Sep 17 00:00:00 2001
From: David Galindo <155019077+davidgalindo-git@users.noreply.github.com>
Date: Thu, 29 Jan 2026 08:54:58 +0100
Subject: [PATCH 44/61] setup email (#84)

* feat:"sms checkbox template"

* feat:"phone number input if box checked"

* chore:"comments"

* feat:"python email setup"

* refactor:"use email instead of sms"

* feat:"test mail frontend setup"

* refactor:"gmail py file ref"

* refactor:"route ref"

* feat:"test email sent succesfully"

* fix:"send test email button css"

---------

Co-authored-by: davidgalindo-git <>
---
 API/gmail.py                          | 56 +++++++++++++++++++++++++
 API/main.py                           |  3 ++
 src/components/CoordinateForm.vue     |  2 +
 src/components/notification/Email.vue | 60 +++++++++++++++++++++++++++
 4 files changed, 121 insertions(+)
 create mode 100644 API/gmail.py
 create mode 100644 src/components/notification/Email.vue

diff --git a/API/gmail.py b/API/gmail.py
new file mode 100644
index 0000000..693416d
--- /dev/null
+++ b/API/gmail.py
@@ -0,0 +1,56 @@
+import smtplib
+import os
+from email.message import EmailMessage
+from fastapi import APIRouter, HTTPException, Body
+from pydantic import BaseModel
+
+router = APIRouter()
+
+class EmailRequest(BaseModel):
+    user_email: str
+
+@router.post("/send-email")
+def send_email():
+    mail_host = "smtp.gmail.com" # mail manager host
+    port = 587 # standard SMTP submission port (STARTTLS)
+
+    sender_email = "<EMAIL>" # email address that will send mail
+    sender_password = os.getenv("GMAIL_APP_PASSWORD") # gmail app password
+    recipient_email = "<EMAIL>" # email address that will receive mail
+
+    # compose email
+    msg = EmailMessage() # init email obj
+    msg["Subject"] = "Planium : A plane is flying near the Moon 🌙" # email subject
+    msg["From"] = sender_email    # sender
+    msg["To"] = recipient_email        # recipient
+    msg.set_content("A plane is about to fly near the moon.") # email content
+
+    # send email
+    with smtplib.SMTP(mail_host, port) as smtp:
+        smtp.starttls()
+        smtp.login(sender_email, sender_password) # login with user credentials
+        smtp.send_message(msg)
+
+# send test email
+@router.post("/send-test-email")
+def send_test_email(request: EmailRequest):
+    sender_email = "zzabcmail123@gmail.com"
+    sender_password = os.getenv("GMAIL_APP_PASSWORD")
+
+    if not sender_password:
+        raise HTTPException(status_code=500, detail="GMAIL_APP_PASSWORD not set")
+
+    msg = EmailMessage()
+    msg["Subject"] = "Planium : A plane is flying near the Moon 🌙"
+    msg["From"] = sender_email
+    msg["To"] = request.user_email
+    msg.set_content("A plane is about to fly near the moon.")
+
+    try:
+        with smtplib.SMTP("smtp.gmail.com", 587) as smtp:
+            smtp.starttls()
+            smtp.login(sender_email, sender_password)
+            smtp.send_message(msg)
+        return {"success": True}
+    except Exception as e:
+        raise HTTPException(status_code=500, detail=str(e))
\ No newline at end of file
diff --git a/API/main.py b/API/main.py
index 6977a97..412c373 100644
--- a/API/main.py
+++ b/API/main.py
@@ -8,6 +8,7 @@
 from fastapi import FastAPI, Query, HTTPException
 from fetchFlights import get_flights
 from fastapi.middleware.cors import CORSMiddleware
+from gmail import router as email_router
 
 app = FastAPI()
 
@@ -24,6 +25,8 @@
     allow_headers=["*"],
 )
 
+app.include_router(email_router, prefix="/api")
+
 @app.get("/flights")
 def get_flights_endpoint(
         lat: float = Query(None, description="User latitude"),
diff --git a/src/components/CoordinateForm.vue b/src/components/CoordinateForm.vue
index 00cc0d1..107613a 100644
--- a/src/components/CoordinateForm.vue
+++ b/src/components/CoordinateForm.vue
@@ -1,5 +1,6 @@
 <script setup>
 import {ref} from "vue";
+import Email from "@/components/notification/Email.vue"
 
 const lat = ref(0)
 const lng = ref(0)
@@ -36,6 +37,7 @@ function send(lat, lng){
           <input v-model="lng" type="number" class="input input-xs" placeholder="6.13838333" />
           </fieldset>
           <button type="submit" @click="send(lat, lng)" class="btn btn-neutral mt-8">Find</button>
+          <Email />
   </div>
   </div>
 
diff --git a/src/components/notification/Email.vue b/src/components/notification/Email.vue
new file mode 100644
index 0000000..a38ac65
--- /dev/null
+++ b/src/components/notification/Email.vue
@@ -0,0 +1,60 @@
+<script setup>
+import { ref } from "vue";
+
+const emailCheck = ref(false); // flag: is "Receive..." box checked?
+const user_email = ref(""); // stores user's email
+
+async function sendTestEmail() {
+  if (!emailCheck.value) {
+    alert("Please check the box to receive email notifications.");
+    return;
+  }
+  if (!user_email.value) {
+    alert("Please enter a valid email address.");
+    return;
+  }
+
+  try{
+    const res = await fetch("http://localhost:8080/api/send-test-email", {
+      method: "POST",
+      headers: {"Content-Type": "application/json"},
+      body: JSON.stringify({ user_email: user_email.value }),
+    });
+
+    if (!res.ok) throw new Error("Failed to send test email");
+
+    alert("Test email sent successfully.");
+  } catch (error) {
+    alert("Error sending email:" + error.message);
+  }
+}
+</script>
+
+<template>
+  <!-- receive email checkbox -->
+  <label class="flex items-center gap-2">
+    <input
+        type="checkbox"
+        v-model="emailCheck"
+    />
+    <div>
+      <p>Receive an email notification when</p>
+      <p>a plane is about to fly near the Moon</p>
+    </div>
+  </label>
+  <!-- email address input shown if box checked -->
+  <input
+      v-if="emailCheck"
+      v-model="user_email"
+      type="email"
+      placeholder="Email address : example@email.com"
+      class="input"
+  />
+  <button
+      class="px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 transition disabled:opacity-50"
+      type="submit"
+      @click="sendTestEmail"
+  >
+    Send Test Email
+  </button>
+</template>
\ No newline at end of file

From 87fd880b9c5a9ea299ad64c200ad3851358a1378 Mon Sep 17 00:00:00 2001
From: Sofian Hussein <sofian.hussein@eduvaud.ch>
Date: Thu, 29 Jan 2026 09:41:35 +0100
Subject: [PATCH 45/61] Feature/logs (#92)

* fix(): Fix a bug with the zoom

* feat(): Add a log function

* feat(): Add a basic log function with API

* feat(): Send the logs to the backend every 15 seconds

---------

Co-authored-by: Joris Bailly <90181523+JorisBly@users.noreply.github.com>
---
 API/main.py        | 27 ++++++++++++++++++++
 src/utils/scene.js | 61 ++++++++++++++++++++++++++++++++++++++++++++--
 2 files changed, 86 insertions(+), 2 deletions(-)

diff --git a/API/main.py b/API/main.py
index 412c373..8276ce7 100644
--- a/API/main.py
+++ b/API/main.py
@@ -5,9 +5,11 @@
 Description: Backend service to fetch and serve live flight data using OpenSky API.
 """
 import uvicorn
+import os
 from fastapi import FastAPI, Query, HTTPException
 from fetchFlights import get_flights
 from fastapi.middleware.cors import CORSMiddleware
+from pydantic import BaseModel
 from gmail import router as email_router
 
 app = FastAPI()
@@ -25,6 +27,8 @@
     allow_headers=["*"],
 )
 
+class Log(BaseModel):
+    message: str
 app.include_router(email_router, prefix="/api")
 
 @app.get("/flights")
@@ -51,6 +55,29 @@ def get_flights_endpoint(
 
     return flights
 
+@app.post("/logs")
+def write_logs(log : Log):
+    """
+    Route that writes logs to a file
+
+    :return: "message": "Logs were added"
+    """
+    # Source : https://www.docstring.fr/formations/faq/fichiers/comment-lire-et-ecrire-dans-un-fichier-en-python/
+    # Source : www.geeksforgeeks.org/python/create-a-directory-in-python/
+    # Source : https://fastapi.tiangolo.com/tutorial/body/
+
+    # Create a folder at the root
+    project_root = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
+
+    logs_dir = os.path.join(project_root, "Logs")
+    os.makedirs(logs_dir, exist_ok=True)
+
+    log_file_path = os.path.join(logs_dir, "log.txt")
+
+    with open(log_file_path, "a", encoding="utf-8") as log_file:
+        log_file.write(f"{log.message}\n")
+    return {"message": "Logs were added"}
+
 
 @app.get("/")
 def read_root():
diff --git a/src/utils/scene.js b/src/utils/scene.js
index 7ed1656..2ff3216 100644
--- a/src/utils/scene.js
+++ b/src/utils/scene.js
@@ -1,4 +1,10 @@
 import {getFLights} from "@/utils/api.js";
+import fs from 'fs';
+import path from 'path';
+
+// data structure that allows logs to be stored
+// Source : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map
+const logs = new Map()
 
 export async function prepareScene(scene){
     //------------Uncomment if performance is low---------------------
@@ -177,6 +183,40 @@ async function addNextPostion(flight, entity, futureTime){
     entity.position.addSample(futureTime, nextPos)
 }
 
+async function sendToLogFile() {
+    /*
+    Source : https://brightdata.fr/blog/donnees-web/fetch-api-in-javascript
+    */
+
+    // Source : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from
+    // Convert map to array
+    let logsArray = Array.from(logs.values());
+
+    const url = "http://localhost:8080/logs"
+
+    try {
+        const response = await fetch(url, {
+            method: "POST",
+            headers: {
+                'Content-type': 'application/json; charset=UTF-8',
+            },
+            // Source : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/join
+            body: JSON.stringify({
+                message: logsArray.join('\n'),
+            }),
+        });
+
+        // Clear the logs once they have been sent to the API
+        logs.clear();
+
+        if (!response.ok) {
+            throw new Error(`Response status: ${response.status}`);
+        }
+    } catch (error) {
+        console.error(error.message);
+    }
+}
+
 
 function determinatePlane(flight) {
     /*
@@ -265,7 +305,6 @@ function calculateMoonPlane(flight,viewer) {
     compare the angle of the moon with that of the airplane
     O ≤ 0.0045 (radian)
     */
-
     const positionCartesian = Cesium.Cartesian3.fromDegrees(flight.long, flight.lat, flight.alt);
 
     const x_A = positionCartesian.x;
@@ -308,9 +347,24 @@ function calculateMoonPlane(flight,viewer) {
 
     const corner_O = Math.acos(dot / (norme_u * norme_v));
 
+    // Source : https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Global_Objects/Map/has
+    const key = `${flight.id}`
+
+    const currentLog = logs.get(flight.id);
+
     if (corner_O <= 0.0045) {
-        console.log("Avion devant la lune !!!!")
+        if (!currentLog) {
+            logs.set(key, `Aircraft pass in front of the moon | Camera : ${cameraPos} | Aircraft ID : ${flight.id} 
+            | Time : ${new Date().toISOString()}`);
+        }
+    } else if (corner_O <= 0.0135) {
+        // Source : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith
+        if (!currentLog || !currentLog.startsWith("Aircraft pass in front")) {
+            logs.set(key, `Aircraft pass close to the moon | Camera : ${cameraPos} | Aircraft ID : ${flight.id} 
+            | Time : ${new Date().toISOString()}`);
+        }
     }
+
 }
 async function addNewPlanes(viewer, data){
     const airplaneUri = await Cesium.IonResource.fromAssetId(4359085);
@@ -326,3 +380,6 @@ async function addNewPlanes(viewer, data){
     })
 }
 
+// Source : https://developer.mozilla.org/en-US/docs/Web/API/Window/setInterval
+// Send the logs every 15 seconds
+setInterval(sendToLogFile, 15000)
\ No newline at end of file

From daa0c3d2be2e64ad079cffa12a56f5b019a17f46 Mon Sep 17 00:00:00 2001
From: Joris Bailly <90181523+JorisBly@users.noreply.github.com>
Date: Thu, 29 Jan 2026 10:35:18 +0100
Subject: [PATCH 46/61] Feature/refactorig (#93)

* feat(): Add gmail app password to .env.example

* feat(): Hide Email component in CoordinateForm for production

* refactor(): Extract email logic outside the component to be able to use it everywhere

* refactor(): Add more informations on the README about the different asset and account to create

* refactor(): Extract models in API/models

* refactor(): Use the extracted models for EmailRequest and Log
---
 .env.example                          |  4 +++-
 API/gmail.py                          |  4 +---
 API/main.py                           |  4 ++--
 API/models/EmailRequest.py            |  4 ++++
 API/models/Log.py                     |  4 ++++
 README.md                             | 18 ++++++++++++++---
 src/components/CoordinateForm.vue     |  2 +-
 src/components/notification/Email.vue | 29 +++------------------------
 src/utils/mail.js                     | 24 ++++++++++++++++++++++
 9 files changed, 57 insertions(+), 36 deletions(-)
 create mode 100644 API/models/EmailRequest.py
 create mode 100644 API/models/Log.py
 create mode 100644 src/utils/mail.js

diff --git a/.env.example b/.env.example
index 521082f..6d1cc17 100644
--- a/.env.example
+++ b/.env.example
@@ -4,4 +4,6 @@ VITE_MOON_PHASE_APP_ID="YOUR_APP_ID"
 VITE_MOON_PHASE_APP_SECRET="YOUR_MOON_APP_SECRET"
 
 OPENSKY_CLIENT_ID="YOUR_CLIENT_ID"
-OPENSKY_CLIENT_SECRET="YOU_SECRET"
\ No newline at end of file
+OPENSKY_CLIENT_SECRET="YOU_SECRET"
+
+GMAIL_APP_PASSWORD="YOUR_GMAIL_APP_PASSWORD"
diff --git a/API/gmail.py b/API/gmail.py
index 693416d..6d7ba04 100644
--- a/API/gmail.py
+++ b/API/gmail.py
@@ -2,12 +2,10 @@
 import os
 from email.message import EmailMessage
 from fastapi import APIRouter, HTTPException, Body
-from pydantic import BaseModel
+from models.EmailRequest import EmailRequest
 
 router = APIRouter()
 
-class EmailRequest(BaseModel):
-    user_email: str
 
 @router.post("/send-email")
 def send_email():
diff --git a/API/main.py b/API/main.py
index 8276ce7..69a7250 100644
--- a/API/main.py
+++ b/API/main.py
@@ -11,6 +11,7 @@
 from fastapi.middleware.cors import CORSMiddleware
 from pydantic import BaseModel
 from gmail import router as email_router
+from models.Log import Log
 
 app = FastAPI()
 
@@ -27,8 +28,7 @@
     allow_headers=["*"],
 )
 
-class Log(BaseModel):
-    message: str
+
 app.include_router(email_router, prefix="/api")
 
 @app.get("/flights")
diff --git a/API/models/EmailRequest.py b/API/models/EmailRequest.py
new file mode 100644
index 0000000..3474815
--- /dev/null
+++ b/API/models/EmailRequest.py
@@ -0,0 +1,4 @@
+from pydantic import BaseModel
+
+class EmailRequest(BaseModel):
+    user_email: str
\ No newline at end of file
diff --git a/API/models/Log.py b/API/models/Log.py
new file mode 100644
index 0000000..bcb85de
--- /dev/null
+++ b/API/models/Log.py
@@ -0,0 +1,4 @@
+from pydantic import BaseModel
+
+class Log(BaseModel):
+    message: str
\ No newline at end of file
diff --git a/README.md b/README.md
index 1d91add..1401182 100644
--- a/README.md
+++ b/README.md
@@ -1,19 +1,31 @@
 # Planium
 
-
+Planium is an application for fan of astrology and photos of planes in front of the moon.
 
 ## Stacks
 - [Vue.js](https://vuejs.org/)
 - [vue-cesium](https://zouyaoji.top/vue-cesium/#/en-US)
+- [Cesium](https://cesium.com/cesiumjs/)
+- [FastAPI](https://fastapi.tiangolo.com/)
 - [DaisyUi](https://daisyui.com/)
 
+
 ## Requirements
 - Node.js 20.19.0+
 - Python 3.10+
 
 ## Prerequisites
-    - A Cesium ion account (To Downloads and load assets)
-    - A Opensky account (To get more credits for the API)
+- [A Cesium ion account](https://ion.cesium.com) (To Downloads and load assets)
+- [A Opensky account](https://opensky-network.org) (To get more credits for the API, follow this [tutorial](https://openskynetwork.github.io/opensky-api/rest.html#oauth2-client-credentials-flow))
+- [A Astronomy account](https://astronomyapi.com) (To get the moon phase)
+- [A Google app linked to an email](https://myaccount.google.com/apppasswords) (To send emails)
+
+## Upload non-ion assets
+1. Download the following assets and upload them to your ion account:
+   - [Plane](https://cesium.cdn.prismic.io/cesium/Zv2eybVsGrYSwUFj_Cesium_Air.glb)
+2. Go to [your account dashboard](https://ion.cesium.com/assets/?). Drag and drop the model file on this page.
+3. Select **3D Model (Convert to glTF)**, then click **Upload**.
+4. After it’s done processing, find the **asset ID** by selecting the new asset back in your dashboard and looking under the preview window on the right.
 
 ## Project Setup
 
diff --git a/src/components/CoordinateForm.vue b/src/components/CoordinateForm.vue
index 107613a..3490dfa 100644
--- a/src/components/CoordinateForm.vue
+++ b/src/components/CoordinateForm.vue
@@ -37,7 +37,7 @@ function send(lat, lng){
           <input v-model="lng" type="number" class="input input-xs" placeholder="6.13838333" />
           </fieldset>
           <button type="submit" @click="send(lat, lng)" class="btn btn-neutral mt-8">Find</button>
-          <Email />
+<!--          <Email />-->
   </div>
   </div>
 
diff --git a/src/components/notification/Email.vue b/src/components/notification/Email.vue
index a38ac65..1ede3db 100644
--- a/src/components/notification/Email.vue
+++ b/src/components/notification/Email.vue
@@ -1,35 +1,12 @@
 <script setup>
 import { ref } from "vue";
+import {sendTestEmail} from "@/utils/mail.js";
 
 const emailCheck = ref(false); // flag: is "Receive..." box checked?
 const user_email = ref(""); // stores user's email
 
-async function sendTestEmail() {
-  if (!emailCheck.value) {
-    alert("Please check the box to receive email notifications.");
-    return;
-  }
-  if (!user_email.value) {
-    alert("Please enter a valid email address.");
-    return;
-  }
-
-  try{
-    const res = await fetch("http://localhost:8080/api/send-test-email", {
-      method: "POST",
-      headers: {"Content-Type": "application/json"},
-      body: JSON.stringify({ user_email: user_email.value }),
-    });
-
-    if (!res.ok) throw new Error("Failed to send test email");
-
-    alert("Test email sent successfully.");
-  } catch (error) {
-    alert("Error sending email:" + error.message);
-  }
-}
 </script>
-
+<!-----------------------------------------This is a component to test the email sender manually-------------------------->
 <template>
   <!-- receive email checkbox -->
   <label class="flex items-center gap-2">
@@ -53,7 +30,7 @@ async function sendTestEmail() {
   <button
       class="px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 transition disabled:opacity-50"
       type="submit"
-      @click="sendTestEmail"
+      @click="async () => sendTestEmail(emailCheck, user_email)"
   >
     Send Test Email
   </button>
diff --git a/src/utils/mail.js b/src/utils/mail.js
new file mode 100644
index 0000000..76b45ff
--- /dev/null
+++ b/src/utils/mail.js
@@ -0,0 +1,24 @@
+export async function sendTestEmail(emailCheck, user_email) {
+    if (!emailCheck) {
+        alert("Please check the box to receive email notifications.");
+        return;
+    }
+    if (!user_email) {
+        alert("Please enter a valid email address.");
+        return;
+    }
+
+    try{
+        const res = await fetch("http://localhost:8080/api/send-test-email", {
+            method: "POST",
+            headers: {"Content-Type": "application/json"},
+            body: JSON.stringify({ user_email: user_email }),
+        });
+
+        if (!res.ok) throw new Error("Failed to send test email");
+
+        alert("Test email sent successfully.");
+    } catch (error) {
+        alert("Error sending email:" + error.message);
+    }
+}
\ No newline at end of file

From ac60c1ab95f4793da7e4c4c7a6fbd4fd0c230f5d Mon Sep 17 00:00:00 2001
From: Sofian Hussein <sofian.hussein@eduvaud.ch>
Date: Thu, 29 Jan 2026 10:52:26 +0100
Subject: [PATCH 47/61] Feature/calculations predict refactor (#94)

* fix(): Fix a bug with the zoom

* Feature/predict (#89)

* fix(): Fix a bug with the zoom

* feat(): Add the calculations needed to predict the future position of the aircraft.

* docs(): Modify the unit in the comment

* feat(): Add a log function

* feat(): Add a basic log function with API

* feat(): detect aircraft in front of the moon

* feat(): Send logs every 30 seconds

* docs(): Add a comment
---
 src/utils/scene.js | 177 +++++++++++++++++++++++++++++++++------------
 1 file changed, 131 insertions(+), 46 deletions(-)

diff --git a/src/utils/scene.js b/src/utils/scene.js
index 2ff3216..e6a8476 100644
--- a/src/utils/scene.js
+++ b/src/utils/scene.js
@@ -1,6 +1,4 @@
 import {getFLights} from "@/utils/api.js";
-import fs from 'fs';
-import path from 'path';
 
 // data structure that allows logs to be stored
 // Source : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map
@@ -218,7 +216,8 @@ async function sendToLogFile() {
 }
 
 
-function determinatePlane(flight) {
+
+function determinatePlane(flight, delta_time) {
     /*
         Prompt to Claude :
         I want to predict the geographical position of an aircraft in 30 seconds.
@@ -231,7 +230,7 @@ function determinatePlane(flight) {
 
         Provide the complete mathematical formulas to calculate the new latitude, longitude, and altitude,
         taking into account the curvature of the Earth.
-        */
+    */
     const long = flight.long
     const lat = flight.lat
     const alt = flight.alt
@@ -241,8 +240,6 @@ function determinatePlane(flight) {
 
     const pi = Math.PI;
 
-    // prediction time in seconds
-    const delta_time = 30;
 
     // Convert to radians
     const long_rad = long * pi / 180
@@ -281,35 +278,27 @@ function determinatePlane(flight) {
 function calculateMoonPlane(flight,viewer) {
     /*
     Prompt to Claude :
-    If I have a person (P), a plane (A), and the moon (L), I would like to know if the plane is in front of the moon
-    from P's point of view. Please provide the formulas needed for this calculation.
-
-    P = (xₚ, yₚ, zₚ)
-    A = (xₐ, yₐ, zₐ)
-    L = (xₗ, yₗ, zₗ)
-
-    vector person towards airplane = PA = u⃗ = (xₐ - xₚ, yₐ - yₚ, zₐ - zₚ)
-    vector person towards moon = PL = v⃗ = (xₗ - xₚ, yₗ - yₚ, zₗ - zₚ)
+    If I have a person P (with coordinates x, y, z),
+    a line segment representing the trajectory of an airplane from 0 to 60 seconds (points A_Now and A_Prediction),
+    and the moon L (x, y, z),
 
-    dot product
-    u⃗ · v⃗ = (xₐ - xₚ)(xₗ - xₚ) + (yₐ - yₚ)(yₗ - yₚ) + (zₐ - zₚ)(zₗ - zₚ)
+    I would like to know if the airplane passes in front of the moon from P's point of view at any point during those
+    60 seconds
 
+    Please provide the detailed mathematical formulas needed to calculate that.
+    */
 
-    vectors norm
-    ||u⃗|| = √[(xₐ - xₚ)² + (yₐ - yₚ)² + (zₐ - zₚ)²]
-    ||v⃗|| = √[(xₗ - xₚ)² + (yₗ - yₚ)² + (zₗ - zₚ)²]
+    const positionFlightNow = Cesium.Cartesian3.fromDegrees(flight.long, flight.lat, flight.alt);
 
-    calculate angle O
-    O = arccos[(u⃗ · v⃗) / (||u⃗|| × ||v⃗||)]
+    const x_A_Now = positionFlightNow.x;
+    const y_A_Now = positionFlightNow.y;
+    const z_A_Now = positionFlightNow.z;
 
-    compare the angle of the moon with that of the airplane
-    O ≤ 0.0045 (radian)
-    */
-    const positionCartesian = Cesium.Cartesian3.fromDegrees(flight.long, flight.lat, flight.alt);
+    const positionFlightPrediction = determinatePlane(flight, 60)
 
-    const x_A = positionCartesian.x;
-    const y_A = positionCartesian.y;
-    const z_A = positionCartesian.z;
+    const x_A_Predict = positionFlightPrediction.x;
+    const y_A_Predict = positionFlightPrediction.y;
+    const z_A_Predict = positionFlightPrediction.z;
 
     const cameraPos = viewer.camera.position;
     const x_P = cameraPos.x;
@@ -328,44 +317,140 @@ function calculateMoonPlane(flight,viewer) {
     const y_L = moonPos.y;
     const z_L = moonPos.z;
 
-    const P_To_A = {
-        x: x_A - x_P,
-        y: y_A - y_P,
-        z: z_A - z_P
-    };
-
+    // P_To_L = P To Moon
+    // the direction is the moon
     const P_To_L = {
         x: x_L - x_P,
         y: y_L - y_P,
         z: z_L - z_P
     };
 
-    const dot = (x_A - x_P)*(x_L-x_P) + (y_A-y_P)*(y_L-y_P) + (z_A-z_P)*(z_L-z_P)
+    // P_To_A_Now
+    // The direction of the plane now
+    const P_To_A_Now = {
+        x: x_A_Now - x_P,
+        y: y_A_Now - y_P,
+        z: z_A_Now - z_P
+    };
+
+    // the direction of the prediction
+    const A_Now_To_A_Pred = {
+        x: x_A_Predict - x_A_Now,
+        y: y_A_Predict - y_A_Now,
+        z: z_A_Predict - z_A_Now
+    };
+
+    // normalize moon direction
+    // distance between the observer and the moon
+    const norm_P_To_L = Math.sqrt(
+        P_To_L.x ** 2 +
+        P_To_L.y ** 2 +
+        P_To_L.z ** 2
+    )
+
+    // keep only the direction
+    const u_L = {
+        x: P_To_L.x / norm_P_To_L,
+        y: P_To_L.y / norm_P_To_L,
+        z: P_To_L.z / norm_P_To_L
+    };
 
-    const norme_u = Math.sqrt((x_A - x_P)**2 + (y_A-y_P)**2 + (z_A-z_P)**2);
-    const norme_v = Math.sqrt((x_L - x_P)**2 + (y_L-y_P)**2 + (z_L-z_P)**2);
+    // Dot product: P_To_A_Now · u_L
+    // how far the plane is already pointing towards the moon
+    const P_To_A_Now_dot_u_L =
+        P_To_A_Now.x * u_L.x +
+        P_To_A_Now.y * u_L.y +
+        P_To_A_Now.z * u_L.z;
+
+    // Dot product: A_Now_To_A_Pred · u_L
+    // indicates whether the aircraft is moving towards or away from the lunar direction.
+    const A_Now_To_A_Pred_dot_u_L =
+        A_Now_To_A_Pred.x * u_L.x +
+        A_Now_To_A_Pred.y * u_L.y +
+        A_Now_To_A_Pred.z * u_L.z;
+
+    // time the plane is closest to the moon
+    let t_closest;
+
+    // handle cases where the result is almost zero
+    const epsilon = 1e-10;
+
+    if (Math.abs(A_Now_To_A_Pred_dot_u_L) < epsilon) {
+        // Trajectory perpendicular to moon direction
+        t_closest = 0;
+
+    } else {
+        // calculate the moment when the plane will be closest to the moon.
+        const t_star = -60 * P_To_A_Now_dot_u_L / A_Now_To_A_Pred_dot_u_L;
+        // limit the result between 0 and 60 seconds
+        t_closest = Math.max(0, Math.min(60, t_star));
+    }
 
-    const corner_O = Math.acos(dot / (norme_u * norme_v));
+
+    // Converts time into a ratio between 0 and 1.
+    const t_ratio = t_closest / 60;
+
+    // calculates the position of the plane at the moment when the plane is closest to the moon
+    const P_To_A_At_t_closest = {
+        x: P_To_A_Now.x + t_ratio * A_Now_To_A_Pred.x,
+        y: P_To_A_Now.y + t_ratio * A_Now_To_A_Pred.y,
+        z: P_To_A_Now.z + t_ratio * A_Now_To_A_Pred.z
+    };
+
+    // calculate the length of the observer vector
+    const norm_P_To_A_At_t_closest = Math.sqrt(
+        P_To_A_At_t_closest.x ** 2 +
+        P_To_A_At_t_closest.y ** 2 +
+        P_To_A_At_t_closest.z ** 2
+    );
+
+    // in order to calculate the angle between the two directions
+    const dot_product =
+        P_To_A_At_t_closest.x * P_To_L.x +
+        P_To_A_At_t_closest.y * P_To_L.y +
+        P_To_A_At_t_closest.z * P_To_L.z;
+
+    // calculate the cosine of the angle between the two directions
+    /*
+    cos(0°) = 1 → same directions
+    cos(90°) = 0 → perpendicular directions
+    cos(180°) = -1 → opposite directions
+    */
+    const cos_theta = dot_product / (norm_P_To_A_At_t_closest * norm_P_To_L);
+
+
+    // we force the value into the valid range
+    const cos_theta_clamped = Math.max(-1, Math.min(1, cos_theta));
+
+    // Calculate the angle in radians between the direction of the plane and the direction of the moon.
+    const corner_O = Math.acos(cos_theta_clamped);
+
+    const moonAngularRadius = 0.0045
+    const closeTheMoon = 0.0135
 
     // Source : https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Global_Objects/Map/has
     const key = `${flight.id}`
 
     const currentLog = logs.get(flight.id);
 
-    if (corner_O <= 0.0045) {
+    if (corner_O <= moonAngularRadius) {
         if (!currentLog) {
+            const closestDate = new Date(Date.now() + t_closest * 1000);
+            const logTime = closestDate.toISOString();
             logs.set(key, `Aircraft pass in front of the moon | Camera : ${cameraPos} | Aircraft ID : ${flight.id} 
-            | Time : ${new Date().toISOString()}`);
+            | Time : ${logTime}`);
         }
-    } else if (corner_O <= 0.0135) {
+    } else if (corner_O <= closeTheMoon) {
         // Source : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith
         if (!currentLog || !currentLog.startsWith("Aircraft pass in front")) {
+            const closestDate = new Date(Date.now() + t_closest * 1000);
+            const logTime = closestDate.toISOString();
             logs.set(key, `Aircraft pass close to the moon | Camera : ${cameraPos} | Aircraft ID : ${flight.id} 
-            | Time : ${new Date().toISOString()}`);
+            | Time : ${logTime}`);
         }
     }
-
 }
+
 async function addNewPlanes(viewer, data){
     const airplaneUri = await Cesium.IonResource.fromAssetId(4359085);
     data.forEach(async (flight) => {
@@ -380,6 +465,6 @@ async function addNewPlanes(viewer, data){
     })
 }
 
+
 // Source : https://developer.mozilla.org/en-US/docs/Web/API/Window/setInterval
-// Send the logs every 15 seconds
-setInterval(sendToLogFile, 15000)
\ No newline at end of file
+setInterval(sendToLogFile,30000)
\ No newline at end of file

From acde3e5031099ba66980815ca447ee9ff0cbe284 Mon Sep 17 00:00:00 2001
From: Joris Bailly <90181523+JorisBly@users.noreply.github.com>
Date: Thu, 29 Jan 2026 11:53:07 +0100
Subject: [PATCH 48/61] Feature/predict plane position (#90)

* feat(): Add plane_ inside of plane id to recognise than it's a plane and note any entities

* feat(): Delete only entities who include plane in their id

* feat(): rollbakc to the same logic as before

* feat(): remove unused checkLastOccurence

* feat(): feat implement prediction for planes

* feat(): Adjust the second for the interval

* feat(): Check each time we add a position if this one is in front of the moon

* feat(): Put 24h in seconds

* feat(): Make scene never stop

* feat(): Use the new version of prediction for plane position calculation

* feat(): Log every 30 seconds
---
 src/components/Viewer.vue |  5 +--
 src/utils/scene.js        | 67 +++++++++++++++++++--------------------
 2 files changed, 35 insertions(+), 37 deletions(-)

diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index 962cb6d..2063347 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -1,7 +1,7 @@
 <script setup>
 import {VcViewer} from "vue-cesium";
 import {nextTick, ref} from "vue";
-import {loadPlanes, updatePlanes, prepareScene, removeMoving} from "@/utils/scene.js";
+import {loadPlanes, updatePlanes, prepareScene, removeMoving, sendToLogFile} from "@/utils/scene.js";
 import Imagery from "@/components/imagery/Imagery.vue";
 import {flyTo} from "@/utils/camera.js";
 import Navigation from "@/components/navigation/Navigation.vue";
@@ -61,8 +61,9 @@ const onViewerReady = async ({Cesium, viewer}) => {
       setInterval(async () => {
         if (mapViewer.value !== undefined){
           await updatePlanes(mapViewer.value, location.value)
+          await sendToLogFile()
         }
-      }, 30000)
+      }, 59000)
 
     } catch (error) {
       console.error("Error loading tileset:", error);
diff --git a/src/utils/scene.js b/src/utils/scene.js
index e6a8476..a31d710 100644
--- a/src/utils/scene.js
+++ b/src/utils/scene.js
@@ -89,13 +89,12 @@ export async function loadPlanes(viewer, location){
           Initialize the viewer's clock by setting its start and stop to the flight start and stop times we just calculated.
           Also, set the viewer's current time to the start time and take the user to that time.
         */
-        const timeStepInSeconds = 30;
         // const totalSeconds = timeStepInSeconds * (flightData.length - 1);
         const start = Cesium.JulianDate.now();
-        const stop = Cesium.JulianDate.addSeconds(start, 10000000000, new Cesium.JulianDate());
+        const stop = Cesium.JulianDate.addSeconds(start, 86400, new Cesium.JulianDate());
 
         viewer.clock.startTime = start.clone();
-        // viewer.clock.stopTime = stop.clone();
+        viewer.clock.clockRange = Cesium.ClockRange.UNBOUNDED
         viewer.clock.currentTime = start.clone();
 
         // viewer.timeline.zoomTo(start, stop);
@@ -116,20 +115,15 @@ export async function loadPlanes(viewer, location){
 
             const position = Cesium.Cartesian3.fromDegrees(flight.long, flight.lat, flight.alt);
             // Store the position along with its timestamp.
-            // Here we add the positions all upfront, but these can be added at run-time as samples are received from a server.
             positionProperty.addSample(start, position);
             // Make planes appear even if it's too late
             positionProperty.forwardExtrapolationType = Cesium.ExtrapolationType.HOLD
             positionProperty.backwardExtrapolationType = Cesium.ExtrapolationType.HOLD
 
-            // viewer.entities.add({
-            //     description: `Location: (${flight.long}, ${flight.lat}, ${flight.alt})`,
-            //     position: position,
-            //     point: {pixelSize: 10, color: Cesium.Color.RED}
-            // });
-
             await loadModel(viewer, start, stop, positionProperty, airplaneUri, flight.id);
 
+            positionProperty.addSample(getNextTimeBySecond(viewer, 60), determinatePlane(flight, 60))
+            calculateMoonPlane(flight, viewer)
         }
     }
 
@@ -138,50 +132,52 @@ export async function loadPlanes(viewer, location){
 
 async function loadModel(viewer, start, stop, positionProperty, airplaneUri, id) {
     // Load the glTF model from Cesium ion.
-    const airplaneEntity = viewer.entities.add({
-        id: id,
+    viewer.entities.add({
+        id: "plane_" + id,
         availability: new Cesium.TimeIntervalCollection([ new Cesium.TimeInterval({ start: start, stop: stop }) ]),
         position: positionProperty,
         // Attach the 3D model instead of the green point.
-        model: {uri: airplaneUri,minimumPixelSize: 100  },
+        model: {uri: airplaneUri,minimumPixelSize: 100 },
         // Automatically compute the orientation from the position.
         orientation: new Cesium.VelocityOrientationProperty(positionProperty),
-        path: new Cesium.PathGraphics({ width: 3 , trailTime: 30})
+        path: new Cesium.PathGraphics({ width: 3 , trailTime: 60})
     });
 }
 
 export async function updatePlanes(viewer, location){
+
     const data = await getFLights('http://localhost:8080/flights', {long:location.long , lat: location.lat})
     if (data.length > 0){
-        const futureTime = Cesium.JulianDate.addSeconds(
-            viewer.clock.currentTime,
-            31,
-            new Cesium.JulianDate()
-        );
+
         if (data !== undefined && viewer.entities !== undefined) {
             viewer.entities.values.forEach(async (entity) => {
-                const flight = data.find(flight => flight.id === entity.id)
-                if(flight !== undefined){
-                    await addNextPostion(flight, entity, futureTime)
-                }else if(entity.id !== 'Moon'){
-                    viewer.entities.remove(entity)
-                }
-
-            })
+                    const flight = data.find(flight => entity.id.includes(flight.id))
+                    if(flight !== undefined){
+                        await addNextPostion(determinatePlane(flight, 60), entity, getNextTimeBySecond(viewer, 60))
+                        calculateMoonPlane(flight, viewer)
+                    }else if(entity.id.includes('plane') ){
+                        viewer.entities.remove(entity)
+                    }
+                })
+            }
 
             await addNewPlanes(viewer, data)
         }
     }
 
-}
 
-async function addNextPostion(flight, entity, futureTime){
-    const time = Cesium.JulianDate.now();
-    const nextPos = Cesium.Cartesian3.fromDegrees(flight.long, flight.lat, flight.alt)
+async function addNextPostion(nextPos, entity, futureTime){
     entity.position.addSample(futureTime, nextPos)
 }
 
-async function sendToLogFile() {
+function getNextTimeBySecond(viewer, seconds){
+    return Cesium.JulianDate.addSeconds(
+        viewer.clock ? viewer.clock.currentTime : Cesium.JulianDate.now(),
+        seconds,
+        new Cesium.JulianDate()
+    );
+}
+export async function sendToLogFile() {
     /*
     Source : https://brightdata.fr/blog/donnees-web/fetch-api-in-javascript
     */
@@ -269,7 +265,8 @@ function determinatePlane(flight, delta_time) {
 
     // Convert result back to degrees
     const new_lat = new_lat_rad * 180 / pi
-    const new_long = new_long_rad * 180 / pi
+        const new_long = new_long_rad * 180 / pi
+
 
     // Return predicted position
     return Cesium.Cartesian3.fromDegrees(new_long, new_lat, new_alt);
@@ -454,17 +451,17 @@ function calculateMoonPlane(flight,viewer) {
 async function addNewPlanes(viewer, data){
     const airplaneUri = await Cesium.IonResource.fromAssetId(4359085);
     data.forEach(async (flight) => {
-        if (viewer.entities.values.find(entity => entity.id === flight.id) === undefined){
+        if (viewer.entities.values.find(entity => entity.id.includes(flight.id)) === undefined){
             const positionProperty = new Cesium.SampledPositionProperty();
             const position = Cesium.Cartesian3.fromDegrees(flight.long, flight.lat, flight.alt)
             positionProperty.addSample(viewer.clock.currentTime, position);
             positionProperty.forwardExtrapolationType = Cesium.ExtrapolationType.HOLD
             positionProperty.backwardExtrapolationType = Cesium.ExtrapolationType.HOLD
             await loadModel(viewer, viewer.clock.currentTime, viewer.clock.stopTime, positionProperty, airplaneUri, flight.id)
+            positionProperty.addSample(getNextTimeBySecond(viewer, 60), determinatePlane(flight, 60))
         }
     })
 }
 
 
 // Source : https://developer.mozilla.org/en-US/docs/Web/API/Window/setInterval
-setInterval(sendToLogFile,30000)
\ No newline at end of file

From 1619dd8c356e8792d05de62b1300ac723a55bdc3 Mon Sep 17 00:00:00 2001
From: David Galindo <155019077+davidgalindo-git@users.noreply.github.com>
Date: Thu, 29 Jan 2026 13:22:11 +0100
Subject: [PATCH 49/61] Feature/moon zoomed window (#95)

* feat:"moon mini viewer sketch"

* fix:"moon mini viewer cleaned"

* feat:"mini moon silhouette"

* feat:"planes passed to miniviewer, refactored viewer and scene logic to avoid double fetch"

* fix:"overlay debug for fixed display"

* fix:"moon circle highlight"

* refactor:"improve code structure"

* fix:"improve logic with safety checks"

* refactor:"ui improve and css"

* refactor:"6 moons width"

* refactor:"max 20 moon width"

* fix:"atmosphere debug"

* chore:"comments"

* chore:"comments"

* chore:"comments"

* fix:"long to lng"

* fix:"move to middle"

* fix:"move to right"

* fix:"default location if getLocation error"

* fix:"email css"

* refactor:"undo long to lng"

* refactor:" long to lng (works only with lng)"

---------

Co-authored-by: davidgalindo-git <>
---
 src/components/CoordinateForm.vue             |  29 +--
 src/components/MoonMiniViewer.vue             | 231 ++++++++++++++++++
 src/components/MoonPhase.vue                  |   6 +-
 src/components/Viewer.vue                     |  33 ++-
 src/components/primitive/Moon.vue             |  60 +++--
 src/components/primitive/MoonCenterButton.vue |  10 +-
 6 files changed, 304 insertions(+), 65 deletions(-)
 create mode 100644 src/components/MoonMiniViewer.vue

diff --git a/src/components/CoordinateForm.vue b/src/components/CoordinateForm.vue
index 3490dfa..bee6169 100644
--- a/src/components/CoordinateForm.vue
+++ b/src/components/CoordinateForm.vue
@@ -20,25 +20,26 @@ const emit = defineEmits({
 })
 
 function send(lat, lng){
-  emit('submit', { lat, long: lng })
+  emit('submit', { lat, lng: lng })
 }
 </script>
 
 <template>
-  <div class="absolute top-18 left-[1%] z-10000 bg-transparent ">
-  <div class=" flex flex-row w-xl justify-between items-center bg-white/20 backdrop-blur-sm rounded-box shadow-lg px-2">
-          <fieldset class="flex flex-col gap-1">
-          <label class="label">Latitude</label>
-          <input v-model="lat" type="number" class="input input-xs" placeholder="42.161836383" />
-            </fieldset>
+  <div class="absolute top-18 left-[1%] z-10000 flex flex-col gap-2 w-80 bg-transparent ">
+    <div class=" flex flex-row w-xl justify-between items-center bg-white/20 backdrop-blur-sm rounded-box shadow-lg px-2">
+      <fieldset class="flex flex-col gap-1">
+      <label class="label">Latitude</label>
+      <input v-model="lat" type="number" class="input input-xs" placeholder="42.161836383" />
+        </fieldset>
 
-          <fieldset class="flex flex-col gap-1">
-          <label class="label">Longitude</label>
-          <input v-model="lng" type="number" class="input input-xs" placeholder="6.13838333" />
-          </fieldset>
-          <button type="submit" @click="send(lat, lng)" class="btn btn-neutral mt-8">Find</button>
-<!--          <Email />-->
-  </div>
+      <fieldset class="flex flex-col gap-1">
+      <label class="label">Longitude</label>
+      <input v-model="lng" type="number" class="input input-xs" placeholder="6.13838333" />
+      </fieldset>
+      <button type="submit" @click="send(lat, lng)" class="btn btn-neutral mt-8">Find</button>
+    </div>
+    <div class="bg-white/20 backdrop-blur-md rounded-xl shadow-lg p-4 border border-white/10 flex flex-col gap-3">      <Email />
+    </div>
   </div>
 
 </template>
\ No newline at end of file
diff --git a/src/components/MoonMiniViewer.vue b/src/components/MoonMiniViewer.vue
new file mode 100644
index 0000000..bcb4fe6
--- /dev/null
+++ b/src/components/MoonMiniViewer.vue
@@ -0,0 +1,231 @@
+<script setup>
+import {computed, onMounted, onUnmounted, ref, watch} from 'vue';
+import {loadPlanes, updatePlanes} from "@/utils/scene.js";
+
+// data from Viewer.vue
+const props = defineProps({
+  mainViewer: Object, // pass main Cesium.Viewer (3D map)
+  Cesium: Object,     // pass Cesium library
+  moonPos: Object,    // pass Moon position (cartesian)
+  planes: Array       // pass plane data
+});
+
+const miniViewerContainer = ref(null);
+let miniViewer = null;
+let syncLayers = null;
+
+const moonRadius = 1737400 // meters
+const moonWidthMultiplier = ref(6); // zoom width (Moon's diameters, default: 6 Moons)
+
+const reticleStyle = computed(() => { // adjust reticle to moon's size
+  const size = (400 / moonWidthMultiplier.value) + 2; // proportion (ex. 2 Moons wide, reticle = 202x202px)
+  return {
+    width: `${size}px`,
+    height: `${size}px`
+  };
+});
+
+// point miniViewer's camera to Moon reactively
+function updateMiniView() {
+  if (!props.moonPos || !miniViewer || !miniViewer.scene || miniViewer.isDestroyed() || !props.mainViewer.camera.position) return
+
+  const Cesium = props.Cesium
+  const mainCamera = props.mainViewer.camera
+
+  // calculate direction vector from main camera to Moon
+  const moonDirection = Cesium.Cartesian3.subtract(props.moonPos, mainCamera.position, new Cesium.Cartesian3());
+  const distanceToMoon = Cesium.Cartesian3.magnitude(moonDirection);
+  Cesium.Cartesian3.normalize(moonDirection, moonDirection);
+
+  // set miniViewer's camera to same position as mainCamera but pointing the Moon
+  miniViewer.camera.setView({
+    destination: mainCamera.position,
+    orientation: {
+      direction: moonDirection,
+      up: mainCamera.up
+    }
+  });
+
+  // sync clock to mainViewer's
+  miniViewer.clock.currentTime = props.mainViewer.clock.currentTime;
+
+  // calculate Moon's angular width
+  // help of GEMINI
+  // opp side: moonRadius, adj side: distanceToMoon, angle: half Moon
+  // tan = opp/adj, angle = inverse tan (atan)
+  // multiply by 2 to get full width
+  const moonAngularSize = 2 * Math.atan(moonRadius / distanceToMoon)
+  miniViewer.camera.frustum.fov = moonAngularSize * moonWidthMultiplier.value // adjust "Field of View" to zoom
+}
+
+onMounted(async () => {
+  const { Cesium, mainViewer } = props;
+
+  // initialize miniViewer
+  miniViewer = new Cesium.Viewer(miniViewerContainer.value, {
+    sceneMode: Cesium.SceneMode.SCENE3D,
+    terrainProvider: mainViewer.terrainProvider,
+    creditContainer: document.createElement('div'), // hide credits
+    // hide default UI
+    animation: false, timeline: false, geocoder: false, homeButton: false,
+    infoBox: false, selectionIndicator: false, navigationHelpButton: false,
+    sceneModePicker: false, fullscreenButton: false, baseLayerPicker: false,
+  })
+
+
+  const scene = miniViewer.scene
+  scene.backgroundColor = Cesium.Color.TRANSPARENT; // allow sight of atmosphere colors
+  scene.logarithmicDepthBuffer = true;  // improve long distance render (logarithmic depth)
+  scene.screenSpaceCameraController.enableInputs = false; // fixed view (disable inputs on mini viewer)
+
+
+  // safe prevention to 'rectangles error' (when Cesium tries rendering a layer before ImageryProvider is ready)
+  syncLayers = () => {
+    // by GEMINI
+    try{
+      if (mainViewer.imageryLayers.length > 0) {
+        const primaryLayer = mainViewer.imageryLayers.get(0) // first layer (base layer)
+
+        // only add ImageryProvider if it exists and isn't null or undefined
+        if (primaryLayer?.imageryProvider) {
+          const provider = primaryLayer.imageryProvider
+          miniViewer.imageryLayers.removeAll()
+          miniViewer.imageryLayers.addImageryProvider(provider)
+        }
+      }
+    } catch (e) {
+        console.error("Layer error: ", e)
+    }
+  }
+  // layer sync : react to map changes
+  syncLayers()
+  mainViewer.imageryLayers.layerAdded.addEventListener(syncLayers);
+
+  miniViewer.clock.currentTime = mainViewer.clock.currentTime; // sync clock
+  mainViewer.camera.changed.addEventListener(updateMiniView) // sync camera
+  await loadPlanes(miniViewer)  // load plane assets
+})
+
+onUnmounted(() => {
+  // help of GEMINI
+  if (miniViewer) {
+    // remove listeners to prevent memory leaks
+    props.mainViewer.camera.changed.removeEventListener(updateMiniView);
+    if (syncLayers) {
+      props.mainViewer.imageryLayers.layerAdded.removeEventListener(syncLayers)
+    }
+    miniViewer.destroy();
+  }
+});
+
+// react to user's miniViewer zoom
+watch(moonWidthMultiplier, updateMiniView);
+// react to Moon position
+watch(() => props.moonPos, updateMiniView, { deep: true });
+// react to planes data
+watch(() => props.planes, (newData) => {
+  if (miniViewer) updatePlanes(miniViewer, newData);
+}, { deep: true });
+
+</script>
+
+<template>
+  <div class="telescope-container">
+    <div ref="miniViewerContainer" class="mini-moon-viewer">
+      <div class="reticle-ring" :style="reticleStyle"></div>
+    </div>
+
+    <div class="zoom-controls">
+      <div class="labels">
+        <label class="zoom-label">ZOOM </label>
+        <label class="zoom-sub">(Moon diameters): </label>
+      </div>
+      <input
+        type="range"
+        v-model.number="moonWidthMultiplier"
+        min="2"
+        max="20"
+        step="1"
+      />
+      <span class="zoom-value">{{ moonWidthMultiplier }}</span>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+/* absolute positions for containers and reticle */
+.telescope-container {
+  position: absolute;
+  bottom: 24px;
+  left: 24px;
+  width: 440px;
+  height: 440px;
+  z-index: 2000;
+  pointer-events: none;
+}
+.mini-moon-viewer {
+  position: absolute;
+  bottom: 50px;
+  left: 20px;
+  width: 400px;
+  height: 400px;
+  border: 2px solid rgba(255, 255, 255, 0.5);
+  border-radius: 50%;
+  overflow: hidden;
+  z-index: 2000;
+  mask-image: radial-gradient(circle, white 100%, black 100%);
+}
+.reticle-ring {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  border: 2px solid yellow;
+  border-radius: 50%;
+  box-shadow: 0 0 8px rgba(255, 255, 0, 0.8);
+  opacity: 0.8;
+  z-index: 2001;
+}
+.zoom-controls {
+  position: absolute;
+  bottom: 10px;
+  left: 60px;
+  width: 300px;
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  color: white;
+  background: rgba(0, 0, 0, 0.0);
+  pointer-events: auto;
+  text-shadow: 1px 1px 2px black;
+  padding: 10px;
+}
+.labels{
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  line-height: 1.1;
+}
+.zoom-label{
+  font-weight: bold;
+  font-size: 14px;
+  color: #fff;
+}
+.zoom-sub{
+  font-size: 9px;
+  color:#fff;
+  text-transform: uppercase;
+}
+input[type="range"] {
+  flex-grow: 1;
+  cursor: pointer;
+  accent-color: white;
+}
+.zoom-value {
+  font-size: 16px;
+  min-width: 30px;
+  font-weight: bold;
+  color: white;
+  text-align: right;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/MoonPhase.vue b/src/components/MoonPhase.vue
index 52d608a..6867ec0 100644
--- a/src/components/MoonPhase.vue
+++ b/src/components/MoonPhase.vue
@@ -138,15 +138,13 @@ const fetchMoonPhase = async (lat, lng) => {
 <template>
   <div
       v-if="isLoading || error || moonImageUrl || hasRequested"
-      class="absolute bottom-6 left-6 z-[1000] pointer-events-auto"
+      class="fixed bottom-6 right-6 z-[2000] pointer-events-auto"
   >
     <div class="bg-black/70 backdrop-blur-md border border-white/20 p-2 rounded-xl shadow-2xl transition-all hover:scale-105 duration-300 w-40">
 
       <div v-if="isLoading" class="flex flex-col items-center justify-center h-48 space-y-2">
         <div class="w-6 h-6 border-2 border-white/30 border-t-white rounded-full animate-spin"></div>
-        <span class="text-[10px] text-white/50 uppercase tracking-widest">
-        Loading Moon
-      </span>
+        <span class="text-[10px] text-white/50 uppercase tracking-widest">Loading Moon</span>
       </div>
 
       <div v-else-if="error" class="text-[10px] text-red-400 p-2 text-center">
diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index 2063347..ada7ec9 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -9,6 +9,7 @@ import Terrain from "@/components/terrain/Terrain.vue";
 import Moon from "@/components/primitive/Moon.vue";
 import MoonPhase from "@/components/MoonPhase.vue";
 import MoonCenterButton from "@/components/primitive/MoonCenterButton.vue";
+import MoonMiniViewer from "@/components/MoonMiniViewer.vue"
 import CameraController from './CameraController.vue'
 import CompassIndicator from '@/components/CompassIndicator.vue'
 import CoordinateForm from "@/components/CoordinateForm.vue";
@@ -23,7 +24,7 @@ const location = ref({
   lat: undefined,
   long: undefined
 })
-
+const planeData = ref([])
 const moonComponentRef = ref(null)
 
 
@@ -50,7 +51,13 @@ const onViewerReady = async ({Cesium, viewer}) => {
         console.error("Moon Component Ref is NULL. Check if Moon is inside a v-if.");
       }
 
-      location.value = await getLocation(viewer)
+      try {
+        location.value = await getLocation(viewer)
+      } catch (geoError) {
+        console.warn("Geolocation denied, using default coordinates (Ste-Croix).");
+        location.value = {lat: 46.8221, long: 6.5015}
+      }
+
       mapViewer.value = viewer
       cesium.value = Cesium
 
@@ -72,9 +79,17 @@ const onViewerReady = async ({Cesium, viewer}) => {
 };
 
 async function onLocationSubmitted(e){
-  flyTo(mapViewer.value.camera, cesium.value, e.lat, e.long)
-  location.value = {lat: e.lat, long: e.long}
-  await updatePlanes(mapViewer.value, location.value)
+  if (!mapViewer.value || !cesium.value) {
+    console.log("Viewer not ready yet. Please wait.");
+    return;
+  }
+  try {
+    flyTo(mapViewer.value.camera, cesium.value, e.lat, e.lng)
+    location.value = {lat: e.lat, long: e.lng}
+    await updatePlanes(mapViewer.value, location.value)
+  } catch (e) {
+    console.error("Flight failed:", e)
+  }
 }
 
 </script>
@@ -99,11 +114,17 @@ async function onLocationSubmitted(e){
           :cesium="cesium"
           :moonComponent="moonComponentRef"
       />
+      <MoonMiniViewer
+          v-if="cesium && mapViewer"
+          :mainViewer="mapViewer"
+          :Cesium="cesium"
+          :moonPos="moonComponentRef?.moonPos"
+          :planes="planeData"
+      />
       <CameraController v-if="isViewerReady" :viewer="mapViewer" />
       <CompassIndicator v-if="isViewerReady" :viewer="mapViewer" />
       <CoordinateForm @submit="onLocationSubmitted"/>
     </template>
-    <MoonPhase/>
   </vc-viewer>
 </template>
 
diff --git a/src/components/primitive/Moon.vue b/src/components/primitive/Moon.vue
index 332d18c..142cb4e 100644
--- a/src/components/primitive/Moon.vue
+++ b/src/components/primitive/Moon.vue
@@ -9,6 +9,7 @@ This component defines Moon's parameters and places it to real location in real
 const moonPos = ref(null); // 3D position (x, y, z)
 const point = ref(null);  // point space marker (Moon display)
 const label = ref(null);  // display text above Moon
+const moonRadius = 1737400; // meters
 
 // const debugStatus = ref("Waiting for viewer..."); // DEBUG
 let removeTickListener = null; // for detaching Cesium clock listener when component is destroyed
@@ -24,9 +25,8 @@ const onViewerReady = ({ Cesium, viewer }) => {
   // style config
   // point marker (Moon)
   point.value = {
-    pixelSize: 40,
-    color: Cesium.Color.fromCssColorString("#B2B2B2"), // Moon gray
-    outlineColor: Cesium.Color.WHITE,
+    color: Cesium.Color.TRANSPARENT,
+    outlineColor: Cesium.Color.YELLOW,
     outlineWidth: 2,
     disableDepthTestDistance: Number.POSITIVE_INFINITY // set limit to infinity to ensure Moon is always displayed in front
   };
@@ -97,7 +97,31 @@ const onViewerReady = ({ Cesium, viewer }) => {
           scratchCartesian,
           moonPos.value || new Cesium.Cartesian3()
       );
-      // debugStatus.value = "Moon Synced"; // DEBUG
+    }
+
+    if (moonPos.value) {
+      const camera = viewer.camera;
+      const canvasHeight = viewer.scene.canvas.clientHeight;
+
+      // Calculate distance
+      const distance = Cesium.Cartesian3.distance(camera.position, moonPos.value);
+
+      // Angular diameter math
+      const angularSize = 2 * Math.atan(moonRadius / distance);
+
+      // Safety check for FOV (handling Perspective vs Orthographic)
+      const fov = camera.frustum.fov || Cesium.Math.toRadians(60);
+
+      // Calculate diameter
+      const pixelDiameter = (angularSize / fov) * canvasHeight;
+
+      // Update point with a guard against negative/infinite values
+      if (isFinite(pixelDiameter) && pixelDiameter > 0) {
+        point.value = {
+          ...point.value,
+          pixelSize: pixelDiameter
+        };
+      }
     }
   };
 
@@ -105,34 +129,6 @@ const onViewerReady = ({ Cesium, viewer }) => {
   viewer.clock.onTick.addEventListener(listener);
   // save function that removes clock listener when component is destroyed
   removeTickListener = () => viewer.clock.onTick.removeEventListener(listener);
-
-  /* Uncomment to redirect camera to moon's location
-  // ---- CAMERA FLIGHT TO MOON ----
-  setTimeout(() => {
-    if (!moonPos.value) return;
-
-    debugStatus.value = "Traveling to Moon...";
-
-    const offset = Cesium.Cartesian3.multiplyByScalar(
-        Cesium.Cartesian3.normalize(moonPos.value, new Cesium.Cartesian3()),
-        20_000_000,
-        new Cesium.Cartesian3()
-    );
-
-    viewer.camera.flyTo({
-      destination: Cesium.Cartesian3.subtract(
-          moonPos.value,
-          offset,
-          new Cesium.Cartesian3()
-      ),
-      orientation: {
-        direction: Cesium.Cartesian3.normalize(offset, new Cesium.Cartesian3()),
-        up: Cesium.Cartesian3.UNIT_Z
-      },
-      duration: 5
-    });
-  }, 4000);
-  */
 };
 
 onBeforeUnmount(() => {
diff --git a/src/components/primitive/MoonCenterButton.vue b/src/components/primitive/MoonCenterButton.vue
index 0c61092..7b61fea 100644
--- a/src/components/primitive/MoonCenterButton.vue
+++ b/src/components/primitive/MoonCenterButton.vue
@@ -55,17 +55,9 @@ function onClick() {
 
 <template>
   <button
-      class="fixed bottom-6 right-6 z-[2000] bg-blue-600 text-white px-4 py-2 rounded shadow-lg"
+      class="fixed bottom-6 left-1/2 -translate-x-1/2 z-[2000] bg-blue-600 text-white px-4 py-2 rounded shadow-lg"
       @click="onClick"
   >
     Center Moon
   </button>
 </template>
-<style>
-.fixed {
-  position: fixed;
-  bottom: 1.5rem;
-  right: 1.5rem;
-  z-index: 9999;
-}
-</style>

From 3c58fc687c5b04ca70d220016cde4a4de7422300 Mon Sep 17 00:00:00 2001
From: Joris Bailly <90181523+JorisBly@users.noreply.github.com>
Date: Thu, 29 Jan 2026 13:42:56 +0100
Subject: [PATCH 50/61] Hotfix/fix plane prediction (#96)

* fix(): Detach the check if a plane is in front of the moon

* fix(): Hide Moon mini viewer because of bug

* fix(): Hide broken component for the moment
---
 src/components/MoonMiniViewer.vue |  8 ++++----
 src/components/Viewer.vue         | 27 +++++++++++++++++++--------
 src/utils/scene.js                |  9 +++++++--
 3 files changed, 30 insertions(+), 14 deletions(-)

diff --git a/src/components/MoonMiniViewer.vue b/src/components/MoonMiniViewer.vue
index bcb4fe6..e3b3cf6 100644
--- a/src/components/MoonMiniViewer.vue
+++ b/src/components/MoonMiniViewer.vue
@@ -103,7 +103,7 @@ onMounted(async () => {
 
   miniViewer.clock.currentTime = mainViewer.clock.currentTime; // sync clock
   mainViewer.camera.changed.addEventListener(updateMiniView) // sync camera
-  await loadPlanes(miniViewer)  // load plane assets
+  // await loadPlanes(miniViewer)  // load plane assets
 })
 
 onUnmounted(() => {
@@ -123,9 +123,9 @@ watch(moonWidthMultiplier, updateMiniView);
 // react to Moon position
 watch(() => props.moonPos, updateMiniView, { deep: true });
 // react to planes data
-watch(() => props.planes, (newData) => {
-  if (miniViewer) updatePlanes(miniViewer, newData);
-}, { deep: true });
+// watch(() => props.planes, (newData) => {
+//   if (miniViewer) updatePlanes(miniViewer, newData);
+// }, { deep: true });
 
 </script>
 
diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index ada7ec9..a5db011 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -1,7 +1,14 @@
 <script setup>
 import {VcViewer} from "vue-cesium";
 import {nextTick, ref} from "vue";
-import {loadPlanes, updatePlanes, prepareScene, removeMoving, sendToLogFile} from "@/utils/scene.js";
+import {
+  loadPlanes,
+  updatePlanes,
+  prepareScene,
+  removeMoving,
+  sendToLogFile,
+  checkIfPlaneIsCloseToTheMoon
+} from "@/utils/scene.js";
 import Imagery from "@/components/imagery/Imagery.vue";
 import {flyTo} from "@/utils/camera.js";
 import Navigation from "@/components/navigation/Navigation.vue";
@@ -72,6 +79,10 @@ const onViewerReady = async ({Cesium, viewer}) => {
         }
       }, 59000)
 
+      setInterval(async () => {
+        checkIfPlaneIsCloseToTheMoon(mapViewer.value)
+      }, 30000)
+
     } catch (error) {
       console.error("Error loading tileset:", error);
     }
@@ -114,13 +125,13 @@ async function onLocationSubmitted(e){
           :cesium="cesium"
           :moonComponent="moonComponentRef"
       />
-      <MoonMiniViewer
-          v-if="cesium && mapViewer"
-          :mainViewer="mapViewer"
-          :Cesium="cesium"
-          :moonPos="moonComponentRef?.moonPos"
-          :planes="planeData"
-      />
+<!--      <MoonMiniViewer-->
+<!--          v-if="cesium && mapViewer"-->
+<!--          :mainViewer="mapViewer"-->
+<!--          :Cesium="cesium"-->
+<!--          :moonPos="moonComponentRef?.moonPos"-->
+<!--          :planes="planeData"-->
+<!--      />-->
       <CameraController v-if="isViewerReady" :viewer="mapViewer" />
       <CompassIndicator v-if="isViewerReady" :viewer="mapViewer" />
       <CoordinateForm @submit="onLocationSubmitted"/>
diff --git a/src/utils/scene.js b/src/utils/scene.js
index a31d710..50691b6 100644
--- a/src/utils/scene.js
+++ b/src/utils/scene.js
@@ -123,7 +123,6 @@ export async function loadPlanes(viewer, location){
             await loadModel(viewer, start, stop, positionProperty, airplaneUri, flight.id);
 
             positionProperty.addSample(getNextTimeBySecond(viewer, 60), determinatePlane(flight, 60))
-            calculateMoonPlane(flight, viewer)
         }
     }
 
@@ -154,7 +153,6 @@ export async function updatePlanes(viewer, location){
                     const flight = data.find(flight => entity.id.includes(flight.id))
                     if(flight !== undefined){
                         await addNextPostion(determinatePlane(flight, 60), entity, getNextTimeBySecond(viewer, 60))
-                        calculateMoonPlane(flight, viewer)
                     }else if(entity.id.includes('plane') ){
                         viewer.entities.remove(entity)
                     }
@@ -463,5 +461,12 @@ async function addNewPlanes(viewer, data){
     })
 }
 
+export function checkIfPlaneIsCloseToTheMoon(viewer) {
+    viewer.entities.values.forEach(entity => {
+        if (entity.id.includes('plane')) {
+            calculateMoonPlane(entity, viewer)
+        }
+    })
+}
 
 // Source : https://developer.mozilla.org/en-US/docs/Web/API/Window/setInterval

From cf918383088fc4d358b2ae1ff2ee34dc57b4864b Mon Sep 17 00:00:00 2001
From: Jorisbly <joris.bailly.2001@gmail.com>
Date: Thu, 29 Jan 2026 13:47:52 +0100
Subject: [PATCH 51/61] fix(): Comment broken try catch

---
 src/components/Viewer.vue | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index a5db011..90591b5 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -58,12 +58,11 @@ const onViewerReady = async ({Cesium, viewer}) => {
         console.error("Moon Component Ref is NULL. Check if Moon is inside a v-if.");
       }
 
-      try {
+      // try {
         location.value = await getLocation(viewer)
-      } catch (geoError) {
-        console.warn("Geolocation denied, using default coordinates (Ste-Croix).");
-        location.value = {lat: 46.8221, long: 6.5015}
-      }
+      // } catch (geoError) {
+      //   console.warn("Geolocation denied, using default coordinates (Ste-Croix).");
+      // }
 
       mapViewer.value = viewer
       cesium.value = Cesium

From dcdc23b40608e1c8335453fd2286175b3829941e Mon Sep 17 00:00:00 2001
From: Joris Bailly <90181523+JorisBly@users.noreply.github.com>
Date: Thu, 29 Jan 2026 14:16:36 +0100
Subject: [PATCH 52/61] Merge develop into main (#97) (#98)

* feat:added cesium access token

* feat(): Add a navbar

* feat(): Add NavBar to the view

* feat(): Change positioning and sizing

* feat(): Change default heading

* Added moon asset loader. Closes #15

* fix:"Moon asset is now only loaded not added to viewer. Closes #15"

* fix:"erased pasted code"

* feat:added cesium access token

* Added moon asset loader. Closes #15

* fix:added reactive mount check for viewer and cesium before loading asset

* Update Cesium access token in .env file

Replaced the Cesium access token with a placeholder.

* feat(): React to location changes

* chore(): Ignore .env file

* fix(): Fix cached .env

* chore():Add a .env.example file

* feat(): add FastAPI backend for live flight data fetching

* fix(): allow API access from local network

* moon display 3d with start view to south (#24)

* feat:moon asset added

* feat:moved moon above evian and rescaled to make it visible

* fix:cesium functions sources + moon visible from start

---------

Co-authored-by: davidgalindo-git <>

* Feature/Refactoring (#34)

* refactor():Use a proper way to initilaise cesium and viewer

* feat():Create map terrain component

* feat():Component for ion-imagery

* feat():Component for to call all imagery

* feat():Create component for alerts

* feat():Create scene and tileset .js files for their logic

* feat():Create a Tilesets.vue to call all tilesets components

* feat():Create function for camera

* feat():Create function for scene

* feat():Create a compass component

* feat():Create the button to get current location

* feat():Create component to handle all navigations component

* feat():Add function to get a tilset position from any API

* feat():Create a generic tileset component

* feat(): Create the components to contain all tilesets in the scene

* feat(): Create component for terrain

* refactor(): Refactor the mapPreview

* fix(): Bring back removingMoving

* refactor(): Change name of mapPreview to Viewer.vue

* refactor(): Change name of mapTerrain to Terrain.vue

* refactor(): Remove call of Google3dTiles.vue

* refactor(): Remove useless code

* fix(): Add strict comparaison

* refactor(): Put console.error for invalid

* refactor(): Create a Cartesian3 object

* Feature/place moon (#38)

* fix(): Make 2d map appear

* feat(): Make moon placed in real place

* refactor(): Extract logic to make Tileset not too specific

* refactor(): Change my ming and create a Moon component with real moon

* refactor(): Remove useless function

* fix(): Remove debugger

* fix(): Remove cesiumPath from VueCesium configuration

* feat(): Put assetid directly in the called component

* feat(): Create function load plane to display plane and can make them fly

* fix(): Fix import (#39)

* Feature/moon as entities (#44)

* feat(): Make moon as a entity

* feat(): Call new Moon.vue

* feat(): Call component Moon.vue

* Features/fetch planes position (#33)

* feat(): Add vertical rate to the return of `get_flights`

* docs(get_flights): Add more details to the `get_flights` header

* docs(get_flights): Small display change

* docs(get_flights): Add Field Descriptions section

* fetch moon api data (python) and moon phase widget (vue component) (#37)

* feat:moon asset added

* feat:moved moon above evian and rescaled to make it visible

* fix:cesium functions sources + moon visible from start

* feat:fetch Moon data api

* fix:undo log file generation

* feat:added get_moon_data func. Returns datetime, ra, dec and phase for hard coded params.

* fix:start time, stop time and step are external params

* refactor:modified comments and prevent params format errors

* fix:"session request with retries to prevent ssl error + comments"

* feat:"convert ra and dec to cesium and return all necessary info"

* chore:"params comments"

* moon phase assets

* moon phase display

* moon phase assets del

* chore : "moon phase comments and env vars"

* Delete .idea/Planium.iml

---------

Co-authored-by: davidgalindo-git <>

* Moon phase uses reactive lat and lng (#55)

* feat:moon asset added

* feat:moved moon above evian and rescaled to make it visible

* fix:cesium functions sources + moon visible from start

* feat:fetch Moon data api

* fix:undo log file generation

* feat:added get_moon_data func. Returns datetime, ra, dec and phase for hard coded params.

* fix:start time, stop time and step are external params

* refactor:modified comments and prevent params format errors

* fix:"session request with retries to prevent ssl error + comments"

* feat:"convert ra and dec to cesium and return all necessary info"

* chore:"params comments"

* moon phase assets

* moon phase display

* moon phase assets del

* chore : "moon phase comments and env vars"

* fix: "lat and lng variables are reactive to form depending on viewer state"

* Delete .idea/Planium.iml

---------

Co-authored-by: davidgalindo-git <>

* Feature/fetch planes location (#57)

* feat(): Fetch data from api

* feat(): Get Id of the flight

* fix(): Allow cross origin of the front

* feat(): Create a requirements.txt

* feat(): Move plane when received a new position

* feat(): Call the move plane function

* feat(): Get exception and status code when an error occurred

* feat(): Do nothing if an eror occurred during fetch

* feat(): Make run both frontend and backend with one command

* feat(): Update requirments.txt

* feat(): Remove dividing by 1000 for altitude

* feat(): Make request every 30 seconde

* fix(): rename Vcviewer -> mapViewer

* fix(): Remove debugger

* fix(): Remove useless stuff

* fix(): Remove useless billboard

* moon display on real-time position (#58)

* fix: "moon current location"

* refactor: "moon current location improved"

---------

Co-authored-by: davidgalindo-git <>

* Feature/fix plane position (#59)

* fix(): Error breaking

* fix(): Check if viewer.entities is defined

* feat(): Remove planes from viewer when no data received anymore

* feat(): Add future key nneded for opensky fetching with credits

* fix(): Import HTTPException from fastapi

* fix(): Fix command install-all

* chore(): Add requirements and update install-all script

* feat(): Use token from opensky to use credits

* chore(): Add Prerequisites for Cesium and opensky accounts

* refactor(): move adding position in a specific function to isolate it

* chore(): Remove .idea

* chore(): .vscode

* chore(): remove extension.json from .vscode

* Feature/modifiy scene (#60)

* feat(): Disable scroll wheel zoom

* feat(): Disable the movement with the mouse

* feat(): Remove compass

* feat(): Add joystick for the orientation

* feat(): Add a CompassIndicator and block the movement with the mouse, keep only the change of direction

* fix(): Fix the problem with the camera and the compass indicator

* fix(): Fix the problem with the CompassIndicator

* fix(): Don't allow the zoom with the scroll wheel

---------



* chore(): Add commands for linux too

* feat(): Add camera zoom using the mouse wheel (#66)

* feat(): Add camera zoom using the mouse wheel

* fix(): Update asset id

* feat:"moon view center button" (#69)

* feat:"moon view center button"

* refactor:"component name"

---------

Co-authored-by: davidgalindo-git <>

* Feature/fix entities (#74)

* fix(): Add id to the moon

* fix(): Remove extra \\

* refactor(): function

* feat(): Add new planes

* feat(): Hide get loaction button

* fix:"moon phase debug (but only works on submit form)" (#67)

* fix:"moon phase debug (but only works on submit form)"

* Replace hardcoded API credentials with environment variables

---------

Co-authored-by: davidgalindo-git <>

* Feature/refactor view layout (#76)

* feat(): Feat use emitter to detect when a new location is sended

* feat(): Use tailwind instead of classic css

* refactor(): Align camera controller with compass

* refactor(): Remove legend

* refactor(): Move components in template when IsViewerReady

* refactor(): Move components in template when IsViewerReady

* refactor(): Remove useless w-full

* refactor(): Add z-index

* refactor(): Change positioning and spacing

* refactor(): Make navbar transparent and fixed

* fix(): Use correct name of import

* Feature/zoom fix (#81)

* fix(): Fix a bug with the zoom

* fix(): Fix a bug with the zoom

* Feature/get actual position (#83)

* feat(): Get current user location

* refactor (): Match name long like the backend instead of lng

* feat(): Use current location for planes

* refactor(): Remove console.log for result when asking api

* refactor(): Add a comment to clarify default lat and long

* fix(): First reassign location before updating planes

* refactor(): Remove french comments and unnecessary

* refactor(): Delete unused addTilesetToScene function

* fix(): Check if viewer is defined before updating planes

* Feature/calculate plane moon (#75)

* feat(): Add the basics calculations to determine if a plane is in front of the moon

* docs(): Fix a comment

* Feature/predict (#89)

* fix(): Fix a bug with the zoom

* feat(): Add the calculations needed to predict the future position of the aircraft.

* docs(): Modify the unit in the comment

* setup email (#84)

* feat:"sms checkbox template"

* feat:"phone number input if box checked"

* chore:"comments"

* feat:"python email setup"

* refactor:"use email instead of sms"

* feat:"test mail frontend setup"

* refactor:"gmail py file ref"

* refactor:"route ref"

* feat:"test email sent succesfully"

* fix:"send test email button css"

---------

Co-authored-by: davidgalindo-git <>

* Feature/logs (#92)

* fix(): Fix a bug with the zoom

* feat(): Add a log function

* feat(): Add a basic log function with API

* feat(): Send the logs to the backend every 15 seconds

---------



* Feature/refactorig (#93)

* feat(): Add gmail app password to .env.example

* feat(): Hide Email component in CoordinateForm for production

* refactor(): Extract email logic outside the component to be able to use it everywhere

* refactor(): Add more informations on the README about the different asset and account to create

* refactor(): Extract models in API/models

* refactor(): Use the extracted models for EmailRequest and Log

* Feature/calculations predict refactor (#94)

* fix(): Fix a bug with the zoom

* Feature/predict (#89)

* fix(): Fix a bug with the zoom

* feat(): Add the calculations needed to predict the future position of the aircraft.

* docs(): Modify the unit in the comment

* feat(): Add a log function

* feat(): Add a basic log function with API

* feat(): detect aircraft in front of the moon

* feat(): Send logs every 30 seconds

* docs(): Add a comment

* Feature/predict plane position (#90)

* feat(): Add plane_ inside of plane id to recognise than it's a plane and note any entities

* feat(): Delete only entities who include plane in their id

* feat(): rollbakc to the same logic as before

* feat(): remove unused checkLastOccurence

* feat(): feat implement prediction for planes

* feat(): Adjust the second for the interval

* feat(): Check each time we add a position if this one is in front of the moon

* feat(): Put 24h in seconds

* feat(): Make scene never stop

* feat(): Use the new version of prediction for plane position calculation

* feat(): Log every 30 seconds

* Feature/moon zoomed window (#95)

* feat:"moon mini viewer sketch"

* fix:"moon mini viewer cleaned"

* feat:"mini moon silhouette"

* feat:"planes passed to miniviewer, refactored viewer and scene logic to avoid double fetch"

* fix:"overlay debug for fixed display"

* fix:"moon circle highlight"

* refactor:"improve code structure"

* fix:"improve logic with safety checks"

* refactor:"ui improve and css"

* refactor:"6 moons width"

* refactor:"max 20 moon width"

* fix:"atmosphere debug"

* chore:"comments"

* chore:"comments"

* chore:"comments"

* fix:"long to lng"

* fix:"move to middle"

* fix:"move to right"

* fix:"default location if getLocation error"

* fix:"email css"

* refactor:"undo long to lng"

* refactor:" long to lng (works only with lng)"

---------

Co-authored-by: davidgalindo-git <>

* Hotfix/fix plane prediction (#96)

* fix(): Detach the check if a plane is in front of the moon

* fix(): Hide Moon mini viewer because of bug

* fix(): Hide broken component for the moment

* fix(): Comment broken try catch

---------

Co-authored-by: davidgalindo-git <>

Co-authored-by: David Galindo <155019077+davidgalindo-git@users.noreply.github.com>
Co-authored-by: sofian.hussein@eduvaud.ch <sofian.hussein@eduvaud.ch>
Co-authored-by: omegasofian2304 <pn82bby@eduvaud.ch>

From 604391617f5751b8f6d8f7f176d37ebbf7c008e1 Mon Sep 17 00:00:00 2001
From: Sofian Hussein <sofian.hussein@eduvaud.ch>
Date: Thu, 29 Jan 2026 14:49:08 +0100
Subject: [PATCH 53/61] feat(): Expand the aircraft search area (#100)

---
 API/fetchFlights.py | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/API/fetchFlights.py b/API/fetchFlights.py
index fbe1111..5cc2704 100644
--- a/API/fetchFlights.py
+++ b/API/fetchFlights.py
@@ -74,7 +74,7 @@ def get_flights(user_lat, user_long):
     params = {
         "lamin": user_lat-0.52,
         "lomin": user_long-1,
-        "lamax": user_lat,
+        "lamax": user_lat+1,
         "lomax": user_long+1
     }
     token = get_opensky_token()

From 1c6f5d6b38a6644fcafea49c4f242906d0e54fac Mon Sep 17 00:00:00 2001
From: David Galindo <155019077+davidgalindo-git@users.noreply.github.com>
Date: Thu, 29 Jan 2026 14:54:27 +0100
Subject: [PATCH 54/61] Feature/moon zoomed window (#99)

* feat:"moon mini viewer sketch"

* fix:"moon mini viewer cleaned"

* feat:"mini moon silhouette"

* feat:"planes passed to miniviewer, refactored viewer and scene logic to avoid double fetch"

* fix:"overlay debug for fixed display"

* fix:"moon circle highlight"

* refactor:"improve code structure"

* fix:"improve logic with safety checks"

* refactor:"ui improve and css"

* refactor:"6 moons width"

* refactor:"max 20 moon width"

* fix:"atmosphere debug"

* chore:"comments"

* chore:"comments"

* chore:"comments"

* fix:"long to lng"

* fix:"move to middle"

* fix:"move to right"

* fix:"default location if getLocation error"

* fix:"email css"

* refactor:"undo long to lng"

* refactor:" long to lng (works only with lng)"

---------

Co-authored-by: davidgalindo-git <>
---
 src/components/Viewer.vue | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index 90591b5..68573e8 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -58,11 +58,7 @@ const onViewerReady = async ({Cesium, viewer}) => {
         console.error("Moon Component Ref is NULL. Check if Moon is inside a v-if.");
       }
 
-      // try {
-        location.value = await getLocation(viewer)
-      // } catch (geoError) {
-      //   console.warn("Geolocation denied, using default coordinates (Ste-Croix).");
-      // }
+      location.value = await getLocation(viewer)
 
       mapViewer.value = viewer
       cesium.value = Cesium

From e515688b7eb27d8994aa2fa4cb43ffd752551ab7 Mon Sep 17 00:00:00 2001
From: David Galindo <155019077+davidgalindo-git@users.noreply.github.com>
Date: Thu, 29 Jan 2026 15:13:49 +0100
Subject: [PATCH 55/61] fix:"uncomment moon viewer" (#101)

Co-authored-by: davidgalindo-git <>
---
 src/components/Viewer.vue | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index 68573e8..ffe2ffa 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -120,13 +120,13 @@ async function onLocationSubmitted(e){
           :cesium="cesium"
           :moonComponent="moonComponentRef"
       />
-<!--      <MoonMiniViewer-->
-<!--          v-if="cesium && mapViewer"-->
-<!--          :mainViewer="mapViewer"-->
-<!--          :Cesium="cesium"-->
-<!--          :moonPos="moonComponentRef?.moonPos"-->
-<!--          :planes="planeData"-->
-<!--      />-->
+      <MoonMiniViewer
+          v-if="cesium && mapViewer"
+          :mainViewer="mapViewer"
+          :Cesium="cesium"
+          :moonPos="moonComponentRef?.moonPos"
+          :planes="planeData"
+      />
       <CameraController v-if="isViewerReady" :viewer="mapViewer" />
       <CompassIndicator v-if="isViewerReady" :viewer="mapViewer" />
       <CoordinateForm @submit="onLocationSubmitted"/>

From 5ab342b5a0b6a4da075b07d88db3b93368349b52 Mon Sep 17 00:00:00 2001
From: Joris Bailly <90181523+JorisBly@users.noreply.github.com>
Date: Thu, 29 Jan 2026 15:36:13 +0100
Subject: [PATCH 56/61] fix(): comment again MoonMiniViewer (#103)

---
 src/components/Viewer.vue | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index ffe2ffa..68573e8 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -120,13 +120,13 @@ async function onLocationSubmitted(e){
           :cesium="cesium"
           :moonComponent="moonComponentRef"
       />
-      <MoonMiniViewer
-          v-if="cesium && mapViewer"
-          :mainViewer="mapViewer"
-          :Cesium="cesium"
-          :moonPos="moonComponentRef?.moonPos"
-          :planes="planeData"
-      />
+<!--      <MoonMiniViewer-->
+<!--          v-if="cesium && mapViewer"-->
+<!--          :mainViewer="mapViewer"-->
+<!--          :Cesium="cesium"-->
+<!--          :moonPos="moonComponentRef?.moonPos"-->
+<!--          :planes="planeData"-->
+<!--      />-->
       <CameraController v-if="isViewerReady" :viewer="mapViewer" />
       <CompassIndicator v-if="isViewerReady" :viewer="mapViewer" />
       <CoordinateForm @submit="onLocationSubmitted"/>

From 3d41b574d7adfb3d3a70aff9039d0bfe686b9af8 Mon Sep 17 00:00:00 2001
From: Joris Bailly <90181523+JorisBly@users.noreply.github.com>
Date: Thu, 29 Jan 2026 15:36:23 +0100
Subject: [PATCH 57/61] Hotfix/fix adding sample (#102)

* fix(): Simplify

* fix(): switch to for of

* fix(): Minimize size of planes

* refactor(): Put viewer variable into functions
---
 src/components/Viewer.vue |  4 ++--
 src/utils/scene.js        | 12 ++++++------
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index 68573e8..44c72c5 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -69,13 +69,13 @@ const onViewerReady = async ({Cesium, viewer}) => {
 
       setInterval(async () => {
         if (mapViewer.value !== undefined){
-          await updatePlanes(mapViewer.value, location.value)
+          await updatePlanes(viewer, location.value)
           await sendToLogFile()
         }
       }, 59000)
 
       setInterval(async () => {
-        checkIfPlaneIsCloseToTheMoon(mapViewer.value)
+        checkIfPlaneIsCloseToTheMoon(viewer)
       }, 30000)
 
     } catch (error) {
diff --git a/src/utils/scene.js b/src/utils/scene.js
index 50691b6..6cea80f 100644
--- a/src/utils/scene.js
+++ b/src/utils/scene.js
@@ -136,7 +136,7 @@ async function loadModel(viewer, start, stop, positionProperty, airplaneUri, id)
         availability: new Cesium.TimeIntervalCollection([ new Cesium.TimeInterval({ start: start, stop: stop }) ]),
         position: positionProperty,
         // Attach the 3D model instead of the green point.
-        model: {uri: airplaneUri,minimumPixelSize: 100 },
+        model: {uri: airplaneUri,minimumPixelSize: 30 },
         // Automatically compute the orientation from the position.
         orientation: new Cesium.VelocityOrientationProperty(positionProperty),
         path: new Cesium.PathGraphics({ width: 3 , trailTime: 60})
@@ -148,16 +148,16 @@ export async function updatePlanes(viewer, location){
     const data = await getFLights('http://localhost:8080/flights', {long:location.long , lat: location.lat})
     if (data.length > 0){
 
-        if (data !== undefined && viewer.entities !== undefined) {
-            viewer.entities.values.forEach(async (entity) => {
+        if (viewer.entities !== undefined) {
+            for (const entity of viewer.entities.values) {
                     const flight = data.find(flight => entity.id.includes(flight.id))
-                    if(flight !== undefined){
+                    if(flight !== undefined && flight.id.includes('plane')){
                         await addNextPostion(determinatePlane(flight, 60), entity, getNextTimeBySecond(viewer, 60))
                     }else if(entity.id.includes('plane') ){
                         viewer.entities.remove(entity)
                     }
-                })
-            }
+                }
+        }
 
             await addNewPlanes(viewer, data)
         }

From 5cc1a1ec5defd02db0c5a2b0234f764ffe0973db Mon Sep 17 00:00:00 2001
From: Sofian Hussein <sofian.hussein@eduvaud.ch>
Date: Fri, 30 Jan 2026 08:48:41 +0100
Subject: [PATCH 58/61] fix(): Moon prediction (#107)

---
 src/components/Viewer.vue |  4 ++--
 src/utils/scene.js        | 17 +++++++----------
 2 files changed, 9 insertions(+), 12 deletions(-)

diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index 44c72c5..84bf40b 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -70,12 +70,12 @@ const onViewerReady = async ({Cesium, viewer}) => {
       setInterval(async () => {
         if (mapViewer.value !== undefined){
           await updatePlanes(viewer, location.value)
-          await sendToLogFile()
         }
       }, 59000)
 
       setInterval(async () => {
-        checkIfPlaneIsCloseToTheMoon(viewer)
+        await checkIfPlaneIsCloseToTheMoon(viewer, location.value)
+        await sendToLogFile()
       }, 30000)
 
     } catch (error) {
diff --git a/src/utils/scene.js b/src/utils/scene.js
index 6cea80f..5fa54cf 100644
--- a/src/utils/scene.js
+++ b/src/utils/scene.js
@@ -73,7 +73,7 @@ export function removeMoving(scene){
     scene.screenSpaceCameraController.enableRotate = false;
 }
 export async function loadPlanes(viewer, location){
-    const airplaneUri = await Cesium.IonResource.fromAssetId(4359085);
+    const airplaneUri = await Cesium.IonResource.fromAssetId(4373030);
     const data = await getFLights('http://localhost:8080/flights', {long: location.long , lat: location.lat})
 
     if(data !== undefined) {
@@ -183,7 +183,6 @@ export async function sendToLogFile() {
     // Source : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from
     // Convert map to array
     let logsArray = Array.from(logs.values());
-
     const url = "http://localhost:8080/logs"
 
     try {
@@ -421,13 +420,12 @@ function calculateMoonPlane(flight,viewer) {
     const corner_O = Math.acos(cos_theta_clamped);
 
     const moonAngularRadius = 0.0045
-    const closeTheMoon = 0.0135
+    const closeTheMoon = (0.0135)*2
 
     // Source : https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Global_Objects/Map/has
     const key = `${flight.id}`
 
     const currentLog = logs.get(flight.id);
-
     if (corner_O <= moonAngularRadius) {
         if (!currentLog) {
             const closestDate = new Date(Date.now() + t_closest * 1000);
@@ -447,7 +445,7 @@ function calculateMoonPlane(flight,viewer) {
 }
 
 async function addNewPlanes(viewer, data){
-    const airplaneUri = await Cesium.IonResource.fromAssetId(4359085);
+    const airplaneUri = await Cesium.IonResource.fromAssetId(4373030);
     data.forEach(async (flight) => {
         if (viewer.entities.values.find(entity => entity.id.includes(flight.id)) === undefined){
             const positionProperty = new Cesium.SampledPositionProperty();
@@ -461,11 +459,10 @@ async function addNewPlanes(viewer, data){
     })
 }
 
-export function checkIfPlaneIsCloseToTheMoon(viewer) {
-    viewer.entities.values.forEach(entity => {
-        if (entity.id.includes('plane')) {
-            calculateMoonPlane(entity, viewer)
-        }
+export async function checkIfPlaneIsCloseToTheMoon(viewer, location) {
+    const data = await getFLights('http://localhost:8080/flights', {long:location.long , lat: location.lat})
+    data.forEach(flight => {
+            calculateMoonPlane(flight, viewer)
     })
 }
 

From 4094db7bd184c87c15e6f09f3f56b7357d8ba18c Mon Sep 17 00:00:00 2001
From: Joris Bailly <90181523+JorisBly@users.noreply.github.com>
Date: Fri, 30 Jan 2026 08:54:02 +0100
Subject: [PATCH 59/61] Feature/send notification (#104)

* refactor():Delete div from the level of CoordinateForm.vue

* feat(): Check when email is mounted if there is already a saved email

* feat(): Make the email form hidden if the user want or by default if there is no email provided

* feat(): Add content in EmailRequest model

* feat(): Get infos from the email and put it inside

* feat(): Add content in the params of sendEmail

* feat(): Import getEmail and sendEmail

* feat(): Add await to checkIfPlaneIsCloseToTheMoon function call
---
 API/gmail.py                          | 14 ++++----
 API/models/EmailRequest.py            |  3 +-
 src/components/CoordinateForm.vue     |  3 +-
 src/components/Viewer.vue             |  1 +
 src/components/notification/Email.vue | 49 +++++++++++++++++++++++----
 src/utils/mail.js                     | 20 ++++++-----
 src/utils/scene.js                    | 32 +++++++++++------
 7 files changed, 88 insertions(+), 34 deletions(-)

diff --git a/API/gmail.py b/API/gmail.py
index 6d7ba04..ab8ac6b 100644
--- a/API/gmail.py
+++ b/API/gmail.py
@@ -8,20 +8,20 @@
 
 
 @router.post("/send-email")
-def send_email():
+def send_email(request: EmailRequest):
     mail_host = "smtp.gmail.com" # mail manager host
     port = 587 # standard SMTP submission port (STARTTLS)
-
-    sender_email = "<EMAIL>" # email address that will send mail
+    sender_email = "zzabcmail123@gmail.com" # email address that will send mail
     sender_password = os.getenv("GMAIL_APP_PASSWORD") # gmail app password
-    recipient_email = "<EMAIL>" # email address that will receive mail
+    recipient_email = request.user_email # email address that will receive mail
+    content = request.content
 
     # compose email
     msg = EmailMessage() # init email obj
-    msg["Subject"] = "Planium : A plane is flying near the Moon 🌙" # email subject
+    msg["Subject"] = "Planium : A plane is flying near the Moon 🌙"# email subject
     msg["From"] = sender_email    # sender
-    msg["To"] = recipient_email        # recipient
-    msg.set_content("A plane is about to fly near the moon.") # email content
+    msg["To"] = recipient_email       # recipient
+    msg.set_content(content) # email content
 
     # send email
     with smtplib.SMTP(mail_host, port) as smtp:
diff --git a/API/models/EmailRequest.py b/API/models/EmailRequest.py
index 3474815..5178085 100644
--- a/API/models/EmailRequest.py
+++ b/API/models/EmailRequest.py
@@ -1,4 +1,5 @@
 from pydantic import BaseModel
 
 class EmailRequest(BaseModel):
-    user_email: str
\ No newline at end of file
+    user_email: str
+    content: str
\ No newline at end of file
diff --git a/src/components/CoordinateForm.vue b/src/components/CoordinateForm.vue
index bee6169..f4c5663 100644
--- a/src/components/CoordinateForm.vue
+++ b/src/components/CoordinateForm.vue
@@ -38,8 +38,7 @@ function send(lat, lng){
       </fieldset>
       <button type="submit" @click="send(lat, lng)" class="btn btn-neutral mt-8">Find</button>
     </div>
-    <div class="bg-white/20 backdrop-blur-md rounded-xl shadow-lg p-4 border border-white/10 flex flex-col gap-3">      <Email />
-    </div>
+    <Email />
   </div>
 
 </template>
\ No newline at end of file
diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index 84bf40b..b7de127 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -74,6 +74,7 @@ const onViewerReady = async ({Cesium, viewer}) => {
       }, 59000)
 
       setInterval(async () => {
+        await checkIfPlaneIsCloseToTheMoon(viewer)
         await checkIfPlaneIsCloseToTheMoon(viewer, location.value)
         await sendToLogFile()
       }, 30000)
diff --git a/src/components/notification/Email.vue b/src/components/notification/Email.vue
index 1ede3db..b49dacd 100644
--- a/src/components/notification/Email.vue
+++ b/src/components/notification/Email.vue
@@ -1,13 +1,28 @@
 <script setup>
-import { ref } from "vue";
-import {sendTestEmail} from "@/utils/mail.js";
-
+import {onMounted, ref, watch} from "vue";
+import {getEmail, saveEmail, sendEmail} from "@/utils/mail.js";
+const displayed = ref(true)
 const emailCheck = ref(false); // flag: is "Receive..." box checked?
 const user_email = ref(""); // stores user's email
 
+onMounted(() => {
+  const storedEmail = getEmail()
+
+  if (storedEmail && storedEmail.trim() !== "") {
+    user_email.value = storedEmail;
+    displayed.value = false
+  }
+});
+
+watch(displayed, (newValue) => {
+    if (newValue){
+      user_email.value = getEmail()
+    }
+})
 </script>
 <!-----------------------------------------This is a component to test the email sender manually-------------------------->
 <template>
+  <div v-if="displayed" class="bg-white/20 backdrop-blur-md rounded-xl shadow-lg p-4 border border-white/10 flex flex-col gap-3">
   <!-- receive email checkbox -->
   <label class="flex items-center gap-2">
     <input
@@ -27,11 +42,33 @@ const user_email = ref(""); // stores user's email
       placeholder="Email address : example@email.com"
       class="input"
   />
+    <div class="flex justify-between gap-2">
   <button
-      class="px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 transition disabled:opacity-50"
+      class="btn btn-primary"
       type="submit"
-      @click="async () => sendTestEmail(emailCheck, user_email)"
+      @click="() => {
+        saveEmail(user_email, `salut c'est le test`)
+        displayed = false
+  }"
   >
-    Send Test Email
+    Save email
   </button>
+
+      <button
+          class=" btn btn-error px-4 py-2  transition disabled:opacity-50"
+          type="submit"
+          @click="() => {
+            displayed = false
+          }"
+      >
+        Close
+      </button>
+    </div>
+  </div>
+  <div v-else class="w-10 justify-center bg-white/20 backdrop-blur-md rounded-xl shadow-lg border p-1 border-white/10 flex flex-col gap-3">
+    <button @click="() => {displayed = true}" class="w-full flex justify-center items-center">
+    <svg class="w-8" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free v7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2026 Fonticons, Inc.--><path d="M61.4 64C27.5 64 0 91.5 0 125.4 0 126.3 0 127.1 .1 128L0 128 0 384c0 35.3 28.7 64 64 64l384 0c35.3 0 64-28.7 64-64l0-256-.1 0c0-.9 .1-1.7 .1-2.6 0-33.9-27.5-61.4-61.4-61.4L61.4 64zM464 192.3L464 384c0 8.8-7.2 16-16 16L64 400c-8.8 0-16-7.2-16-16l0-191.7 154.8 117.4c31.4 23.9 74.9 23.9 106.4 0L464 192.3zM48 125.4C48 118 54 112 61.4 112l389.2 0c7.4 0 13.4 6 13.4 13.4 0 4.2-2 8.2-5.3 10.7L280.2 271.5c-14.3 10.8-34.1 10.8-48.4 0L53.3 136.1c-3.3-2.5-5.3-6.5-5.3-10.7z"/>
+    </svg>
+    </button>
+  </div>
 </template>
\ No newline at end of file
diff --git a/src/utils/mail.js b/src/utils/mail.js
index 76b45ff..70a1b16 100644
--- a/src/utils/mail.js
+++ b/src/utils/mail.js
@@ -1,24 +1,28 @@
-export async function sendTestEmail(emailCheck, user_email) {
-    if (!emailCheck) {
-        alert("Please check the box to receive email notifications.");
-        return;
-    }
+export async function sendEmail(user_email, content) {
     if (!user_email) {
         alert("Please enter a valid email address.");
         return;
     }
 
     try{
-        const res = await fetch("http://localhost:8080/api/send-test-email", {
+        const res = await fetch("http://localhost:8080/api/send-email", {
             method: "POST",
             headers: {"Content-Type": "application/json"},
-            body: JSON.stringify({ user_email: user_email }),
+            body: JSON.stringify({ user_email: user_email , content: content}),
         });
 
         if (!res.ok) throw new Error("Failed to send test email");
 
-        alert("Test email sent successfully.");
+        alert("Email sent successfully.");
     } catch (error) {
         alert("Error sending email:" + error.message);
     }
+}
+
+export function saveEmail(email) {
+    localStorage.setItem("user_email", email);
+}
+
+export function getEmail() {
+    return localStorage.getItem("user_email");
 }
\ No newline at end of file
diff --git a/src/utils/scene.js b/src/utils/scene.js
index 5fa54cf..1c99e71 100644
--- a/src/utils/scene.js
+++ b/src/utils/scene.js
@@ -1,4 +1,5 @@
 import {getFLights} from "@/utils/api.js";
+import {getEmail, sendEmail} from "@/utils/mail.js";
 
 // data structure that allows logs to be stored
 // Source : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map
@@ -73,7 +74,7 @@ export function removeMoving(scene){
     scene.screenSpaceCameraController.enableRotate = false;
 }
 export async function loadPlanes(viewer, location){
-    const airplaneUri = await Cesium.IonResource.fromAssetId(4373030);
+    const airplaneUri = await Cesium.IonResource.fromAssetId(4359085);
     const data = await getFLights('http://localhost:8080/flights', {long: location.long , lat: location.lat})
 
     if(data !== undefined) {
@@ -183,6 +184,7 @@ export async function sendToLogFile() {
     // Source : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from
     // Convert map to array
     let logsArray = Array.from(logs.values());
+
     const url = "http://localhost:8080/logs"
 
     try {
@@ -269,7 +271,7 @@ function determinatePlane(flight, delta_time) {
     return Cesium.Cartesian3.fromDegrees(new_long, new_lat, new_alt);
 }
 
-function calculateMoonPlane(flight,viewer) {
+async function calculateMoonPlane(flight,viewer) {
     /*
     Prompt to Claude :
     If I have a person P (with coordinates x, y, z),
@@ -426,12 +428,18 @@ function calculateMoonPlane(flight,viewer) {
     const key = `${flight.id}`
 
     const currentLog = logs.get(flight.id);
+    const user_email = getEmail()
+
     if (corner_O <= moonAngularRadius) {
         if (!currentLog) {
             const closestDate = new Date(Date.now() + t_closest * 1000);
             const logTime = closestDate.toISOString();
             logs.set(key, `Aircraft pass in front of the moon | Camera : ${cameraPos} | Aircraft ID : ${flight.id} 
             | Time : ${logTime}`);
+
+            if(user_email !== undefined){
+                await sendEmail(user_email, ` ${logTime} : Aircraft pass in front of the moon | Camera : ${cameraPos} | Aircraft ID : ${flight.id} `)
+            }
         }
     } else if (corner_O <= closeTheMoon) {
         // Source : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith
@@ -440,13 +448,16 @@ function calculateMoonPlane(flight,viewer) {
             const logTime = closestDate.toISOString();
             logs.set(key, `Aircraft pass close to the moon | Camera : ${cameraPos} | Aircraft ID : ${flight.id} 
             | Time : ${logTime}`);
+            if(user_email !== undefined){
+                await sendEmail(user_email, ` ${logTime} : Aircraft pass in front of the moon | Camera : ${cameraPos} | Aircraft ID : ${flight.id} `)
+            }
         }
     }
 }
 
 async function addNewPlanes(viewer, data){
-    const airplaneUri = await Cesium.IonResource.fromAssetId(4373030);
-    data.forEach(async (flight) => {
+    const airplaneUri = await Cesium.IonResource.fromAssetId(4359085);
+    for (const flight of data) {
         if (viewer.entities.values.find(entity => entity.id.includes(flight.id)) === undefined){
             const positionProperty = new Cesium.SampledPositionProperty();
             const position = Cesium.Cartesian3.fromDegrees(flight.long, flight.lat, flight.alt)
@@ -456,14 +467,15 @@ async function addNewPlanes(viewer, data){
             await loadModel(viewer, viewer.clock.currentTime, viewer.clock.stopTime, positionProperty, airplaneUri, flight.id)
             positionProperty.addSample(getNextTimeBySecond(viewer, 60), determinatePlane(flight, 60))
         }
-    })
+    }
 }
 
-export async function checkIfPlaneIsCloseToTheMoon(viewer, location) {
-    const data = await getFLights('http://localhost:8080/flights', {long:location.long , lat: location.lat})
-    data.forEach(flight => {
-            calculateMoonPlane(flight, viewer)
-    })
+export async function checkIfPlaneIsCloseToTheMoon(viewer) {
+    for (const entity of viewer.entities.values) {
+        if (entity.id.includes('plane')) {
+            await calculateMoonPlane(entity, viewer)
+        }
+    }
 }
 
 // Source : https://developer.mozilla.org/en-US/docs/Web/API/Window/setInterval

From 3eeb71f2b10235b25da352ab7fceb16a5ddb24ec Mon Sep 17 00:00:00 2001
From: Sofian Hussein <sofian.hussein@eduvaud.ch>
Date: Fri, 30 Jan 2026 10:08:01 +0100
Subject: [PATCH 60/61] docs(): Improve the README (#106)

---
 README.md | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 1401182..7215233 100644
--- a/README.md
+++ b/README.md
@@ -1,6 +1,8 @@
 # Planium
 
-Planium is an application for fan of astrology and photos of planes in front of the moon.
+Planium is a tool for visualizing airplanes, as well as the moon and the sun.
+It also allows you to predict 30 seconds before an airplane passes in front of the moon.
+Planium makes a rare event accessible: taking a capture of a Moon–aircraft alignment.
 
 ## Stacks
 - [Vue.js](https://vuejs.org/)
@@ -12,7 +14,11 @@ Planium is an application for fan of astrology and photos of planes in front of
 
 ## Requirements
 - Node.js 20.19.0+
+- https://nodejs.org/en/download
+
+
 - Python 3.10+
+- https://www.python.org/downloads/
 
 ## Prerequisites
 - [A Cesium ion account](https://ion.cesium.com) (To Downloads and load assets)
@@ -27,6 +33,11 @@ Planium is an application for fan of astrology and photos of planes in front of
 3. Select **3D Model (Convert to glTF)**, then click **Upload**.
 4. After it’s done processing, find the **asset ID** by selecting the new asset back in your dashboard and looking under the preview window on the right.
 
+## Create the .env file
+1) Create a .env file at the root of the project.
+2) Paste the content of the file ".env.example"
+3) Replace the variable values with your own.
+
 ## Project Setup
 
 ```sh

From ecb202b29bee6b93cf6ac9f9ac8443f2fa0aace8 Mon Sep 17 00:00:00 2001
From: Sofian Hussein <sofian.hussein@eduvaud.ch>
Date: Fri, 30 Jan 2026 11:11:38 +0100
Subject: [PATCH 61/61] Feature/improve logs (#108)

* fix(): Change mail message

* fix(): Call checkIfPlaneIsCloseToTheMoon with api informations in parameters

* fix(): Fix the log system with direct write on the disk
---
 API/main.py               |  3 ++-
 src/components/Viewer.vue |  1 -
 src/utils/scene.js        | 13 ++++++-------
 3 files changed, 8 insertions(+), 9 deletions(-)

diff --git a/API/main.py b/API/main.py
index 69a7250..06658d5 100644
--- a/API/main.py
+++ b/API/main.py
@@ -73,9 +73,10 @@ def write_logs(log : Log):
     os.makedirs(logs_dir, exist_ok=True)
 
     log_file_path = os.path.join(logs_dir, "log.txt")
-
     with open(log_file_path, "a", encoding="utf-8") as log_file:
         log_file.write(f"{log.message}\n")
+        log_file.flush()
+        os.fsync(log_file.fileno())
     return {"message": "Logs were added"}
 
 
diff --git a/src/components/Viewer.vue b/src/components/Viewer.vue
index b7de127..84bf40b 100644
--- a/src/components/Viewer.vue
+++ b/src/components/Viewer.vue
@@ -74,7 +74,6 @@ const onViewerReady = async ({Cesium, viewer}) => {
       }, 59000)
 
       setInterval(async () => {
-        await checkIfPlaneIsCloseToTheMoon(viewer)
         await checkIfPlaneIsCloseToTheMoon(viewer, location.value)
         await sendToLogFile()
       }, 30000)
diff --git a/src/utils/scene.js b/src/utils/scene.js
index 1c99e71..1022c83 100644
--- a/src/utils/scene.js
+++ b/src/utils/scene.js
@@ -449,7 +449,7 @@ async function calculateMoonPlane(flight,viewer) {
             logs.set(key, `Aircraft pass close to the moon | Camera : ${cameraPos} | Aircraft ID : ${flight.id} 
             | Time : ${logTime}`);
             if(user_email !== undefined){
-                await sendEmail(user_email, ` ${logTime} : Aircraft pass in front of the moon | Camera : ${cameraPos} | Aircraft ID : ${flight.id} `)
+                await sendEmail(user_email, ` ${logTime} : Aircraft pass close of the moon | Camera : ${cameraPos} | Aircraft ID : ${flight.id} `)
             }
         }
     }
@@ -470,12 +470,11 @@ async function addNewPlanes(viewer, data){
     }
 }
 
-export async function checkIfPlaneIsCloseToTheMoon(viewer) {
-    for (const entity of viewer.entities.values) {
-        if (entity.id.includes('plane')) {
-            await calculateMoonPlane(entity, viewer)
-        }
-    }
+export async function checkIfPlaneIsCloseToTheMoon(viewer, location) {
+    const data = await getFLights('http://localhost:8080/flights', {long:location.long , lat: location.lat})
+    data.forEach(flight => {
+        calculateMoonPlane(flight, viewer)
+    })
 }
 
 // Source : https://developer.mozilla.org/en-US/docs/Web/API/Window/setInterval