Update public/js/script.js

public/js/script.js

+const map = L.map('map').setView([51.505, -0.09], 13);
+
+// Add OSM base map
+L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
+    maxZoom: 19,
+}).addTo(map);
+
+// Function to load pins from CSV and add them to the map
+function loadPins() {
+    Papa.parse('/data/pins.csv', {
+        download: true,
+        header: true,
+        complete: function(results) {
+            results.data.forEach(pin => {
+                if (pin.lat && pin.lng && pin.name && pin.color) {
+                    const marker = L.marker([parseFloat(pin.lat), parseFloat(pin.lng)], {
+                        title: pin.name,
+                        icon: L.divIcon({
+                            className: 'custom-pin',
+                            html: `<div style="background-color: ${pin.color};" class="pin"></div>`
+                        })
+                    }).addTo(map);
+
+                    marker.bindPopup(`<b>${pin.name}</b>`);
+                }
+            });
+        }
+    });
+}
+
+// Call the function to load pins from the CSV
+loadPins();
+
+// Add click event to the map to add new pins
+map.on('click', function(e) {
+    const name = prompt("Enter pin name:");
+    const color = prompt("Enter pin color (e.g., red, #ff0000):");
+
+    if (name && color) {
+        const newPin = {
+            lat: e.latlng.lat,
+            lng: e.latlng.lng,
+            name: name,
+            color: color
+        };
+
+        // Save the pin to the CSV file
+        addPinToCSV(newPin);
+
+        // Add the new pin to the map
+        const marker = L.marker([newPin.lat, newPin.lng], {
+            title: newPin.name,
+            icon: L.divIcon({
+                className: 'custom-pin',
+                html: `<div style="background-color: ${newPin.color};" class="pin"></div>`
+            })
+        }).addTo(map);
+
+        marker.bindPopup(`<b>${newPin.name}</b>`);
+    }
+});
+
+// Function to add a pin to the CSV (simulated by logging to the console)
+function addPinToCSV(pin) {
+    const csvLine = `${pin.lat},${pin.lng},${pin.name},${pin.color}\n`;
+    console.log("Pin to add to CSV:", csvLine);
+    // Note: This will only log to the console since we cannot write to files on GitHub Pages
+}