Contexte :
Avoir une carte qui affiche les horaires du RER pour une gare.
Prérequis : rien d’autre qu’un HA et utiliser l’API de Pierre GRIMAUD.
Les grandes étapes :
- Déclaration du sensor
- Déclaration de la carte en markdown avec du template
Résultat attendu :
C’est parti :
Récupération des infos via l’API de Pierre GRIMAUD :
Il faut se rendre sur l’interface de l’API pour générer la requête qui nous intéresse.
Aller à la section Stations, et cliquer sur Try it out, cela va nous permettre d’avoir la bonne syntaxe du nom de l’arrêt/gare/station :
Remplir les champs suivants en fonction de son besoin, ici rers, la ligne A, le sens retour R (il faut tester pour trouver le bon sens) :
Cela affiche la résultat de la requête, on récupère la syntaxe slug du nom de la gare, dans l’exemple La Défense « la+defense+(grande+arche) ».
On va récupérer l’URL qui nous servira à avoir les infos d’horaires, on se rendra à la section Schedules, « Try it out » :
On récupère l’URL dans la partie ** Request URL** :
Allons maintenant sur HA :
Déclaration du sensor :
## API Pierre GRIMAUD
### Doc : https://api-ratp.pierre-grimaud.fr/v4/
### Dashboard : https://p.datadoghq.com/sb/b933ad64d-3d03339edc63b8ba89556675024d64fd
### RER A - La Defense vers l est
- platform: rest
name: makers_rera2est
json_attributes:
- result
- _metadata
value_template: "{{ value_json.result.schedules[0].message }}"
resource: https://api-ratp.pierre- grimaud.fr/v4/schedules/rers/a/la%2Bdefense%2B(grande%2Barche)/R
Note : attention à l’indentation .
Redémarrage de HA …
Code de la carte :
card: null
type: markdown
content: |
<table>
<thead>
<tr>
<th>Code mission</th>
<th>Destination</th>
<th>Horaire</th>
</tr>
</thead>
<tbody>
{% for infos_train in states.sensor.makers_rera2est.attributes.result.schedules -%}
<tr>
<td><mark>{{ infos_train.code -}} </mark></td>
<td>{{ infos_train.destination -}} </td>
<td>{{ infos_train.message -}} </td>
</tr>
{% endfor -%}
</tbody>
</table>
title: RER A - La Défense
card_mod:
style:
ha-markdown:
$:
ha-markdown-element: |
table{
border-collapse: collapse;
margin: 25px 0;
font-size: 0.9em;
font-family: sans-serif;
min-width: 100%;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
border-radius: 15px;
}
td {
padding: 12px 15px;
}
tr {
border-bottom: 1px solid grey;
}
tr:nth-of-type(even) {
background-color: #f3f3f3;
}
tr:last-of-type {
border-bottom: 2px solid red;
}
td:last-of-type {
background-color: #716F6B;
color: #F3C66C;
}
thead > tr > th {
padding: 12px 15px;
color: blue;
font-weight: 700;
}
tr > td {
text-align: center;
}
tr > td > mark {
background: #716F6B;
color: white;
border-radius: 5px;
padding: 5px;
}
td:nth-child(2) {
color: blue;
}
Note :
HA est susceptible à l’indentation
On ne critique pas mon niveau de CSS