vent.demoustier.com — Prévision de vent

Site statique des prévisions de vent des spots de wingfoil : journées navigables selon le critère de l'alerte Telegram, graphe à 16 jours, abonnement au canal d'alertes. HTML, CSS et JavaScript natif (modules ES), sans framework ni compilation. Les prévisions viennent d'Open-Meteo, interrogé directement depuis le navigateur (« meilleur modèle », soit pour ces points Météo-France AROME HD sur deux jours, ARPEGE jusqu'à J+5, modèle global au-delà).

Le plan complet est dans PLAN-VENT.md du projet temperatures-maison, dont ce site reprend la logique de alerte_vent.py.

Fichiers

Fichier	Rôle
index.html	Page unique : accueil (montrerAccueil), carte d'un spot (montrerVent), réglages, pied de page avec le bouton Telegram (constante LIEN_TELEGRAM, bouton caché tant qu'elle est vide). Ancres : #cannes (un spot), #cannes/2026-09-18 (journée), #cannes/3j/2026-09-18 (3 jours), suffixe /passe pour les 7 jours passés
vent.js	Composant : montrerAccueil (cartes compactes : vent du moment, prochaine session, miniature) et montrerVent (carte complète : graphe à trois niveaux, légende, critère, tableau des heures, journées retenues, 7 jours passés, partage)
reglages.js	Seuils personnels du navigateur (localStorage), formulaire panneauReglages
vent.css	Styles du composant, tout sous .vent, thème par variables --vent-… (clair/sombre)
graphe.js	Graphe SVG à trois niveaux, porté du serveur temperatures-maison ; tap sur un jour, survol, flèches de direction
meteo.js	Requête Open-Meteo, cache localStorage (30 min, nouvel essai 5 min après un échec)
analyse.js	Journées retenues, secteur, direction moyenne (port de alerte_vent.py), séries horaires pour le graphe
spots.json	Spots (clé, nom, latitude, longitude)
manifest.webmanifest, icones/	App installable (PWA) : nom, couleurs, icônes. icone.svg est la source ; les PNG en dérivent (sips -z 512 512 … ou capture Chrome headless, puis sips -z 192 192 icone-512.png --out icone-192.png)
sw.js	Service worker : squelette du site en cache, réseau d'abord ; jamais les prévisions. Changer VERSION à chaque déploiement. Non enregistré sur localhost
tests/	Tests node --test, fixtures Open-Meteo figées et résultats de référence Python
infra/vent.yaml	Pile CloudFormation : bucket S3 privé, Origin Access Control, politique d'en-têtes (CORS ouvert, sécurité), distribution CloudFront avec le certificat joker *.demoustier.com
deployer.sh	Déploiement : nouvelle VERSION du service worker, aws s3 sync avec Cache-Control, invalidation CloudFront. --infra crée ou met à jour la pile d'abord

Inclure le composant dans une autre page

<link rel="stylesheet" href="https://vent.demoustier.com/vent.css">
<div id="vent"></div>
<script type="module">
  import { montrerVent } from "https://vent.demoustier.com/vent.js";
  montrerVent(document.getElementById("vent"), { spot: "cannes" }); // sans spot : tous
  // options : vue ("tout" | "trois" | "jour"), jour ("AAAA-MM-JJ"), passe (7 jours passés),
  //           critere, spots, lien (fonction qui rend l'URL à partager ; sans elle, pas de bouton)
</script>

montrerAccueil(conteneur, { critere, spots, lienSpot }) monte les cartes compactes de l'accueil.

Le conteneur émet l'événement vent:vue ({spot, vue, jour, passe}) à chaque changement de niveau, pour que la page hôte mette son ancre à jour.

Le conteneur reçoit la classe vent ; redéfinir les variables --vent-… dessus change le thème.

Développer

python3 serveur_dev.py            # puis http://localhost:8090 (sans cache : Safari voit chaque modification)
node --test

Tests de non-régression contre le script Python

Les fichiers tests/previsions-<spot>.json sont des réponses Open-Meteo figées (synthetique est un jeu construit à la main pour les cas limites : bornes 15 et 25 nds, heures 9 et 17, mesures manquantes, passage par le nord). tests/attendu-<spot>.json contient ce que alerte_vent.py en déduit ; analyse.js doit produire exactement la même chose. Pour les régénérer après un changement du script Python ou des fixtures :

tests/generer_attendu.py "../temperatures-maison/alerte_vent.py"

Déploiement (AWS, compte 777938877070, région eu-west-3)

./deployer.sh --infra   # première fois, ou après modification de infra/vent.yaml
./deployer.sh           # déploiements suivants

• Pile CloudFormation vent-demoustier-com : bucket vent.demoustier.com, distribution CloudFront, politique d'en-têtes. Le certificat est le joker *.demoustier.com déjà présent dans ACM (us-east-1), partagé avec cdn.demoustier.com.
• DNS chez Gandi (LiveDNS, zone demoustier.com) : enregistrement vent de type CNAME vers le domaine CloudFront affiché en sortie de pile (DomaineCloudFront), TTL 300. Aucune validation de certificat à faire.
• Cache : page, scripts et styles revalidés à chaque ouverture, 30 jours sur les icônes ; deployer.sh invalide CloudFront à chaque déploiement.
• Le service worker n'est pas actif en local : pour tester une mise à jour de sw.js, déployer puis recharger deux fois la page.