# Code dans custom:button-card

**URL:** <https://forum.hacf.fr/t/code-dans-custom-button-card/29632>\
**Category:** Entraide Home Assistant\
**Tags:** card\
**Created:** [Octobre 20, 2023, 1:15 UTC](https://forum.hacf.fr/t/code-dans-custom-button-card/29632 "2023-10-20T13:15:03Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![roumano](https://forum.hacf.fr/letter_avatar_proxy/v4/letter/r/f14d63/32.png) [@roumano](https://forum.hacf.fr/u/roumano)\
**Post date:** [Octobre 20, 2023, 1:15 UTC](https://forum.hacf.fr/t/code-dans-custom-button-card/29632/1 "2023-10-20T13:15:03Z")

</div>

## Mon problème

Je sollicite votre aide pour m’aider a faire du formatage dans un `type: custom:button-card`

J’ai configurer un custom:button-card avec ça ( qui fonctionne ) :

```auto
type: custom:button-card
...
label: |
  [[[
    if (states['input_boolean.xxxx'].state == "on")
      return 'Ce soir à ' + states['input_datetime.yyyy'].state;
    else
      return "Eteint" ;
  ]]]

```

Ca affiche `Ce soir à 00:45:00`  
J’aimerais retirer les secondes pour rendre ça plus lisible.

En template jinja, le code serait `{{ strptime(states('input_datetime.yyyy'),'%H:%M:%S').strftime('%-H:%M') }}`

Mais c’est pas du jinja mais du javascript (je crois)  
Vous savez comment faire ?

Merci.

---

<div class="post-metadata">

**Author:** ![WarC0zes](https://forum.hacf.fr/user_avatar/forum.hacf.fr/warc0zes/32/137471_2.png) [@WarC0zes](https://forum.hacf.fr/u/WarC0zes)\
**Post date:** [Octobre 20, 2023, 3:32 UTC](https://forum.hacf.fr/t/code-dans-custom-button-card/29632/2 "2023-10-20T15:32:56Z")

</div>

Bonjour,  
tu peu utiliser le `helpers.format`, ta plusieurs type de formatage.  
tu peu essayer:

```auto
type: custom:button-card
...
label: |
  [[[
    if (states['input_boolean.xxxx'].state == "on")
      return 'Ce soir à ' + helpers.formatTime24h(states['input_datetime.yyyy'].state);
    else
      return "Eteint" ;
  ]]]

```

format possible:

- Date, Time and Date Time format helpers, all localized (takes a string or a `Date` object as input):
  - `helpers.formatTime(time)`: 21:15 / 9:15
  - `helpers.formatTimeWithSeconds(time)`: 9:15:24 PM || 21:15:24
  - `helpers.formatTimeWeekday(time)`: Tuesday 7:00 PM || Tuesday 19:00
  - `helpers.formatTime24h(time)`: 21:15
  - `helpers.formatDateWeekdayDay(date)`: Tuesday, August 10
  - `helpers.formatDate(date)`: August 10, 2021
  - `helpers.formatDateNumeric(date)`: 10/08/2021
  - `helpers.formatDateShort(date)`: Aug 10
  - `helpers.formatDateMonthYear(date)`: August 2021
  - `helpers.formatDateMonth(date)`: August
  - `helpers.formatDateYear(date)`: 2021
  - `helpers.formatDateWeekday(date)`: Monday
  - `helpers.formatDateWeekdayShort(date)`: Mon
  - `helpers.formatDateTime(datetime)`: August 9, 2021, 8:23 AM
  - `helpers.formatDateTimeNumeric(datetime)`: Aug 9, 2021, 8:23 AM
  - `helpers.formatDateTimeWithSeconds(datetime)`: Aug 9, 8:23 AM
  - `helpers.formatShortDateTime(datetime)`: August 9, 2021, 8:23:15 AM
  - `helpers.formatShortDateTimeWithYear(datetime)`: 9/8/2021, 8:23 AM
  - Example: `return helpers.formatDateTime(entity.attribute.last_changed)`  
[GitHub - custom-cards/button-card: ❇️ Lovelace button-card for home assistant](https://github.com/custom-cards/button-card#javascript-templates)

---

<div class="post-metadata">

**Author:** ![anon41081891](https://forum.hacf.fr/letter_avatar_proxy/v4/letter/a/e9c0ed/32.png) [@anon41081891](https://forum.hacf.fr/u/anon41081891)\
**Post date:** [Octobre 20, 2023, 4:12 UTC](https://forum.hacf.fr/t/code-dans-custom-button-card/29632/3 "2023-10-20T16:12:25Z")

</div>

J'ai rien réussi à faire avec helpers...

En revanche ceci fonctionne :

```auto
type: custom:button-card
show_label: true
label: |
  [[[
    var date = states['input_datetime.yyyy'].state
    if (states['input_boolean.xxxx'].state == 'on')
      return "Ce soir à " + date.substr(0,5);
    else
      return "Eteint";
  ]]]

```

 ![image](https://forum.hacf.fr/uploads/default/original/3X/1/3/13dc6aa778574d07dfa092fc94409062b59cbb56.png)

---

<div class="post-metadata">

**Author:** ![WarC0zes](https://forum.hacf.fr/user_avatar/forum.hacf.fr/warc0zes/32/137471_2.png) [@WarC0zes](https://forum.hacf.fr/u/WarC0zes)\
**Post date:** [Octobre 20, 2023, 4:38 UTC](https://forum.hacf.fr/t/code-dans-custom-button-card/29632/4 "2023-10-20T16:38:40Z")

</div>

Voila comment faire:

 ![format button-card](https://forum.hacf.fr/uploads/default/original/3X/0/2/02cd95163b7764b708dd6a977d5c3acd1f707f61.png)

```auto
type: custom:button-card
entity: input_datetime.time
show_name: false
show_state: true
show_label: true
state_display: |
  [[[return 'Ce soir à ' + helpers.formatTime24h(states['input_datetime.time'].state); ]]]

```

sans format:

 ![format button-card2](https://forum.hacf.fr/uploads/default/original/3X/4/8/488bbd8f4cee70ce8daf8b38fa4c4dc25e7baa75.png)

Y avait déja un sujet dessus [Button-card - comment afficher un attribut date "formaté"?](https://forum.hacf.fr/t/button-card-comment-afficher-un-attribut-date-formate/26515)

---

<div class="post-metadata">

**Author:** ![anon41081891](https://forum.hacf.fr/letter_avatar_proxy/v4/letter/a/e9c0ed/32.png) [@anon41081891](https://forum.hacf.fr/u/anon41081891)\
**Post date:** [Octobre 20, 2023, 4:46 UTC](https://forum.hacf.fr/t/code-dans-custom-button-card/29632/5 "2023-10-20T16:46:04Z")

</div>

C’est quand même plus simple comme ça 😂 🙃

```auto
type: custom:button-card
show_label: true
label: |
  [[[
    if (states['input_boolean.xxxx'].state == 'on')
      return "Ce soir à " + states['input_datetime.yyyy'].state.substr(0,5);
    else
      return "Eteint";
  ]]]

```

Enfin si l’heure uniquement est saisie dans le input\_datetime…

---

<div class="post-metadata">

**Author:** ![WarC0zes](https://forum.hacf.fr/user_avatar/forum.hacf.fr/warc0zes/32/137471_2.png) [@WarC0zes](https://forum.hacf.fr/u/WarC0zes)\
**Post date:** [Octobre 20, 2023, 4:54 UTC](https://forum.hacf.fr/t/code-dans-custom-button-card/29632/6 "2023-10-20T16:54:46Z")

</div>

> [@anon41081891](#):
>
> Enfin si l’heure uniquement est saisie dans le input\_datetime…

Et oui, mais si ta la date, faut modifier. J'ai du compter ... que par la commande format, j'aurais pas eu mal a la tête 🤣

 ![format button-card3](https://forum.hacf.fr/uploads/default/original/3X/c/3/c362cefa6a8e73ff9de9ee7fa85237760a57214a.png)

---

<div class="post-metadata">

**Author:** ![anon41081891](https://forum.hacf.fr/letter_avatar_proxy/v4/letter/a/e9c0ed/32.png) [@anon41081891](https://forum.hacf.fr/u/anon41081891)\
**Post date:** [Octobre 20, 2023, 5:04 UTC](https://forum.hacf.fr/t/code-dans-custom-button-card/29632/7 "2023-10-20T17:04:59Z")

</div>

Bah, une date standard, c’est 10 caractères + 1 pour l’espace entre la date et l’heure et c’est joué 😉

Puis avec substr je peux prendre ta date complète : " 2023-10-20 00:45:00 " et écrire à la place : Ce soir à 00h45 le 20/10/2023 "

---

<div class="post-metadata">

**Author:** ![roumano](https://forum.hacf.fr/letter_avatar_proxy/v4/letter/r/f14d63/32.png) [@roumano](https://forum.hacf.fr/u/roumano)\
**Post date:** [Octobre 20, 2023, 5:05 UTC](https://forum.hacf.fr/t/code-dans-custom-button-card/29632/8 "2023-10-20T17:05:46Z")

</div>

> [@WarC0zes](#):
>
> `helpers.formatTime24h(`

Merci, c'est vrai que c'est pas conventionnel mais ça fonctionne !

---

<div class="post-metadata">

**Author:** ![roumano](https://forum.hacf.fr/letter_avatar_proxy/v4/letter/r/f14d63/32.png) [@roumano](https://forum.hacf.fr/u/roumano)\
**Post date:** [Octobre 20, 2023, 5:07 UTC](https://forum.hacf.fr/t/code-dans-custom-button-card/29632/9 "2023-10-20T17:07:52Z")

</div>

Sauf que ça fonctionne pas chez moi, dès que je met le `helpers.formatTime24h(...`, plus rien s’affiche, donc ça doit partir en erreur.

Mais c’est pas grave, avec la façon moins conventionnel de `substr`, ça fonctionne.

Merci de vos retour !!!