Quando si inizia a costruire la propria UI (interfaccia grafica) su Home Assistant spesso viene voglia di piazzare da qualche parte la data del giorno corrente, visualizzata però secondo un formato preferito. Ecco, se si è approdati da poco in questo mondo e non si ha ancora una buona dimestichezza con i template, c’è una buona probabilità di rimanere spiazzati.

Corriamo ai ripari, vediamo quali sono i requisiti necessari, come fare un sensore per formattare la data su Home Assistant e come mostrarlo sulla UI con il componente custom:button-card.

La piattaforma time_date

La prima cosa da fare è quella di integrare la piattaforma time_date per dotarci di alcuni sensori relativi al tempo.
Qui trovi l’elenco completo dei sensori disponibili, nella maggior parte dei casi bastano time e  date.

Questo è il codice da aggiungere al file  configuration.yaml , se necessario.

sensor:
  - platform: time_date
    display_options:
      - 'time'
      - 'date'

Questa integrazione crea due sensori:

sensor.time
Ora corrente nel formato HH:MM

sensor.date
Data del giorno nel formato YYYY-MM-DD

L’ora va bene così, sulla data ci possiamo lavorare creando un sensore custom con la piattaforma template per ottenere qualsiasi tipo di formato.

Formattare la data

La piattaforma template si applica in diversi contesti ed è una risorsa molto preziosa per sfruttare le potenzialità di Home Assistant. Quando applicata all’integrazione sensor: consente di ottenere un sensore personalizzato basato sul valore di una entità già presente.

In questo caso usiamo il sensore  sensor.date creato in precedenza e lo elaboriamo con questo modello.

sensor:
  - platform: template
    sensors:
      pretty_date:
        friendly_name: Data di oggi
        value_template: >-
          {% set today = states("sensor.date") %}
          {% set arr_week_days = ["Domenica", "Lunedì", "Martedì", "Mercoledì", "Giovedì", "Venerdì", "Sabato"] %}
          {% set arr_months = ["Gennaio", "Febbraio", "Marzo", "Aprile", "Maggio", "Giugno", "Luglio", "Agosto", "Settembre", "Ottobre", "Novembre", "Dicembre"] %}
          {% set week_day = as_timestamp(today) | timestamp_custom('%w') | int %}
          {% set day = as_timestamp(today) | timestamp_custom('%d') %}
          {% set month = as_timestamp(today) | timestamp_custom('%m') | int %}
          {% set year = as_timestamp(today) | timestamp_custom('%Y') | int %}
          {{ arr_week_days[week_day] }}, {{ day }} {{ arr_months[month-1] }} {{ year }}

Questo sensor template genera un nuovo sensore chiamato sensor.pretty_date con il formato personalizzato rappresentato in questa card.

Se ti interessa qui sotto ti lascio il codice di questa card realizzata con il componente custom:button-card.
Per approfondire meglio il discorso plancia, invece, puoi partire da qui.

button-card

type: 'custom:button-card'
entity: sensor.time
layout: vertical
template: no_background
label: "[[[ return states['sensor.dark_sky_hourly_summary_tmpl'].state; ]]]"
name: "[[[ return states['sensor.pretty_date'].state; ]]]"
show_icon: false
show_label: true
show_name: true
show_state: true
styles:
  card:
    - height: 100px
  state:
    - font-size: 200%
    - font-weight: bold
    - justify-self: center
  label:
    - justify-self: center
    - font-size: 90%
    - color: var(--paper-item-icon-active-color)
  name:
    - justify-self: center
    - font-size: 120%
tap_action:
  action: none

Piccola considerazione sulla logica di questo sensore.

Spesso vedo condividere sul gruppo Home Assistant Italia di Facebook e sul Forum ufficiale di Home Assistant modelli che fanno uso della funzione now(). Nella pratica non cambia nulla, si riesce comunque ad ottenere un formato personalizzato, ma c’è da considerare che modelli di quel tipo si aggiornano ogni minuto.

Sicuramente è irrilevante a livello di risorse utilizzate per Home Assistant aggiornare un sensore ogni minuto, ma concettualmente perchè farlo quando sappiamo che il valore del sensore non cambierà per 24 ore? Interrogare il valore del sensore sensor.date e poi elaborarlo con le funzioni timestamp, invece, farà si che il modello venga ricalcolato solo alla mezzanotte di ogni giorno, senza dare inutile lavoro da fare ad Home Assistant.

Un sensore tutto fare

Bene, abbiamo creato un sensore con un formato data personalizzato da piazzare nella nostra bella UI.

Ma cosa succede se un domani avessimo bisogno di un altro formato? Tipo solo il mese, oppure il giorno della settimana?
Succede che dobbiamo creare un nuovo sensore ancora, formattando la data in maniera diversa.

Poco male si è vero, ma in realtà possiamo estendere le funzionalità di questo sensore aggiungendo negli attributi alcuni campi da recuperare al bisogno e farlo diventare un sensore tutto fare.

Vediamo come modificare il sensore e come sfruttare al meglio gli attributi aggiunti.

sensor:
  - platform: template
    sensors:
      pretty_date:
        friendly_name: Data di oggi
        value_template: >-
          {% set today = states("sensor.date") %}
          {% set arr_week_days = ["Domenica", "Lunedì", "Martedì", "Mercoledì", "Giovedì", "Venerdì", "Sabato"] %}
          {% set arr_months = ["Gennaio", "Febbraio", "Marzo", "Aprile", "Maggio", "Giugno", "Luglio", "Agosto", "Settembre", "Ottobre", "Novembre", "Dicembre"] %}
          {% set week_day = as_timestamp(today) | timestamp_custom('%w') | int %}
          {% set day = as_timestamp(today) | timestamp_custom('%d') %}
          {% set month = as_timestamp(today) | timestamp_custom('%m') | int %}
          {% set year = as_timestamp(today) | timestamp_custom('%Y') | int %}
          {{ arr_week_days[week_day] }}, {{ day }} {{ arr_months[month-1] }} {{ year }}
        attribute_templates:
          week_day: >-
            {% set today = states("sensor.date") %}
            {% set arr_week_days = ["Domenica", "Lunedì", "Martedì", "Mercoledì", "Giovedì", "Venerdì", "Sabato"] %}
            {% set week_day = as_timestamp(today) | timestamp_custom('%w') | int %}
            {{ arr_week_days[week_day] }}    
          day: >-
            {% set today = states("sensor.date") %}
            {% set day = as_timestamp(today) | timestamp_custom('%d') %}
            {{ day }}      
          month_num: >-
            {% set today = states("sensor.date") %}
            {% set month = as_timestamp(today) | timestamp_custom('%m') %}
            {{ month }}  
          month_name: >-
            {% set today = states("sensor.date") %}
            {% set arr_months = ["Gennaio", "Febbraio", "Marzo", "Aprile", "Maggio", "Giugno", "Luglio", "Agosto", "Settembre", "Ottobre", "Novembre", "Dicembre"] %}          
            {% set month = as_timestamp(today) | timestamp_custom('%m') | int %}
            {{ arr_months[month-1] }}  
          year: >-
            {% set today = states("sensor.date") %}
            {% set year = as_timestamp(today) | timestamp_custom('%Y') | int %}
            {{ year }}

Il modello principale è rimasto lo stesso, per cui lo stato del sensore continuerà a fornire la data nel formato che abbiamo visto in precedenza. Ma stavolta abbiamo anche cinque attributi da usare per formattare la data in modo diverso.

Ora possiamo recuperare gli attributi direttamente con custom:button-card per formattare la data ogni volta in modo diverso, pur avendo un unico sensore. Vediamo qualche esempio.

type: 'custom:button-card'
name: |
  [[[
    var week_day = states['sensor.pretty_date'].attributes.week_day;
    return 'Oggi è <b>' + week_day + '</b>';
  ]]]
tap_action:
  action: none
type: 'custom:button-card'
name: |
  [[[
    var month = states['sensor.pretty_date'].attributes.month_name;
    return 'Siamo nel mese di <br><b>' + month + '</b>';
  ]]]
tap_action:
  action: none
type: 'custom:button-card'
name: |
  [[[
    var day = states['sensor.pretty_date'].attributes.day;
    var month_num = states['sensor.pretty_date'].attributes.month_num;
    var year = states['sensor.pretty_date'].attributes.year;
    return day + '/' + month_num + '/' + year;
  ]]]
tap_action:
  action: none

E così via. Ovviamente è possibile usare e concatenare i valori degli attributi per ottenere un qualsiasi formato.

Ma non solo, attributi di questo tipo possono essere utili anche in ambito automazioni.
Ipotizziamo ad esempio di voler eseguire una qualsiasi azione ad inizio settimana:

automation:
  trigger:
    - platform: state
      entity_id: sensor.pretty_date
      attribute: week_day
      to: "Lunedì"
  condition: []
  action: []

Oppure il primo giorno di ogni mese:

automation:
  trigger:
    - platform: state
      entity_id: sensor.pretty_date
      attribute: day
      to: "01"
  condition: []
  action: []

Conclusione

Insomma, è davvero un sensore tutto fare che torna utile nel Frontend per impreziosire l’interfaccia grafica, ma anche nelle logiche di script o automazioni nel Backend.
Come sempre mi auguro di aver dato un contributo utile, in questo caso soprattutto a coloro che si sono avvicinati da poco a questo mondo.

Ciao e a presto,
Max

Se apprezzi i miei contenuti puoi stimolare nuove idee sostenendo il progetto con una buona birra!

Partecipa alla discussione 11 Commenti

  • Matteo ha detto:

    Ciao sono alle primissime armi con home assistant e stavo seguendo le tue guide per configurare la board

    Ho provato a inserire i sensori nel configuration.yaml e attivare la card ma mi da errore col sensore pretty_date

    ButtonCardJSTemplateError: TypeError: Cannot read property ‘state’ of undefined in ‘return states[‘sensor.pretty_date’].state;’

    suggerimenti?

    grazie

    • Max ha detto:

      Ciao Matteo, la card non ti vede il sensore. Può essere stato creato male, oppure non hai ricaricato i template dopo l’inserimento.
      Posta qui il codice completo del sensore e vediamo

  • Corrado ha detto:

    Ciao,
    innanzitutto grazie per le guide, davverro interessanti per me che sono alle prime armi.
    Stavo creando l’header con le tue card. Ho create i due sensori time e date ma adesso non so come fare per creare il sensore pretty_date. Il codice per il sensore template non capisco dove devo inserirlo.
    Potresti aiutarmi per favore?
    Ho un’altra domande:
    – per creare i sensori data e time posso creare un file che chiamo sensor_time_date.yaml e poi aggiunger giusto sensor: !include sensor_time_date.yaml?
    Grazie,

    • Max ha detto:

      Ciao Corrado, hai un po’ di confusione. Ti consiglio di studiare prima le basi e poi dedicarti all’interfaccia altrimenti diventa tutto molto difficile.

  • Andrea ha detto:

    Ciao Max, seguo le tue guide con molto interesse. Nella card utilizzi come label “sensor.dark_sky_hourly_summary_tmpl”. Saresti così gentile da condividere il codice per creare questo sensore? Grazie infinite.
    Un saluto

  • Fabio ha detto:

    Ciao, grazie per i suggerimenti. Volevo sapere come invertire l’ora e la data: vorrei mettere sopra l’ora e sotto la data ma non ci riesco.

  • Giovanni ha detto:

    Ciao, ho seguito la tua guida e creato il sensore data personalizzato con vari attributi copiando il tuo codice nel mio home assistant. Purtroppo però ho riscontrato un errore: mentre il sensore “date” della piattaforma time_date mi restituisce la data giusta (29 aprile 2022 mentre scrivo), il sensore personalizzato mi dice Giovaedì, 28 aprile 2022 (quindi mi dà un giorno in meno).
    Da cosa può dipendere questo errore?

Lascia un Commento