Spaces:

docto41
/

routier-974

Running

App Files Files Community

docto41 commited on May 2

Commit

fd6183a

verified ·

1 Parent(s): 13aad7d

Add 2 files

Browse files

Files changed (2) hide show

index.html +99 -628
prompts.txt +2 -1

index.html CHANGED Viewed

@@ -3,7 +3,7 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Simulateur de Camion Réaliste - La Réunion</title>
     <script src="https://cdn.tailwindcss.com"></script>
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
     <style>
@@ -13,7 +13,6 @@
             font-family: 'Poppins', sans-serif;
             background-color: #0f172a;
             color: white;
-            overflow: hidden;
             margin: 0;
             padding: 0;
         }
@@ -30,22 +29,7 @@
             justify-content: center;
             align-items: center;
             z-index: 9999;
-        }
-        .loading-bar {
-            width: 300px;
-            height: 20px;
-            background-color: #334155;
-            border-radius: 10px;
-            overflow: hidden;
-            margin-top: 20px;
-        }
-        .loading-progress {
-            height: 100%;
-            background: linear-gradient(90deg, #f59e0b, #f97316);
-            width: 0%;
-            transition: width 0.1s linear;
         }
         .game-container {
@@ -73,13 +57,6 @@
             border: 1px solid rgba(255,255,255,0.1);
         }
-        .dashboard-item {
-            display: flex;
-            flex-direction: column;
-            align-items: center;
-            min-width: 100px;
-        }
         .progress-bar {
             width: 100px;
             height: 10px;
@@ -116,20 +93,6 @@
             border: 2px solid white;
         }
-        .mission-popup {
-            position: absolute;
-            top: 50%;
-            left: 50%;
-            transform: translate(-50%, -50%);
-            background-color: rgba(0,0,0,0.9);
-            padding: 20px;
-            border-radius: 10px;
-            text-align: center;
-            display: none;
-            backdrop-filter: blur(5px);
-            border: 1px solid #f59e0b;
-        }
         #gameCanvas {
             position: absolute;
             top: 0;
@@ -138,31 +101,6 @@
             height: 100%;
         }
-        .controls-info {
-            position: absolute;
-            bottom: 100px;
-            left: 20px;
-            background-color: rgba(0,0,0,0.7);
-            padding: 10px;
-            border-radius: 5px;
-            font-size: 14px;
-            backdrop-filter: blur(5px);
-            border: 1px solid rgba(255,255,255,0.1);
-        }
-        .mission-progress {
-            position: absolute;
-            top: 20px;
-            left: 20px;
-            background-color: rgba(0,0,0,0.7);
-            padding: 10px;
-            border-radius: 5px;
-            font-size: 14px;
-            max-width: 300px;
-            backdrop-filter: blur(5px);
-            border: 1px solid rgba(255,255,255,0.1);
-        }
         .mission-complete {
             position: absolute;
             top: 50%;
@@ -178,149 +116,6 @@
             border: 2px solid #f59e0b;
         }
-        .mission-complete h3 {
-            font-size: 24px;
-            color: #f59e0b;
-            margin-bottom: 20px;
-        }
-        .mission-complete button {
-            background-color: #f59e0b;
-            color: black;
-            border: none;
-            padding: 10px 20px;
-            border-radius: 5px;
-            font-weight: bold;
-            cursor: pointer;
-            margin-top: 20px;
-            transition: all 0.3s ease;
-        }
-        .mission-complete button:hover {
-            background-color: #f97316;
-            transform: translateY(-2px);
-        }
-        .weather-effects {
-            position: absolute;
-            top: 0;
-            left: 0;
-            width: 100%;
-            height: 100%;
-            pointer-events: none;
-        }
-        .rain {
-            position: absolute;
-            width: 2px;
-            height: 20px;
-            background-color: rgba(255,255,255,0.5);
-            animation: rain-fall linear infinite;
-        }
-        @keyframes rain-fall {
-            0% { transform: translateY(-100px); }
-            100% { transform: translateY(100vh); }
-        }
-        .time-display {
-            position: absolute;
-            top: 20px;
-            right: 240px;
-            background-color: rgba(0,0,0,0.7);
-            padding: 10px;
-            border-radius: 5px;
-            font-size: 14px;
-            backdrop-filter: blur(5px);
-            border: 1px solid rgba(255,255,255,0.1);
-        }
-        .ai-status {
-            position: absolute;
-            bottom: 20px;
-            right: 20px;
-            background-color: rgba(0,0,0,0.7);
-            padding: 10px;
-            border-radius: 5px;
-            font-size: 14px;
-            backdrop-filter: blur(5px);
-            border: 1px solid rgba(255,255,255,0.1);
-        }
-        /* Styles réalistes ajoutés */
-        .realistic-truck {
-            position: relative;
-            width: 120px;
-            height: 40px;
-        }
-        .truck-cabin {
-            position: absolute;
-            width: 40px;
-            height: 30px;
-            background-color: #3498db;
-            border-radius: 5px 0 0 5px;
-        }
-        .truck-trailer {
-            position: absolute;
-            left: 40px;
-            width: 80px;
-            height: 30px;
-            background-color: #2980b9;
-            border-radius: 0 5px 5px 0;
-        }
-        .wheel {
-            position: absolute;
-            width: 12px;
-            height: 12px;
-            background-color: #333;
-            border-radius: 50%;
-            bottom: -6px;
-        }
-        .wheel-front {
-            left: 10px;
-        }
-        .wheel-rear {
-            left: 30px;
-        }
-        .wheel-trailer {
-            left: 70px;
-        }
-        .road-sign {
-            position: absolute;
-            background-color: #f1c40f;
-            width: 20px;
-            height: 30px;
-            border-radius: 3px;
-        }
-        .road-sign:after {
-            content: "";
-            position: absolute;
-            bottom: -10px;
-            left: 8px;
-            width: 4px;
-            height: 10px;
-            background-color: #7f8c8d;
-        }
-        .pano-view {
-            position: absolute;
-            top: 0;
-            left: 0;
-            width: 100%;
-            height: 100%;
-            background-size: cover;
-            background-position: center;
-            transition: background-image 1s ease;
-        }
         .start-screen {
             position: fixed;
             top: 0;
@@ -350,61 +145,55 @@
             box-shadow: 0 10px 20px rgba(0,0,0,0.3);
         }
-        .start-btn:hover {
-            transform: translateY(-5px);
-            box-shadow: 0 15px 25px rgba(0,0,0,0.4);
         }
-        .start-btn:active {
-            transform: translateY(0);
-        }
-        /* Optimisation du chargement */
-        .preload-images {
-            display: none;
         }
-        /* Animation de chargement accélérée */
-        @keyframes loadingPulse {
-            0% { opacity: 0.5; }
-            50% { opacity: 1; }
-            100% { opacity: 0.5; }
         }
-        .loading-pulse {
-            animation: loadingPulse 1.5s infinite;
         }
     </style>
 </head>
-<body class="min-h-screen">
-    <!-- Préchargement des images -->
-    <div class="preload-images">
-        <img src="https://images.unsplash.com/photo-1584556818175-1a676b2657d3?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80">
-        <img src="https://images.unsplash.com/photo-1566438480900-0609be27a4be?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80">
-    </div>
-    <!-- Start Screen -->
     <div class="start-screen">
         <h1 class="text-5xl font-bold text-yellow-400 mb-6">SIMULATEUR DE CAMION RÉUNIONNAIS</h1>
-        <p class="text-xl mb-8 max-w-2xl text-center">Conduisez un véritable camion à travers les paysages spectaculaires de La Réunion. Expérience réaliste avec vrais paysages et conditions météo.</p>
         <button id="startGameBtn" class="start-btn">
             <i class="fas fa-truck mr-2"></i> DÉMARRER LA CONDUITE
         </button>
     </div>
-    <!-- Loading Screen -->
-    <div class="loading-screen">
-        <h1 class="text-4xl font-bold text-yellow-400 mb-4 loading-pulse">Chargement des données GPS</h1>
         <p class="text-lg mb-8" id="loadingStatus">Initialisation du système de conduite...</p>
-        <div class="loading-bar">
-            <div class="loading-progress" id="loadingProgress"></div>
-        </div>
         <div class="mt-4 text-sm" id="loadingText">Connexion aux serveurs...</div>
     </div>
     <!-- Game Container -->
     <div id="gameContainer" class="game-container">
-        <!-- Panoramic View from Real Truck Camera -->
         <div class="pano-view" id="panoView"></div>
         <!-- Game UI Elements -->
@@ -424,34 +213,12 @@
                 <span class="text-sm mb-1">Distance</span>
                 <span id="distanceValue" class="text-xl font-bold">0 km</span>
             </div>
-            <div class="dashboard-item">
-                <span class="text-sm mb-1">Poids</span>
-                <span id="weightValue" class="text-xl font-bold">0 kg</span>
-            </div>
         </div>
         <div class="game-map">
             <div id="playerMarker" class="player-marker"></div>
         </div>
-        <div id="missionProgress" class="mission-progress">
-            <strong>Mission en cours:</strong> Aucune mission active
-        </div>
-        <div class="time-display" id="timeDisplay">
-            <i class="fas fa-clock mr-2"></i> <span id="timeValue">06:00</span>
-        </div>
-        <div class="controls-info">
-            <p><strong>Contrôles réalistes:</strong></p>
-            <p>Accélérateur: Flèche haut/Z</p>
-            <p>Frein: Flèche bas/S</p>
-            <p>Direction: Flèches gauche/droite ou Q/D</p>
-            <p>Rétroviseurs: A/E</p>
-            <p>Phares: L</p>
-            <p>Klaxon: K</p>
-        </div>
         <div id="missionComplete" class="mission-complete">
             <!-- Will be filled dynamically -->
         </div>
@@ -459,73 +226,33 @@
         <button id="exitGameBtn" class="absolute top-4 left-4 bg-red-600 hover:bg-red-700 text-white font-bold py-2 px-4 rounded-full transition-all">
             <i class="fas fa-times mr-2"></i> Quitter
         </button>
-        <!-- Realistic rearview mirrors -->
-        <div id="leftMirror" class="absolute top-20 left-4 w-32 h-20 bg-gray-800 border-2 border-gray-600 rounded overflow-hidden" style="display: none;">
-            <div class="mirror-view" style="width: 100%; height: 100%; background-color: rgba(0,0,0,0.5);"></div>
-        </div>
-        <div id="rightMirror" class="absolute top-20 right-4 w-32 h-20 bg-gray-800 border-2 border-gray-600 rounded overflow-hidden" style="display: none;">
-            <div class="mirror-view" style="width: 100%; height: 100%; background-color: rgba(0,0,0,0.5);"></div>
-        </div>
     </div>
     <script>
-        // Optimisation: Préchargement des ressources
-        function preloadResources() {
-            const images = [
-                'https://images.unsplash.com/photo-1584556818175-1a676b2657d3?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80',
-                'https://images.unsplash.com/photo-1566438480900-0609be27a4be?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80'
-            ];
-            images.forEach(img => {
-                new Image().src = img;
-            });
-        }
-        // Démarrer le préchargement dès que la page est chargée
-        window.addEventListener('DOMContentLoaded', preloadResources);
         // Game variables
         let truckSpeed = 0;
         const maxSpeed = 90;
-        const maxReverseSpeed = 20;
         const acceleration = 0.5;
-        const braking = 1;
         const deceleration = 0.3;
         const steeringSpeed = 0.02;
         let fuel = 100;
         const fuelConsumption = 0.05;
         let distance = 0;
-        let currentWeight = 0;
-        let hasCargo = false;
-        let currentMission = null;
-        let missionProgress = 0;
         let gameTime = 6 * 60;
-        let isRaining = false;
-        let headlightsOn = false;
-        let mirrorsVisible = false;
-        // Real locations in La Réunion with actual images
         const locations = [
             {
                 name: "Saint-Denis",
-                lat: -20.8825,
-                lng: 55.4504,
-                img: "https://images.unsplash.com/photo-1584556818175-1a676b2657d3?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80",
-                description: "Capitale de La Réunion avec son architecture coloniale"
             },
             {
                 name: "Saint-Pierre",
-                lat: -21.3291,
-                lng: 55.4789,
-                img: "https://images.unsplash.com/photo-1566438480900-0609be27a4be?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80",
-                description: "Ville dynamique du sud avec son port de plaisance"
             }
         ];
-        // Current location index
         let currentLocationIndex = 0;
         // UI elements
@@ -533,51 +260,24 @@
         const fuelElement = document.getElementById('fuelValue');
         const fuelBar = document.getElementById('fuelBar');
         const distanceElement = document.getElementById('distanceValue');
-        const weightElement = document.getElementById('weightValue');
-        const missionProgressElement = document.getElementById('missionProgress');
-        const missionCompleteElement = document.getElementById('missionComplete');
-        const playerMarker = document.getElementById('playerMarker');
-        const timeDisplay = document.getElementById('timeDisplay');
-        const timeValue = document.getElementById('timeValue');
         const panoView = document.getElementById('panoView');
-        const leftMirror = document.getElementById('leftMirror');
-        const rightMirror = document.getElementById('rightMirror');
-        const loadingProgress = document.getElementById('loadingProgress');
-        const loadingText = document.getElementById('loadingText');
-        const loadingStatus = document.getElementById('loadingStatus');
         const gameContainer = document.getElementById('gameContainer');
-        const exitGameBtn = document.getElementById('exitGameBtn');
-        const loadingScreen = document.querySelector('.loading-screen');
         const startScreen = document.querySelector('.start-screen');
         const startGameBtn = document.getElementById('startGameBtn');
-        // Start game button
-        startGameBtn.addEventListener('click', function() {
-            startScreen.style.display = 'none';
-            loadingScreen.style.display = 'flex';
-            // Optimisation: Chargement accéléré
-            setTimeout(() => {
-                loadingStatus.textContent = "Chargement des textures...";
-                loadingProgress.style.width = "30%";
-            }, 200);
             setTimeout(() => {
-                loadingStatus.textContent = "Initialisation du moteur physique...";
-                loadingProgress.style.width = "60%";
-            }, 600);
-            setTimeout(() => {
-                loadingStatus.textContent = "Chargement des modèles 3D...";
-                loadingProgress.style.width = "90%";
-            }, 1000);
-            setTimeout(() => {
-                loadingStatus.textContent = "Prêt à démarrer!";
-                loadingProgress.style.width = "100%";
-                loadingText.textContent = "Connexion établie avec les camions IRL!";
-                // Masquer l'écran de chargement et afficher le jeu
                 setTimeout(() => {
                     loadingScreen.style.display = 'none';
                     gameContainer.style.display = 'block';
@@ -588,43 +288,36 @@
                     // Démarrer la boucle de jeu
                     gameLoop();
-                    // Démarrer une mission après un court délai
-                    setTimeout(startRandomMission, 1000);
-                    // Démarrer le système de temps
-                    startTimeSystem();
-                }, 500);
-            }, 1500);
         });
-        // Load location with real images
         function loadLocation(index) {
             const location = locations[index];
-            // Set the panoramic view
             panoView.style.backgroundImage = `url('${location.img}')`;
-            // Update mission text
-            if (currentMission) {
-                missionProgressElement.innerHTML = `
-                    <strong>Localisation actuelle:</strong> ${location.name}<br>
-                    <strong>Description:</strong> ${location.description}<br>
-                    <strong>Mission:</strong> ${currentMission.cargo} vers ${currentMission.destination}<br>
-                    <strong>Distance restante:</strong> ${(100 - missionProgress).toFixed(1)} km
-                `;
-            } else {
-                missionProgressElement.innerHTML = `
-                    <strong>Localisation actuelle:</strong> ${location.name}<br>
-                    <strong>Description:</strong> ${location.description}<br>
-                    <strong>Mission:</strong> Aucune mission active
-                `;
-            }
-            // Update player marker on map
             updatePlayerMarker();
         }
-        // Update player marker position on mini-map
         function updatePlayerMarker() {
             const x = 100 + Math.random() * 50;
             const y = 100 + Math.random() * 50;
@@ -632,119 +325,34 @@
             playerMarker.style.top = `${y}px`;
         }
-        // Start time system
-        function startTimeSystem() {
-            setInterval(() => {
-                gameTime += 1;
-                if (gameTime >= 24 * 60) gameTime = 0;
-                updateTimeDisplay();
-                updateLighting();
-                // Random weather changes
-                if (Math.random() < 0.001) {
-                    toggleRain(!isRaining);
-                }
-            }, 1000);
-        }
-        // Toggle rain effect
-        function toggleRain(enable) {
-            isRaining = enable;
-            const weatherEffects = document.querySelector('.weather-effects');
-            if (enable) {
-                weatherEffects.innerHTML = '';
-                for (let i = 0; i < 100; i++) {
-                    const rainDrop = document.createElement('div');
-                    rainDrop.className = 'rain';
-                    rainDrop.style.left = `${Math.random() * 100}%`;
-                    rainDrop.style.animationDuration = `${0.5 + Math.random() * 0.5}s`;
-                    rainDrop.style.animationDelay = `${Math.random() * 2}s`;
-                    weatherEffects.appendChild(rainDrop);
-                }
-                panoView.style.filter = 'brightness(0.7) contrast(1.1)';
-            } else {
-                weatherEffects.innerHTML = '';
-                panoView.style.filter = headlightsOn ? 'brightness(0.6) contrast(1.2)' : 'brightness(1) contrast(1)';
-            }
-        }
-        // Update time display
-        function updateTimeDisplay() {
-            const hours = Math.floor(gameTime / 60);
-            const minutes = gameTime % 60;
-            timeValue.textContent = `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}`;
-        }
-        // Update lighting based on time of day
-        function updateLighting() {
-            const hour = gameTime / 60;
-            if (hour >= 18 || hour < 6) {
-                panoView.style.filter = 'brightness(0.6) contrast(1.2)';
-                if (!headlightsOn) {
-                    toggleHeadlights(true);
-                }
-            } else {
-                panoView.style.filter = 'brightness(1) contrast(1)';
-                if (headlightsOn) {
-                    toggleHeadlights(false);
-                }
-            }
-        }
-        // Toggle headlights
-        function toggleHeadlights(on) {
-            headlightsOn = on;
-            if (on) {
-                panoView.style.boxShadow = 'inset 0 0 100px 20px rgba(255, 255, 150, 0.2)';
-            } else {
-                panoView.style.boxShadow = 'none';
-            }
-        }
-        // Toggle mirrors
-        function toggleMirrors(show) {
-            mirrorsVisible = show;
-            if (show) {
-                leftMirror.style.display = 'block';
-                rightMirror.style.display = 'block';
-            } else {
-                leftMirror.style.display = 'none';
-                rightMirror.style.display = 'none';
-            }
         }
-        // Main game loop
         function gameLoop() {
             handleControls();
-            checkMissionCompletion();
             updateDashboard();
             updateView();
             requestAnimationFrame(gameLoop);
         }
         function updateView() {
-            if (truckSpeed > 0) {
-                if (Math.random() < truckSpeed / 5000) {
-                    currentLocationIndex = (currentLocationIndex + 1) % locations.length;
-                    loadLocation(currentLocationIndex);
-                }
-            } else if (truckSpeed < 0) {
-                if (Math.random() < -truckSpeed / 5000) {
-                    currentLocationIndex = (currentLocationIndex - 1 + locations.length) % locations.length;
-                    loadLocation(currentLocationIndex);
-                }
-            }
-            if (mirrorsVisible) {
-                leftMirror.querySelector('.mirror-view').style.backgroundColor = `rgba(0,0,0,${0.3 + Math.random()*0.2})`;
-                rightMirror.querySelector('.mirror-view').style.backgroundColor = `rgba(0,0,0,${0.3 + Math.random()*0.2})`;
             }
         }
@@ -753,101 +361,6 @@
             fuelElement.textContent = `${fuel.toFixed(1)}%`;
             fuelBar.style.width = `${fuel}%`;
             distanceElement.textContent = `${distance.toFixed(1)} km`;
-            weightElement.textContent = `${currentWeight} kg`;
-            if (currentMission) {
-                missionProgressElement.innerHTML = `
-                    <strong>Localisation actuelle:</strong> ${locations[currentLocationIndex].name}<br>
-                    <strong>Description:</strong> ${locations[currentLocationIndex].description}<br>
-                    <strong>Mission:</strong> ${currentMission.cargo} vers ${currentMission.destination}<br>
-                    <strong>Distance restante:</strong> ${(100 - missionProgress).toFixed(1)} km
-                `;
-            }
-        }
-        function checkMissionCompletion() {
-            if (!currentMission) return;
-            if (missionProgress >= 100) {
-                completeMission();
-            }
-        }
-        function completeMission() {
-            missionCompleteElement.style.display = 'block';
-            missionCompleteElement.innerHTML = `
-                <h3>Livraison accomplie!</h3>
-                <p>Vous avez livré ${currentWeight} kg de ${currentMission.cargo} à ${currentMission.destination}</p>
-                <p>Temps de livraison: ${formatTime(gameTime)}</p>
-                <p>Localisation: ${locations[currentLocationIndex].name}</p>
-                <button id="nextMissionBtn" class="bg-yellow-500 hover:bg-yellow-600 text-black font-bold py-2 px-4 rounded">
-                    <i class="fas fa-truck-moving mr-2"></i> Nouvelle mission
-                </button>
-            `;
-            currentMission = null;
-            hasCargo = false;
-            currentWeight = 0;
-            document.getElementById('nextMissionBtn').addEventListener('click', function() {
-                missionCompleteElement.style.display = 'none';
-                startRandomMission();
-            });
-        }
-        function formatTime(minutes) {
-            const hrs = Math.floor(minutes / 60);
-            const mins = minutes % 60;
-            return `${hrs}h${mins.toString().padStart(2, '0')}`;
-        }
-        function startRandomMission() {
-            const missions = [
-                { cargo: "Canne à sucre", destination: "Saint-Denis", weight: 10000 },
-                { cargo: "Charbon de bois", destination: "Saint-Pierre", weight: 8000 }
-            ];
-            currentMission = missions[Math.floor(Math.random() * missions.length)];
-            hasCargo = true;
-            currentWeight = currentMission.weight;
-            missionProgress = 0;
-            const destIndex = locations.findIndex(loc => loc.name === currentMission.destination);
-            if (destIndex >= 0) {
-                missionProgress = Math.floor(Math.random() * 20);
-            }
-            missionProgressElement.innerHTML = `
-                <strong>Nouvelle mission:</strong> ${currentWeight} kg de ${currentMission.cargo}<br>
-                <strong>Destination:</strong> ${currentMission.destination}<br>
-                <strong>Distance:</strong> ${(100 - missionProgress).toFixed(1)} km
-            `;
-            showMissionStartPopup();
-        }
-        function showMissionStartPopup() {
-            const popup = document.createElement('div');
-            popup.className = 'mission-popup';
-            popup.innerHTML = `
-                <h3 class="text-xl font-bold text-yellow-400 mb-4">NOUVELLE MISSION</h3>
-                <p class="mb-2"><strong>Chargement:</strong> ${currentWeight} kg de ${currentMission.cargo}</p>
-                <p class="mb-2"><strong>Destination:</strong> ${currentMission.destination}</p>
-                <p class="mb-4"><strong>Distance:</strong> 100 km</p>
-                <button id="startMissionBtn" class="bg-yellow-500 hover:bg-yellow-600 text-black font-bold py-2 px-4 rounded">
-                    <i class="fas fa-check mr-2"></i> Accepter la mission
-                </button>
-            `;
-            document.body.appendChild(popup);
-            popup.style.display = 'block';
-            document.getElementById('startMissionBtn').addEventListener('click', function() {
-                popup.style.display = 'none';
-                setTimeout(() => {
-                    document.body.removeChild(popup);
-                }, 500);
-            });
         }
         // Handle keyboard controls
@@ -855,26 +368,11 @@
         document.addEventListener('keydown', function(e) {
             keys[e.key.toLowerCase()] = true;
-            if (e.key === 'e' || e.key === 'E') {
                 gameContainer.style.display = 'none';
-                document.body.style.overflow = 'auto';
-            }
-            if (e.key === 'm' || e.key === 'M') {
-                document.querySelector('.game-map').style.display =
-                    document.querySelector('.game-map').style.display === 'none' ? 'block' : 'none';
-            }
-            if (e.key === 'a' || e.key === 'A' || e.key === 'e' || e.key === 'E') {
-                toggleMirrors(!mirrorsVisible);
-            }
-            if (e.key === 'l' || e.key === 'L') {
-                toggleHeadlights(!headlightsOn);
-            }
-            if (e.key === 'k' || e.key === 'K') {
-                playHornSound();
             }
         });
@@ -882,66 +380,39 @@
             keys[e.key.toLowerCase()] = false;
         });
-        function playHornSound() {
-            const horn = new Audio('https://assets.mixkit.co/sfx/preview/mixkit-truck-horn-715.mp3');
-            horn.volume = 0.3;
-            horn.play();
-        }
         function handleControls() {
-            if (keys['arrowup'] || keys['z'] || keys['w']) {
                 if (truckSpeed < maxSpeed) {
-                    truckSpeed += acceleration * (1 - currentWeight / 20000);
                 }
             } else if (keys['arrowdown'] || keys['s']) {
-                if (truckSpeed > -maxReverseSpeed) {
-                    truckSpeed -= braking;
                 }
             } else {
                 if (truckSpeed > 0) {
                     truckSpeed = Math.max(0, truckSpeed - deceleration);
-                } else if (truckSpeed < 0) {
-                    truckSpeed = Math.min(0, truckSpeed + deceleration);
                 }
             }
-            if (keys['arrowleft'] || keys['q'] || keys['a']) {
-                const steeringEffect = steeringSpeed * (1 - Math.abs(truckSpeed) / maxSpeed * 0.8);
-                if (truckSpeed > 0) {
-                    currentLocationIndex = (currentLocationIndex - steeringEffect * 10 + locations.length) % locations.length;
-                } else if (truckSpeed < 0) {
-                    currentLocationIndex = (currentLocationIndex + steeringEffect * 10) % locations.length;
-                }
             } else if (keys['arrowright'] || keys['d']) {
-                const steeringEffect = steeringSpeed * (1 - Math.abs(truckSpeed) / maxSpeed * 0.8);
-                if (truckSpeed > 0) {
-                    currentLocationIndex = (currentLocationIndex + steeringEffect * 10) % locations.length;
-                } else if (truckSpeed < 0) {
-                    currentLocationIndex = (currentLocationIndex - steeringEffect * 10 + locations.length) % locations.length;
-                }
             }
             if (truckSpeed > 0) {
                 distance += truckSpeed / 3600;
-                if (currentMission) {
-                    missionProgress = Math.min(100, missionProgress + truckSpeed / 36000);
-                }
             }
-            if (Math.abs(truckSpeed) > 0) {
-                fuel = Math.max(0, fuel - fuelConsumption * Math.abs(truckSpeed) / 500);
-                if (fuel <= 0) {
-                    truckSpeed = 0;
-                }
-            }
-            loadLocation(currentLocationIndex);
         }
         // Exit game button
-        exitGameBtn.addEventListener('click', function() {
             gameContainer.style.display = 'none';
-            document.body.style.overflow = 'auto';
         });
     </script>
 <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=docto41/routier-974" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>

 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Simulateur de Camion Réaliste - La Réunion (Mode Rapide)</title>
     <script src="https://cdn.tailwindcss.com"></script>
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
     <style>
             font-family: 'Poppins', sans-serif;
             background-color: #0f172a;
             color: white;
             margin: 0;
             padding: 0;
         }
             justify-content: center;
             align-items: center;
             z-index: 9999;
+            transition: opacity 0.5s ease;
         }
         .game-container {
             border: 1px solid rgba(255,255,255,0.1);
         }
         .progress-bar {
             width: 100px;
             height: 10px;
             border: 2px solid white;
         }
         #gameCanvas {
             position: absolute;
             top: 0;
             height: 100%;
         }
         .mission-complete {
             position: absolute;
             top: 50%;
             border: 2px solid #f59e0b;
         }
         .start-screen {
             position: fixed;
             top: 0;
             box-shadow: 0 10px 20px rgba(0,0,0,0.3);
         }
+        .fast-load-btn {
+            background: linear-gradient(135deg, #10b981, #059669);
+            margin-top: 15px;
         }
+        .pano-view {
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            background-size: cover;
+            background-position: center;
         }
+        /* Animation de chargement rapide */
+        @keyframes quickFade {
+            0% { opacity: 1; }
+            100% { opacity: 0; }
         }
+        .quick-load {
+            animation: quickFade 0.5s forwards;
         }
     </style>
 </head>
+<body>
+    <!-- Start Screen avec option de chargement rapide -->
     <div class="start-screen">
         <h1 class="text-5xl font-bold text-yellow-400 mb-6">SIMULATEUR DE CAMION RÉUNIONNAIS</h1>
+        <p class="text-xl mb-8 max-w-2xl text-center">Conduisez un véritable camion à travers les paysages spectaculaires de La Réunion</p>
         <button id="startGameBtn" class="start-btn">
             <i class="fas fa-truck mr-2"></i> DÉMARRER LA CONDUITE
         </button>
+        <button id="fastLoadBtn" class="start-btn fast-load-btn">
+            <i class="fas fa-bolt mr-2"></i> MODE RAPIDE (NO LOADING)
+        </button>
     </div>
+    <!-- Loading Screen (masqué par défaut) -->
+    <div class="loading-screen" id="loadingScreen">
+        <h1 class="text-4xl font-bold text-yellow-400 mb-4">Chargement des données GPS</h1>
         <p class="text-lg mb-8" id="loadingStatus">Initialisation du système de conduite...</p>
         <div class="mt-4 text-sm" id="loadingText">Connexion aux serveurs...</div>
     </div>
     <!-- Game Container -->
     <div id="gameContainer" class="game-container">
+        <!-- Panoramic View -->
         <div class="pano-view" id="panoView"></div>
         <!-- Game UI Elements -->
                 <span class="text-sm mb-1">Distance</span>
                 <span id="distanceValue" class="text-xl font-bold">0 km</span>
             </div>
         </div>
         <div class="game-map">
             <div id="playerMarker" class="player-marker"></div>
         </div>
         <div id="missionComplete" class="mission-complete">
             <!-- Will be filled dynamically -->
         </div>
         <button id="exitGameBtn" class="absolute top-4 left-4 bg-red-600 hover:bg-red-700 text-white font-bold py-2 px-4 rounded-full transition-all">
             <i class="fas fa-times mr-2"></i> Quitter
         </button>
     </div>
     <script>
         // Game variables
         let truckSpeed = 0;
         const maxSpeed = 90;
         const acceleration = 0.5;
         const deceleration = 0.3;
         const steeringSpeed = 0.02;
         let fuel = 100;
         const fuelConsumption = 0.05;
         let distance = 0;
         let gameTime = 6 * 60;
+        // Locations with placeholder images
         const locations = [
             {
                 name: "Saint-Denis",
+                img: "https://images.unsplash.com/photo-1584556818175-1a676b2657d3?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80"
             },
             {
                 name: "Saint-Pierre",
+                img: "https://images.unsplash.com/photo-1566438480900-0609be27a4be?ixlib=rb-1.2.1&auto=format&fit=crop&w=1350&q=80"
             }
         ];
         let currentLocationIndex = 0;
         // UI elements
         const fuelElement = document.getElementById('fuelValue');
         const fuelBar = document.getElementById('fuelBar');
         const distanceElement = document.getElementById('distanceValue');
         const panoView = document.getElementById('panoView');
+        const playerMarker = document.getElementById('playerMarker');
         const gameContainer = document.getElementById('gameContainer');
+        const loadingScreen = document.getElementById('loadingScreen');
         const startScreen = document.querySelector('.start-screen');
         const startGameBtn = document.getElementById('startGameBtn');
+        const fastLoadBtn = document.getElementById('fastLoadBtn');
+        // Mode de chargement rapide
+        fastLoadBtn.addEventListener('click', function() {
+            startScreen.classList.add('quick-load');
+            // Simuler un chargement ultra rapide
             setTimeout(() => {
+                startScreen.style.display = 'none';
+                loadingScreen.style.display = 'flex';
+                // Afficher pendant très peu de temps
                 setTimeout(() => {
                     loadingScreen.style.display = 'none';
                     gameContainer.style.display = 'block';
                     // Démarrer la boucle de jeu
                     gameLoop();
+                    // Démarrer une mission
+                    startRandomMission();
+                }, 200);
+            }, 300);
         });
+        // Mode normal
+        startGameBtn.addEventListener('click', function() {
+            startScreen.style.display = 'none';
+            loadingScreen.style.display = 'flex';
+            // Chargement accéléré
+            setTimeout(() => {
+                loadingScreen.style.display = 'none';
+                gameContainer.style.display = 'block';
+                loadLocation(currentLocationIndex);
+                gameLoop();
+                startRandomMission();
+            }, 800);
+        });
+        // Load location
         function loadLocation(index) {
             const location = locations[index];
             panoView.style.backgroundImage = `url('${location.img}')`;
             updatePlayerMarker();
         }
+        // Update player marker
         function updatePlayerMarker() {
             const x = 100 + Math.random() * 50;
             const y = 100 + Math.random() * 50;
             playerMarker.style.top = `${y}px`;
         }
+        // Start random mission
+        function startRandomMission() {
+            // Mission simple pour le mode rapide
+            const missionComplete = document.getElementById('missionComplete');
+            missionComplete.innerHTML = `
+                <h3 class="text-xl font-bold text-yellow-400 mb-4">Mission Rapide</h3>
+                <p class="mb-4">Transportez des marchandises à travers l'île</p>
+                <p class="text-sm">Utilisez les flèches directionnelles pour conduire</p>
+            `;
+            missionComplete.style.display = 'block';
+            setTimeout(() => {
+                missionComplete.style.display = 'none';
+            }, 3000);
         }
+        // Main game loop (simplifié pour le mode rapide)
         function gameLoop() {
             handleControls();
             updateDashboard();
             updateView();
             requestAnimationFrame(gameLoop);
         }
         function updateView() {
+            if (truckSpeed > 0 && Math.random() < truckSpeed / 5000) {
+                currentLocationIndex = (currentLocationIndex + 1) % locations.length;
+                loadLocation(currentLocationIndex);
             }
         }
             fuelElement.textContent = `${fuel.toFixed(1)}%`;
             fuelBar.style.width = `${fuel}%`;
             distanceElement.textContent = `${distance.toFixed(1)} km`;
         }
         // Handle keyboard controls
         document.addEventListener('keydown', function(e) {
             keys[e.key.toLowerCase()] = true;
+            // Touche E pour quitter
+            if (e.key === 'e') {
                 gameContainer.style.display = 'none';
+                startScreen.style.display = 'flex';
+                startScreen.classList.remove('quick-load');
             }
         });
             keys[e.key.toLowerCase()] = false;
         });
         function handleControls() {
+            // Contrôles simplifiés
+            if (keys['arrowup'] || keys['z']) {
                 if (truckSpeed < maxSpeed) {
+                    truckSpeed += acceleration;
                 }
             } else if (keys['arrowdown'] || keys['s']) {
+                if (truckSpeed > 0) {
+                    truckSpeed = Math.max(0, truckSpeed - deceleration * 2);
                 }
             } else {
                 if (truckSpeed > 0) {
                     truckSpeed = Math.max(0, truckSpeed - deceleration);
                 }
             }
+            if (keys['arrowleft'] || keys['q']) {
+                currentLocationIndex = (currentLocationIndex - 0.1 + locations.length) % locations.length;
             } else if (keys['arrowright'] || keys['d']) {
+                currentLocationIndex = (currentLocationIndex + 0.1) % locations.length;
             }
             if (truckSpeed > 0) {
                 distance += truckSpeed / 3600;
+                fuel = Math.max(0, fuel - fuelConsumption * truckSpeed / 500);
             }
         }
         // Exit game button
+        document.getElementById('exitGameBtn').addEventListener('click', function() {
             gameContainer.style.display = 'none';
+            startScreen.style.display = 'flex';
+            startScreen.classList.remove('quick-load');
         });
     </script>
 <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=docto41/routier-974" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>

prompts.txt CHANGED Viewed

@@ -6,4 +6,5 @@ ACTIVE LES IA AFIN ILS FONT FONCTIONNER LES JEUX
 Jappel a mon armée de creer mon jeux de  simulateur de conduite de camion en temp réel sur les route de l'iles de la reunion
 je  conduire avec des vrai camion pas des  jeux , je veux voir les vrai paysage reelement
 DEMARRER LES JEUX
-les chargement des jeux sont trop lent pour declenche le jeu

 Jappel a mon armée de creer mon jeux de  simulateur de conduite de camion en temp réel sur les route de l'iles de la reunion
 je  conduire avec des vrai camion pas des  jeux , je veux voir les vrai paysage reelement
 DEMARRER LES JEUX
+les chargement des jeux sont trop lent pour declenche le jeu
+declencher le jeu en mode rapide