Bergamo Trails — Sentieri e Rifugi

Mappa interattiva dei sentieri e rifugi del Club Alpino Italiano — Sezione di Bergamo.
Progressive Web App installabile, accessibile da desktop e dispositivi mobili.

Funzionalità

• Visualizzazione sentieri con classificazione per difficoltà (T, E, EE, EEA)
• Visualizzazione rifugi con dettagli (nome, quota, proprietà)
• Ricerca per numero sentiero CAI, nome rifugio o indirizzo italiano
• Geolocalizzazione dell'utente sulla mappa
• Popup interattivo con informazioni dettagliate al click o alla ricerca
• Highlight delle feature selezionate
• Cambio mappa base (Topografica, Satellite, Stradale)
• Legenda sempre visibile
• Tema chiaro / scuro / sistema con persistenza
• Multilingua (Italiano 🇮🇹 / English 🇬🇧)
• Responsive — pannello laterale su desktop, bottom sheet su mobile
• Installabile come PWA con supporto offline

Tech Stack

Struttura del Progetto

src/
├── App.svelte                         # Layout principale (panel, loading, settings)
├── App.css                            # Stili panel, footer, impostazioni
├── global.css                         # CSS custom properties (tema chiaro/scuro), reset
├── main.js                            # Entry point
│
├── assets/
│   └── i18n/                          # Localizzazione
│       ├── i18n.svelte.js             # Store i18n ($state)
│       ├── it.json                    # Stringhe italiano
│       └── en.json                    # Stringhe inglese
│
├── components/
│   ├── map/
│   │   ├── MapContainer.svelte        # Mappa Esri, GeoJSONLayer da Supabase, click handler
│   │   └── MapContainer.css
│   │
│   ├── panel/
│   │   ├── search/
│   │   │   ├── SearchBar.svelte       # Ricerca sentieri, rifugi, indirizzi
│   │   │   └── SearchBar.css
│   │   ├── locate/
│   │   │   ├── LocateButton.svelte    # Pulsante geolocalizzazione
│   │   │   └── LocateButton.css
│   │   ├── basemap/
│   │   │   ├── BasemapSwitcher.svelte # Selezione mappa base
│   │   │   └── BasemapSwitcher.css
│   │   └── legend/
│   │       ├── Legend.svelte          # Legenda sentieri e rifugi
│   │       └── Legend.css
│   │
│   └── popup/
│       ├── CustomPopup.svelte         # Card popup glassmorphism
│       └── CustomPopup.css
│
└── stores/
    ├── mapStore.svelte.js             # Stato mappa, popup, highlight
    └── themeStore.svelte.js           # Stato tema (light/dark/system)

public/
├── manifest.json                      # PWA manifest
├── service-worker.js                  # Service worker per caching
├── offline.html                       # Pagina offline
├── favicon.png
└── images/icons/                      # Icone PWA (32–512px + maskable)

Getting Started

Prerequisiti

• Node.js ≥ 18

Installazione

git clone <repo-url>
cd Cai-pwa
npm install

Sviluppo

npm run dev

L'app sarà disponibile su http://localhost:5173.

Build di produzione

npm run build
npm run preview   # anteprima locale del build

I file di output vengono generati nella cartella dist/.

Dati

I dati geografici provengono dal servizio cartografico Maggioli S.p.A. per conto di CAI Bergamo e sono serviti tramite Supabase (PostGIS) in formato GeoJSON.

Il geocoding degli indirizzi utilizza il World Geocoding Service di Esri.

Deploy

Il progetto include la configurazione per Netlify (netlify.toml).
Basta collegare il repository a Netlify e il deploy avverrà automaticamente.

[build]
  command = "npm run build"
  publish = "dist"

Licenza

Questo progetto è a uso privato. I dati cartografici sono di proprietà di CAI Bergamo / Maggioli S.p.A.