Spaces:

SaidAmchghal
/

simulation-de-gravit

Running

App Files Files Community

SaidAmchghal commited on Apr 25, 2025

Commit

6255610

verified ·

1 Parent(s): f532dcc

Add 2 files

Browse files

Files changed (2) hide show

index.html +99 -5
prompts.txt +3 -1

index.html CHANGED Viewed

@@ -38,6 +38,27 @@
         .floating {
             animation: float 3s ease-in-out infinite;
         }
     </style>
 </head>
 <body class="bg-gray-900 text-gray-100 min-h-screen">
@@ -164,6 +185,7 @@
                             <th class="py-3 px-4">Masse (×10²⁴ kg)</th>
                             <th class="py-3 px-4">Rayon (km)</th>
                             <th class="py-3 px-4">Temps de chute de 100m</th>
                         </tr>
                     </thead>
                     <tbody id="planetData">
@@ -236,6 +258,7 @@
             let animationId = null;
             let startTime = null;
             let objects = [];
             // Éléments DOM
             const simulationContainer = document.getElementById('simulationContainer');
@@ -267,7 +290,9 @@
             });
             heightSlider.addEventListener('input', function() {
-                heightValue.textContent = `${this.value}m`;
             });
             startBtn.addEventListener('click', startSimulation);
@@ -284,12 +309,14 @@
                         btn.classList.add('ring-2', 'ring-blue-400');
                         renderPlanetSelection();
                         updatePlanetDataTable();
                     }
                 } else {
                     selectedPlanets.splice(index, 1);
                     btn.classList.remove('ring-2', 'ring-blue-400');
                     renderPlanetSelection();
                     updatePlanetDataTable();
                 }
             }
@@ -342,6 +369,19 @@
                     gravityWell.style.backgroundColor = planet.color;
                     planetsContainer.appendChild(gravityWell);
                     // Ajout des statistiques de la planète
                     const statsEl = document.createElement('div');
                     statsEl.className = 'bg-gray-700 p-4 rounded-lg';
@@ -373,12 +413,36 @@
                 });
             }
             function updatePlanetDataTable() {
                 planetData.innerHTML = '';
                 Object.keys(PLANETS).forEach(planetId => {
                     const planet = PLANETS[planetId];
                     const isSelected = selectedPlanets.includes(planetId);
                     const row = document.createElement('tr');
                     row.className = isSelected ? 'bg-gray-700' : 'border-b border-gray-700';
@@ -390,7 +454,8 @@
                         <td class="py-3 px-4">${planet.g}</td>
                         <td class="py-3 px-4">${planet.mass}</td>
                         <td class="py-3 px-4">${planet.radius}</td>
-                        <td class="py-3 px-4">${Math.sqrt(2 * 100 / planet.g).toFixed(2)} s</td>
                     `;
                     planetData.appendChild(row);
                 });
@@ -404,7 +469,7 @@
                 startTime = Date.now();
                 objects = [];
-                const height = parseInt(heightSlider.value);
                 const object = OBJECTS[objectType.value];
                 // Créer un objet pour chaque planète sélectionnée
@@ -429,9 +494,22 @@
                         falling: false,
                         startTime: null,
                         fallDuration: null,
-                        finalSpeed: null
                     };
                     objects.push(obj);
                     // Mettre à jour le poids affiché
@@ -473,11 +551,19 @@
                         const fallTime = (now - obj.startTime) / 1000;
                         // Formule de chute libre: y = y0 + 0.5 * g * t^2
-                        obj.y = 50 + 0.5 * obj.g * fallTime * fallTime * 100;
                         // Vitesse: v = g * t
                         obj.vy = obj.g * fallTime;
                         // Vérifier si l'objet a atteint le sol
                         if (obj.y >= obj.planetY - 30) {
                             obj.y = obj.planetY - 30;
@@ -549,6 +635,14 @@
                 simulationRunning = false;
                 startBtn.disabled = false;
                 objects = [];
                 // Effacer le canvas

         .floating {
             animation: float 3s ease-in-out infinite;
         }
+        .planet-stats {
+            position: absolute;
+            background: rgba(30, 41, 59, 0.8);
+            border-radius: 8px;
+            padding: 8px;
+            font-size: 12px;
+            pointer-events: none;
+            transform: translateX(-50%);
+        }
+        .fall-data {
+            position: absolute;
+            bottom: 10px;
+            left: 50%;
+            transform: translateX(-50%);
+            background: rgba(30, 41, 59, 0.8);
+            border-radius: 8px;
+            padding: 8px;
+            font-size: 12px;
+            text-align: center;
+            min-width: 120px;
+        }
     </style>
 </head>
 <body class="bg-gray-900 text-gray-100 min-h-screen">
                             <th class="py-3 px-4">Masse (×10²⁴ kg)</th>
                             <th class="py-3 px-4">Rayon (km)</th>
                             <th class="py-3 px-4">Temps de chute de 100m</th>
+                            <th class="py-3 px-4">Vitesse finale (100m)</th>
                         </tr>
                     </thead>
                     <tbody id="planetData">
             let animationId = null;
             let startTime = null;
             let objects = [];
+            let currentHeight = 150;
             // Éléments DOM
             const simulationContainer = document.getElementById('simulationContainer');
             });
             heightSlider.addEventListener('input', function() {
+                currentHeight = parseInt(this.value);
+                heightValue.textContent = `${currentHeight}m`;
+                updateFallData();
             });
             startBtn.addEventListener('click', startSimulation);
                         btn.classList.add('ring-2', 'ring-blue-400');
                         renderPlanetSelection();
                         updatePlanetDataTable();
+                        updateFallData();
                     }
                 } else {
                     selectedPlanets.splice(index, 1);
                     btn.classList.remove('ring-2', 'ring-blue-400');
                     renderPlanetSelection();
                     updatePlanetDataTable();
+                    updateFallData();
                 }
             }
                     gravityWell.style.backgroundColor = planet.color;
                     planetsContainer.appendChild(gravityWell);
+                    // Ajout des données de chute sous chaque planète
+                    const fallDataEl = document.createElement('div');
+                    fallDataEl.className = 'fall-data';
+                    fallDataEl.style.left = `${left}px`;
+                    fallDataEl.style.color = planet.color;
+                    fallDataEl.innerHTML = `
+                        <div>Hauteur: ${currentHeight}m</div>
+                        <div>Temps: ${calculateFallTime(currentHeight, planet.g).toFixed(2)}s</div>
+                        <div>Vitesse: ${calculateFinalSpeed(currentHeight, planet.g).toFixed(2)}m/s</div>
+                    `;
+                    fallDataEl.id = `fall-data-${planetId}`;
+                    planetsContainer.appendChild(fallDataEl);
                     // Ajout des statistiques de la planète
                     const statsEl = document.createElement('div');
                     statsEl.className = 'bg-gray-700 p-4 rounded-lg';
                 });
             }
+            function calculateFallTime(height, gravity) {
+                return Math.sqrt(2 * height / gravity);
+            }
+            function calculateFinalSpeed(height, gravity) {
+                return Math.sqrt(2 * gravity * height);
+            }
+            function updateFallData() {
+                selectedPlanets.forEach(planetId => {
+                    const planet = PLANETS[planetId];
+                    const fallDataEl = document.getElementById(`fall-data-${planetId}`);
+                    if (fallDataEl) {
+                        fallDataEl.innerHTML = `
+                            <div>Hauteur: ${currentHeight}m</div>
+                            <div>Temps: ${calculateFallTime(currentHeight, planet.g).toFixed(2)}s</div>
+                            <div>Vitesse: ${calculateFinalSpeed(currentHeight, planet.g).toFixed(2)}m/s</div>
+                        `;
+                    }
+                });
+            }
             function updatePlanetDataTable() {
                 planetData.innerHTML = '';
                 Object.keys(PLANETS).forEach(planetId => {
                     const planet = PLANETS[planetId];
                     const isSelected = selectedPlanets.includes(planetId);
+                    const fallTime100m = calculateFallTime(100, planet.g);
+                    const finalSpeed100m = calculateFinalSpeed(100, planet.g);
                     const row = document.createElement('tr');
                     row.className = isSelected ? 'bg-gray-700' : 'border-b border-gray-700';
                         <td class="py-3 px-4">${planet.g}</td>
                         <td class="py-3 px-4">${planet.mass}</td>
                         <td class="py-3 px-4">${planet.radius}</td>
+                        <td class="py-3 px-4">${fallTime100m.toFixed(2)} s</td>
+                        <td class="py-3 px-4">${finalSpeed100m.toFixed(2)} m/s</td>
                     `;
                     planetData.appendChild(row);
                 });
                 startTime = Date.now();
                 objects = [];
+                const height = currentHeight;
                 const object = OBJECTS[objectType.value];
                 // Créer un objet pour chaque planète sélectionnée
                         falling: false,
                         startTime: null,
                         fallDuration: null,
+                        finalSpeed: null,
+                        statsEl: null
                     };
+                    // Créer l'élément pour afficher les stats en temps réel
+                    obj.statsEl = document.createElement('div');
+                    obj.statsEl.className = 'planet-stats';
+                    obj.statsEl.style.left = `${planetX}px`;
+                    obj.statsEl.style.top = '20px';
+                    obj.statsEl.style.color = planet.color;
+                    obj.statsEl.innerHTML = `
+                        <div>Temps: <span class="time-value">0.00</span>s</div>
+                        <div>Vitesse: <span class="speed-value">0.00</span>m/s</div>
+                    `;
+                    planetsContainer.appendChild(obj.statsEl);
                     objects.push(obj);
                     // Mettre à jour le poids affiché
                         const fallTime = (now - obj.startTime) / 1000;
                         // Formule de chute libre: y = y0 + 0.5 * g * t^2
+                        // On ajuste l'échelle pour que la chute soit visible à l'écran
+                        const scaleFactor = (simulationCanvas.height / 2 - 50) / obj.height;
+                        obj.y = 50 + 0.5 * obj.g * fallTime * fallTime * scaleFactor;
                         // Vitesse: v = g * t
                         obj.vy = obj.g * fallTime;
+                        // Mettre à jour les stats en temps réel
+                        if (obj.statsEl) {
+                            obj.statsEl.querySelector('.time-value').textContent = fallTime.toFixed(2);
+                            obj.statsEl.querySelector('.speed-value').textContent = obj.vy.toFixed(2);
+                        }
                         // Vérifier si l'objet a atteint le sol
                         if (obj.y >= obj.planetY - 30) {
                             obj.y = obj.planetY - 30;
                 simulationRunning = false;
                 startBtn.disabled = false;
+                // Supprimer les éléments de stats
+                objects.forEach(obj => {
+                    if (obj.statsEl && obj.statsEl.parentNode) {
+                        obj.statsEl.parentNode.removeChild(obj.statsEl);
+                    }
+                });
                 objects = [];
                 // Effacer le canvas

prompts.txt CHANGED Viewed

	@@ -1 +1,3 @@
1	- Une application qui permet de faire une simulation de la gravité sur plusieurs planètes en même temps pour voir la différence. Prévoir les fonctionnalités nécessaires et utiles pour une bonne expérience.

+Une application qui permet de faire une simulation de la gravité sur plusieurs planètes en même temps pour voir la différence. Prévoir les fonctionnalités nécessaires et utiles pour une bonne expérience.
+Ajoutez dans la zone de simulation le temps de chute et la vitesse pour les planètes comparées.
+Le temps de chute et la vitesse finale doivent changé en fonction de la hauteur de chute, et pour chaque planète dans la zone de simulation indiquez les valeurs du temps de chute et de la vitesse finale.