Add interactive Base 4 track map with Leaflet.js

- Created new track-map page with aerial image and SVG overlay
- Implemented custom rotated square markers with obstacle numbers
- Added admin edit mode for placing and repositioning markers
- Database migration for track_obstacles table
- Modal form for adding new obstacles (replaces browser alerts)
- Drag-to-reposition functionality with auto-save
- Color-coded markers (green/red/black/split) for difficulty levels
- Clickable popups showing obstacle details
- Added track-map to navigation menu and sitemap
- URL rewrite rule for clean /track-map URL
This commit is contained in:
twotalesanimation
2025-12-12 12:00:20 +02:00
parent 48ee7592b2
commit cce181e2d0
15 changed files with 14213 additions and 107 deletions

View File

@@ -687,6 +687,10 @@ if (countUpcomingTrips() > 0) { ?>
<h2>✨ What's New</h2>
</div>
<div class="updates-modal-body">
<div class="update-item">
<h3><i class="fas fa-images" style="margin-right: 10px; color: #e90000;"></i>Track Map</h3>
<p>Interactive map of the BASE4 4x4 Training Track.</p>
</div>
<div class="update-item">
<h3><i class="fas fa-images" style="margin-right: 10px; color: #e90000;"></i>Photo Gallery</h3>
<p>Explore and share memories from club events and trips. Members can now upload and view photos from past adventures.</p>