Interrupteur tactile sous OpenHASP – Personnalisez votre domotique

Imaginez contrôler votre éclairage, votre chauffage ou encore vos stores d'un simple effleurement sur un écran tactile. Et tout ça sans investir des centaines d'euros dans des solutions propriétaires : avec OpenHASP et un ESP32, vous pouvez créer vos propres interfaces domotiques sur mesure et pour un prix contenu.

Mon aventure a commencé avec un besoin simple : contrôler l'ambiance lumineuse de ma baignoire avec un ruban LED RGB. Plutôt que d'opter pour un interrupteur classique ou une solution commerciale hors de prix, j'ai découvert OpenHASP. Résultat ? Un écran tactile personnalisable installé à la place de mon ancien interrupteur, pour moins de 50 €, qui permet une grande personnalisation et communique en MQTT avec les systèmes domotiques, basé sur un ESP32.

Choix du matériel

Pour réaliser ce projet, il nous faut un écran tactile qui sera connecté à un ESP32, vous trouverez une liste de matériel recommandé sur le site d'openHASP. Il est également possible de faire fonctionner le firmware sur d'autres écrans avec une personnalisation de celui-ci (pour les personnes qui ont un niveau averti).

Dans mon cas j'ai choisi un GS-T3E, car je voulais un écran au format interrupteur, alimenté en 230 V directement et qui possède 3 sorties 230 V contrôlables. Ainsi, je pouvais remplacer l'interrupteur actuel de ma salle de bain tout en gardant un contrôle du plafonnier en direct (la commande intégrée des relais n'est pas dépendante du réseau). Son coût était d'environ 30€ lors de l'achat.

Voici l'interface d'origine de l'écran, que j'ai juste regardé 10 secondes pour vérifier que l'écran fonctionnait avant de le flasher.

Flashage de l'écran

J'ai rapidement ouvert l'écran, sans difficulté, et vous allez y trouver différentes choses :

• Un port micro USB qui permet de flasher l'écran.
• Un bouton reset.
• Des bornes pour passer en mode flash (GND-IO0).

Voici comment procéder pour flasher l'écran :

1. Déclipser la partie 230V
2. Retirer la protection plastique pour accéder à la partie électronique
3. Déclipser la carte afin de pouvoir brancher le port micro USB à votre PC
4. Faire un pont entre la borne GND et IO0
5. Appuyer un coup sur le bouton key
6. Retirer le pont et direction votre navigateur

Sur votre navigateur (Edge ou Chrome), rendez-vous sur le site d'installation du firmware, sélectionnez l'écran et sélectionnez install en bas de la page. 30 secondes seulement après, le nouveau firmware est installé. Au redémarrage de l'écran, vous êtes invités à vous connecter au point d'accès Wifi afin de pouvoir configurer le réseau de votre domicile.

Configuration initiale

Une fois l'interrupteur connecté à votre réseau, vous pouvez accéder à son interface Web depuis son adresse IP, et vous obtiendrez les menus suivants :

• HASP Design: pour définir l'apparence générale, notamment le thème, les couleurs ou la police.
• Screenshot: pour voir ce qu'il y a actuellement à l'écran et naviguer entre les pages.
• Information: nous donne plein d'informations sur l'écran.
• Configuration: pour configurer les paramètres de l'écran, dont le Wifi, le MQTT, les GPIO....
• Firmware Update: pour mettre à jour le firmware.
• File Editor: pour éditer les fichiers, d'en supprimer et rajouter.
• Restart: pour redémarrer l'écran.

Le modèle GS-T3E que j'utilise intègre 3 relais physiques 230V, mais OpenHASP ne les reconnaît pas automatiquement après le flashage. Il faut donc les déclarer manuellement dans le système pour pouvoir les contrôler.

Dans le menu Configuration, vous devez définir les GPIO pour utiliser les 3 sorties relais de l'écran dans GPIO Settings, ensuite Add New Pin Output et sur cette page il vous faut définir les numéros de Pin 45, 46 et 44
Vous vous demandez peut-être pourquoi précisément les pins 45, 46 et 44 ? Ces valeurs ne sont pas arbitraires.

C'est le câblage physique du GS-T3E qui impose ces numéros. Les concepteurs de cet écran ont choisi de connecter :

• Le relais 1 à la GPIO 45
• Le relais 2 à la GPIO 46
• Le relais 3 à la GPIO 44

Ces informations proviennent de la documentation technique du matériel et de la communauté OpenHASP qui a analysé le circuit imprimé.

Le champ "Group" permet ensuite de regrouper logiquement ces GPIO. En choisissant Group 1, 2 et 3, vous pourrez envoyer des commandes simples comme hasp/plate01/command/output1 ON pour activer le premier relais. J'ai simplement choisi le même numéro de groupe que celui du relais pour plus de simplicité à l'usage.

Pour résumer chaque relais est câblé à une broche GPIO spécifique de l'ESP32. En configurant ces GPIO dans l'interface web, vous créez un pont logiciel entre votre interface tactile (ou votre box domotique via MQTT) et les relais physiques. C'est comme dire à OpenHASP : "Quand je t'envoie la commande Group 1, active la pin 45 qui contrôle le relais 1".

Cette configuration vous permet de garder un contrôle direct et local de vos équipements, même en cas de perte de connexion réseau : l'écran tactile peut toujours actionner les relais indépendamment de votre box domotique.

Personnalisation de l'interface

Maintenant, le vrai travail commence ! Direction File Editor afin de définir votre affichage. Ici, il faut éditer le fichier page.jsonl. Il y a beaucoup de possibilités offertes, donc je vous renvoie à la documentation officielle pour découvrir l'ensemble des fonctionnalités. Vous y trouverez également des exemples et pourrez utiliser le simulateur, bien pratique.

Chaque ligne de ce fichier décrit un élément visuel (bouton, label, slider, etc.). Voici un exemple simple pour créer un bouton fonctionnel :

{"page":1,"id":1,"obj":"btn","x":10,"y":10,"w":220,"h":80,"text":"Plafonnier","toggle":true}

Décryptage de ce code :

• "page":1 : l'élément apparaît sur la page d'accueil
• "id":1 : identifiant unique de cet élément
• "obj":"btn" : c'est un bouton
• "x":10,"y":10" : position en pixels depuis le coin supérieur gauche
• "w":220,"h":80 : dimensions (largeur × hauteur)
• "text":"Plafonnier" : texte affiché sur le bouton
• "toggle":true : le bouton reste enfoncé quand on clique (comme un interrupteur)

Pour relier ce bouton à une action, vous devrez ensuite configurer dans Jeedom ou Home Assistant l'action à effectuer quand hasp/plate01/state/p0b1 change d'état. Le simulateur en ligne mentionné dans l'article est parfait pour tester vos designs avant de les déployer !

Commencez simple avec quelques boutons, puis enrichissez progressivement avec des couleurs, icônes et pages multiples une fois que vous maîtrisez la syntaxe de base.

Intégration domotique

Maintenant que vous avez un début d'interface, il va falloir intégrer cette dernière à votre système domotique.

Pour les utilisateurs d'Home Assistant, cela est très bien expliqué dans la documentation officielle.

Mais si comme moi vous utilisez Jeedom, il existe un plugin qui est plutôt bien fait et dont voici la documentation qui explique bien sa configuration.

Voici une petite galerie d'exemple de design que j'ai réalisés ainsi que d'une vidéo du contrôle du bandeau LED qui marche avec WLED.

Conclusion

Voilà, vous avez désormais un interrupteur tactile totalement personnalisable pour moins de 50 €. Le projet OpenHASP offre des possibilités infinies : multipage, widgets météo, contrôle multimédia...

Cette solution vous offre un contrôle complet de l'interrupteur et permet une intégration simple avec les système domotique. L'architecture modulaire permet facilement d'ajouter de nouvelles fonctionnalités ou d'adapter à vos besoins spécifiques.

N'hésitez pas à partager vos créations ou venir chercher de l'aide avec la communauté sur le groupe Telegram ou bien en commentaire !