Zo maak je een dashboard voor je domoticasysteem

Door: koen-vervloesem | 18 januari 2021 09:10

How To

Je domoticasysteem stuur je in veel gevallen aan via een webinterface op je laptop of een mobiele app op je smartphone. Maar altijd toegang tot je domoticasysteem hebben via een klein schermpje aan de muur is zeker zo handig. In dit artikel installeren we Homepoint op een M5Core-microcontrollerbordje met een schermpje van 2 inch en knoppen, en integreren we dit met je domoticasysteem via MQTT.

Domoticasystemen zoals Home Assistant zijn voorzien van een webinterface waarmee je je apparaten kunt aansturen en hun status kunt bekijken. Dat is handig op je laptop of zelfs op een smartphone, maar dan moet je die wel altijd bij de hand hebben om die interface te openen. Hetzelfde geldt voor de mobiele apps van domoticasystemen: je pakt je smartphone, ontgrendelt hem en opent de app. Toch heel wat handelingen. Wat als je direct de temperatuur buiten wilt bekijken of je rolluiken omlaag wilt doen?

Een alternatieve oplossing is een apparaatje dat als enige taak heeft om als dashboard voor je domoticasysteem te dienen. Dat kan een klein microcontrollerbordje met schermpje en enkele knoppen zijn, dat je aan je muur hangt of in een kast zet. Het dashboard geeft continu de status van je domoticasysteem weer en reageert onmiddellijk op een druk op een van de knoppen. In een ideale wereld zou elk domoticasysteem minstens één dashboard per verdieping moeten hebben dat geen andere taken heeft.

Meer lezen?

Vanuit dit artikel wordt diverse keren verwezen naar de basiscursus MQTT.

01 M5Stack Core

Je kunt zo’n apparaatje zelf in elkaar knutselen met een microcontrollerbordje, een schermpje en wat knoppen, maar als je het in de woonkamer wilt gebruiken, wil je niet dat er allerlei losse draadjes en printplaatjes te zien zijn. M5Stack, een jong Chinees bedrijf, biedt allerlei producten aan die gebouwd zijn rond een ESP32-microcontroller, die er niet als een ontwikkelbordje uitzien. Vooral interessant is de M5Stack Core BASIC Kit: een modulair, stapelbaar ESP32-bordje met een lcd-scherm van 2 inch en drie knoppen in een sobere behuizing. Die ziet er niet slecht uit in je woonkamer. De module is heel compact: 13 mm hoog, en 54 mm lang en breed.

Er bestaat ook een standaard voor waardoor je het doosje rechtop kunt zetten (licht naar achteren leunend). Dat is ideaal om de M5Stack Core op een kast of tafel te plaatsen en zo het schermpje te kunnen lezen. De M5Stack Core en bijbehorende modules zijn in diverse webwinkels te vinden, ook in Nederland. De BASIC Kit kost rond de 28 euro. Let op: er is ondertussen ook een nieuw model uit, de M5Core2, maar dat is nog niet compatibel met de software die we in deze masterclass gebruiken.

01 De M5Stack Core is een handig doosje met ESP32-microcontroller, lcd-scherm en knoppen.

02 Homepoint

Een van de programma’s die je op de M5Stack Core kunt installeren, is Homepoint. Het biedt een interface om een op MQTT gebaseerd domoticasysteem aan te sturen en de status van sensors te tonen. Homepoint is firmware die je op de ESP32-microcontroller installeert, nadat je eerst configureert welke sensors en (licht)schakelaars van je domoticasysteem je wilt opnemen in je dashboard. De installatie gebeurt met het programma esptool, en daarvoor heb je op zijn beurt Python nodig.

02 Met Homepoint maak je van je ESP32-microcontroller een dashboard voor je domoticasysteem.

03 Python installeren

Gebruik je macOS of Linux, dan is Python normaal al standaard geïnstalleerd. Onder Windows download je de nieuwste Python-versie, op het moment van schrijven was dat Python 3.9.0. Kies de executable installer voor 64 bit (x86-64) of 32 bit (x86), afhankelijk van je Windows-versie.

Vink in het eerste venster van het installatieprogramma Install launcher for all users en Add Python to PATH aan. Na installatie kun je controleren of Python correct is geïnstalleerd met de volgende opdracht in de Opdrachtprompt:

python --version

Je krijgt dan het versienummer van je Python-installatie te zien.

03 Om Homepoint te flashen heb je Python nodig.

04 Esptool installeren

De volgende stap is het installeren van esptool. Dat doe je met de volgende opdracht:

pip install esptool

Op sommige Python-installaties geeft dat een foutmelding. Probeer dan:

python -m pip install esptool

In veel Linux-distributies moet je dit commando uitvoeren:

pip3 install esptool

Na de installatie zou je esptool moeten kunnen uitvoeren en uitleg krijgen over alle mogelijke opties die het programma herkent:

esptool.py

04 Met esptool schrijf je nieuwe firmware naar een ESP32-microcontroller.

05 Firmware flashen

Download de recentste Homepoint-firmware van GitHub. Op het moment van schrijven was dat versie 0.0.4rc1. Download het bestand homepoint_release.zip en pak het uit. Je ziet diverse bestanden met de extensie .bin. Voor de M5Stack Core heb je het bestand homepoint_m5stack_full.bin nodig.

Sluit je M5Stack Core op je pc aan via een usb-c-kabel. Voer dan de volgende opdracht uit:

esptool.py write_flash -fs 4MB -fm dout 0x0 homepoint_m5stack_full.bin

Als alles goed gaat, krijg je nu te zien dat de firmware naar de ESP32-microcontroller wordt geflasht. Daarna herstart de microcontroller en krijg je op het scherm de naam van een draadloos accesspoint (HomePoint-Config) en een ip-adres te zien.

05 De firmware naar de M5Stack Core flashen gaat heel gemakkelijk.

06 Wifi-configuratie

Verbind met het accesspoint HomePoint-Config, bijvoorbeeld op je smartphone. Bezoek dan in je browser het getoonde ip-adres: http://192.168.99.1. Je krijgt de webpagina voor de initiële configuratie te zien.

Vul eerst het ssid en wachtwoord in van het accesspoint waarmee je je M5Stack Core wilt laten verbinden. Stel ook een gebruikersnaam (standaard admin) en een wachtwoord in om op de webinterface van Homepoint in te loggen. Daarna herstart je de M5Stack Core en krijg je als alles goed is bovenaan het schermpje het nieuwe ip-adres te zien, dat deze keer in het adresbereik van je eigen accesspoint ligt.

07 Ingebouwde webserver

Je configureert Homepoint volledig in één configuratiebestand, dat je via een ingebouwde webserver op de ESP32-microcontroller vanuit je browser kunt bewerken. Open dus het ip-adres dat je op het scherm ziet in je browser. Je krijgt dan links een hoop bestanden te zien. Dat zijn onder andere de icoontjes voor op het scherm, maar ook de css- en html-bestanden van de webinterface.

Selecteer je een bestand, dan krijg je rechts de inhoud te zien. Je kunt het ook vervangen door een ander bestand op je lokale schijf, of door een extra bestand uploaden naar de microcontroller: klik op Bladeren, selecteer je bestand en klik op Upload. Zo zet je dus de interface van Homepoint naar je hand.

07 De configuratie van Homepoint verloopt volledig in de browser.

08 Minimale configuratie

Tekstbestanden in het geheugen van de ESP32-microcontroller kun je ook in de webinterface bewerken. Dat is handig om de configuratie aan te passen, die zich in het JSON-bestand /config.json bevindt. Een minimale configuratie ziet er als volgt uit:

{
"wifi": "SSID",
"password": "WACHTWOORD",
"login": "LOGIN",
"webpass": "WWWACHTWOORD",
"mqttbroker": "mqtt://IP",
"mqttusername": "MQTT_GEBRUIKER",
"mqttpasswd": "MQTT_WACHTWOORD",
"timezone": "CET-1CEST-2,M3.5.0/02:00:00,M10.5.0/03:00:00",
}

Na de wifi-configuratie (die je in stap 6 hebt ingevoerd) zijn de eerste vier elementen en de tijdzone normaal gesproken al ingevuld. Dan blijft alleen de configuratie voor de MQTT-verbinding over waardoor Homepoint met je domoticasysteem kan communiceren. Vul daarom het ip-adres van je MQTT-broker in (zie ook de Basiscursus MQTT), en indien nodig een gebruikersnaam en wachtwoord als je MQTT-broker daarom vraagt. Klik daarna rechts op Save om je wijzigingen van de configuratie op te slaan en links op Reload om de configuratie opnieuw in te lezen. Als je een ongeldige MQTT-configuratie hebt ingevoerd, verschijnt er bovenaan rechts een rode streep door het icoontje van het huisje. Heb je een fout gemaakt in de JSON-syntaxis, dan verschijnt er ook een foutmelding.

08 Fouten in de JSON-syntaxis zijn snel gemaakt.

09 Sensor weergeven

Je ziet op het schermpje van je M5Stack Core zes vakjes. Elk van die vakjes biedt plaats aan twee sensors of aan één (licht)schakelaar. Laten we beginnen met een vakje te maken met de temperatuur en luchtvochtigheid van een sensor. We geven een voorbeeld van een temperatuur- en luchtvochtigheidssensor die we met rtl_433toMQTT (zie ook de Basiscursus MQTT) uitlezen en waarvan we de metingen naar MQTT-boodschappen omzetten.

In het configuratiebestand voegen we achter de regel met de tijdzone een scène toe voor onze diepvries met twee sensors:

"scenes": [{
"name": "Diepvries",

"type": "Sensor",

"devices": [{
"name": "Temperatuur",

"type": "singleValue",
"jsondata": false,
"firstIcon": "temperature_small",

"getTopic": "rtl433/Oregon-THGR122N/1/218/temperature_C"
},
{
"name": "Luchtvochtigheid",
"type": "singleValue",

"jsondata": false,
"firstIcon":"humidity_small",
"getTopic": "rtl433/Oregon-THGR122N/1/218/humidity"
}]
}]

Let goed op dat je alle haakjes en komma’s correct plaatst. Zorg ook dat de regel met de tijdzone hiervoor echt met een komma eindigt, en dat het hele bestand met een gesloten gekruld haakje } eindigt.

We definiëren hier dus een scène met de naam Diepvries en type Sensor. Daaraan kennen we twee apparaten toe. Het eerste geeft de waarde van een MQTT-boodschap met onderwerp rtl433/Oregon-THGR122N/1/218/temperature_C weer met een temperatuuricoontje en het tweede geeft de waarde van een MQTT-boodschap met onderwerp rtl433/Oregon-THGR122N/1/218/humidity weer met een vochtigheidsicoontje. Klik na je wijzigingen op Save en herlaad de configuratie. Als je dan even wacht tot de sensors weer een waarde hebben uitgestuurd, zie je in het vakje linksboven de temperatuur en vochtigheid in je diepvries verschijnen.

09 In elk vakje van Homepoint is plaats voor de gegevens van twee sensors.

10 JSON-sensor weergeven

Sommige multisensors sturen hun waardes niet elk naar een afzonderlijk MQTT-onderwerp, maar in de vorm van een boodschap met JSON-inhoud. Draai je bijvoorbeeld het programma system_sensors dat data over je Raspberry Pi via MQTT stuurt, dan ziet de inhoud van zo’n boodschap er als volgt uit:

{"temperature": 55.0, "disk_use": 96.2, "memory_use": 47.4, "cpu_usage": 13.6, "swap_usage": 0.0, "power_status": "Everything is working as intended", "last_boot": "2020-08-25T23:26:22+02:00", "last_message": "2020-10-14T15:19:31.571775+02:00", "updates": 0}

Met de volgende configuratie in Homepoint tonen we de temperatuur en het schijfverbruik:

{

"name": "Raspberry Pi",
"type": "Sensor",
"devices": [{
"name": "Temperatuur",
"type": "combinedValues",
"jsondata": true,
"firstIcon": "temperature_small",
"secondIcon": "wattage_small",
"firstKey": "temperature",
"secondKey": "disk_use",
"getTopic": "system-sensors/sensor/pi-red/state"
}]
}]

Let op: deze code komt ná de vorige scène, dus daar vervang je de blokhaak ] door een komma , en de blokhaak ] op het einde van de tweede scène sluit de lijst met scènes af, waarna het hele bestand weer eindigt met een gesloten gekruld haakje }.

Je ziet dat we in deze scène maar één apparaat definiëren, omdat het van type combinedValues is. Door jsondata op true te zetten, geven we aan dat de eerste getoonde waarde die van de JSON-sleutel temperature is en de tweede die van de sleutel disk_use. Sla dit op en herlaad de configuratie, daarna toont Homepoint na een minuut de temperatuur en het schijfgebruik van je Raspberry Pi in het tweede vakje.

11 Schakelaar toevoegen

Op dezelfde manier kun je ook een schakelaar in een vakje van het Homepoint-scherm tonen. Als je die schakelaar activeert, stuurt Homepoint een boodschap naar je MQTT-broker om een apparaat in te schakelen.

Voeg bijvoorbeeld de volgende scène toe:

{
"name": "Badkamer",
"type": "Light",
"icon": "door",
"devices": [{
"name": "Badkamerlicht",
"setTopic": "zwave/Bathroom/Bathroom_light/38/1/0/set",
"getTopic": "zwave/Bathroom/Bathroom_light/38/1/0",
"onValue": "99",
"offValue": "0"
}]
}]

Let er ook hier weer op dat je de haakjes en komma’s correct plaatst. We voegen hier dus een apparaat met de naam Badkamerlicht aan toe. De waarde van getTopic is het MQTT-onderwerp waarop de lamp zijn status (aan of uit) doorgeeft, terwijl de waarde van setTopic het MQTT-onderwerp is waarmee je de status van de lamp verandert. De waarde van onValue is de waarde voor een ingeschakelde lamp en offValue voor een uitgeschakelde lamp.

12 MQTT-boodschappen

Het voorbeeld van de lamp, werkt ook voor een ander soort schakelaar, zoals het aansturen van een pomp met Homepoint. Alleen verander je dan het type apparaat van Light naar Switch. Het juiste MQTT-onderwerp en de waardes vereisen bij (licht)schakelaars wel iets meer aandacht dan sensors. Want Homepoint werkt voor schakelaars niet met JSON-boodschappen.

Gebruik je bijvoorbeeld Zwave2Mqtt (op onze website vind je een cursus over de configuratie van Zwave2Mqtt, ga dan naar de instellingen van de gateway. Als je bij Payload type de optie Entire Z-Wave value Object hebt gekozen zoals we in die cursus aanraadden, krijg je een maximale hoeveelheid informatie te zien, maar dat is in het JSON-formaat waar Homepoint niet mee overweg kan. Je verandert het payload-type dan het best naar Just value.

Welk onderwerp je nodig hebt om de status van je apparaat uit te lezen en de status te veranderen, kun je het best te weten komen door met een programma zoals MQTT Explorer (zie ook de Basiscursus MQTT) de MQTT-boodschappen die je broker ontvangt te bekijken. Maak je gebruik van Zwave2Mqtt, dan is het onderwerp om een schakelaar te veranderen hetzelfde als het onderwerp dat een statusverandering communiceert, maar dan met /set erachter.

12 Stel in Zwave2Mqtt in dat MQTT-boodschappen geen JSON gebruiken.

13 Schakelaar in je dashboard

Als je alles correct hebt geconfigureerd, zou het icoontje van je schakelaar nu oranje moeten worden als je zelf je lamp inschakelt en weer wit als je de lamp uitschakelt. Maar Homepoint kun je ook als schakelaar inzetten, namelijk met de drie knoppen onderaan.

Met de middelste knop selecteer je het volgende vakje op het dashboard en met de linkerknop het vorige vakje. Heb je een vakje geselecteerd (de naam wordt dan oranje), dan schakel je de lamp in met een druk op de rechterknop. Het icoontje wordt dan ook oranje omdat de status van je lamp nu aan is. Met nog eens een druk op dezelfde knop schakel je je lamp uit en wordt ook het icoontje weer wit.

13 Naast sensors kan Homepoint ook (licht)schakelaars tonen.

14 Meerdere schakelaars in één groep

Homepoint kan ook meerdere (licht)schakelaars in één groep weergeven. Voor de configuratie van de badkamerlamp hebben we namelijk een scène Badkamer gemaakt met toevallig één apparaat erin, maar daar kun je meerdere aan toevoegen. Voeg bijvoorbeeld deze configuratie toe met twee nachtlampjes in je slaapkamer:

{
"name": "Slaapkamer",
"type": "Light",
"icon": "bedroom",
"devices": [{
"name": "Lamp links",
"setTopic": "lights/hue/00:15:8d:00:01:94:60:2c-01/set/on",
"getTopic": "lights/hue/00:15:8d:00:01:94:60:2c-01/get/on",
"onValue": "true",
"offValue": "false"
},
{
"name": "Lamp rechts",
"setTopic": "lights/hue/00:15:8d:00:01:1f:a0:61-01/set/on",
"getTopic": "lights/hue/00:15:8d:00:01:1f:a0:61-01/get/on",
"onValue": "true",
"offValue": "false"
}]
}]

Als je nu de slaapkamer op het dashboard selecteert en dan een lange druk op de rechterknop geeft, krijg je een nieuw scherm te zien met de twee lampen en een icoontje Back. Je kunt nu de twee lampen individueel aansturen en hun status bekijken. Als je naar Back navigeert en op de rechterknop drukt, keer je terug naar het hoofdscherm. Als je in het hoofdscherm overigens kort op de rechterknop klikt bij een scène, worden alle schakelaars in die groep aan- of uitgeschakeld.

14 Je kunt ook voor elke kamer een groep met alle schakelaars maken.

15 En verder

De maker van Homepoint werkt ook aan ondersteuning voor HomeKit, het platform van Apple voor slimme apparaten. Verder ondersteunt Homepoint over-the-air-updates als er nieuwe versies van de firmware uitkomen. Je opent dan gewoon de webinterface van Homepoint op je apparaatje, selecteer het gedownloade firmwarebestand en klikt ernaast op Update firmware.

2 Reactie(s) op: Zo maak je een dashboard voor je domoticasysteem

  • Om te reageren moet je ingelogd zijn. Nog geen account? Registreer je dan en praat mee!
  • 12 februari 2021 15:40 ThomasT3
    Dit commando op bladzijde 78:
    esptool.py write_flash -fs 4MB -fm dout 0x0 homepoint_m5stack.bin

    Geeft deze foutmelding:
    PS C:\WINDOWS\system32> esptool.py write_flash -fs 4MB -fm dout 0x0 homepoint_m5stack.bin
    usage: esptool write_flash [-h] [–erase-all] [–flash_freq {keep,40m,26m,20m,80m}]
    [–flash_mode {keep,qio,qout,dio,dout}] [–flash_size FLASH_SIZE]
    [–spi-connection SPI_CONNECTION] [–no-progress] [–verify] [–encrypt]
    [–ignore-flash-encryption-efuse-setting] [–compress | –no-compress]
    <address> <filename> [<address> <filename> …]
    esptool write_flash: error: argument <address> <filename>: [Errno 2] No such file or directory: 'homepoint_m5stack.bin'
    PS C:\WINDOWS\system32>

    Hoe voeg ik een file pad toe aan het commando?
    M5 burner laat enkel hun geselecteerde files toe!?
    Is er geen eenvoudige Windows burner? (Tasmotizer en Esp.Easy.Flasher geven foutmelding)

    Groet, Thomas
    Wanneer je een reactie plaatst ga je akoord
    met onze voorwaarden voor reacties.
  • 15 februari 2021 17:53 ThomasT3
    Jammer, natuurlijk zijn we leer gericht en heb ik na Change Directory vanuit de fileopslag uiteindelijk de file kunnen uploaden.
    Nu probeer ik als test enkel met copy paste de “time” regel in de config.json in te voegen en krijg ik een foutmelding.
    Ook het Voorbeeld config bestand - met de juiste MQTT gegevens – geeft een foutmelding.
    De regels zijn van deze site gekopieerd en elke punt, komma en haakje is twee keer gecontroleerd.

    Tijd wijst nu 00:00 en telt slechts totdat het scherm in slaapstand gaat, wil door uploaden “Time” regel, tijd vasthouden. Logische gedachte toch?

    Ben eigenlijk wel benieuwd hoeveel lezers zo’n project nou in één keer gefikst krijgen?
    Is daar wel eens onderzoek naar gedaan?

    Nog iemand een idee hoe ik wél mijn M5stack alleen al van de juiste tijd kan voorzien?
    Wanneer je een reactie plaatst ga je akoord
    met onze voorwaarden voor reacties.

Wanneer je een reactie plaatst ga je akoord
met onze voorwaarden voor reacties.