From 4db4822c09156e203d17c59d2436fba66b6a6031 Mon Sep 17 00:00:00 2001
From: Peter Goodhall <peter@magicbug.co.uk>
Date: Sun, 10 Aug 2025 22:06:11 +0100
Subject: [PATCH] Add debug logging and improve map loading UX

Added console logging to map loading callbacks and AJAX requests for better debugging. Reduced failsafe timeout from 35s to 10s to improve user experience. Improved date range display logic to check for element existence before updating.
---
 application/views/interface_assets/footer.php | 13 +++++++++++--
 application/views/map/custom_date.php         | 15 +++++++++------
 assets/js/leaflet/leafembed.js                |  8 +++++++-
 3 files changed, 27 insertions(+), 9 deletions(-)

diff --git a/application/views/interface_assets/footer.php b/application/views/interface_assets/footer.php
index 2b4197e2..948d813e 100644
--- a/application/views/interface_assets/footer.php
+++ b/application/views/interface_assets/footer.php
@@ -795,14 +795,14 @@ if ($this->session->userdata('user_id') != null) {
                 $('.warningOnSubmit').hide();
                 $('#map-success-alert').addClass('d-none');
                 
-                // Failsafe timeout to prevent stuck spinner (35 seconds)
+                // Failsafe timeout to prevent stuck spinner (10 seconds)
                 const failsafeTimeout = setTimeout(function() {
                     console.warn('Map loading timed out - forcing spinner hide');
                     $button.prop('disabled', false);
                     $spinner.addClass('d-none');
                     $('.warningOnSubmit .warningOnSubmit_txt').text('Map loading timed out. Please try again.');
                     $('.warningOnSubmit').show();
-                }, 35000);
+                }, 10000);
                 
                 var customdata = {
                     'dataPost': {
@@ -818,17 +818,23 @@ if ($this->session->userdata('user_id') != null) {
                 
                 // Add success and error callbacks to the customdata
                 customdata.onSuccess = function(plotjson) {
+                    console.log('Map loading success callback called with data:', plotjson);
+                    
                     // Clear the failsafe timeout
                     clearTimeout(failsafeTimeout);
                     
                     try {
                         // Update statistics
                         if (typeof updateMapStatistics === 'function') {
+                            console.log('Calling updateMapStatistics function');
                             updateMapStatistics(plotjson);
+                        } else {
+                            console.warn('updateMapStatistics function not found');
                         }
                         
                         // Show success message
                         const qsoCount = plotjson['markers'] ? plotjson['markers'].length : 0;
+                        console.log('QSO count:', qsoCount);
                         $('#qso-count-display').text(`Loaded ${qsoCount} QSOs successfully`);
                         $('#map-success-alert').removeClass('d-none');
                         
@@ -841,12 +847,15 @@ if ($this->session->userdata('user_id') != null) {
                         $('.warningOnSubmit').show();
                     } finally {
                         // Always re-enable button and hide spinner
+                        console.log('Re-enabling button and hiding spinner');
                         $button.prop('disabled', false);
                         $spinner.addClass('d-none');
                     }
                 };
                 
                 customdata.onError = function() {
+                    console.log('Map loading error callback called');
+                    
                     // Clear the failsafe timeout
                     clearTimeout(failsafeTimeout);
                     
diff --git a/application/views/map/custom_date.php b/application/views/map/custom_date.php
index b0498b24..5791d9f5 100644
--- a/application/views/map/custom_date.php
+++ b/application/views/map/custom_date.php
@@ -327,14 +327,17 @@ function updateDateRangeDisplay() {
     const toDate = document.getElementById('to').value;
     const display = document.getElementById('date-range-display');
     
-    if (fromDate && toDate) {
-        if (fromDate === toDate) {
-            display.textContent = new Date(fromDate).toLocaleDateString();
+    // Only update if the display element exists
+    if (display) {
+        if (fromDate && toDate) {
+            if (fromDate === toDate) {
+                display.textContent = new Date(fromDate).toLocaleDateString();
+            } else {
+                display.textContent = new Date(fromDate).toLocaleDateString() + ' - ' + new Date(toDate).toLocaleDateString();
+            }
         } else {
-            display.textContent = new Date(fromDate).toLocaleDateString() + ' - ' + new Date(toDate).toLocaleDateString();
+            display.textContent = 'Select dates';
         }
-    } else {
-        display.textContent = 'Select dates';
     }
 }
 
diff --git a/assets/js/leaflet/leafembed.js b/assets/js/leaflet/leafembed.js
index 8a459a9e..4d54322f 100644
--- a/assets/js/leaflet/leafembed.js
+++ b/assets/js/leaflet/leafembed.js
@@ -65,6 +65,7 @@ function initplot(_url_qso, options={}) {
 }
 
 function askForPlots(_url_qso, options={}) {
+	console.log('askForPlots called with URL:', _url_qso, 'options:', options);
 	removeMarkers();
 	if (typeof options.dataPost !== "undefined") { _dataPost = options.dataPost; } else { _dataPost = {}; }
     $.ajax({
@@ -74,13 +75,15 @@ function askForPlots(_url_qso, options={}) {
         data: _dataPost,
         timeout: 30000, // 30 second timeout
         error: function(xhr, status, error) { 
-            console.log('[ERROR] ajax askForPlots() function return error:', status, error);
+            console.log('[ERROR] ajax askForPlots() function return error:', status, error, xhr);
             // Call custom error callback if provided
             if (typeof options.onError === 'function') {
+                console.log('Calling custom error callback');
                 options.onError();
             }
         },
         success: function(plotjson) {
+        	console.log('askForPlots AJAX success, plotjson:', plotjson);
         	if ((typeof plotjson['markers'] !== "undefined")&&(plotjson['markers'].length>0)) {
 				for (i=0;i<plotjson['markers'].length;i++) { createPlots(plotjson['markers'][i]); }
         	}
@@ -93,7 +96,10 @@ function askForPlots(_url_qso, options={}) {
         	
         	// Call custom success callback if provided
         	if (typeof options.onSuccess === 'function') {
+        	    console.log('Calling custom success callback');
         	    options.onSuccess(plotjson);
+        	} else {
+        	    console.warn('No custom success callback provided');
         	}
         }
     });