RoadTripsGenerator/README.md

RoadTripsGenerator est un ensemble de scripts (bash et Python) qui génèrent un site web statique de road-trips : une carte interactive par voyage et par jour, avec les photos, les vidéos, les traces GPS et le récit du voyage.

C'est sans prétention et il faudrait probablement des développements bien plus sérieux pour obtenir un logiciel « presse-bouton », mais si cela peut donner des idées…

Je me suis rendu compte que je passais des heures à monter des films de mes road-trips que finalement je ne regardais pas moi-même : trop longs mais pas assez d'infos, pas interactifs, etc. Je me suis donc demandé sous quelle forme présenter mes voyages pour pouvoir me les remémorer en famille et les partager. C'est comme cela que ce petit projet a vu le jour.

Le principe

Pour chaque voyage, je dispose de photos et de vidéos géolocalisées (photos iPhone, films GoPro), des traces GPS de chaque journée et d'un récit écrit en Markdown.

Les scripts lisent les positions GPS des photos et des vidéos, les placent sur une carte avec la trace du parcours découpée par jour, et construisent des pages web où l'on peut, en parallèle, lire le récit du voyage. Voir par exemple mon road-trip de l'été 2025.

Ils préparent aussi les médias pour le web :

• vidéos : un 720p H.264 lisible partout, chargé par défaut, et un 1080p HEVC proposé à la demande (environ 40 % plus léger que du H.264 à qualité égale) ;
• photos : une version allégée (1600 px, quelques centaines de Ko) affichée dans les diaporamas, le clic ouvrant l'original ;
• aperçus : une image tirée de chaque vidéo, affichée avant la lecture.

Les originaux ne sont jamais modifiés. Le site produit est statique : une simple copie suffit pour le publier ou le transporter.

Les prérequis

Les scripts fonctionnent sous macOS et Linux.

• obligatoirement :
  • Python 3 et les paquets pandas folium gpxpy markdown2 numpy (Jinja2, utilisé pour la mise en page, est installé avec folium)
  • exiftool
• conseillé :
  • ffmpeg (compression des vidéos et images d'aperçu)
  • pillow pour les photos allégées (sous macOS, l'outil sips du système prend le relais s'il est absent)

brew install exiftool ffmpeg
pip3 install pandas folium gpxpy markdown2 numpy pillow

Organisation des dossiers

Le dépôt et le site sont deux dossiers voisins. Un voyage est un dossier qui contient au moins un des sous-dossiers photos, rushs ou routes. Les voyages rangés à la racine du site forment la rubrique « Voyages » de la page d'accueil. Ceux rangés un niveau plus bas, dans un dossier de regroupement (ici Balades), forment une rubrique du nom de ce dossier. L'accueil montre les 2 plus récents de chaque rubrique (ACCUEIL_NB=3 pour en montrer plus), avec un lien vers la liste complète.

CLEROADTRIPS
|-RoadTripsGenerator          ce dépôt
| |-Scripts
|   |-templates               mise en page (HTML, CSS, JavaScript)
|-Road-Trips                  le site
  |-Ete-2025
  | |-photos                  photos (JPEG)
  | |-rushs                   vidéos d'origine (peut être un lien vers un disque externe)
  | |-routes                  une trace GPX par jour, date dans le nom : 2025-08-02.gpx
  | |-voyage.md               le récit
  |-Balades
    |-Aisne-06-2026
      |-...

Dans le récit voyage.md, deux raccourcis évitent les liens écrits en dur (qui ne marcheraient pas à la fois en local et en ligne) :

[Carte du jour](jour:2025-08-02)
[Le col](media:photos/IMG_4831.jpeg)
[La descente](media:videos/GH011272.mp4)

Mode d'emploi

Tout le site, ou quelques voyages

Depuis le dossier du site :

cd Road-Trips
../RoadTripsGenerator/Scripts/genere_site.sh                        # tous les voyages
../RoadTripsGenerator/Scripts/genere_site.sh Balades/Vexin-10-2026  # un seul
SKIP_COMPRESS=1 ../RoadTripsGenerator/Scripts/genere_site.sh        # sans réencoder les vidéos

Pour chaque voyage, genere_site.sh enchaîne les étapes ci-dessous, puis régénère la page d'accueil et la carte globale. Un voyage d'une seule journée (une balade, souvent) n'a pas de carte générale intermédiaire : sa page est directement la carte du jour, avec photos et vidéos. Chaque étape ne refait que ce qui a changé : relancer le script est rapide, sauf quand de nouveaux rushs sont à encoder.

Étape par étape

Depuis le dossier d'un voyage (ici Road-Trips/Balades/Vexin-10-2026, d'où les ../../../) :

Commande	Rôle	Produit
../../../RoadTripsGenerator/Scripts/extraction_infos.sh	positions GPS des photos et vidéos	export_photos.csv, export_videos.csv
../../../RoadTripsGenerator/Scripts/compress.sh	vidéos web (long)	videos/
../../../RoadTripsGenerator/Scripts/prepare_web.py	photos allégées, aperçus	photos_web/, apercus/
../../../RoadTripsGenerator/Scripts/genere_carte.py	pages du voyage	index.html, mini.html, html/, assets/, <voyage>.kml

Puis, depuis le dossier du site, la page d'accueil :

../RoadTripsGenerator/Scripts/genere_index_general.py

Sans compression, il faut faire de videos un lien vers rushs : ln -s rushs videos.

Réglages utiles

• compress.sh : ENCODER=vt (encodeur matériel du Mac, bien plus rapide, un peu moins bon à taille égale), JOBS=N, CRF_HEVC, CRF_H264, FORCE=1 pour tout réencoder. Une vidéo déjà encodée mais illisible (encodage interrompu) est refaite automatiquement.
• prepare_web.py : WEB_PX=1600 (taille des photos), WEB_QUALITE=80, FORCE=1.
• bench_crf.sh : mesure la qualité (VMAF ou SSIM) d'un extrait de rush à plusieurs CRF, pour choisir CRF_HEVC / CRF_H264 sur ses propres images.

Carte globale de l'accueil

Sous les rubriques, l'accueil affiche une grande carte (carte_globale.html, fond OpenStreetMap, sans Google) qui réunit le contenu récupéré de nos cartes Google My Maps et les voyages du site (rubrique « Voyages »), un calque et une couleur par voyage ; un clic sur une trace mène au voyage. Un fichier moto.txt (une ligne) dans un voyage ajoute la moto à son nom dans la légende, par exemple « Ete 2026 (BMW R 1300 GS Adventure) ».

On peut y ajouter des cartes Google My Maps : mettre leurs liens, un par ligne, dans mymaps.txt à la racine du site (les cartes doivent être partagées en « Tous les utilisateurs disposant du lien »). Le KML de chaque carte est récupéré une seule fois dans _mymaps/ ; ensuite la carte ne dépend plus de Google (MYMAPS_MAJ=1 pour le reprendre après avoir modifié la carte Google). On peut aussi déposer à la main des exports .kml ou .kmz dans _mymaps/. Chaque calque My Maps devient un calque de la carte, avec ses couleurs d'origine.

Chaque voyage produit aussi un <voyage>.kml (tout le voyage en une seule trace, avec sa distance et un lien vers sa page, sous les 5 Mo acceptés par My Maps), pour qui voudrait l'importer dans une carte My Maps. Régler l'adresse publique du site avec SITE_URL (par défaut https://roadtrip.ouaibe.fr/) pour des liens corrects.

Modifier l'apparence

Toute la mise en page est dans Scripts/templates/ :

• carte.css, carte.js : style et comportement des pages de voyage (copiés dans assets/ de chaque voyage à la génération) ;
• fragments.html : les morceaux de HTML (popups photo et vidéo, journal, boutons, barre des jours) ;
• fragments_globale.html : les popups et la légende de la carte globale ;
• base_accueil.html, accueil.html, liste.html : la page d'accueil (rubriques Voyages et Balades, les 2 plus récents de chacune) et les listes complètes voyages.html, balades.html.

Après une modification, SKIP_COMPRESS=1 ../RoadTripsGenerator/Scripts/genere_site.sh régénère tout en quelques dizaines de secondes.

Publier

Il suffit de copier le dossier du site. Les sous-dossiers rushs (originaux, très lourds) et les fichiers export_*.csv sont inutiles en ligne ; photos reste nécessaire pour l'ouverture des originaux.

Contribuer

Pour pouvoir faire des push :

git remote set-url origin https://<nom d'utilisateur>@git.ouaibe.fr/Korrigan/RoadTripsGenerator.git

Pour éviter de retaper le mot de passe pendant une heure pour les autres push :

git config --global credential.helper 'cache --timeout=3600'