Carte Mushroom / Bouton ON/OFF

Mon problème

Bonjour

J’ai découvert les cartes Mushroom qui me vont très très bien minimaliste et classe à la fois à mon goût sur mon iPhone.
Néanmoins il y a pas tous les types de cartes encore sur les Mushroom card ou alors je n’ai pas bien vu les éléments de la dernier version.

Je voudrais un bouton pour mes prises de manière à faire un simple toggle, on/off en ayant d’indiqué sont état par la couleur de l’icône, modifier la couleur de l’icône en fonction de l’état, et idéalement indiqué la puissance à l’instant t consommé par la prise.

Est-ce que les experts ont déjà vu ce type de carte sur mushroom ? SI non est-il possible de faire une carte de ce style avec les quelques indications que j’ai mis ? SI oui pouvez vous me guider sur le chemin de la réussite d’un tel bouton :wink:

Belle journée à vous

Ma configuration

Je suis sur un VM Proxmox


version core-2022.10.5
installation_type Home Assistant OS
dev false
hassio true
docker true
user root
virtualenv false
python_version 3.10.5
os_name Linux
os_version 5.15.74
arch x86_64
timezone Europe/Paris
config_dir /config
Home Assistant Community Store GitHub API | ok -- | -- GitHub Content | ok GitHub Web | ok GitHub API Calls Remaining | 5000 Installed Version | 1.28.3 Stage | running Available Repositories | 1143 Downloaded Repositories | 75
Home Assistant Cloud logged_in | true -- | -- subscription_expiration | 1 janvier 2018 à 01:00 relayer_connected | false remote_enabled | true remote_connected | false alexa_enabled | false google_enabled | false remote_server | null can_reach_cert_server | ok can_reach_cloud_auth | ok can_reach_cloud | ok
Home Assistant Supervisor host_os | Home Assistant OS 9.3 -- | -- update_channel | stable supervisor_version | supervisor-2022.10.0 agent_version | 1.4.1 docker_version | 20.10.18 disk_total | 30.8 GB disk_used | 16.1 GB healthy | true supported | true board | ova supervisor_api | ok version_api | ok installed_addons | Samba share (10.0.0), File editor (5.4.1), Terminal & SSH (9.6.1), Studio Code Server (5.4.0), Check Home Assistant configuration (3.11.0), Network UPS Tools (0.11.0), Samba Backup (5.2.0), Home Assistant Google Drive Backup (0.108.4), Dropbox Sync (1.3.0), Node-RED (13.5.0), TheengsGateway (1.3.0), ESPHome (2022.10.1)
Dashboards dashboards | 3 -- | -- resources | 47 views | 21 mode | storage
Recorder oldest_recorder_run | 22 octobre 2022 à 07:45 -- | -- current_recorder_run | 27 octobre 2022 à 18:21 estimated_db_size | 3673.82 MiB database_engine | sqlite database_version | 3.38.5

Salut @jerome6994

Je pense que tu devrais regarder les « template card » de mushroom :

Exemple de code chez moi moi pour un détecteur de mvt, mais tu dois pourvoir adapter pour un switch ou autre :

salon

type: custom:mushroom-template-card
entity: binary_sensor.mvt_salon
primary: Salon
secondary: |
  {% if is_state('binary_sensor.mvt_salon','on') %}
    Détecté
  {% else %}
    Ras
  {% endif %}
icon: |
  {% if is_state('binary_sensor.mvt_salon','on') %}
    mdi:motion-sensor
  {% else %}
    mdi:motion-sensor-off
  {% endif %}
icon_color: |
  {% if is_state('binary_sensor.mvt_salon','on') %}
    deep-orange
  {% else %}
    cyan
  {% endif %}
fill_container: true
tap_action:
  action: more-info
card_mod:
  style: |
    :host {
      --mush-icon-size: 48px;
    }
    mushroom-shape-icon {
      --shape-color: transparent !important;
    }
    ha-card {
      background: transparent;
      box-shadow: none;
    }

Bonjour @Herbs

trop rapide la réponse :wink: c’est cool j’ai commencé à regarder en effet les template card cela semble prometteur, au bémol prêt qu’il faut que j’aiguise ma dextérité du codage :slight_smile: mais ça va venir

je tiens déjà un truc que je partage ensuite pour tous ceux qui cherche ou chercherais le même usage.

Le dernier point que je cherche à mettre c’est 2 ou 3 informations sur la partie secondary
comme par exemple « Activée depuis xxx - 10W » ou « Désactivée depuis xxx - 0W »
Voir même mettre les Watt à coté du titre pour avoir plus de place sur le secondary

image

Tu peux travailler sur ce genre de template :

Depuis {{ as_timestamp(states.binary_sensor.mvt_salon.last_changed) | timestamp_custom('%HH%M')}} 

image

Là en gros ça dit que mon détecteur de mvt du salon ne détecte plus rien depuis 10h39.

Bref c’est souple :wink:

Edit :
Pas vu la réponse pendant que j’écrivais sorry
Je vais tester ton exemple

Bon j’ai un peu avancer grâce aux infos merci voici ce que j’ai pu faire pour le moment :

Untitled

  - type: custom:mushroom-template-card
    entity: sensor.pc_ch_parents_moustiques_power
    primary: |
      Moustiques - 
      {% if states('sensor.pc_ch_parents_moustiques_power') | float == 0 %}
      {{ states('sensor.pc_ch_parents_moustiques_power') }} W
      {% else %}
      {{ states('sensor.pc_ch_parents_moustiques_power') }} W
      {% endif %} 
    fill_container: true
    icon: mdi:power-plug
    layout: horizontal
    secondary: |
      {% if is_state('switch.pc_ch_parents_moustiques','on') | float == 0 %}
        Désactivée
      {% else %}
        Activée
      {% endif %}
    tap_action:
      action: call-service
      service: switch.toggle
      data: {}
      target:
        entity_id: switch.pc_ch_parents_moustiques
    icon_color: |-
      {% if is_state('switch.pc_ch_parents_moustiques','on') %}
          blue
        {% else %}
          grey
        {% endif %}
    badge_icon: ''

Par contre je n’arrive pas à ce stade à insérer l’option last-change
cela n’empêche pas le fonctionnement mais c’était un élément que j’aurais aimer implanter quand même

En tout cas merci je vais pouvoir déjà mettre ceci sur d’autres éléments

1 « J'aime »

Bien c’est parfait cela fonctionne nickel
image

Reste encore l’adaptation du temps affiché si cela dur sur plusieurs jours comme un prise qui est quasi toujours allumée. Je dis quasi car celle qui sont normalement toujours allumée je les actionne régulièrement pour que le relais interne ne s’endorme pas dans une position. Ce sont souvent des prises plutôt routeur on va dire

Je découvre le Mushroom et j’adore de plus en plus cette carte
J’ai vu des pastilles aussi sur les icons, faut que je trouve des exemple d’info à l’intérieur mais j’imagine déjà quelques bricolle comme le nombre de fois que l’on a sonné à la porte pendant mon absence, le nombre de courrier etc…

Bonjour,
Je suis intéressé par la dernière version du code avec l’option last-change :wink:
Peux tu nous la partager ?
Merci d’avance,

Merci Jérome, j’ai bien vu ton code

{{ as_timestamp(states.binary_sensor.mvt_salon.last_changed) | timestamp_custom(‹ %HH%M ›)}}

Me concernant je suis exactement dans l’exemple que tu as donné avant avec une prise ON/OFF
La prise s’appelle : switch.tz3000_gvn91tmx_ts011f_switch_2

du coup j’incère ton code mis à jour suivant :

{{ as_timestamp(states.binary_switch.tz3000_gvn91tmx_ts011f_switch_2.last_changed) | timestamp_custom(‹ %HH%M ›)}}

Et Erreur : can not read an implicit mapping pair; a colon is missed (20:113)

Je précise, je débute en langage YAML (j’ai 6 mois de retard à combler par rapport à toi je pense…)

Sinon as tu trouvé comment résoudre l’affichage pour une prise qui reste dans le même état plusieurs jours ? (transformer les h et J)

Les quotes sont pas les bonnes

{{ as_timestamp(states.binary_switch.tz3000_gvn91tmx_ts011f_switch_2.last_changed) | timestamp_custom('%HH%M')}}

Voici mon code

type: custom:mushroom-template-card
entity: sensor.tz3000_gvn91tmx_ts011f_active_power_2
primary: |
  PC Chargeur - 
  {% if states('sensor.tz3000_gvn91tmx_ts011f_active_power_2') | float == 0 %}
  {{ states('sensor.tz3000_gvn91tmx_ts011f_active_power_2') }} W
  {% else %}
  {{ states('sensor.tz3000_gvn91tmx_ts011f_active_power_2') }} W
  {% endif %} 
fill_container: true
icon: mdi:power-plug
layout: horizontal
secondary: |
  {% if is_state('switch.tz3000_gvn91tmx_ts011f_switch_2','on') | float == 0 %}
    Désactivée
  {% else %}
    Activée
  {% endif %}
{{ as_timestamp(states.binary_switch.tz3000_gvn91tmx_ts011f_switch_2.last_changed) | timestamp_custom('%HH%M')}}
tap_action:
  action: call-service
  service: switch.toggle
  data: {}
  target:
    entity_id: switch.tz3000_gvn91tmx_ts011f_switch_2
icon_color: |-
  {% if is_state('switch.tz3000_gvn91tmx_ts011f_switch_2','on') %}
      blue
    {% else %}
      grey
    {% endif %}
badge_icon: ''

erreur suivante :
Erreurs de configuration détectées:

can not read an implicit mapping pair; a colon is missed (19:113)

 16 |  ... 
 17 |  ... 
 18 |  ... 
 19 |  ...  | timestamp_custom('%HH%M')}}
-----------------------------------------^
 20 |  ... 
 21 |  ...

Il manque 2 espaces au début
{{ as_timestamp(states.binary_switch.

En effet c’est mieux, j’ai aussi enlever une paire de guillemet mais cela donne le résultat suivant :

→ Il écrit le code au lieu de mettre un résultat

d’accocades, mais il en fait 2 au début {{et 2 à la fin }}, justement pour lui demander d’afficher le calcul et pas le texte

c’est pire avec la paire d’accolades :

Cette variable :states.binary_switch.tz3000_gvn91tmx_ts011f_switch_2.last_changed → c’est moi qui l’ai écrire en recopiant le format de jérome, mais existe t elle ?

Devant ET derrière… Là j’en vois que devant

ça aussi c’est à adapter avec le nom d’une entité à toi, mais ça semble cohérent avec le reste
switch.tz3000_gvn91tmx_ts011f_switch_2

Oui il ya a bien les accolades Devant ET derrière (on voir que le début sur l’acquisition d’écran)

Je recolle la version actuelle du code correspondant à l’écran précédent.

type: custom:mushroom-template-card
entity: sensor.tz3000_gvn91tmx_ts011f_active_power_2
primary: |
  PC Chargeur - 
  {% if states('sensor.tz3000_gvn91tmx_ts011f_active_power_2') | float == 0 %}
  {{ states('sensor.tz3000_gvn91tmx_ts011f_active_power_2') }} W
  {% else %}
  {{ states('sensor.tz3000_gvn91tmx_ts011f_active_power_2') }} W
  {% endif %} 
fill_container: true
icon: mdi:power-plug
layout: horizontal
secondary: |
  {% if is_state('switch.tz3000_gvn91tmx_ts011f_switch_2','on') | float == 0 %}
    Désactivée
  {% else %}
    Activée
  {% endif %}
  {{ as_timestamp(states.binary_switch.tz3000_gvn91tmx_ts011f_switch_2.last_changed) | timestamp_custom('%HH%M')}}
tap_action:
  action: call-service
  service: switch.toggle
  data: {}
  target:
    entity_id: switch.tz3000_gvn91tmx_ts011f_switch_2
icon_color: |-
  {% if is_state('switch.tz3000_gvn91tmx_ts011f_switch_2','on') %}
      blue
    {% else %}
      grey
    {% endif %}
badge_icon: ''

Comment faire pour savoir si cette variable existe :
states.binary_switch.tz3000_gvn91tmx_ts011f_switch_2.last_changed

Suffit il comme j’ai fait de recopier le format de Jérome :
states.binary_NOM DEVICE.last_changed

Ou faut il un peu plus d’intelligence…

il faut voir si l’entité binary_switch.tz3000_gvn91tmx_ts011f_switch_2 dans les outils dev (juste à coté des modèles
image
Le reste states. et .lastchanged c’est des suffixes/préfixes pour accéder aux propriétés

Je vois pas trop ou regarder voici ce qu’il y a :

Cherche ce début de nom