pre-clean x2

Signed-off-by: boris <boris@borishub.co.uk>

public/js/mapHandler.js

@@ -28,6 +28,63 @@ document.addEventListener('DOMContentLoaded', function() {
     // Get facilities data from sessionStorage
     facilities = JSON.parse(sessionStorage.getItem('facilityData') || '[]');
     
+    // Add location found handler
+    map.on('locationfound', function(e) {
+        try {
+            const { lat, lng } = e.latlng;
+            
+            // Update the map directly with the coordinates
+            updateMapLocation({ lat, lng }, currentRadius);
+            
+            // Remove overlay once we have a valid location
+            const overlay = document.getElementById('mapOverlay');
+            if (overlay) {
+                overlay.classList.add('hidden');
+            }
+            
+            // Get postcode from coordinates
+            fetch(`https://api.postcodes.io/postcodes?lon=${lng}&lat=${lat}`)
+                .then(response => response.json())
+                .then(data => {
+                    if (data.status === 200 && data.result && data.result.length > 0) {
+                        const postcode = data.result[0].postcode;
+                        const postcodeInput = document.getElementById('postcode');
+                        if (postcodeInput) {
+                            postcodeInput.value = postcode;
+                        }
+                    }
+                })
+                .catch(error => {
+                    console.error('Error getting postcode:', error);
+                });
+        } catch (error) {
+            console.error('Error processing location:', error);
+            alert('Error getting your location: ' + error.message);
+        }
+    });
+
+    // Add location error handler
+    map.on('locationerror', function(e) {
+        console.error('Geolocation error:', e);
+        let message = 'Error getting your location: ';
+        
+        switch(e.code) {
+            case 1: // PERMISSION_DENIED
+                message += 'Please enable location access in your browser settings.';
+                break;
+            case 2: // POSITION_UNAVAILABLE
+                message += 'Location information is unavailable.';
+                break;
+            case 3: // TIMEOUT
+                message += 'Location request timed out.';
+                break;
+            default:
+                message += 'An unknown error occurred.';
+        }
+        
+        alert(message);
+    });
+    
     // Set up form handlers
     setupFormHandlers();
     
@@ -35,6 +92,84 @@ document.addEventListener('DOMContentLoaded', function() {
     setupHeaderSearchHandler();
 });
 
+/**
+ * Get postcode from coordinates using postcodes.io API
+ * @param {number} lat - Latitude
+ * @param {number} lng - Longitude
+ * @returns {Promise<string>} The postcode
+ */
+async function getPostcodeFromCoordinates(lat, lng) {
+    try {
+        const response = await fetch(`https://api.postcodes.io/postcodes?lon=${lng}&lat=${lat}`);
+        if (!response.ok) {
+            throw new Error('Could not find postcode for coordinates');
+        }
+        
+        const data = await response.json();
+        if (data.status === 200 && data.result && data.result.length > 0) {
+            return data.result[0].postcode;
+        }
+        
+        throw new Error('No postcode found for coordinates');
+    } catch (error) {
+        console.error('Error getting postcode from coordinates:', error);
+        throw error;
+    }
+}
+
+/**
+ * Handle geolocation success
+ * @param {GeolocationPosition} position - The position object
+ */
+async function handleGeolocationSuccess(position) {
+    try {
+        const { latitude, longitude } = position.coords;
+        
+        // Get postcode from coordinates
+        const postcode = await getPostcodeFromCoordinates(latitude, longitude);
+        
+        // Update the postcode input
+        const postcodeInput = document.getElementById('postcode');
+        if (postcodeInput) {
+            postcodeInput.value = postcode;
+            
+            // Submit the form to update the map
+            const postcodeForm = document.getElementById('postcodeForm');
+            if (postcodeForm) {
+                postcodeForm.dispatchEvent(new Event('submit'));
+            }
+        }
+    } catch (error) {
+        console.error('Error processing geolocation:', error);
+        alert('Error getting your location: ' + error.message);
+    }
+}
+
+/**
+ * Handle geolocation error
+ * @param {GeolocationPositionError} error - The error object
+ */
+function handleGeolocationError(error) {
+    console.error('Geolocation error:', error);
+    let message = 'Error getting your location: ';
+    
+    switch(error.code) {
+        case error.PERMISSION_DENIED:
+            message += 'Please enable location access in your browser settings.';
+            break;
+        case error.POSITION_UNAVAILABLE:
+            message += 'Location information is unavailable.';
+            break;
+        case error.TIMEOUT:
+            message += 'Location request timed out.';
+            break;
+        default:
+            message += 'An unknown error occurred.';
+    }
+    
+    alert(message);
+}
+
 /**
  * Set up form handlers for postcode and radius inputs
  */
@@ -43,6 +178,24 @@ function setupFormHandlers() {
     const radiusSelect = document.getElementById('radius');
     
     if (postcodeForm) {
+        // Add geolocation functionality to the search button
+        const searchButton = postcodeForm.querySelector('button[type="submit"]');
+        if (searchButton) {
+            searchButton.onclick = (e) => {
+                // If the postcode input is empty, use geolocation
+                const postcodeInput = document.getElementById('postcode');
+                if (!postcodeInput.value.trim()) {
+                    e.preventDefault();
+                    map.locate({
+                        setView: false,
+                        enableHighAccuracy: true,
+                        timeout: 10000,
+                        maximumAge: 0
+                    });
+                }
+            };
+        }
+        
         postcodeForm.addEventListener('submit', async function(e) {
             e.preventDefault();
             
@@ -51,12 +204,7 @@ function setupFormHandlers() {
             
             // Show loading state
             const submitButton = this.querySelector('button[type="submit"]');
-            const originalButtonContent = `<i class="bi bi-search me-1"></i>Search...`;
             submitButton.disabled = true;
-            submitButton.innerHTML = `
-                <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
-                <span class="ms-2">Searching...</span>
-            `;
             
             // Validate postcode format first
             if (!isValidPostcode(postcode)) {
@@ -92,7 +240,6 @@ function setupFormHandlers() {
             } finally {
                 // Always reset button state
                 submitButton.disabled = false;
-                submitButton.innerHTML = originalButtonContent;
             }
         });
     }