pretix-map 0.1.3__py3-none-any.whl → 0.1.4__py3-none-any.whl

{pretix_map-0.1.3.dist-info → pretix_map-0.1.4.dist-info}/METADATA

@@ -1,6 +1,6 @@
 Metadata-Version: 2.4
 Name: pretix-map
-Version: 0.1.3
+Version: 0.1.4
 Summary: An overview map of the catchment area of previous orders. Measured by postcode
 Author-email: MarkenJaden <jjsch1410@gmail.com>
 Maintainer-email: MarkenJaden <jjsch1410@gmail.com>

{pretix_map-0.1.3.dist-info → pretix_map-0.1.4.dist-info}/RECORD

@@ -1,5 +1,5 @@
-pretix_map-0.1.3.dist-info/licenses/LICENSE,sha256=RhQ89ePNDClBzEROahhwjDrBSEb5Zpx6XewZfGlY4Ss,569
-pretix_mapplugin/__init__.py,sha256=LPNaKUFe5S0lxcbXP4IcviKz02tUsjRUDAJch2OV7IE,23
+pretix_map-0.1.4.dist-info/licenses/LICENSE,sha256=RhQ89ePNDClBzEROahhwjDrBSEb5Zpx6XewZfGlY4Ss,569
+pretix_mapplugin/__init__.py,sha256=wQL21SKqJmZ-NSboyC8tgIR3EmyN1XDjwrN7CAHZpGQ,23
 pretix_mapplugin/apps.py,sha256=AnThwyRw2AAz5f-kmXZ8hm85OmKnlDkRosVoQOBgPzE,830
 pretix_mapplugin/geocoding.py,sha256=lBmwMvmE_cPyOHxWE8H3Se2P-2Eq0UjDTCv9gUs97Fo,4018
 pretix_mapplugin/models.py,sha256=klKrgMu1bmiPBwucTdOAZGWtv4WAEKcnoeqPlZgFR1A,2091
@@ -14,13 +14,13 @@ pretix_mapplugin/locale/de_Informal/LC_MESSAGES/django.mo,sha256=6VVRAqa0ixL-lDA
 pretix_mapplugin/locale/de_Informal/LC_MESSAGES/django.po,sha256=tIFKw9KOdGTjGq8bHV6tquRZe_MOn8TT4MJjdTRhId8,323
 pretix_mapplugin/management/__init__.py,sha256=47DEQpj8HBSa-_TImW-5JCeuQeRkm5NMpJWZG3hSuFU,0
 pretix_mapplugin/management/commands/__init__.py,sha256=47DEQpj8HBSa-_TImW-5JCeuQeRkm5NMpJWZG3hSuFU,0
-pretix_mapplugin/management/commands/geocode_existing_orders.py,sha256=Go9XzBb-eI_ohGDJ4x74MWIQkq2f1rMDLFNo0hp29AM,14127
+pretix_mapplugin/management/commands/geocode_existing_orders.py,sha256=zD8OD7c1ZXPCR1KNOc-gWY8ZlIk_IbMKtagFinG6qf0,14099
 pretix_mapplugin/migrations/0001_initial.py,sha256=KAl1Egxptv1bpregGbsh8wUbr4Yh5A_zazVSAQdmoHM,1020
 pretix_mapplugin/migrations/0002_remove_ordergeocodedata_geocoded_timestamp_and_more.py,sha256=dXmZRdqrND0pxiPRuitlDdg-Q2JBqYG-sRPJxr6Urpk,889
 pretix_mapplugin/migrations/__init__.py,sha256=47DEQpj8HBSa-_TImW-5JCeuQeRkm5NMpJWZG3hSuFU,0
 pretix_mapplugin/static/pretix_mapplugin/.gitkeep,sha256=47DEQpj8HBSa-_TImW-5JCeuQeRkm5NMpJWZG3hSuFU,0
-pretix_mapplugin/static/pretix_mapplugin/css/salesmap.css,sha256=itRfmhct3UAz9rg0i8KYZDNQbN_sNgo8qoa1UPhvQW0,964
-pretix_mapplugin/static/pretix_mapplugin/js/salesmap.js,sha256=4SX0yr0VuJQro-A0Fnl6pTlAfk4X9XhjDxkGq95qUsQ,21272
+pretix_mapplugin/static/pretix_mapplugin/css/salesmap.css,sha256=9t2grYB2nWk90Q8h7XjDrlMw9UvcwYS4lcXM1KFidqI,964
+pretix_mapplugin/static/pretix_mapplugin/js/salesmap.js,sha256=ObXC0E0UOJMIiS5DobuGkTVjNzxDjODs8WgxbKaryWE,18591
 pretix_mapplugin/static/pretix_mapplugin/libs/leaflet-sales-map/MarkerCluster.Default.css,sha256=LWhzWaQGZRsWFrrJxg-6Zn8TT84k0_trtiHBc6qcGpY,1346
 pretix_mapplugin/static/pretix_mapplugin/libs/leaflet-sales-map/MarkerCluster.css,sha256=-bdWuWOXMFkX0v9Cvr3OWClPiYefDQz9GGZP_7xZxdc,886
 pretix_mapplugin/static/pretix_mapplugin/libs/leaflet-sales-map/leaflet-heat.js,sha256=aPb_2lnWKnXsUc1_-aT9-kbtr4CV3c85jH9xC1e5QDI,5168
@@ -39,9 +39,9 @@ pretix_mapplugin/static/pretix_mapplugin/libs/leaflet-sales-map/images/marker-ic
 pretix_mapplugin/static/pretix_mapplugin/libs/leaflet-sales-map/images/marker-icon.png,sha256=V0w6XMqF9BFAhbaEFZbWLwDXyJLHsD8oy_owHesdxDc,1466
 pretix_mapplugin/static/pretix_mapplugin/libs/leaflet-sales-map/images/marker-shadow.png,sha256=Jk9cZAM58ELdcpBiz8BMF_jqDymIK1OOOEjtjxDttNo,618
 pretix_mapplugin/templates/pretix_mapplugin/.gitkeep,sha256=47DEQpj8HBSa-_TImW-5JCeuQeRkm5NMpJWZG3hSuFU,0
-pretix_mapplugin/templates/pretix_mapplugin/map_page.html,sha256=OC1CA5wAcDTC8BOejqO98u0vT0-pnfTgB1Frxk_3uWI,3391
-pretix_map-0.1.3.dist-info/METADATA,sha256=LslAvtHnkh0p5WdCL6vJi5ERPpFNuOXzkvy7ZcRA-jQ,9518
-pretix_map-0.1.3.dist-info/WHEEL,sha256=CmyFI0kx5cdEMTLiONQRbGQwjIoR1aIYB7eCAQ4KPJ0,91
-pretix_map-0.1.3.dist-info/entry_points.txt,sha256=C3NAjeZHoCekafkLMCJynPcABRTK8AUprtQv7sUNDZs,137
-pretix_map-0.1.3.dist-info/top_level.txt,sha256=CAtEnkgA73zE9Gadm5mjt1SpXHBPOS-QWP0dQVoNToE,17
-pretix_map-0.1.3.dist-info/RECORD,,
+pretix_mapplugin/templates/pretix_mapplugin/map_page.html,sha256=wrUFxvtlmBhgADoRqB7sL3QsGETNC_DgYjWboHvDYFw,4827
+pretix_map-0.1.4.dist-info/METADATA,sha256=BkU4P9Kyz6cXKpmquqrTwkVXTd3ng0ygN_kmbP3YBuU,9518
+pretix_map-0.1.4.dist-info/WHEEL,sha256=CmyFI0kx5cdEMTLiONQRbGQwjIoR1aIYB7eCAQ4KPJ0,91
+pretix_map-0.1.4.dist-info/entry_points.txt,sha256=C3NAjeZHoCekafkLMCJynPcABRTK8AUprtQv7sUNDZs,137
+pretix_map-0.1.4.dist-info/top_level.txt,sha256=CAtEnkgA73zE9Gadm5mjt1SpXHBPOS-QWP0dQVoNToE,17
+pretix_map-0.1.4.dist-info/RECORD,,

pretix_mapplugin/__init__.py

@@ -1 +1 @@
-__version__ = "0.1.3"
+__version__ = "0.1.4"

pretix_mapplugin/management/commands/geocode_existing_orders.py

@@ -131,7 +131,7 @@ class Command(BaseCommand):
             with scope(organizer=organizer):
                 # --- Get orders ---
                 orders_qs = Order.objects.filter(status=Order.STATUS_PAID).select_related(
-                    'invoice_address', 'invoice_address__country', 'event'
+                    'invoice_address', 'event'
                 )
 
                 # --- Filter by event ---

pretix_mapplugin/static/pretix_mapplugin/css/salesmap.css

@@ -1,7 +1,7 @@
 .plugin-map-content-wrapper {
     display: flex;
     flex-direction: column;
-    height: calc(100vh - 200px);
+    height: calc(100vh - 100px);
     min-height: 450px;
 }
 

pretix_mapplugin/static/pretix_mapplugin/js/salesmap.js

@@ -2,21 +2,18 @@ document.addEventListener('DOMContentLoaded', function () {
     console.log("Sales Map JS Loaded (Cluster Toggle & Heatmap Opts)");
 
     // --- L.Icon.Default setup ---
-    // Explicitly set the path to Leaflet's default icon images
     try {
         delete L.Icon.Default.prototype._getIconUrl;
         L.Icon.Default.mergeOptions({
-            iconRetinaUrl: '/static/leaflet/images/marker-icon-2x.png', // Path within your collected static files
-            iconUrl: '/static/leaflet/images/marker-icon.png',         // Path within your collected static files
-            shadowUrl: '/static/leaflet/images/marker-shadow.png',     // Path within your collected static files
+            iconRetinaUrl: '/static/leaflet/images/marker-icon-2x.png',
+            iconUrl: '/static/leaflet/images/marker-icon.png',
+            shadowUrl: '/static/leaflet/images/marker-shadow.png',
             iconSize: [25, 41], iconAnchor: [12, 41], popupAnchor: [1, -34],
             tooltipAnchor: [16, -28], shadowSize: [41, 41]
         });
         console.log("Set Leaflet default icon image paths explicitly.");
     } catch (e) {
-        console.error("Error setting Leaflet default icon path:", e);
-        // Fallback might be needed for very old Leaflet versions
-        // L.Icon.Default.imagePath = '/static/leaflet/images/';
+        console.error("Error setting icon path:", e);
     }
     // --- End L.Icon.Default setup ---
 
@@ -24,25 +21,22 @@ document.addEventListener('DOMContentLoaded', function () {
     // --- Configuration ---
     const mapContainerId = 'sales-map-container';
     const statusOverlayId = 'map-status-overlay';
-    const viewToggleButtonId = 'view-toggle-btn'; // Changed from toggleButtonId for clarity
+    const viewToggleButtonId = 'view-toggle-btn';
     const clusterToggleButtonId = 'cluster-toggle-btn';
     const heatmapOptionsPanelId = 'heatmap-options-panel';
-    const initialZoom = 5; // Start more zoomed out
-    const defaultMapView = 'pins'; // Start with pins
+    const initialZoom = 5;
+    const defaultMapView = 'pins';
 
     // --- Globals & State ---
     let map = null;
-    let coordinateData = []; // Stores {lat, lon, tooltip, order_url}
-    let pinLayer = null; // Holds L.markerClusterGroup OR L.layerGroup
+    let coordinateData = [];
+    let pinLayer = null;
     let heatmapLayer = null;
     let currentView = defaultMapView;
     let dataUrl = null;
-    let isClusteringEnabled = true; // Default Cluster State: ON
-    let heatmapOptions = { // Default Heatmap Options (state variable)
-        radius: 25,
-        blur: 15,
-        maxZoom: 18,
-        minOpacity: 0.2 // Example optional parameter
+    let isClusteringEnabled = true;
+    let heatmapOptions = {
+        radius: 25, blur: 15, maxZoom: 18, minOpacity: 0.2
     };
 
     // --- DOM Elements ---
@@ -51,7 +45,6 @@ document.addEventListener('DOMContentLoaded', function () {
     const viewToggleButton = document.getElementById(viewToggleButtonId);
     const clusterToggleButton = document.getElementById(clusterToggleButtonId);
     const heatmapOptionsPanel = document.getElementById(heatmapOptionsPanelId);
-    // Heatmap control elements
     const heatmapRadiusInput = document.getElementById('heatmap-radius');
     const heatmapBlurInput = document.getElementById('heatmap-blur');
     const heatmapMaxZoomInput = document.getElementById('heatmap-maxZoom');
@@ -63,28 +56,39 @@ document.addEventListener('DOMContentLoaded', function () {
     function updateStatus(message, isError = false) {
         if (statusOverlay) {
             const p = statusOverlay.querySelector('p');
-            if (p) { p.textContent = message; p.className = isError ? 'text-danger' : ''; }
-            statusOverlay.style.display = 'flex'; // Show overlay when status updates
-        } else { console.warn("Status overlay element not found."); }
+            if (p) {
+                p.textContent = message;
+                p.className = isError ? 'text-danger' : '';
+            }
+            statusOverlay.style.display = 'flex';
+        } else {
+            console.warn("Status overlay element not found.");
+        }
     }
+
     function hideStatus() {
-        if (statusOverlay) { statusOverlay.style.display = 'none'; } // Hide overlay
+        if (statusOverlay) {
+            statusOverlay.style.display = 'none';
+        }
     }
+
     // --- End Status Helpers ---
 
 
     // --- Initialization ---
     function initializeMap() {
-        // Check required elements
-        if (!mapElement) { console.error(`Map container #${mapContainerId} not found.`); return; }
-        if (!statusOverlay) { console.warn("Status overlay element not found."); }
-        // Check control elements (warn but continue if missing)
+        if (!mapElement) {
+            console.error(`Map container #${mapContainerId} not found.`);
+            return;
+        }
+        if (!statusOverlay) {
+            console.warn("Status overlay element not found.");
+        }
         if (!viewToggleButton) console.warn("View toggle button not found.");
         if (!clusterToggleButton) console.warn("Cluster toggle button not found.");
         if (!heatmapOptionsPanel) console.warn("Heatmap options panel not found.");
         if (!heatmapRadiusInput || !heatmapBlurInput || !heatmapMaxZoomInput) console.warn("Heatmap input elements missing.");
 
-        // Get Data URL
         dataUrl = mapElement.dataset.dataUrl;
         if (!dataUrl) {
             updateStatus("Configuration Error: Missing data source URL.", true);
@@ -93,24 +97,21 @@ document.addEventListener('DOMContentLoaded', function () {
         console.log(`Data URL found: ${dataUrl}`);
         updateStatus("Initializing map...");
 
-        // Create Leaflet Map
         try {
-            map = L.map(mapContainerId).setView([48.85, 2.35], initialZoom); // Centered somewhat on Europe
+            map = L.map(mapContainerId).setView([48.85, 2.35], initialZoom);
             console.log("L.map() called successfully.");
 
-            // Add Base Tile Layer
             L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
-                 attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors',
-                 maxZoom: 18, // Standard max zoom
-            }).on('load', function() { console.log('Base tiles loaded.'); }).addTo(map);
+                attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors',
+                maxZoom: 18,
+            }).on('load', function () {
+                console.log('Base tiles loaded.');
+            }).addTo(map);
             console.log("Tile layer added successfully.");
 
-            // Setup Controls (Event Listeners)
             if (viewToggleButton) setupViewToggleButton();
             if (clusterToggleButton) setupClusterToggleButton();
-            setupHeatmapControls(); // Setup listeners even if panel hidden
-
-            // Fetch data to populate layers
+            setupHeatmapControls();
             fetchDataAndDraw();
 
         } catch (error) {
@@ -125,298 +126,307 @@ document.addEventListener('DOMContentLoaded', function () {
         if (!dataUrl) return;
         console.log("Fetching coordinates from:", dataUrl);
         updateStatus("Loading ticket locations...");
-        // Disable controls while loading
-        if(viewToggleButton) viewToggleButton.disabled = true;
-        if(clusterToggleButton) clusterToggleButton.disabled = true;
+        if (viewToggleButton) viewToggleButton.disabled = true;
+        if (clusterToggleButton) clusterToggleButton.disabled = true;
         disableHeatmapControls(true);
 
         fetch(dataUrl)
             .then(response => {
-                 if (!response.ok) throw new Error(`HTTP error! Status: ${response.status} ${response.statusText}`);
-                 return response.json();
-             })
+                if (!response.ok) throw new Error(`HTTP error! Status: ${response.status} ${response.statusText}`);
+                return response.json();
+            })
             .then(data => {
                 if (data.error) throw new Error(`API Error: ${data.error}`);
                 if (!data || !data.locations || !Array.isArray(data.locations)) {
-                     console.warn("Invalid or empty data format received:", data);
-                     updateStatus("No valid geocoded ticket locations found.", false);
-                     coordinateData = []; hideStatus(); return;
+                    console.warn("Invalid data format:", data);
+                    updateStatus("No valid locations found.", false);
+                    coordinateData = [];
+                    hideStatus();
+                    return;
                 }
                 if (data.locations.length === 0) {
-                    console.log("No coordinate data received (empty list).");
-                    updateStatus("No geocoded ticket locations found for this event.", false);
-                    coordinateData = []; hideStatus(); return;
+                    console.log("No locations received.");
+                    updateStatus("No locations found for event.", false);
+                    coordinateData = [];
+                    hideStatus();
+                    return;
                 }
 
                 coordinateData = data.locations;
                 console.log(`Received ${coordinateData.length} coordinates.`);
 
-                // Enable controls now that we have data
-                if(viewToggleButton) viewToggleButton.disabled = false;
-                // Only enable cluster button if in pins view initially and data exists
-                if(clusterToggleButton) clusterToggleButton.disabled = (currentView !== 'pins');
-                // Only enable heatmap controls if data exists
+                if (viewToggleButton) viewToggleButton.disabled = false;
+                if (clusterToggleButton) clusterToggleButton.disabled = (currentView !== 'pins');
                 disableHeatmapControls(false);
 
-                // Create both layers based on fetched data
                 createAllLayers();
-                // Display the default layer
                 showCurrentView();
-                // Adjust bounds to fit the data
                 adjustMapBounds();
+                hideStatus();
 
-                hideStatus(); // Hide loading overlay
-
-                // Force redraw after a short delay
                 setTimeout(function () {
                     console.log("Forcing map.invalidateSize() after data load...");
                     const container = document.getElementById(mapContainerId);
                     if (map && container && container.offsetWidth > 0) {
-                         map.invalidateSize();
+                        map.invalidateSize();
                     } else {
-                         console.warn(`Skipping invalidateSize. Map: ${!!map}, Container: ${!!container}, OffsetWidth: ${container ? container.offsetWidth : 'N/A'}`);
+                        console.warn(`Skipping invalidateSize. Map: ${!!map}, Container: ${!!container}, OffsetWidth: ${container ? container.offsetWidth : 'N/A'}`);
                     }
                 }, 100);
             })
             .catch(error => {
-                console.error('Error fetching or processing coordinate data:', error);
-                updateStatus(`Error loading map data: ${error.message}. Please try again later.`, true);
-                // Keep controls disabled on error
+                console.error('Error fetching/processing data:', error);
+                updateStatus(`Error loading map data: ${error.message}.`, true);
             });
     }
 
 
     // --- Layer Creation Functions ---
     function createAllLayers() {
-        // Orchestrates creation of both layer types
         createPinLayer();
         createHeatmapLayer();
-        console.log("Map layer instances created/updated.");
+        console.log("Layers created/updated.");
     }
 
     function createPinLayer() {
-        // Creates/recreates the pin layer based on isClusteringEnabled state
-        console.log(`Creating pin layer instance (Clustering: ${isClusteringEnabled})...`);
-        pinLayer = null; // Clear previous instance
-        if (coordinateData.length === 0) { console.warn("No coordinate data for pin layer."); return; }
-
+        console.log(`Creating pin layer (Clustering: ${isClusteringEnabled})...`);
+        pinLayer = null;
+        if (coordinateData.length === 0) {
+            console.warn("No data for pin layer.");
+            return;
+        }
         const markers = [];
         coordinateData.forEach((loc, index) => {
             try {
                 if (loc.lat == null || loc.lon == null || isNaN(loc.lat) || isNaN(loc.lon)) return;
-                const latLng = L.latLng(loc.lat, loc.lon);
-                const marker = L.marker(latLng);
+                const marker = L.marker(L.latLng(loc.lat, loc.lon));
                 if (loc.tooltip) marker.bindTooltip(loc.tooltip);
-                if (loc.order_url) { marker.on('click', () => window.open(loc.order_url, '_blank')); }
+                if (loc.order_url) {
+                    marker.on('click', () => window.open(loc.order_url, '_blank'));
+                }
                 markers.push(marker);
-            } catch (e) { console.error(`Error creating marker ${index}:`, e); }
+            } catch (e) {
+                console.error(`Error creating marker ${index}:`, e);
+            }
         });
-
-        if (markers.length === 0) { console.warn("No valid markers created for pin layer."); return; }
-
+        if (markers.length === 0) {
+            console.warn("No valid markers created.");
+            return;
+        }
         if (isClusteringEnabled) {
-            pinLayer = L.markerClusterGroup(); // Use clustering
+            pinLayer = L.markerClusterGroup();
             pinLayer.addLayers(markers);
-            console.log("Marker cluster group created and populated.");
+            console.log("Marker cluster populated.");
         } else {
-            pinLayer = L.layerGroup(markers); // Use simple layer group
-            console.log("Simple layer group created and populated.");
+            pinLayer = L.layerGroup(markers);
+            console.log("Simple layer group populated.");
         }
     }
 
     function createHeatmapLayer() {
-        // Creates/recreates the heatmap layer using current heatmapOptions
-        console.log("Creating heatmap layer instance...");
-        heatmapLayer = null; // Clear previous instance
-        if (coordinateData.length === 0) { console.warn("No coordinate data for heatmap layer."); return; }
-
+        console.log("Creating heatmap layer...");
+        heatmapLayer = null;
+        if (coordinateData.length === 0) {
+            console.warn("No data for heatmap.");
+            return;
+        }
         try {
             const heatPoints = coordinateData.map(loc => {
                 if (loc.lat != null && loc.lon != null && !isNaN(loc.lat) && !isNaN(loc.lon)) {
-                    return [loc.lat, loc.lon, 1.0]; // Intensity 1.0
-                } return null;
+                    return [loc.lat, loc.lon, 1.0];
+                }
+                return null;
             }).filter(p => p !== null);
-
             if (heatPoints.length > 0) {
-                heatmapLayer = L.heatLayer(heatPoints, heatmapOptions); // Use state variable
-                console.log("Heatmap layer instance created with options:", heatmapOptions);
-            } else { console.warn("No valid points for heatmap layer."); }
-        } catch (e) { console.error("Error creating heatmap layer instance:", e); }
+                heatmapLayer = L.heatLayer(heatPoints, heatmapOptions);
+                console.log("Heatmap created:", heatmapOptions);
+            } else {
+                console.warn("No valid points for heatmap.");
+            }
+        } catch (e) {
+            console.error("Error creating heatmap:", e);
+        }
     }
 
 
     // --- Layer Update Functions ---
     function redrawPinLayer() {
-        // Removes existing pin layer, calls createPinLayer, adds new one if current view is 'pins'
         if (!map) return;
         console.log("Redrawing pin layer...");
-        if (pinLayer && map.hasLayer(pinLayer)) {
-            map.removeLayer(pinLayer);
-            console.log("Removed existing pin layer before redraw.");
-        }
-        pinLayer = null; // Ensure it's cleared
-        createPinLayer(); // Recreate based on current clustering state
+        if (pinLayer && map.hasLayer(pinLayer)) map.removeLayer(pinLayer);
+        pinLayer = null;
+        createPinLayer();
         if (currentView === 'pins' && pinLayer) {
-             console.log("Adding newly created pin layer to map.");
-             map.addLayer(pinLayer);
+            console.log("Adding new pin layer.");
+            map.addLayer(pinLayer);
         }
     }
 
     function updateHeatmap() {
-        // Updates options on the existing heatmap layer if it's present
         if (!map || !heatmapLayer) {
-            console.warn("Cannot update heatmap: map or heatmap layer missing.");
+            console.warn("Cannot update heatmap.");
             return;
         }
-        console.log("Updating heatmap options:", heatmapOptions);
+        console.log("Updating heatmap opts:", heatmapOptions);
         try {
-             // Use Leaflet.heat's setOptions method
-             heatmapLayer.setOptions(heatmapOptions);
-             console.log("Heatmap options updated.");
-        } catch(e) {
-             console.error("Error setting heatmap options:", e);
+            heatmapLayer.setOptions(heatmapOptions);
+            console.log("Heatmap opts updated.");
+        } catch (e) {
+            console.error("Error setting heatmap opts:", e);
         }
     }
 
 
-     // --- Adjust Map Bounds ---
+    // --- Adjust Map Bounds (Corrected) ---
     function adjustMapBounds() {
-        // (Keep the working version from previous steps)
         if (!map || coordinateData.length === 0) return;
         try {
             let bounds = null;
             if (currentView === 'pins' && pinLayer && typeof pinLayer.getBounds === 'function') {
-                 bounds = pinLayer.getBounds();
-                 console.log("Attempting bounds from pin layer.");
+                bounds = pinLayer.getBounds();
+                console.log("Attempting bounds from pin layer.");
             }
+            // Calculate from raw if pin layer bounds unavailable/invalid or if in heatmap view
             if (!bounds || !bounds.isValid()) {
                 console.log("Calculating bounds from raw coordinates.");
-                const latLngs = coordinateData.map(loc => { /* ... filter valid ... */ return [loc.lat, loc.lon]; }).filter(p => p !== null);
+                // Filter valid lat/lon pairs
+                const latLngs = coordinateData
+                    .map(loc => {
+                        if (loc.lat != null && loc.lon != null && !isNaN(loc.lat) && !isNaN(loc.lon)) {
+                            return [loc.lat, loc.lon];
+                        }
+                        return null;
+                    })
+                    .filter(p => p !== null);
                 if (latLngs.length > 0) bounds = L.latLngBounds(latLngs);
             }
+
+            // Apply bounds if valid
             if (bounds && bounds.isValid()) {
-                console.log("Fitting map to bounds..."); map.fitBounds(bounds, { padding: [50, 50] }); console.log("Bounds fitted.");
-            } else if (coordinateData.length === 1) {
-                 console.log("Setting view for single coordinate.");
-                 const singleCoord = coordinateData.find(loc => /* ... valid ... */);
-                 if (singleCoord) map.setView([singleCoord.lat, singleCoord.lon], 13);
-                 else console.warn("Could not find single valid coordinate.");
-            } else { console.warn("Could not determine valid bounds."); }
-        } catch (e) { console.error("Error fitting map bounds:", e); }
-    }
+                console.log("Fitting map to bounds...");
+                map.fitBounds(bounds, {padding: [50, 50]});
+                console.log("Bounds fitted.");
+                // Handle single point case
+            } else if (coordinateData.filter(loc => loc.lat != null && loc.lon != null && !isNaN(loc.lat) && !isNaN(loc.lon)).length === 1) {
+                console.log("Setting view for single coordinate.");
+                // --- Corrected logic to find the single valid coordinate ---
+                const singleCoord = coordinateData.find(loc => loc.lat != null && loc.lon != null && !isNaN(loc.lat) && !isNaN(loc.lon));
+                // --- End Correction ---
+                if (singleCoord) map.setView([singleCoord.lat, singleCoord.lon], 13);
+                else console.warn("Could not find single valid coordinate to set view.");
+                // Removed extra ')' here
+            } else {
+                console.warn("Could not determine valid bounds.");
+            }
+        } catch (e) {
+            console.error("Error fitting map bounds:", e);
+        }
+    } // End adjustMapBounds function
 
 
     // --- Control Setup Functions ---
     function setupViewToggleButton() {
-        updateViewToggleButtonText(); // Initial text
+        updateViewToggleButtonText();
         viewToggleButton.addEventListener('click', () => {
-            console.log("View toggle button clicked!");
+            console.log("View toggle clicked!");
             currentView = (currentView === 'pins') ? 'heatmap' : 'pins';
-            showCurrentView(); // Update map display
-            updateViewToggleButtonText(); // Update button text
-            // Enable/disable cluster button based on view
+            showCurrentView();
+            updateViewToggleButtonText();
             if (clusterToggleButton) clusterToggleButton.disabled = (currentView !== 'pins');
         });
-        console.log("View toggle button listener setup complete.");
+        console.log("View toggle listener setup.");
     }
 
     function setupClusterToggleButton() {
-        updateClusterToggleButtonText(); // Initial text
-        // Start disabled if not in pins view
+        updateClusterToggleButtonText();
         clusterToggleButton.disabled = (currentView !== 'pins');
         clusterToggleButton.addEventListener('click', () => {
-            if (currentView !== 'pins') return; // Safety check
-            console.log("Cluster toggle button clicked!");
-            isClusteringEnabled = !isClusteringEnabled; // Toggle state
-            redrawPinLayer(); // Recreate and potentially re-add the pin layer
-            updateClusterToggleButtonText(); // Update button text
+            if (currentView !== 'pins') return;
+            console.log("Cluster toggle clicked!");
+            isClusteringEnabled = !isClusteringEnabled;
+            redrawPinLayer();
+            updateClusterToggleButtonText();
         });
-        console.log("Cluster toggle button listener setup complete.");
+        console.log("Cluster toggle listener setup.");
     }
 
     function setupHeatmapControls() {
-        // Check if all elements exist before adding listeners
         if (!heatmapRadiusInput || !heatmapBlurInput || !heatmapMaxZoomInput || !radiusValueSpan || !blurValueSpan || !maxZoomValueSpan) {
-            console.error("One or more heatmap control elements not found. Cannot setup listeners.");
+            console.error("Heatmap controls missing.");
             return;
         }
-
-        // Set initial display values from defaults
         radiusValueSpan.textContent = heatmapOptions.radius;
         heatmapRadiusInput.value = heatmapOptions.radius;
         blurValueSpan.textContent = heatmapOptions.blur;
         heatmapBlurInput.value = heatmapOptions.blur;
         maxZoomValueSpan.textContent = heatmapOptions.maxZoom;
         heatmapMaxZoomInput.value = heatmapOptions.maxZoom;
-
-        // Add 'input' listeners for real-time updates
         heatmapRadiusInput.addEventListener('input', (e) => {
-            const value = parseFloat(e.target.value);
-            heatmapOptions.radius = value; // Update state
-            radiusValueSpan.textContent = value; // Update display
-            updateHeatmap(); // Apply change to map
+            const v = parseFloat(e.target.value);
+            heatmapOptions.radius = v;
+            radiusValueSpan.textContent = v;
+            updateHeatmap();
         });
         heatmapBlurInput.addEventListener('input', (e) => {
-             const value = parseFloat(e.target.value);
-            heatmapOptions.blur = value; // Update state
-            blurValueSpan.textContent = value; // Update display
-            updateHeatmap(); // Apply change to map
+            const v = parseFloat(e.target.value);
+            heatmapOptions.blur = v;
+            blurValueSpan.textContent = v;
+            updateHeatmap();
         });
         heatmapMaxZoomInput.addEventListener('input', (e) => {
-             const value = parseInt(e.target.value, 10);
-            heatmapOptions.maxZoom = value; // Update state
-            maxZoomValueSpan.textContent = value; // Update display
-            updateHeatmap(); // Apply change to map
+            const v = parseInt(e.target.value, 10);
+            heatmapOptions.maxZoom = v;
+            maxZoomValueSpan.textContent = v;
+            updateHeatmap();
         });
-        console.log("Heatmap control listeners setup complete.");
+        console.log("Heatmap control listeners setup.");
     }
 
-     function disableHeatmapControls(disabled) {
-         // Helper to enable/disable all heatmap inputs
-         if (heatmapRadiusInput) heatmapRadiusInput.disabled = disabled;
-         if (heatmapBlurInput) heatmapBlurInput.disabled = disabled;
-         if (heatmapMaxZoomInput) heatmapMaxZoomInput.disabled = disabled;
-     }
+    function disableHeatmapControls(disabled) {
+        if (heatmapRadiusInput) heatmapRadiusInput.disabled = disabled;
+        if (heatmapBlurInput) heatmapBlurInput.disabled = disabled;
+        if (heatmapMaxZoomInput) heatmapMaxZoomInput.disabled = disabled;
+    }
 
 
     // --- View Switching Logic ---
     function showCurrentView() {
         console.log(`Showing view: ${currentView}`);
-        if (!map) { console.warn("Map not initialized."); return; }
-
-        // Remove existing layers from map
-        console.log("Removing existing layers (if present)...");
+        if (!map) {
+            console.warn("Map not init.");
+            return;
+        }
+        console.log("Removing layers...");
         if (pinLayer && map.hasLayer(pinLayer)) map.removeLayer(pinLayer);
         if (heatmapLayer && map.hasLayer(heatmapLayer)) map.removeLayer(heatmapLayer);
-
-        // Add the selected layer and show/hide controls
         console.log(`Adding ${currentView} layer...`);
         let layerToAdd = null;
         if (currentView === 'pins') {
             layerToAdd = pinLayer;
-            if(heatmapOptionsPanel) heatmapOptionsPanel.style.display = 'none';
-            if(clusterToggleButton) clusterToggleButton.style.display = 'inline-block'; // Show cluster btn
-            if(clusterToggleButton) clusterToggleButton.disabled = false; // Ensure enabled
-        } else { // Heatmap view
+            if (heatmapOptionsPanel) heatmapOptionsPanel.style.display = 'none';
+            if (clusterToggleButton) {
+                clusterToggleButton.style.display = 'inline-block';
+                clusterToggleButton.disabled = false;
+            }
+        } else {
             layerToAdd = heatmapLayer;
-            if(heatmapOptionsPanel) heatmapOptionsPanel.style.display = 'block';
-            if(clusterToggleButton) clusterToggleButton.style.display = 'none'; // Hide cluster btn
-            if(clusterToggleButton) clusterToggleButton.disabled = true; // Ensure disabled
+            if (heatmapOptionsPanel) heatmapOptionsPanel.style.display = 'block';
+            if (clusterToggleButton) {
+                clusterToggleButton.style.display = 'none';
+                clusterToggleButton.disabled = true;
+            }
         }
-
-        // Add the layer to the map if it exists
         if (layerToAdd) {
             try {
-                 map.addLayer(layerToAdd);
-                 console.log(`Added ${currentView} layer to map.`);
+                map.addLayer(layerToAdd);
+                console.log(`Added ${currentView} layer.`);
             } catch (e) {
-                 console.error(`Error adding ${currentView} layer:`, e);
-                 updateStatus(`Error displaying ${currentView} layer.`, true);
+                console.error(`Error adding ${currentView}:`, e);
+                updateStatus(`Error display ${currentView}.`, true);
             }
         } else {
-            // This happens if createLayer failed (e.g., no valid data)
-            console.warn(`Cannot add layer for view "${currentView}": Layer instance missing.`);
-            updateStatus(`No data available for ${currentView} view.`, false);
+            console.warn(`Layer instance missing for ${currentView}.`);
+            updateStatus(`No data for ${currentView}.`, false);
         }
     }
 
@@ -424,15 +434,15 @@ document.addEventListener('DOMContentLoaded', function () {
     // --- Button Text Update Functions ---
     function updateViewToggleButtonText() {
         if (!viewToggleButton) return;
-        const nextViewText = (currentView === 'pins') ? 'Heatmap' : 'Pin';
-        viewToggleButton.textContent = `Switch to ${nextViewText} View`;
-        console.log(`View Toggle Button text updated to: ${viewToggleButton.textContent}`);
+        const next = (currentView === 'pins') ? 'Heatmap' : 'Pin';
+        viewToggleButton.textContent = `Switch to ${next} View`;
+        console.log(`View Btn text: ${viewToggleButton.textContent}`);
     }
 
     function updateClusterToggleButtonText() {
-         if (!clusterToggleButton) return;
+        if (!clusterToggleButton) return;
         clusterToggleButton.textContent = isClusteringEnabled ? 'Disable Clustering' : 'Enable Clustering';
-        console.log(`Cluster Toggle Button text updated to: ${clusterToggleButton.textContent}`);
+        console.log(`Cluster Btn text: ${clusterToggleButton.textContent}`);
     }
 
 

pretix_mapplugin/templates/pretix_mapplugin/map_page.html

@@ -6,62 +6,82 @@
 {% block title %}{% trans "Ticket Sales Map" %}{% endblock %}
 
 {% block inside %}
-    <h1>{% trans "Ticket Sales Map" %}</h1>
 
-    {# -- Controls Row -- #}
-    <div class="form-inline" style="margin-bottom: 1em;">
-        <div class="form-group" style="margin-right: 10px;">
-            <button id="view-toggle-btn" class="btn btn-default">Switch to Heatmap View</button>
-        </div>
-        {# -- NEW Cluster Toggle Button -- #}
-        <div class="form-group" style="margin-right: 10px;">
-            <button id="cluster-toggle-btn" class="btn btn-default" disabled>Disable Clustering</button>
-        </div>
-        {# -- End Cluster Toggle Button -- #}
-    </div>
-    {# -- End Controls Row -- #}
-
-    {# -- NEW Heatmap Options Panel (Initially hidden for pins view) -- #}
-    <div id="heatmap-options-panel" class="panel panel-default"
-         style="display: none; padding: 15px; margin-bottom: 1em; max-width: 400px;">
-        <h4>{% trans "Heatmap Options" %}</h4>
-        <div class="form-group">
-            <label for="heatmap-radius">Radius: <span id="radius-value">25</span></label>
-            <input type="range" id="heatmap-radius" class="form-control" min="1" max="100" value="25" step="1" disabled>
-        </div>
-        <div class="form-group">
-            <label for="heatmap-blur">Blur: <span id="blur-value">15</span></label>
-            <input type="range" id="heatmap-blur" class="form-control" min="1" max="50" value="15" step="1" disabled>
-        </div>
-        <div class="form-group">
-            <label for="heatmap-maxZoom">Max Zoom: <span id="maxzoom-value">18</span></label>
-            <input type="range" id="heatmap-maxZoom" class="form-control" min="1" max="18" value="18" step="1" disabled>
-        </div>
-        {# Add more options like gradient if desired later #}
-    </div>
-    {# -- End Heatmap Options Panel -- #}
+    <div class="plugin-map-content-wrapper">
 
+        <h1>{% trans "Ticket Sales Map" %}</h1>
+        
+        <div class="form-inline map-controls-row"
+             style="margin-bottom: 1em; display: flex; flex-wrap: wrap; align-items: flex-start; gap: 15px;">
 
-    {# -- Map Area -- #}
-    <div style="position: relative; border: 1px solid #ccc;">
-        <div id="sales-map-container"
-             data-data-url="{% url 'plugins:pretix_mapplugin:event.settings.salesmap.data' organizer=request.organizer.slug event=request.event.slug %}">
+            <div class="map-buttons-group" style="display: flex; flex-wrap: wrap; gap: 10px; align-items: center;">
+                <div class="form-group">
+                    <button id="view-toggle-btn" class="btn btn-default" disabled>Switch to Heatmap View</button>
+                </div>
+                <div class="form-group">
+                    <button id="cluster-toggle-btn" class="btn btn-default" disabled style="display: inline-block;">
+                        Disable Clustering
+                    </button>
+                </div>
+            </div>
+            <div id="heatmap-options-panel" class="panel panel-default"
+                 style="display: none; padding: 10px 15px; border-radius: 4px; min-width: 350px;">
+                <h5 style="margin-top: 0; margin-bottom: 10px;">{% trans "Heatmap Options" %}</h5>
+                <div class="form-horizontal">
+                    <div class="form-group form-group-sm" style="margin-bottom: 5px;">
+                        <label for="heatmap-radius" class="col-sm-3 control-label"
+                               style="padding-top: 5px;">Radius</label>
+                        <div class="col-sm-7">
+                            <input type="range" id="heatmap-radius" class="form-control" min="1" max="100" value="25"
+                                   step="1" disabled>
+                        </div>
+                        <div class="col-sm-2">
+                            <span id="radius-value" class="form-control-static">25</span>
+                        </div>
+                    </div>
+                    <div class="form-group form-group-sm" style="margin-bottom: 5px;">
+                        <label for="heatmap-blur" class="col-sm-3 control-label" style="padding-top: 5px;">Blur</label>
+                        <div class="col-sm-7">
+                            <input type="range" id="heatmap-blur" class="form-control" min="1" max="50" value="15"
+                                   step="1" disabled>
+                        </div>
+                        <div class="col-sm-2">
+                            <span id="blur-value" class="form-control-static">15</span>
+                        </div>
+                    </div>
+                    <div class="form-group form-group-sm" style="margin-bottom: 5px;">
+                        <label for="heatmap-maxZoom" class="col-sm-3 control-label" style="padding-top: 5px;">Max
+                            Zoom</label>
+                        <div class="col-sm-7">
+                            <input type="range" id="heatmap-maxZoom" class="form-control" min="1" max="18" value="18"
+                                   step="1" disabled>
+                        </div>
+                        <div class="col-sm-2">
+                            <span id="maxzoom-value" class="form-control-static">18</span>
+                        </div>
+                    </div>
+                </div>
+            </div>
         </div>
-        <div id="map-status-overlay"
-             style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.8); z-index: 1000; display: flex; justify-content: center; align-items: center; text-align: center;">
-            <p>Loading map data...</p>
+
+        <div class="map-wrapper" style="position: relative; border: 1px solid #ccc; flex-grow: 1; min-height: 0;">
+            <div id="sales-map-container"
+                 data-data-url="{% url 'plugins:pretix_mapplugin:event.settings.salesmap.data' organizer=request.organizer.slug event=request.event.slug %}">
+            </div>
+            <div id="map-status-overlay"
+                 style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.8); z-index: 1000; display: flex; justify-content: center; align-items: center; text-align: center;">
+                <p>Loading map data...</p>
+            </div>
         </div>
     </div>
-    {# -- End Map Area -- #}
-
 
-    {# === Leaflet & Plugins (Keep as is) === #}
-    <script src="{% static 'pretix_mapplugin/libs/leaflet-sales-map/leaflet-heat.js' %}"></script>
+    <script src="
+            {% static 'pretix_mapplugin/libs/leaflet-sales-map/leaflet-heat.js' %}"></script>
     <link rel="stylesheet" href="{% static 'pretix_mapplugin/libs/leaflet-sales-map/MarkerCluster.css' %}"/>
-    <link rel="stylesheet" href="{% static 'pretix_mapplugin/libs/leaflet-sales-map/MarkerCluster.Default.css' %}"/>
+    <link rel="stylesheet"
+          href="{% static 'pretix_mapplugin/libs/leaflet-sales-map/MarkerCluster.Default.css' %}"/>
     <script src="{% static 'pretix_mapplugin/libs/leaflet-sales-map/leaflet.markercluster.js' %}"></script>
 
-    {# === Your JS/CSS (Keep as is) === #}
     <script src="{% static 'pretix_mapplugin/js/salesmap.js' %}"></script>
     <link rel="stylesheet" href="{% static 'pretix_mapplugin/css/salesmap.css' %}"/>