[Mon Dashboard] - @kaoru

Finalement j’ai résolu mon problème en commentant la ligne :

    #- will-change: transform

dans base.yaml
Au cas ou ça aide quelqu’un d’autre :slight_smile:

image

super ces cartes
On peut trouver le code complet sans template ou avec ou ?

merci

Tu peux retrouver tout ce qu’il faut dedans. ça mêle pas d’éléments. Des templates, un themes etc.

Egalement dans mon repo mais il est out of date

Bonjour @Schumi

Je te conseille de travailler sur une machine virtuelle pour faire tes tests.

Le dashbord est assez lourd à mettre en place.

Bonjour tout le monde.

Je suis en train de reprendre mon dashbaord.
J’ai deux 2 ans de mise à jour homme assistant de retard (2021.9.3).

Globalement visuellement pas mal de chose n’ont pas changé mais le fonctionnement en lui même est différent et nécessite une grosse refonte pour être iso au projet initial.

Les updates devrait arriver rapidement ici et sur surtout sur mon repo.

Malheureusement je peux répondre aux questions précédents car elles n’auront plus de sens dans les futures semaines.

Il doit probablement de manquer l’intégration frontend avec hacs, car c’est button-card custom

cf GitHub - custom-cards/button-card: ❇️ Lovelace button-card for home assistant

Je dirais même un néophyte en informatique, c’est compliqué. Pour ceux ayant touché un système domotique (comme jeedom) ou alors tout simplement les devs/admin sys ont auront plus de facilité. Ce qui a été mon cas dans les deux situations. C’est ce dashboard qui m’a fait migré de jeedom à HA. J’ai directement mis les mains dans HA avec ce dashboard. C’est challengeant !

Tout ce que je peux dire, je suis d’accord : il faut mettre les mains et persévérer !

Je suis aussi passé sur cette organisation.

matt8707 est passé sur cette orga y a quelques temps et je n’ai pas pu rattraper les MAJ par manque de temps et envie

Dans ui-lovcelace.yaml, tu as par exemple un button.

          - type: custom:button-card
            entity: media_player.sony_bravia_tv
            name: Tv
            state_display: >
              [[[
                if (variables.state === 'playing') {
                    return 'On';
                }
                if (variables.state === true) {
                    return variables.translate_unknown;
                }
              ]]]
            double_tap_action:
              !include popup/vardagsrum_tv.yaml
            template:
              - base
              - icon_tv
              - loader

Dans le template icon_tv, c’est le svg qui est le logo.

Dans les nouvelles versions du code de matt, tu as un fichier icons.yaml dans le dossier button_card_templates

icon_plex_white:
  custom_fields:
    icon: >
      <svg viewBox="0 0 50 50">
        <path d="M7.7.3h34.6c4.1 0 7.4 3.3 7.4 7.4v34.6c0 4.1-3.3 7.4-7.4 7.4H7.7c-4.1 0-7.4-3.3-7.4-7.4V7.7C.3 3.6 3.6.3 7.7.3z M25,7.1H14.6L25,25L14.6,42.9H25L35.4,25L25,7.1z" fill="#9da0a2"/>
      </svg>

Tu peux créer un custom, tu recopier une icon existante et tu as juste à remplacer le icon_plex_white par le nom que tu veux.

Et le plus important, c’est de remplacer le svg qui est appelé. Par contre pour faire des icons animé, c’est un peu pus complexe.

Tu peux reprendre ce code,

icon_away:
  state_display: Auto
  styles:
    card:
      - transition: all 0.3s ease-out
    custom_fields:
      icon:
        - width: 79%
        - margin-left: -1%
        - margin-top: -1%
        - fill: >
            [[[ return variables.state_on ? '#516d82' : '#9da0a2'; ]]]
  custom_fields:
    icon: >
      [[[
        let state = variables.state_on ? 'on' : null;
        return `
          <svg viewBox="0 0 50 50">
            <style>
              @keyframes on {
                10%,
                20%,
                100% {
                  transform: rotateZ(0deg);
                }
                30%,
                50%,
                70% {
                  transform: rotateZ(7deg);
                }
                90% {
                  transform: rotateZ(3deg);
                }
                40%,
                60%,
                80% {
                  transform: rotateZ(-7deg);
                }
              }
              .on {
                animation: on 1.35s cubic-bezier(0.5, 1, 0.89, 1);
                animation-fill-mode: both;
                transform-origin: 70% 80%;
                animation-delay: 0s;
              }
            </style>
            <path class="${state}" d="M32.1 18.4s.3-1.6.7-2.1c.3-.6.9-1.4 1.6-1.8.6-.4 1.1-.7 1.4-.7s.7-.1 1 .1.6.4.8 1.3l.3 2.7.1 2.4.2 4.1c0 .3.2 3.1.2 3.3s.2 2.7.2 3.2l-.1 2.5c.1 1.6.5 3.1-.2 4.6-.6 1.4-1.7 2.7-2.9 3.6-.5.4-1.9 1.3-2.9 1.7-1.1.5-2.2.8-3.3 1.1-.5.1-1.4.4-2.3.3s-1.8-.6-2.1-1l-1.6-2.3c-.6-.8-2.1-2.3-2.3-2.5l-2.7-2.8c-.2-.2-2.7-3.5-2.9-3.8l-3.1-4.7-1.8-3.2-1.5-2.8-.9-1.8c-.1-.2-.3-1.1-.2-1.4.3-1.2 1.4-1.4 2.3-.7.3.2.9 1 1.1 1.3s6.1 8.1 6.1 8.1c.2.3.7.3.9 0s-.1-.7-.2-.9c-.4-.6-8.3-11.5-8.3-11.5s-.6-.9-.7-1.1c-.3-1.1 0-2.3 1.1-2.7s1.9.3 2.6 1.1c.3.3 8.3 11.5 8.3 11.5.2.2.3.3.5.3.3 0 .5-.4.4-.7-.1-.2-.5-.9-.5-.9L11.8 9c-.6-1-.9-2-.1-3 .7-.8 2.2-1.3 3-.2.3.3 10.1 14.3 10.1 14.3.2.2.5.4.7.3.5-.1.3-.7.1-1-.1-.2-8.4-11.8-8.4-11.8-.4-.9-.6-2 .2-2.8 1-1.1 2.5-.5 3.3.5.2.3 1 1.4 1 1.4l2.7 3.7c.1.2 3.4 4.4 3.8 4.8.9 1.1 1.8 2.2 2.7 3.2l.5.5c.1.1.1.4.1.8 0 1.3.1 2.6.1 3.9 0 .2.1.4.2.6.3.3.6.1.7-.2.1-.2 0-2.4 0-2.7-.3-.3-.5-1.3-.4-2.9zM12.2 46.9s-2.8-.8-4.8-2.7-2.6-2.7-2.8-3-1.8-3-2-3.6c-.2-.5-.2-.7.2-1 .4-.4 1-.5 1.3.1.1.2.4 1 .5 1.2s1 1.9 1.7 2.8 1.6 2.2 4.4 3.8c.6.3 1.2.6 1.9.9.3.1.6.2.8.4.1.2.1.6-.1.8-.2.4-.7.4-1.1.3zM7.1 30.7l.9 3.1c.3.7 1.1 2.3 1.9 3.3s2.4 2.6 3.4 3.2 2 1.1 3 1.5c1 .3 1.1.4 1.2.5.3.4.2 1.2-.4 1.3-.2 0-1.2 0-1.8-.3L12 41.7c-.5-.4-3.9-3.1-5.1-6S5.3 31 5.2 30.4s-.2-1.1 0-1.4c.3-.4.9-.8 1.3-.3.2.3.3.6.3.9.1 0 .2.8.3 1.1zm26.8-25s.2-.1.5-.1.8.3 1.4.7 1.9 1 3.6 2.9 2.9 3.9 3.4 5.8c.5 1.8.8 3.1.9 5.5 0 .5.1 1.6 0 1.7-.2.5-.5.7-1 .7-.6 0-.7-.5-.7-1l-.1-2.9c-.1-.6-.3-1.9-.7-2.9-.3-1-.7-2.3-1.7-3.6-.9-1.3-2.1-2.8-3.2-3.5l-2.4-1.5c-.6-.6-.7-1.2 0-1.8zm4.9-2.5s.3-.2.5-.1c.2 0 .7.3.9.4s2.1 1.3 3.6 3c1.5 1.6 3.5 5.1 3.7 7.4.1.4.2.9 0 1-.2.2-.4.4-.7.4-.2 0-.5 0-.7-.1-.1-.2-.4-1.1-.4-1.3s-.6-2-1.1-3.1C44 9.7 43.5 8.5 42 7.1s-2.2-1.9-2.8-2.2-1.1-.6-1.1-1c.1-.3.3-.6.7-.7z"/>
          </svg>
        `;
      ]]]

Tu dois remplacer le svg après <path class="${state}". Les styles CSS sont a personnalisé si tu veux faire un truc un peu plus fin.

Pour revenir sur le button-card, bien évidemment faut remplace l’icon dans la clé template pour charger ta nouvelle icon !

Bonjour @kaoru ,
Pourrais-tu expliquer, s’il te plait comment tu as fait pour récupérer les infos la bbox ?

Que faut il mettre comme paramètres pour ces valeurs ?

bbox_password: [REDACTED]
bbox_update_data: "ssh -o StrictHostKeyChecking=no -i /config/.ssh/id_rsa hass@localhost /usr/bin/python3 /usr/share/hassio/homeassistant/python/bbox_sensor.py"
bbox_ha_api_token: "Bearer [REDACTED]"

Merci :wink:

Bj
@Ludoc
a la vue de la capture , je dirais avec ceci, tu as essayé ?

le script qui parle se trouve sur son git

cela pourait d’aider de la maniere pour mettre en place

Hello @Nothing ,
J’ai bien installé le script et le custom component, par contre je ne sais pas quoi mettre dans l’api token.
L’intégration bbox n’est pas fonctionnelle et ne remonte rien.

pour api je viens de trouvé ceci
https://www.assistance.bouyguestelecom.fr/s/forum/question/0D5080000BVhBoPCQV/nouveautés-gestion-de-lapi-des-bbox-sagem-fast5330b-et-sagem-fast5330br1

et ceci chez BB
https://developer.bouyguestelecom.fr/news/router-api-summary

Celui ci peut etre interressant
https://bertrandmartel.github.io/bboxapi-router/?kotlin#introduction

Bonjour

je l’utilisais par le passé, mais l’intégration bbox ne fonctionne plus depuis longtemps.
si tu veux les débits de ta ligne internet, il faut maintenant passer par Speedtest

Intégrer Speedtest CLI Officielle à Home Assistant - Home Assistant - Tutoriels & Partages / Intégration - Home Assistant Communauté Francophone (hacf.fr)

Merci @Nothing
J’ai essayé avec des commandes curl, j’ai que des erreurs, apparemment c’est le token api qui maque.
Je creuserai plus demain.

1 « J'aime »

Merci @LeLapinFou en fait j’aimerai plus que les tests de vitesse, je lache pas le morceau.

avec l’intégration, à part le uptime de la box, il n’y avait pas grand chose de plus.
le uptime de ta box peut être déterminé depuis quand ta ligne internet est up par exemple.
sinon quelles infos cherches tu sur ta box ?

Salut => Là dessus normalement tu as accès à tout https://api.bbox.fr/doc/apirouter/index.html#api-Device-GetDeviceCPU , après ça peut être les appels téléphoniques, les temps cpu, la place sur le disque dur…

Bonjour

En effet pour répondre a tout le monde, l’intégration BBox est KO et en plus manque de fonctionnalités

J’ai repris un code existant que j’ai améliorer pour l’intégrer bêtement à HA

Le bbox_password , c’est le MDP de l’ui que tu utilises bêtement

bbox_ha_api_token, il s’agit d’un token home assistant que tu génères dans l’interface

bbox_update_data, il s’agit d’une commande SSH pour exécuter le code python dans la machine hôte. Le code n’est pas exécuter directement par home assistant car le code python a des dépendances qui ne peuvent être satisfaite directement depuis HA

Home assistant lance en ssh sur la machine hôte le code python
Le code python se connecte a la box via api avec le mot de passe admin, il récupère les datas et ensuite il envoie via l’API home assistant en utilisant un token

Si tu galères avec la commande SSH, tu peux l’exécuter le script de manière périodiques via une cron

Hello,

merci pour la réponse.
Tu parles bien de ce fichier, sur ton github ?

shell_command:
  bbox_update_data: !secret bbox_update_data

automation:
  - alias: bbox_update_data
    trigger:
      - platform: time_pattern
        minutes: '/1'
    action:
      - service: shell_command.bbox_update_data