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

@@ -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);
                     

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';
     }
 }
 

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');
         	}
         }
     });