Présentation Marleo + [DASHBOARD]

Salut
je reviens sur ma présentation suite à discussion avec @BBE
J’ai fait une longue pause domotique pendant un an environ faute de travaux
Je m’y suis remis réellement il y’a peu

Mon matériel actuel :

  • rasperbery 4Gb avec disque SSD 250Go
  • Clé zigbee SONOFF
  • NS Panel Pro flashé
  • Essentiellement du matériel zigbee, prises, thermomètres, contact sec , détecteur d’ouverture etc…
  • Boitier Tostcorp pour les volets SOMFY, contrôlé en MQTT
  • Détecteur de fumée Nest protect

Contrôle par la voix :

  • Alexa

Nous avons eu les 3, Google Siri et Alexa.
Dans le quotidien nous trouvons Alexa plus fluide et c’est plus facile pour mes filles.
Alexa comprends bien plus facilement, mais ça c’est avis perso/familial

Ancien matériel:

  • Ayant commencé la domotique avec Enki, javais pas mal de composant avec le langage ENOCEAN, je m’en suis séparé pour privilégié le Zigbee
  • Ampoules connecté Wifi, l’horreur je ne sais pas si cela dépend des marques mais j’ai arreté le massacre, cela pouvais fonctionner 3 semaines sans souci et du jour au lendemain les ampoules ce déconnectais

Mon nouveau projet :

Si on fait abstraction d’Alexa, tout le contrôle de ma maison ce fait sur le NSPanel Pro
Bien que c’est un petit écran sympa, il y’a tout de même un souci de performance.
La connexion en 2.4Ghz n’aide pas et les dashboards qui comporte des cartes custom n’aide pas non plus.
Je suis parti dans l’idée de tout virer et de passer sur du 100% tuiles (ou presque)

Pour l’instant j’avoue que c’est un bon choix j’ai énormément gagner en fluidité.
Et il faut le dire je m’amuse bien avec les templates, c’est la première fois que je comprends ce que je fait :sweat_smile:

Mon dashboard actuel :

Si on ne compte pas la vue camera, le plan et le QRcode wifi, le dashboard est fait uniquement en tuiles et en mushroom template badge.

Pourquoi le mushroom template bage, car il est plus facile a redimensionner.
Sur ce coté la la tuiles est limitée.

A réaliser :

  • La section garage
  • La card pour la télé
  • les sous vue
  • La room card ? a voir je ne sais pas encore, ce sera peut etre utilie pour mon dashboard téléphone.
  • je ferais un détail complet de mes cards au fur et à mesures
  • L’intégration de ma machine a laver (en attente de Samsung, HA travail dessus)
  • Lave vaisselle
  • Lave linge
  • Voiture

En cours de test:
Home Assistant cloud

Je ferais évoluer ce post au fur et à mesure et si je trouve des choses intéressantes.

A+

EDIT: je n’utilise que tres peu les icones, juste pour avoir un peu de personnalisation je les ai remplacé par des images ou emoji
J’ai trouvé les images ici :

3 « J'aime »

Mes cartes Météo

Pour construire mes cartes je suis passé par du template

Non obligatoire mais pour l’utilisation de template, je préconise d’avoir un template.yaml afin de ne pas encombrer le configuration.yaml

De ce que MOI j’ai compris (c’est pas en prendre au pieds de la lettre),
Il y’a plusieurs type de template, qui est en gros une matrice qu’on va configuré pour une analyse.
Pour la météo on va utiliser le Trigger (déclencheur)
On va ensuite le programmer pour qu’il check les données à intervalle régulier
Dans mon cas 1h que ce soit pour la météo heure/heure ou jour/jour

Ensuite on va lui demander de checker la meteo « donne moi les conditions météo »
On va utiliser « weather_get_forecast »

Aller dans Outils de développement > Action > Météo: Obtenir les prévisions
Vous verrez tout ce qu’on peu obtenir

:sun_behind_small_cloud: METEO PAR HEURE :sun_behind_small_cloud:

Template Meteo heure
- trigger:
  - platform: time_pattern
    hours: /1
  - platform: homeassistant
    event: start
  action:
  - service: weather.get_forecasts
    target:
      entity_id: weather.XXXX
    data:
      type: hourly
    response_variable: hourly
  sensor:      
  - name: meteo XXXX heure
    unique_id: meteo_XXXX_heure
    state: "Something"
    picture: >
        {% set weather = hourly['weather.XXXX'].forecast[0].condition %}
        {% if is_state('sun.sun', 'above_horizon') %}
        {{ '/local/icones/meteoV2/' + weather + '.png' }}
        {% else %}
        {{ '/local/icones/meteoV2/' + weather + '_night.png' }}
        {% endif %}
    attributes:
      datetime: "{{ hourly['weather.XXXX'].forecast[0].datetime }}"
      condition: "{{ hourly['weather.XXXX'].forecast[0].condition | replace('clear', 'Ciel dégagé') | replace('clear-night', 'Nuit clair') | replace('cloudy', 'Nuageux') | replace('rainy', 'Pluie') | replace('hail', 'Risque de grèle') | replace('snowy', 'neige') | replace('windy', 'Venteux') | replace('fog', 'Brouillard') | replace('partlycloudy', 'Eclaircies') | replace('pouring', 'Pluie forte') | replace('lightning', 'Orages') | replace('sunny', 'Ensoleillé') | replace('windy-variant', 'Venteux variant') | replace('Exceptional', 'Exceptionnel') | replace('snowy-rainy', 'Pluie verglaçante') | replace('lightning-rainy', 'Pluie orageuse')}}"
      temperature: "🌡️{{hourly['weather.XXXX'].forecast[0].temperature }}°"
      humidity: "💧{{ hourly['weather.XXXX'].forecast[0].humidity }}%"
      precipitation: "☂️{{hourly['weather.XXXX'].forecast[0].precipitation }}mm"      
      precipitation_percent: "{{ hourly['weather.XXXX'].forecast[0].precipitation.probability }}"  
      wind_speed: "💨{{hourly['weather.XXXX'].forecast[0].wind_speed }}km/h"

image

Code de la carte
type: tile
show_entity_picture: true
icon: mdi:account
color: green
entity: sensor.meteo_precigne_heure
name: Météo
hide_state: false
state_content:
  - temperature
  - humidity
  - precipitation
  - wind_speed
vertical: false
grid_options:
  columns: 12
  rows: 1

:sun_behind_small_cloud: METEO PAR JOUR :sun_behind_small_cloud:

On va donc utiliser le même principe pour la météo jour/jour
Puis transformer le hourly en daily

A savoir :
Forecast[0] : Jour J
Forecast[1] : J+1
Forecast[2] : J+2
Forecast[3] : J+3
Forecast[4] : J+4
etc…

Template météo jour
- trigger:
  - platform: time_pattern
    hours: /1
  - platform: homeassistant
    event: start
  action:
  - service: weather.get_forecasts
    target:
      entity_id: weather.XXXX
    data:
      type: daily
    response_variable: daily
  sensor:
  - name: meteo XXXX jour 0
    unique_id: meteo_XXXX_jour_0
    state: "Something"
    picture: >
        {% set weather = daily['weather.XXXX'].forecast[0].condition %}
        {{ '/local/icones/meteoV2/' + weather + '.png' }}
    attributes:
      datetime: >
        {{ daily['weather.XXXX'].forecast[0].datetime | as_timestamp | timestamp_custom('%d/%m', true) }}
      condition: "{{ daily['weather.XXXX'].forecast[0].condition | replace('clear', 'Ciel dégagé') | replace('clear-night', 'Nuit clair') | replace('cloudy', 'Nuageux') | replace('rainy', 'Pluie') | replace('hail', 'Risque de grèle') | replace('snowy', 'neige') | replace('windy', 'Venteux') | replace('fog', 'Brouillard') | replace('partlycloudy', 'Eclaircies') | replace('pouring', 'Pluie forte') | replace('lightning', 'Orages') | replace('sunny', 'Ensoleillé') | replace('windy-variant', 'Venteux variant') | replace('Exceptional', 'Exceptionnel') | replace('snowy-rainy', 'Pluie verglaçante') | replace('lightning-rainy', 'Pluie orageuse') }}"
      temperature: "🔺{{ daily['weather.XXXX'].forecast[0].temperature }}°"
      humidity: "💧{{ daily['weather.XXXX'].forecast[0].humidity }}%"
      templow: "🔻{{ daily['weather.XXXX'].forecast[0].templow }}°"
      precipitation: "☂️{{ daily['weather.XXXX'].forecast[0].precipitation }}mm"       
      jour: "{{ daily['weather.XXXX'].forecast[0].datetime | as_timestamp | timestamp_custom('%a', true) | replace('Mon', 'Lundi') | replace('Tue', 'Mardi') | replace('Wed', 'Mercredi') | replace('Thu', 'Jeudi') | replace('Fri', 'Vendredi') | replace('Sat', 'Samedi') | replace('Sun', 'Dimanche') }}"


  - name: meteo XXXX jour 1
    unique_id: meteo_XXXX_jour_1
    state: "Something"
    picture: >
        {% set weather = daily['weather.XXXX'].forecast[1].condition %}
        {{ '/local/icones/meteoV2/' + weather + '.png' }}
    attributes:
      datetime: >
        {{ daily['weather.XXXX'].forecast[1].datetime | as_timestamp | timestamp_custom('%d/%m', true) }}
      condition: "{{ daily['weather.XXXX'].forecast[1].condition | replace('clear', 'Ciel dégagé') | replace('clear-night', 'Nuit clair') | replace('cloudy', 'Nuageux') | replace('rainy', 'Pluie') | replace('hail', 'Risque de grèle') | replace('snowy', 'neige') | replace('windy', 'Venteux') | replace('fog', 'Brouillard') | replace('partlycloudy', 'Eclaircies') | replace('pouring', 'Pluie forte') | replace('lightning', 'Orages') | replace('sunny', 'Ensoleillé') | replace('windy-variant', 'Venteux variant') | replace('Exceptional', 'Exceptionnel') | replace('snowy-rainy', 'Pluie verglaçante') | replace('lightning-rainy', 'Pluie orageuse')}}"
      temperature: "🔺{{ daily['weather.XXXX'].forecast[1].temperature }}°"
      humidity: "💧{{ daily['weather.XXXX'].forecast[1].humidity }}%"
      templow: "🔻{{ daily['weather.XXXX'].forecast[1].templow }}°"
      precipitation: "☂️{{ daily['weather.XXXX'].forecast[1].precipitation }}mm"


  - name: "{{ daily['weather.XXXX'].forecast[2].datetime | as_timestamp | timestamp_custom('%a', true) | replace('Mon', 'Lundi') | replace('Tue', 'Mardi') | replace('Wed', 'Mercredi') | replace('Thu', 'Jeudi') | replace('Fri', 'Vendredi') | replace('Sat', 'Samedi') | replace('Sun', 'Dimanche') }}"
    unique_id: meteo_XXXX_jour_2
    state: "Something"
    picture: >
        {% set weather = daily['weather.XXXX'].forecast[2].condition %}
        {{ '/local/icones/meteoV2/' + weather + '.png' }}
    attributes:
      datetime: >
        {{ daily['weather.XXXX'].forecast[2].datetime | as_timestamp | timestamp_custom('%d/%m', true) }}
      condition: "{{ daily['weather.XXXX'].forecast[2].condition | replace('clear', 'Ciel dégagé') | replace('clear-night', 'Nuit clair') | replace('cloudy', 'Nuageux') | replace('rainy', 'Pluie') | replace('hail', 'Risque de grèle') | replace('snowy', 'neige') | replace('windy', 'Venteux') | replace('fog', 'Brouillard') | replace('partlycloudy', 'Eclaircies') | replace('pouring', 'Pluie forte') | replace('lightning', 'Orages') | replace('sunny', 'Ensoleillé') | replace('windy-variant', 'Venteux variant') | replace('Exceptional', 'Exceptionnel') | replace('snowy-rainy', 'Pluie verglaçante') | replace('lightning-rainy', 'Pluie orageuse')}}"
      temperature: "🔺{{ daily['weather.XXXX'].forecast[2].temperature }}°"
      humidity: "💧{{ daily['weather.XXXX'].forecast[2].humidity }}%"
      templow: "🔻{{ daily['weather.XXXX'].forecast[2].templow }}°"
      precipitation: "☂️{{ daily['weather.XXXX'].forecast[2].precipitation }}mm"    


  - name: "{{ daily['weather.XXXX'].forecast[3].datetime | as_timestamp | timestamp_custom('%a', true) | replace('Mon', 'Lundi') | replace('Tue', 'Mardi') | replace('Wed', 'Mercredi') | replace('Thu', 'Jeudi') | replace('Fri', 'Vendredi') | replace('Sat', 'Samedi') | replace('Sun', 'Dimanche') }}"
    unique_id: meteo_XXXX_jour_3
    state: "Something"
    picture: >
        {% set weather = daily['weather.XXXX'].forecast[3].condition %}
        {{ '/local/icones/meteoV2/' + weather + '.png' }}
    attributes:
      datetime: >
        {{ daily['weather.XXXX'].forecast[3].datetime | as_timestamp | timestamp_custom('%d/%m', true) }}
      condition: "{{ daily['weather.XXXX'].forecast[3].condition | replace('clear', 'Ciel dégagé') | replace('clear-night', 'Nuit clair') | replace('cloudy', 'Nuageux') | replace('rainy', 'Pluie') | replace('hail', 'Risque de grèle') | replace('snowy', 'neige') | replace('windy', 'Venteux') | replace('fog', 'Brouillard') | replace('partlycloudy', 'Eclaircies') | replace('pouring', 'Pluie forte') | replace('lightning', 'Orages') | replace('sunny', 'Ensoleillé') | replace('windy-variant', 'Venteux variant') | replace('Exceptional', 'Exceptionnel') | replace('snowy-rainy', 'Pluie verglaçante') | replace('lightning-rainy', 'Pluie orageuse')}}"
      temperature: "🔺{{ daily['weather.XXXX'].forecast[3].temperature }}°"
      humidity: "💧{{ daily['weather.XXXX'].forecast[3].humidity }}%"
      templow: "🔻{{ daily['weather.XXXX'].forecast[3].templow }}°"
      precipitation: "☂️{{ daily['weather.XXXX'].forecast[3].precipitation }}mm"      

 
  - name: "{{ daily['weather.XXXX'].forecast[4].datetime | as_timestamp | timestamp_custom('%a', true) | replace('Mon', 'Lundi') | replace('Tue', 'Mardi') | replace('Wed', 'Mercredi') | replace('Thu', 'Jeudi') | replace('Fri', 'Vendredi') | replace('Sat', 'Samedi') | replace('Sun', 'Dimanche') }}"
    unique_id: meteo_XXXX_jour_4
    state: "Something"
    picture: >
        {% set weather = daily['weather.XXXX'].forecast[4].condition %}
        {{ '/local/icones/meteoV2/' + weather + '.png' }}
    attributes:
      datetime: >
        {{ daily['weather.XXXX'].forecast[4].datetime | as_timestamp | timestamp_custom('%d/%m', true) }}
      condition: "{{ daily['weather.XXXX'].forecast[4].condition | replace('clear', 'Ciel dégagé') | replace('clear-night', 'Nuit clair') | replace('cloudy', 'Nuageux') | replace('rainy', 'Pluie') | replace('hail', 'Risque de grèle') | replace('snowy', 'neige') | replace('windy', 'Venteux') | replace('fog', 'Brouillard') | replace('partlycloudy', 'Eclaircies') | replace('pouring', 'Pluie forte') | replace('lightning', 'Orages') | replace('sunny', 'Ensoleillé') | replace('windy-variant', 'Venteux variant') | replace('Exceptional', 'Exceptionnel') | replace('snowy-rainy', 'Pluie verglaçante') | replace('lightning-rainy', 'Pluie orageuse')}}"
      temperature: "🔺{{ daily['weather.XXXX'].forecast[4].temperature }}°"
      humidity: "💧{{ daily['weather.XXXX'].forecast[4].humidity }}%"
      templow: "🔻{{ daily['weather.XXXX'].forecast[4].templow }}°"
      precipitation: "☂️{{ daily['weather.XXXX'].forecast[4].precipitation }}mm"

Code de la section prévisions
type: grid
cards:
  - type: heading
    heading: Prévision météo
    heading_style: title
    icon: mdi:weather-partly-snowy-rainy
  - type: tile
    show_entity_picture: true
    icon: mdi:account
    color: green
    entity: sensor.meteo_XXXX_jour_0
    hide_state: false
    vertical: false
    grid_options:
      columns: 12
      rows: 1
    state_content:
      - datetime
      - templow
      - temperature
      - humidity
      - precipitation
    name: Aujourd'hui
  - type: tile
    show_entity_picture: true
    icon: mdi:account
    color: green
    entity: sensor.meteo_XXXX_jour_1
    name: Demain
    hide_state: false
    vertical: false
    grid_options:
      columns: 12
      rows: 1
    state_content:
      - datetime
      - templow
      - temperature
      - humidity
      - precipitation
  - type: tile
    show_entity_picture: true
    icon: mdi:account
    color: green
    entity: sensor.meteo_XXXX_jour_2
    hide_state: false
    vertical: false
    grid_options:
      columns: 12
      rows: 1
    state_content:
      - datetime
      - templow
      - temperature
      - humidity
      - precipitation
  - type: tile
    show_entity_picture: true
    icon: mdi:account
    color: green
    entity: sensor.meteo_XXXX_jour_3
    hide_state: false
    vertical: false
    grid_options:
      columns: 12
      rows: 1
    state_content:
      - datetime
      - templow
      - temperature
      - humidity
      - precipitation
  - type: tile
    show_entity_picture: true
    icon: mdi:account
    color: green
    entity: sensor.meteo_XXXX_jour_4
    hide_state: false
    vertical: false
    grid_options:
      columns: 12
      rows: 1
    state_content:
      - datetime
      - templow
      - temperature
      - humidity
      - precipitation

Reste plus que la personnalisation des images météo, si vous voulez rester sur les icones std vous pouvez supprimer la ligne picture dans tout les templates

    picture: >
        {% set weather = hourly['weather.XXXX'].forecast[0].condition %}
        {% if is_state('sun.sun', 'above_horizon') %}
        {{ '/local/icones/meteoV2/' + weather + '.png' }}
        {% else %}
        {{ '/local/icones/meteoV2/' + weather + '_night.png' }}
        {% endif %}

Pour les images, celle ci sera automatiquement mis à jour en fonction des conditions (pour rappel les conditions sont checké toutes les heures)

Toutes vos images devront etres strictement identique au condition de home assistant visible ici :

Chaque nom pourra être doubler avec « _night.png », utile pour la météo heure/heure
Exemple :
clear.png
clear_night.png

A savoir, que je n’ai rien envinté j’ai juste piocher à droite à gauche pour faire ce que je souhaitais, la seule petite « amélioration » est pour les jours des prévisions qui se mettent à jour automatiquement grace à une variable

- name: "{{ daily['weather.XXXX'].forecast[2].datetime | as_timestamp | timestamp_custom('%a', true) | replace('Mon', 'Lundi') | replace('Tue', 'Mardi') | replace('Wed', 'Mercredi') | replace('Thu', 'Jeudi') | replace('Fri', 'Vendredi') | replace('Sat', 'Samedi') | replace('Sun', 'Dimanche') }}"

Si vous mettez en place ce genre de template cela peut mettre un certain temps à synchroniser.
C’est normal, patience :slight_smile:

Merci @jerome6994 pour son aide

2 « J'aime »

Cartes calendrier

:hammer_and_wrench: Configuration :hammer_and_wrench:

j’utilise CalDav pour le calendrier Iphone intégré dans HA
code récupéré sur le forum

Code Caldav
calendar:
  - platform: caldav
    username: adresse mail
    password: XXXXXXX
    url: https://caldav.icloud.com
    #calendars:
    #   - 'Personnel'
    days: 30
    custom_calendars:
      - name: "Anniversaire"
        calendar: "Personnel"
        search: "Anniversaire.+"
      - name: "Personnel"
        calendar: "Personnel"
        search: ".*"
      - name: "Travail"
        calendar: "Travail"
        search: ".*"

Toujours dans le template,
j’ai créer un simple sensor qui vient récupérer toutes les infos que j’ai besoin.
Aller dans Outils de développement > Action > Calendrier: Obtenir des événements
Vous verrez tout ce qu’on peu obtenir

Exemple de sensor

- sensor:                
    - name: "📌 {{ (state_attr('calendar.personnel_personnel', 'message')) }} "
      unique_id: Personnel
      state: "📌 {{ (state_attr('calendar.personnel_personnel', 'message')) }} "  
      picture: "{{ '/local/icones/entity/calendrier_maison.png' }}"       
      attributes:
        date_debut: "📅 {{ (state_attr('calendar.personnel_personnel', 'start_time')) | as_timestamp | timestamp_custom('%d/%m %H:%M', true) }} "
        date_fin: "📅 {{ (state_attr('calendar.personnel_personnel', 'end_time')) | as_timestamp | timestamp_custom('%d/%m %H:%M', true) }} "
        delta: >-
          ⌛ {% set delta = state_attr('calendar.personnel_personnel', 'start_time') | as_datetime | as_local - today_at() %}
          {{ {0: "Aujourd'hui", 1: "Demain"}.get(delta.days, 'Dans ' ~ delta.days ~  ' Jours') }}
        lieu: "📍 {{ (state_attr('calendar.personnel_personnel', 'location')) }} "

Exemple a multiplier selon le besoin

Ici j’ai paramétrer le nom pour qu’il prenne en compte le « message » (evenement)

2 « J'aime »

:microphone: Enceinte :microphone:

Faut bien se le dire la carte tuile et la partie multimedia c’est pas son dada.
Mais j’ai quand même tenté un truc et ça fait le job

J’ai une echo_dot (Alexa) coupler à Deezer, j’imagine que cela fonctionnerait avec d’autres appareils et d’autres application de musique.
Je vais me servir d’Alexa, je vais lui « parler »

On repars sur du template :slight_smile:

Direction en premier lieu les entités et leurs états
Afin de regarder le nom des « capteurs » que je vais utiliser

A intégrer dans le template.yaml

le sensor
- sensor:
    - name: >-
        {% if is_state('media_player.echo_dot_marion', 'playing') %}
        🎤{{ (state_attr('media_player.echo_dot_marion', 'media_artist')) }}
        {% elif is_state('media_player.echo_dot_marion', 'paused') %}
        🎤{{(state_attr('media_player.echo_dot_marion', 'media_artist')) }}
        {% else %}
        Enceinte salon
        {% endif %}
      unique_id: Enceinte_salon
      state: "{{ (states('media_player.echo_dot_marion')) | replace('playing', 'Lecture en cours') | replace('paused', 'en pause') | replace('standby', 'Eteinte')}}"
      picture: >-
        {% if is_state('media_player.echo_dot_marion', 'playing') %}
        {{ (state_attr('media_player.echo_dot_marion', 'entity_picture')) }}
        {% elif is_state('media_player.echo_dot_marion', 'paused') %}
        {{ (state_attr('media_player.echo_dot_marion', 'entity_picture')) }}
        {% else %}
        {{ '/local/icones/entity/enceinte.png' }}
        {% endif %}
      attributes:
        titre: >-
            {% if is_state('media_player.echo_dot_marion', 'playing') %}
            🎼{{ (state_attr('media_player.echo_dot_marion', 'media_title')) }}
            {% elif is_state('media_player.echo_dot_marion', 'paused') %}
            🎼{{ (state_attr('media_player.echo_dot_marion', 'media_title')) }}
            {% else %}
            🎼 -
            {% endif %}
        artiste: >-
            {% if is_state('media_player.echo_dot_marion', 'playing') %}
            🎤{{ (state_attr('media_player.echo_dot_marion', 'media_artist')) }}
            {% elif is_state('media_player.echo_dot_marion', 'paused') %}
            🎤{{ (state_attr('media_player.echo_dot_marion', 'media_artist')) }}
            {% else %}
            🎤 -
            {% endif %}
        volume: "🔊{{ ((state_attr('media_player.echo_dot_marion', 'volume_level') * 100 ) | round(0)) }}%"
        source: "🎧{{ (state_attr('media_player.echo_dot_marion', 'media_album_name')) }}"

Ici en gros je demande à la carte d’afficher les infos si l’echo est en lecture ou au pause
Sinon elle affiche rien

:microphone: La carte :microphone:

:microphone: Ou sont les boutons :microphone:

Comme vous l’imaginer il n’y a pas de boutons lecture sur les cartes tuiles comme sur une carte média classique
J’ai donc créer une solution de contournement.
Je vais utiliser les conditions.
Les boutons apparaitrons si l’enceinte est en lecture ou pause.

Avec Mme nous écoutons principalement le flow sur Deezer
J’ai donc créé un script qui actionnera le flow lorsque je clique sur la card

Le script deezer :

Flow
alias: Deezer flow
sequence:
  - data:
      media_content_type: custom
      media_content_id: lance le flow sur deezer
    action: media_player.play_media
    target:
      device_id: XXXXXXXXX
description: ""
icon: mdi:music

Les boutons :

exemple avec lecture :

Play
alias: Media player lecture pause
sequence:
  - action: media_player.media_play_pause
    metadata: {}
    data: {}
    target:
      entity_id: media_player.echo_dot_marion
description: ""
icon: mdi:play-pause

script a multiplier pour les autres boutons

ce qui donne :

Pour les boutons j’ai tout simplement piquer le code d’un badge que j’ai mis dans le dashboard
Par contre cela implique que le réglage ce fera uniquement en YAML l’editeur n’est pas accessible.
Il faudra jouer sur les colonnes pour agrandir ou rétrécir les boutons

La carte complète :

carte
type: grid
cards:
  - type: heading
    heading: Multimedia
    heading_style: title
    icon: mdi:multimedia
  - type: tile
    entity: sensor.enceinte_salon
    show_entity_picture: true
    grid_options:
      rows: 1
      columns: 12
    state_content:
      - state
      - titre
      - volume
    tap_action:
      action: perform-action
      perform_action: script.deezer_flow
      target: {}
  - type: custom:mushroom-template-badge
    color: blue
    tap_action:
      action: toggle
    label: Pièce de vie
    entity: script.media_player_precedent
    picture: /local/icones/entity/precedent.png
    grid_options:
      columns: 1
      rows: 1
    visibility:
      - condition: or
        conditions:
          - condition: state
            entity: media_player.echo_dot_marion
            state: playing
          - condition: state
            entity: media_player.echo_dot_marion
            state: paused
  - type: custom:mushroom-template-badge
    color: blue
    tap_action:
      action: toggle
    label: Pièce de vie
    entity: script.media_player_lecture_pause
    picture: /local/icones/entity/playpause.png
    grid_options:
      columns: 2
      rows: 1
    visibility:
      - condition: or
        conditions:
          - condition: state
            entity: media_player.echo_dot_marion
            state: playing
          - condition: state
            entity: media_player.echo_dot_marion
            state: paused
  - type: custom:mushroom-template-badge
    color: blue
    tap_action:
      action: toggle
    label: Pièce de vie
    entity: script.media_stop
    picture: /local/icones/entity/stop.png
    grid_options:
      columns: 2
      rows: 1
    visibility:
      - condition: or
        conditions:
          - condition: state
            entity: media_player.echo_dot_marion
            state: playing
          - condition: state
            entity: media_player.echo_dot_marion
            state: paused
  - type: custom:mushroom-template-badge
    color: blue
    tap_action:
      action: toggle
    label: Pièce de vie
    entity: script.media_player_suivant
    picture: /local/icones/entity/suivant.png
    grid_options:
      columns: 1
      rows: 1
    visibility:
      - condition: or
        conditions:
          - condition: state
            entity: media_player.echo_dot_marion
            state: playing
          - condition: state
            entity: media_player.echo_dot_marion
            state: paused
  - type: custom:mushroom-template-badge
    color: blue
    tap_action:
      action: toggle
    label: Pièce de vie
    entity: script.media_mute
    picture: /local/icones/entity/muet.png
    grid_options:
      columns: 1
      rows: 1
    visibility:
      - condition: or
        conditions:
          - condition: state
            entity: media_player.echo_dot_marion
            state: playing
          - condition: state
            entity: media_player.echo_dot_marion
            state: paused
  - type: custom:mushroom-template-badge
    color: blue
    tap_action:
      action: toggle
    label: Pièce de vie
    entity: script.media_volume
    picture: /local/icones/entity/son-.png
    grid_options:
      columns: 1
      rows: 1
    visibility:
      - condition: or
        conditions:
          - condition: state
            entity: media_player.echo_dot_marion
            state: playing
          - condition: state
            entity: media_player.echo_dot_marion
            state: paused
  - type: custom:mushroom-template-badge
    color: blue
    tap_action:
      action: toggle
    label: Pièce de vie
    entity: script.media_volume_2
    picture: /local/icones/entity/son+.png
    grid_options:
      columns: 1
      rows: 1
    visibility:
      - condition: or
        conditions:
          - condition: state
            entity: media_player.echo_dot_marion
            state: playing
          - condition: state
            entity: media_player.echo_dot_marion
            state: paused
  - type: custom:mushroom-template-badge
    color: blue
    content: Flow
    tap_action:
      action: toggle
    entity: script.deezer_flow
    picture: /local/icones/entity/flow.png
    grid_options:
      columns: 3
      rows: 1
    visibility:
      - condition: or
        conditions:
          - condition: state
            entity: media_player.echo_dot_marion
            state: playing
          - condition: state
            entity: media_player.echo_dot_marion
            state: paused
2 « J'aime »

Comme prévu, ta description est super intéressante !!

Bravo !

et merci du partage !

Il y a quelques idées que je n’avais jamais ou rarement vues ailleurs :

  • Une utilisation très poussée des templates pour mettre la complexité en dehors de l’affichage et avoir un dashboard qui se contente d’afficher… Ca ne m’étonne pas que tu aie gagné en fluidité !

  • Un parti pris visuel avec les pictures à la place des icones qui en séduira sans doute beaucoup qui ne sont pas fan du look « tuiles » et ses icones colorées…

  • une utilisation poussée des logiques de visibilité pour avoir un dashboard adaptatif.

Vivement la suite, sans doute d’autres bonnes idées pour s’inspirer !

1 « J'aime »

merci pour ton commentaire, c’est sympa
effectivement tu entièrement raison la motivation première est la fluidité mais aussi de pouvoir personnaliser les icones, je ne suis pas fan des icones ou le fond et l’icone sont de la même couleur.
Et je ne voulais pas passer par du card_mod

Effectivement, je trouve que c’est une super approche, un joli travail que j’ai pu tester sur la carte météo. D’ailleurs j’ai pas encore eu le temps de mettre la variable sur la partie name il va falloir que je teste quand même :slight_smile:
ça change un peu de ça :rofl:
image

1 « J'aime »

Bonjour,
Un grand merci pour tes explications, je m’en suis grandement inspiré.
Juste modifié l’ordre des ‹ replace › dans la traductions des conditions météo pour ne pas que ‹ clear › soit traduit avant ‹ clear-night ›, idem pour ‹ cloudy › et ‹ partly-cloudy ›

  condition: "{{ daily['weather.fouquieres_les_lens'].forecast[3].condition | replace('partlycloudy', 'Eclaircies') | replace('clear-night', 'Nuit clair') | replace('clear', 'Ciel dégagé') | replace('cloudy', 'Nuageux') | replace('rainy', 'Pluie') | replace('hail', 'Risque de grèle') | replace('snowy', 'neige') | replace('windy', 'Venteux') | replace('fog', 'Brouillard') | replace('pouring', 'Pluie forte') | replace('lightning', 'Orages') | replace('sunny', 'Ensoleillé') | replace('windy-variant', 'Venteux variant') | replace('Exceptional', 'Exceptionnel') | replace('snowy-rainy', 'Pluie verglaçante') | replace('lightning-rainy', 'Pluie orageuse')}}"

Par contre, un truc que je n’ai pas compris, c’est que les unique_id sont déclarés comme unique_id: meteo_jour_x, et que je me retrouve avec des template_meteo_jour_X.
Je n’ai pas compris d’où vient le mot ‹ template ›

   - name: "{{ daily['weather.fouquieres_les_lens'].forecast[3].datetime | as_timestamp | timestamp_custom('%a', true) | replace('Mon', 'Lundi') | replace('Tue', 'Mardi') | replace('Wed', 'Mercredi') | replace('Thu', 'Jeudi') | replace('Fri', 'Vendredi') | replace('Sat', 'Samedi') | replace('Sun', 'Dimanche') }}"
        unique_id: meteo_jour_3
        state: "Something"
        picture: >
          {% set weather = daily['weather.fouquieres_les_lens'].forecast[3].condition %}
          {{'/local/images/pulsar_color/' + weather + '.png' }}
        attributes:
          datetime: >
            {{ daily['weather.fouquieres_les_lens'].forecast[3].datetime | as_timestamp | timestamp_custom('%d/%m', true) }}
          condition: "{{ daily['weather.fouquieres_les_lens'].forecast[3].condition | replace('partlycloudy', 'Eclaircies') | replace('clear-night', 'Nuit clair') | replace('clear', 'Ciel dégagé') | replace('cloudy', 'Nuageux') | replace('rainy', 'Pluie') | replace('hail', 'Risque de grèle') | replace('snowy', 'neige') | replace('windy', 'Venteux') | replace('fog', 'Brouillard') | replace('pouring', 'Pluie forte') | replace('lightning', 'Orages') | replace('sunny', 'Ensoleillé') | replace('windy-variant', 'Venteux variant') | replace('Exceptional', 'Exceptionnel') | replace('snowy-rainy', 'Pluie verglaçante') | replace('lightning-rainy', 'Pluie orageuse')}}"
          temperature: "🔺{{ daily['weather.fouquieres_les_lens'].forecast[3].temperature }}°"
          humidity: "💧{{ daily['weather.fouquieres_les_lens'].forecast[3].humidity }}%"
          precipitation: "☂️{{ daily['weather.fouquieres_les_lens'].forecast[3].precipitation }}mm"
unique_id: meteo_jour_3

, ça donne ça au final :

1 « J'aime »

Bravo Marleo pour ton dashboard ! Super boulot!

Question gestion des déchets, comment as tu fait ??

1 « J'aime »

Salut
merci pour la traduction j’avais vu que j’avais une coquille dans la traduction de certaines conditions
j’ai compris :slight_smile:

pour le template c’est bizarre en effet il n’apparait pas pour moi

image

le code il est dans ton configuration.yaml ou tu as un template.yaml ?

@jerome6994, Salut tu as eu ce « problème » ?

@Tibo1426, merci :slight_smile: j’essai de te faire un post explicatif clair ^^ c’est un peu du bricolage mais ça fonctionne

Salut
je vais essayer d’être clair ^^

:truck: Calendrier Poubelle :truck:

Ici j’ai créer 2 calendriers poubelle, un pour la poubelle jaune et un pour la grise en mettant à intervalle régulier.
Une fois tout les 15 jours.

:recycle: Rappel poubelle :recycle:

J’avais dans ma tête l’envie d’interagir avec Alexa tout en gardant la possibilité de gérer manuellement via l’interface.
Donc il à fallu modéliser mon besoin dans HA
Ce sera à modifier selon ton besoin

Automatisation :
Ici je demande à HA de m’envoyer une notification sur mon tél et sur mon echo dot pour me rappeler quelle poubelle sortir.
Il vient checker le calendrier et lance l’automatisation poubelle grise ou poubelle jaune

Notification
alias: Notification poubelle grise
description: ""
triggers:
  - trigger: calendar
    entity_id: calendar.poubelle_grise
    event: start
    offset: "0:0:0"
conditions: []
actions:
  - action: notify.mobile_app_iphone_de_lionel
    metadata: {}
    data:
      message: La poubelle grise est sortie ?
      title: POUBELLE
      data:
        push:
          category: grise
    enabled: true
  - action: notify.alexa_media_echo_dot_marion
    metadata: {}
    data:
      message: Aujourd'hui c'est la poubelle grise à sortir
mode: single

Info importante, la notification est envoyé à l’heure ou commence l’événement.
Dans mon cas j’ai planifié à 17h
image
Si tu planifie l’heure à 00:00 tu recevra la notification à cette heure

La mon « rappel » est programmé, sur mon tél et dans la maison.

:iphone: Action IOS :iphone:

ATTENTION, ça fonctionne MAIS le code est obsolète faut que je prenne le temps de mettre à jour

code à ajouter dans le configuration.yaml pour les notifications actionnables

IOS
ios:
  push:
    categories:
      - name: Poubelle_grise
        identifier: 'grise'
        actions:
          - identifier: 'OUI'
            title: 'Oui'
            activationMode: 'background'
            authenticationRequired: false
            destructive: true
            behavior: 'default'
          - identifier: 'NON'
            title: 'Non'
            activationMode: 'background'
            authenticationRequired: false
            destructive: true
            behavior: 'default'      
      - name: Poubelle_jaune
        identifier: 'jaune'
        actions:
          - identifier: 'OUI'
            title: 'Oui'
            activationMode: 'background'
            authenticationRequired: false
            destructive: true
            behavior: 'default'
          - identifier: 'NON'
            title: 'Non'
            activationMode: 'background'
            authenticationRequired: false
            destructive: true
            behavior: 'default'

C’est donc l’une des premières options données à mon automatisation précédentes.
En restant appuyer sur la notification un OUI/NON apparait
Si OUI est actionné alors il lance cette automatisation :

OUI envoyer
alias: Sortie poubelle grise
description: ""
triggers:
  - trigger: event
    event_type: mobile_app_notification_action
    event_data:
      action: OUI
conditions:
  - condition: state
    entity_id: calendar.poubelle_grise
    attribute: message
    state: Poubelle grise
actions:
  - action: script.turn_on
    metadata: {}
    data: {}
    target:
      entity_id: script.poubelle_grise
mode: single

En gros si OUI reçu et que c’est l’événement poubelle grise alors lance le script.

Script :

Script
sequence:
  - if:
      - condition: state
        entity_id: calendar.maison
        attribute: message
        state: Poubelle grise sortie
    then:
      - stop: déjà renseigner
    else:
      - action: calendar.create_event
        metadata: {}
        data:
          summary: Poubelle grise sortie
          start_date_time: "{{ now() }}"
          end_date_time: "{{ now() + timedelta(minutes=1) }}"
        target:
          entity_id: calendar.maison
      - action: counter.increment
        metadata: {}
        data: {}
        target:
          entity_id: counter.compteur_poubelle_grise
alias: Poubelle grise
description: ""

Ici le script viens checker que « Poubelle grise sortie » n’est pas déjà renseigné dans le calendrier pour éviter les doublons (important pour mon compteur)
Si c’est pas le cas il le met au planning puis incrémente mon compteur

Exemple hier quand j’ai sortie ma poubelle grise

:microphone: Alexa :microphone:

J’ai exposé mon script à Alexa on y mettant des phrases types

Idem j’ai créer des routines sur l’appli Alexa au cas ou je ne prends pas l’abonnement cloud HA

:raised_hand: Action manuel :raised_hand:

J’ai rajouté une dernière option en cliquant sur ma carte ça lance mon script

Carte tuile
type: tile
entity: sensor.poubelle_grise
grid_options:
  columns: full
icon: mdi:home-heart
color: red
hide_state: false
show_entity_picture: true
state_content:
  - date
  - delta
  - Compteur
  - levée restante
  - cout
visibility:
  - condition: state
    entity: input_boolean.spoiler
    state: "on"
tap_action:
  action: perform-action
  perform_action: script.poubelle_grise
  target: {}

:hammer_and_wrench: En option :hammer_and_wrench:

J’ai créer un compteur classique dans les entrées

Ensuite j’ai créer un autre compteur chiffré qui lui est incrémenter au dela de 5 levée de poubelles (je paie un coup supplémentaire)


Pour l’utilisation de ce compteur j’utilise une automatisation

Automatisation cout supp
alias: Automotisation coût poubelle grise
description: ""
triggers:
  - trigger: state
    entity_id:
      - counter.compteur_poubelle_grise
    from: "5"
    to: "6"
  - trigger: state
    entity_id:
      - counter.compteur_poubelle_grise
    from: "6"
    to: "7"
  - trigger: state
    entity_id:
      - counter.compteur_poubelle_grise
    from: "7"
    to: "8"
  - trigger: state
    entity_id:
      - counter.compteur_poubelle_grise
    from: "8"
    to: "9"
  - trigger: state
    entity_id:
      - counter.compteur_poubelle_grise
    from: "9"
    to: "10"
  - trigger: state
    entity_id:
      - counter.compteur_poubelle_grise
    from: "10"
    to: "11"
  - trigger: state
    entity_id:
      - counter.compteur_poubelle_grise
    from: "11"
    to: "12"
conditions: []
actions:
  - action: input_number.increment
    metadata: {}
    data: {}
    target:
      entity_id: input_number.cout_levee_supplementaire
mode: single

Les données calculées dans mon sensor.yaml

sensor
      cout_levee_supplementaire:
        friendly_name: 'Coût levée supplémentaire'
        unique_id: sensor.cout_levee_supplementaire
        value_template: >-
            {{ ( 110 + (states('input_number.cout_levee_supplementaire') | float(default=0) ) ) | round(0) }}€

      limite_restant_poubelle:
        friendly_name: 'Levée restant avant limite'   
        unique_id: sensor.limite_poubelle
        value_template: >-
            {{ ( 5 - (states('counter.compteur_poubelle_grise') | float(default=0) ) ) | round(0) }}  

      levee_poubelle_grise:
        friendly_name: 'Levée poubelle grise'   
        unique_id: sensor.levee_poubelle_grise
        value_template: >-
            {{ (states('counter.compteur_poubelle_grise') | float(default=0) ) }}

Pour modéliser tout ceci j’ai créer un sensor dans mon template.yaml

Poubelle grise

    - name: Poubelle grise
      unique_id: Poubelle_grise
      state: "📅 Prochain rammassage le: {{ (state_attr('calendar.poubelle_grise', 'start_time')) | as_timestamp | timestamp_custom('%d/%m', true) }} "  
      picture: "{{ '/local/icones/entity/poubelle_grise.png' }}"       
      attributes:        
        delta: >-
          ⌛ {% set delta = state_attr('calendar.poubelle_grise', 'start_time') | as_datetime | as_local - today_at() %}
          {{ {0: "Aujourd'hui", 1: "Demain"}.get(delta.days, 'Dans ' ~ delta.days ~  ' Jours') }}
        Compteur: " Nbre de levée: {{ (states('sensor.levee_poubelle_grise')| float(default=0) ) | round(0) }} "
        levée restante: " Levée restante: {{ (states('sensor.limite_restant_poubelle')) }} "
        cout: " Coût: {{ (states('sensor.cout_levee_supplementaire')) }}"

Ce qui donne cette carte
image

Le même principe à été appliqué pour mes poubelles jaunes sans le coté financier car j’ai pas de cout sur cette poubelle.

Je sais pas si c’est très clair, dis moi si il y’a des choses que tu ne comprends pas
J’ai pas trouvé plus simple pour tout ceci mais ça réponds à mon besoin :slight_smile:

Alors je viens de reprendre le sujet car je l’avais laissé de coté sorry :slight_smile:

Bon en reprenant un peu le code je n’ai pas du tout template dans les noms ou les unique_id !
J’ai juste l’icone rainy qui a toujours du mal par rapport aux autres et je n’ai pas trouvé pourquoi !


sinon ça marche très bien

1 « J'aime »