NSPanel ui lovelace

Bonjour,
Je souhaite vous présenter mon modeste projet réalisé à l’aide mon NSPanel de chez Sonoff. L’idée de départ était de domotiser ma chaudière qui était pilotée par un thermostat avec un contact sec. Je souhaitais surtout que n’importe qui dans la famille puisse régler le nouveau thermostat connecté de manière simple. Le NSPanel servira à cela dans un premier temps.

première étape : flasher le sonoff avec Tasmota. J’utilise cette clé USB pour flasher tous mes devices sonoff : DSD Tech USB vers TTL Adaptateur Série avec Puce FTDI FT232RL.
cle

On démonte l’écran du NSPanel, on branche 4 fiches :

  • Tx vers Rx
  • Rx vers Tx
  • ground vers ground
  • Vcc vers Vcc
    Pour le flasher, je vais directement sur le github et j’utilise le web Installer qui fonctionne parfaitement.

Il ne reste plus qu’à configurer le NSpanel pour accueillir NSPanel ui lovelace correctement en suivant la doc ici..

Une fois fait, il ne reste plus qu’à l’aide du file editor dans Home Assistant pour modifier le fichier Yaml :
/config/appdaemon/apps/apps.yaml

Ceci m’a permis d’avoir les écrans suivants :
Screensaver :


Il y a :

  • en haut à gauche : un retour visuel si ma machine à laver est en marche
  • en haut à droite : un retour visuel si mon sèche-linge est en marche
  • Date et Heure
  • la météo annoncée pour demain
  • la température que je récupère sur un thermomètre intérieur (il passe en rouge si ma chaudière est allumée)
  • la température que je récupère sur un thermomètre extérieur
  • le temps de trajet en temps réel (waze) pour aller au travail
  • le temps de trajet en temps réel (waze) pour aller à la crèche
    Voici le code de cette carte :
    screensaver:
      theme:
        date: [255,255,255]
        background: [0,0,0]
        time : [255,255,255]
      statusIcon1:
          entity: binary_sensor.is_washing_machine_running
          icon:
                "on": mdi:washing-machine
                "off": mdi:washing-machine
          color:
                "on": [255,0,0]
                "off": [0,0,0]
      statusIcon2:
          entity: binary_sensor.is_tumble_dryer_running
          icon:
                "on": mdi:tumble-dryer
                "off": mdi:tumble-dryer
          color:
                "on": [255,0,0]
                "off": [0,0,0]
      entities:
        - entity: weather.forecast_maison
          type: 0
        - entity: sensor.capteur_salon_temperature
          name: Intérieur
          color: '{{iif(states("switch.prise_chaudiere") == "off", "[255,255,255]", "[255,0,0]")}}'
        - entity: sensor.capteur_exterieur_temperature
          name: Dehors
          color: '{{iif(states("sensor.capteur_exterieur_temperature") |float < 20, "[0,0,255]", "[255,165,0]")}}'
        - entity: sensor.waze_travel_time
          name: Travail
          icon: mdi:car
          color: '{{iif(state_attr("sensor.waze_travel_time","distance") < 30, "[0,255,0]", "[255,165,0]")}}'
        - entity: sensor.trajet_creche
          name: Crèche
          icon: mdi:car
          color: '{{iif(state_attr("sensor.trajet_creche","distance") < 15, "[0,255,0]", "[255,165,0]")}}'

Une première carte que je considère comme le menu principal :


J’ai donc 6 menus. En voici le code :

      - type: cardGrid
        title: Menu Principal
        entities:
          - entity: navigate.volume_bouilloire
            icon: mdi:kettle-steam
            name: Bouilloire
          - entity: navigate.cover_nuit
            icon: mdi:window-shutter
            name: Volets chambres
            color: [202, 26, 190]
          - entity: navigate.cover_jour
            icon: mdi:window-shutter
            name: Volets séjour
            color: [202, 26, 190]
          - entity: navigate.chauffage
            icon: mdi:fire-circle
            name: Chauffage
            color: '{{iif(states("switch.prise_chaudiere") == "off", "[255,255,255]", "[255,10,0]")}}'
          - entity: navigate.lumiere_nuit
            icon: mdi:lightbulb-outline
            name: Lum. chambres
            color: [255,128,0]
          - entity: navigate.lumiere_jour
            icon: mdi:lightbulb-outline
            name: Lum. séjour
            color: [255,128,0]

J’ai aussi 2 autres cartes :

  • une pour afficher des températures :
  • une carte pour afficher un QRcode qui permet à mes invités en le scannant de se connecter automatiquement à ma Livebox
    Ces cartes ci-dessus sont positionnées dans le fichier Yaml sous :
    cards:

Alors que celles décrites ci-dessous seront positionnées sous :

    hiddenCards:

Si on rentre dans le premier choix de ma page menu principal, on accède à des programmes pour lancer ma bouilloire avec une temporisation différente en fonction de la quantité d’eau que j’y mets. (oui je sais, ce genre de bouilloire existe mais je ne voulais pas en acheter une alors qu’avec une prise connectée j’obtiens le même résultat et je peux la lancer en auto dès mon réveil :slight_smile: )


Voici le code de cette carte :

      - type: cardGrid
        title: Volume bouilloire
        entities:
          - entity: input_button.bouilloire1
            icon: mdi:fraction-one-half
            name: "0.5"
          - entity: input_button.bouilloire2
            icon: mdi:circle-small
            name: "0.75"
          - entity: input_button.bouilloire3
            icon: mdi:numeric-1
            name: "1"
          - entity: input_button.bouilloire4
            icon: mdi:dots-horizontal
            name: "1.25"
          - entity: input_button.bouilloire5
            icon: mdi:mdi:kettle-steam-outline
            name: "1.5"
          - entity: input_button.bouilloire6
            icon: mdi:kettle-alert
            color: [255,0,0]
            name: "Max"
        key: volume_bouilloire

J’ai ensuite une carte pour gérer une famille de volets roulants :

      - type: cardEntities
        title: Volets Séjour
        entities:
          - entity: cover.cuisine1
          - entity: cover.cuisine2
          - entity: cover.salon
          - entity: cover.sejour
        key: cover_jour

Une carte pour certaines lumières :

      - type: cardGrid
        title: Lumières Séjour
        entities:
          - entity: light.lampe_buffet
            icon: mdi:floor-lamp
            name : Lampe buffet
          - entity: light.lampe_canape
            icon: mdi:floor-lamp
            name : Lampe canapé
          - entity: light.lumiere_salon
            icon: mdi:ceiling-light
            name : Lum salon
          - entity: light.lumiere_salle_a_manger
            icon: mdi:ceiling-light
            name : Lum salle à manger
          - entity: light.lumiere_balcon
            icon: mdi:ceiling-light
            name : Lum Balcon
        key: lumiere_jour

Une carte qui joue le rôle de thermostat :

      - type: cardThermo
        title: Chauffage
        entity: climate.chauffage
        key: chauffage

Je souhaitais simplement partager mon projet et peut-être aussi prendre des conseils mais aussi peut-être découvrir d’autres projets autour du NSPanel.

Merci pour votre lecture.

11 « J'aime »

Merci pour le partage :grinning:
J’y pense, mais se ne sera pas pour tout de suite…
@+ Guy

Bonjour

Merci pour le partage, du coup j’avais commencé à mettre esphome et j’ai continué avec la procédure pour esphome, j’arrive au même résultat.

Fred