Update templates/combined_summary.html

templates/combined_summary.html

@@ -590,11 +590,11 @@
     <div class="container mx-auto p-6 pt-2">
         <!-- Order Confirmation -->
         <!-- Added a hidden input to store delivery time in seconds -->
-        <!-- Pass delivery_time_seconds from Flask for a NEW order (e.g., 1800 for 30 mins) -->
-        <!-- Pass 0 or None from Flask for a completed/past order -->
-        <input type="hidden" id="deliveryTimeSeconds" value="{{ delivery_time_seconds | default('0') }}">
+        <!-- Pass delivery_time_seconds from Flask ONLY for a NEW order -->
+        <!-- For historical orders, pass 0 or omit the value -->
+        <input type="hidden" id="deliveryTimeSeconds" value="{{ delivery_time_seconds | default('') }}">
 
-        <div id="orderConfirmationSection" class="section bg-white shadow-sm rounded-xl p-6 mb-6 order-confirmed" role="alert">
+        <div id="orderConfirmationSection" class="section bg-white shadow-sm rounded-xl p-6 mb-6 order-confirmed hidden" role="alert">
             <h1 class="text-center text-2xl font-bold text-orange-500">Order Confirmed!</h1>
             <p class="text-center text-gray-600 mt-2">Estimated delivery time: <span id="countdownTimer"></span></p>
         </div>
@@ -1046,38 +1046,50 @@
             const orderConfirmationSection = document.getElementById('orderConfirmationSection');
             const countdownTimerSpan = document.getElementById('countdownTimer');
 
-            let remainingSeconds = parseInt(deliveryTimeInput.value, 10);
+            // Parse the value, default to 0 if not a valid number or empty
+            let remainingSeconds = parseInt(deliveryTimeInput.value, 10) || 0;
 
-            // Check if delivery time is a valid positive number
-            if (!isNaN(remainingSeconds) && remainingSeconds > 0) {
+            // Check if delivery time is a valid positive number provided for a *new* order
+            if (remainingSeconds > 0) {
                 // Show the section and start the timer
                 orderConfirmationSection.classList.remove('hidden');
+                countdownTimerSpan.textContent = formatTime(remainingSeconds); // Display initial time
 
                 const timerInterval = setInterval(() => {
-                    const minutes = Math.floor(remainingSeconds / 60);
-                    const seconds = remainingSeconds % 60;
-
-                    // Pad seconds with a leading zero if less than 10
-                    const paddedSeconds = seconds < 10 ? '0' + seconds : seconds;
-
-                    countdownTimerSpan.textContent = `${minutes}m ${paddedSeconds}s`;
-
                     remainingSeconds--;
 
+                    if (remainingSeconds >= 0) {
+                        countdownTimerSpan.textContent = formatTime(remainingSeconds);
+                    }
+
                     if (remainingSeconds < 0) {
                         clearInterval(timerInterval);
                         countdownTimerSpan.textContent = 'Delivered!';
                         // Keep the section visible to show the "Delivered!" message
+                        // Optional: Hide the section after a short delay if preferred
+                        /*
+                        setTimeout(() => {
+                             orderConfirmationSection.classList.add('hidden');
+                        }, 3000); // Hide after 3 seconds
+                        */
                     }
                 }, 1000);
             } else {
-                 // If no valid positive delivery time (0 or less, or not provided)
-                 // Assume the order is delivered or this is a past order view
-                 countdownTimerSpan.textContent = 'Delivered!';
-                 orderConfirmationSection.classList.remove('hidden'); // Show the "Delivered!" message
+                 // If deliveryTimeSeconds is 0 or less, or not provided
+                 // This means it's not a new order with a pending timer.
+                 // Hide the confirmation section entirely.
+                 orderConfirmationSection.classList.add('hidden');
             }
         }
 
+        // Helper function to format seconds into m:ss
+        function formatTime(seconds) {
+            const minutes = Math.floor(seconds / 60);
+            const remainingSeconds = seconds % 60;
+            const paddedSeconds = remainingSeconds < 10 ? '0' + remainingSeconds : remainingSeconds;
+            return `${minutes}m ${paddedSeconds}s`;
+        }
+
 
         // Close modals on outside click
         document.addEventListener('click', (e) => {