Catégorie Tutoriels - Constellation

FriendLeaf : la serre connectée grâce à Constellation

Sebastien Warin — Tue, 17 Jul 2018 09:40:50 +0000

Plus besoin de disposer d’un espace extérieur pour faire pousser vos propres herbes aromatiques, salades et fleurs. Grâce à la serre connectée FriendLeaf, vous pouvez faire pousser plusieurs plantes et vous en occuper facilement.

Projet réalisé par Théo DELOOSE, Clara BOMY, Clément NOUGÉ, Mathieu GABRIEL, Marine DAEL et Thaï-Son DANG.

Introduction

Nous sommes six étudiants en troisième année à l’ISEN Lille. Dans le cadre de notre projet de fin d’année, nous avons conçu une serre connectée dédiée à un usage en intérieur. Celle-ci est équipée d’un système d’éclairage intelligent, d’une pompe d’arrosage automatique et d’un brumisateur intégré afin de garantir la bonne croissance des plantes, rassemblant les conditions nécessaires à leur développement. Pour une plus grande facilité d’utilisation, notre serre est associée à une application mobile simple et ludique permettant de suivre en temps réel les données de l’environnement de la serre et de contrôler celle-ci à distance.

En réalisant ce projet, notre but était de proposer une solution de serre connectée à un prix raisonnable et possédant une interface attrayante pour améliorer l’expérience de l’utilisateur.

De plus nous voulions que la serre puisse être intégrée dans différents systèmes facilement pour que l’utilisateur puisse utiliser les données à sa guise.

Fonctionnement général

Nous avons pensé FriendLeaf comme un système de monitoring et de pilotage. Il propose en effet de gérer automatiquement l’arrosage, l’humidité et la luminosité de la serre, ou bien de les activer manuellement à notre guise. Il synchronise les données récupérées par les différents capteurs grâce à la plateforme Constellation et active, par le biais d’un relais, les actionneurs. Enfin, FriendLeaf alerte l’utilisateur lorsque le réservoir d’eau est vide. Tout est synchronisé en temps réel comme par magie grâce à Constellation.

Nous avons donc ajouté dans la serre les capteurs permettant de relever les informations sur l’humidité de l’air et du sol, sur la température et sur la luminosité. L’équipement installé comporte aussi une guirlande lumineuse ayant pour but d’éclairer et d’afficher les alertes, une pompe pour le système d’arrosage et un brumisateur permettant d’humidifier l’air.

Matériel utilisé

Pour réaliser notre projet, nous nous sommes servis des composants suivants :

Pour la Serre :

Serre SOCKER Ikea (12,99€), Ikea
Bac pour le terreau (1,50€), Jardinerie
Carte Raspberry Pi 3B (40,80€), Amazon
Relais 4 canaux supportant jusqu’à 5A et 250V (AC) et 30V (DC) (9,99€), Amazon
Câbles de connexion
Boîte de dérivation

Pour les capteurs :

Humidité et température air : DHT11 (1,31€), Amazon
Luminosité : TSL2561 (6,95€), Gotronic
Humidité sol : GT110 (2,40€), Gotronic
Niveau d’eau : Gravity SEN0205 (10,50€), Gotronic

Pour le brumisateur :

Un émetteur à ultrasons (9,89€), Amazon
Une alimentation pour le brumisateur (24V DC, 1A) (25€), Derotronic, Lille
Un bol

Pour le système d’arrosage :

Une pompe à eau (5,48€), Amazon
Une alimentation 12V 600mA (12€), Derotronic, Lille
Un jerrican (environ 10€)
Un tuyau (ø7mm -ø10mm), Diall

Pour l’éclairage :

2m de guirlandes lumineuses (1m LED et 1m incandescent), Blachère
Une alimentation pour fil lumière, Blachère
Colliers de serrage

Conception de la serre

Étape 1 : Préparation de la serre

Dans la serre, nous avons disposé les capteurs, le pot et un bol pour le brumisateur. Nous avons également percé des trous pour pouvoir faire passer tous les capteurs et le tuyau d’arrosage.

Pour ce qui est de la guirlande lumineuse, il nous a fallu percer quelques trous supplémentaires dans les montants de la serre pour y glisser les colliers de serrage.

Étape 2 : Branchement du relais

Afin de pouvoir contrôler les actionneurs, nous avons branché le relais quatre canaux à une carte Raspberry Pi.

Celui-ci est analogue à un interrupteur. Pour chaque canal, une alimentation est nécessaire et chacun d’entre eux peut être piloté individuellement grâces aux différents pins dont dispose le relais. Il faut également prévoir une masse que l’on branche sur le pin “Gnd” du relais.

Par défaut, lorsque les pins d’entrée ne sont pas alimentés, les canaux du relais délivrent la tension d’alimentation correspondante sur la sortie NC (“Normally Closed”) ou sur la sortie NO (“Normally Open”) dans le cas contraire.

Etape 3 : Éclairage de la serre

Pour l’éclairage de notre serre, nous avons percé des trous dans la structure et fixé la guirlande avec des colliers de serrage. Celle-ci doit être alimentée par une tension de 230V (tension secteur) et est composée d’un mètre de LEDs rouge et d’un mètre incandescent jaune.

Elle est connectée au relais par la phase et le neutre, chacun branchés sur un canal différent, afin d’isoler totalement la guirlande du secteur et ainsi éviter tout problème avec le reste des composants.

Etape 4 : Installation du brumisateur

Pour augmenter l’humidité de l’air dans la serre, nous avons installé un brumisateur fonctionnant par émissions d’ultrasons. Il nécessite une alimentation de 24V/1A maximum. On le relie ensuite au relais. La masse est directement connectée à l’adaptateur secteur par le biais d’un domino.

Etape 5 : Installation du système d’arrosage

En ce qui concerne l’arrosage, nous disposons d’une pompe submersible qui nécessite une alimentation de 12V et 400mA. Elle est branchée en sortie à un tuyau percé pour un arrosage homogène. Nous la connectons ensuite à un des canaux du relais.

Pour le réservoir, nous avons récupéré un bidon de vinaigre de 5L sur lequel nous avons fait un trou pour le capteur de niveau d’eau et une ouverture pour le remplir et y faire passer la pompe.

Pour résumer…

Étape 6 : Mise en place des capteurs et paramétrage de la carte Arduino

Nous installons à présent les capteurs d’humidité/température de l’air, d’humidité du sol, de de luminosité et de niveau d’eau. Nous branchons tous ces capteurs aux pins de la Raspberry ou de l’Arduino en faisant attention au fait que :

Les capteurs d’humidité du sol et de niveau d’eau se branchent sur du 5V.
Les capteurs d’humidité/température de l’air et de luminosité sont alimentés en 3,3V.

Étape 6.1 : Capteur d’humidité et de température de l’air

Le capteur d’humidité et de température de l’air fournissant des données numériques, nous le relions directement à notre Raspberry Pi comme montré sur le schéma ci-dessous :

Étape 6.2 : Capteurs de luminosité, d’humidité du sol et de niveau d’eau

Ces capteurs fournissant des données analogiques, nous les avons branchés à une carte Arduino nano qui permet de lire ces données, contrairement à la Raspberry. Elle est reliée directement par USB à la Raspberry Pi comme montré ci-après :

Étape 6.3 : Programmation de la carte Arduino

Dans l’IDE Arduino, nous avons donc commencé par programmer la carte.

Nous ajoutons tout d’abord les librairies d’Adafruit pour pouvoir initialiser le capteur de luminosité et régler le temps d’intégration des données. Dans le gestionnaire de bibliothèque (menu Croquis > Inclure une bibliothèque), nous avons installé les librairies suivantes :

Adafruit Unified Sensor
Adafruit TSL2561

Au démarrage, dans la méthode “setup()”, nous configurons les pins utilisés. Nous décidons d’utiliser les pins analogiques A0 et A1, respectivement pour le capteur d’humidité du sol et du niveau d’eau et les pins A4 et A5 pour le capteur de luminosité :

void setup(void) 
{
  Serial.begin(9600);
 
  /*Réglage du capteur de luminosité*/
  if(!tsl.begin()) //Initialisation du capteur
  {
    //S'il y a un problème pour détecter le capteur, vérifier votre connexion
    Serial.print("Ooops, pas de capteur détecté... Vérifier votre connexion!");
    while(1);
  }
  
    //Configuration du gain du capteur et du temps d'intégration
    tsl.enableAutoRange(true);          
    tsl.setIntegrationTime(TSL2561_INTEGRATIONTIME_13MS);    
 
}

Dans la méthode “loop()”, nous recueillons ensuite les valeurs des capteurs et les faisons afficher sur le Monitor Série en utilisant les commandes analogRead() et Serial.print() :

void loop(void) 
{  
  /*Pour recevoir une nouvelle donnée par le capteur de luminosité*/ 
  sensors_event_t event;
  tsl.getEvent(&event);
 
  //Lecture des pins analogiques pour les données des capteurs d'humidité du sol et de niveau d'eau
  Hum_value = analogRead(A0);
  Liquid_value=analogRead(A1);
 
  //Affichage des valeurs sur le Moniteur série
  Serial.print(event.light,0);
  Serial.print(',');
  Serial.print(map(Hum_value,0,1024,0,100)); //Le capteur d'humidité renvoie une valeur en pourcentage 
  Serial.print(',');
  Serial.println(map(Liquid_value,0,512,0,1)); //Le capteur de niveau d'eau retourne la valeur 1 quand il est en contact avec l'eau, 0 sinon
  delay(5000); //Retard de 5s pour éviter de surcharger le buffer de la Raspberry 
}

Nous récupèrerons ensuite les données des différents capteurs à l’aide de la carte Raspberry Pi.

La programmation vers Constellation

La programmation vers Constellation est divisée en deux packages : le premier correspond à la récupération des données des capteurs et à l’activation des actionneurs, le second a été créé pour gérer le stockage des données en vue de créer des graphiques sur notre application.

Etape 1 : Package relatif aux capteurs et actionneurs

Etape 1.1 : Acquisition des données des capteurs

Pour récupérer les données des différents capteurs cités précédemment, nous avons utilisé la librairie “Adafruit_DHT” pour Raspberry Pi et la librairie “serial” qui permet de faire le lien entre l’Arduino-Nano et la Raspberry Pi. Ces valeurs vont nous permettre de décider s’il faut activer ou non les actionneurs tels que la pompe, le brumisateur ou les LED.

La fonction ci-après permet de récupérer les valeurs des différents capteurs.

def getCapteur():
    humiditeAir, temperature = Adafruit_DHT.read_retry(11,4)
    lux, humiditeSol, eau = ser.readline()[:-2].split(",")

Nous avons ensuite créé un State Object rassemblant les valeurs d’humidité du sol, d’humidité de l’air, de température et de luminosité ambiante pour pouvoir les publier sur notre Constellation.

Constellation.PushStateObject("Capteurs", {"HumiditeSol": int(self.humiditeSol), "HumiditeAir": int(self.humiditeAir), "Temperature": int(self.temperature), "Luminosite": int(self.lux)}, "CapteursInfos")

Etape 1.2 : Activation et désactivation des différents actionneurs (brumisateur, guirlande lumineuse et pompe à eau)

Comme mentionné précédemment, les actionneurs sont reliés à la Raspberry Pi via un relais quatre canaux. Cela simplifie grandement la programmation : il nous suffit simplement de gérer l’ouverture et la fermeture des relais.

Nous avons donc fait en sorte que chaque actionneur soit associé à son relais grâce à la librairie GPIO de la Raspberry Pi. Ainsi, le code diffère seulement au niveau des numéros des pins utilisés par les actionneurs.

Voici un exemple du code de l’activation et de la désactivation de notre pompe :

GPIO.setmode(GPIO.BOARD)
GPIO.setup(12,GPIO.OUT)
GPIO.output(12,0)

Le pin 12 de la Raspberry est celui relié au relais contrôlant la pompe.

Etape 1.3 : Automatisation des actionneurs

Pour réaliser la fonction d’automatisation, nous nous sommes tout d’abord renseignés sur les conditions propices à la bonne croissance des plantes au niveau de l’humidité du sol et de l’air, de la luminosité et de la température de l’air.

Pour le brumisateur, nous avons choisi de l’activer si l’humidité est inférieure à 35% et de le désactiver si l’humidité remonte au dessus de 37%.

if humiditeAir > 37 and brumisateur:
    DesactiverBrumisateur()
elif humiditeAir < 35 and not brumisateur:
    ActiverBrumisateur()
    time.sleep(1)

Pour la pompe, le fonctionnement est différent. Puisque la diffusion de l’eau dans la terre est plus lente, nous activons la pompe pendant 5s avant de la désactiver pendant 30s pour laisser le temps au capteur de ressentir les changements.

if humiditeSol < 30 and not pompe:
    if self.ticks == 0:
            if self.next_water == 0:
                    ActiverPompe()
            self.next_water = 15
        else:
                    self.next_water -= 1
        elif humiditeSol > 30:
                    self.next_water = 0
    elif pompe:
            self.ticks += 1
               if self.ticks >= 3:
                    DesactiverPompe()
                       self.ticks = 0
time.sleep(1)

Ces différentes fonctions sont exécutées dans des threads séparés pour ne pas que le code soit bloquant.

Maintenant, il ne reste plus qu’à sécuriser notre système d’arrosage via le capteur de niveau d’eau. Connecté à la carte Arduino nano, ce capteur va nous renvoyer 1 s’il y a de l’eau dans le réservoir, 0 sinon.

Les données du capteur de niveau d’eau nous permettent d’arrêter le système d’arrosage lorsque le réservoir est presque vide et d’informer l’utilisateur via un PushBullet et l’allumage des LEDs qu’il faut remplir le réservoir.

Constellation.SendMessage("PushBullet", "PushNote", [ "FriendLead", "Le reservoir d'eau est vide"], Constellation.MessageScope.package)

Étape 2 : Package relatif au stockage des données

Afin d’historiser les valeurs des capteurs stockées dans un des State Objects du premier package, nous en avons créé un autre que l’on a déployé sur le même serveur que Constellation.

Ce package génère une base de données dans un fichier .csv qui est mis à jour toutes les minutes avec les nouvelles données.

Chaque ligne contient la date, l’heure, l’humidité du sol, l’humidité de l’air, la température et la luminosité.

@Constellation.StateObjectLink(package = "FriendLeafCapteurs", name = "Capteurs")
def RecupValue(stateObject):
    humiditeSol = stateObject.Value.HumiditeSol
    humiditeAir = stateObject.Value.HumiditeAir
    temperature = stateObject.Value.Temperature

Nous avons ensuite créé un message callback qui permet de visualiser le fichier CSV dans notre Constellation.

@Constellation.MessageCallback()
def LireBDD():
'''
: return string : La base de données 
'''
    file = open('BDD.csv','r')
    lines = file.readlines()
    return lines

L’interface utilisateur : l’application mobile de monitoring et de pilotage de la serre

Étape 1 : Le noyau de l’application

Pour développer l’application mobile nous nous sommes aidés de Cordova, un Framework permettant de créer des application Android et iOS avec des technologies web.

Nous avons également utilisé jQuery et AngularJS pour faciliter l’interaction entre Javascript et HTML.

De plus, pour gérer certaines fonctionnalités comme le traitement du CSV ou l’affichage des graphiques, nous avons utilisé des librairies externes comme PapaParser et Chartist. Finalement, pour embellir le CSS, nous avons utilisé le Framework SemanticUI qui ressemble en certain points à Bootstrap.

Étape 2 : Connexion à Constellation, State Object et Messages Callback

Pour nous connecter à Constellation avec AngularJS, nous avons utilisé ces lignes de codes :

Constellation.initializeClient(url_port, sha, "FriendLeaf");

Constellation.onConnectionStateChanged(function (change) {
   //suite
});

et une ligne de ce type pour chaque State Object :

Constellation.registerStateObjectLink("*", "FriendLeafCapteurs", "Actionneurs", "*", function (so) {
    //suite
});

Quant aux messages Callback, ils sont envoyés comme suit :

Constellation.sendMessage({ Scope: 'Package', Args: ['FriendLeafCapteurs'] }, 'DesactiverBrumisateur');

Pour que l’application soit utilisable sur n’importe quelle Constellation, nous avons créé un page de configuration où l’utilisateur rentre l’adresse de sa constellation, le port, et des identifiants.

Une fois tout cela rempli, le nom d’utilisateur et le mot de passe sont hachés en SHA1 grâce à une librairie externe et la connexion à Constellation commence.

Lorsque l’application se lance pour la première fois, l’utilisateur est directement redirigé vers cette page pour entrer les informations nécessaires.

Étape 3 : Affichage des données en temps réel

Pour l’affichage des données en temps réel nous avons utilisé des images SVG car elles sont très flexibles et nous voulions réaliser des barres de progression en arc de cercle. Pour les valeurs numériques on affiche un scope AngularJS dans lequel sont stockés les valeurs des capteurs.

Le code JS :

//Stockage des valeurs des capteurs dans la variable capteur
scope.capteurs["humiditeAir"] = so.Value.HumiditeAir;
scope.$apply(); //Applications des modifications du scope

//Pour changer le remplissage de la jauge 
$("#h_air_gauge").css("stroke-dasharray",(so.Value.HumiditeAir*18)/100 + " 18 0");

SVG en HTML :

Étape 4 : Contrôler sa serre

Nous avons également prévu dans l’application de pouvoir gérer les différents actionneurs de la serre.

Pour gérer le côté automatique du package responsable des capteurs nous avons utilisés des sliders qui lorsqu’activés, vont envoyer un Message Callback comme décrit ci-dessus. On va également suivre l’évolution du State Object indiquant si l’automatisation est activée pour tel ou tel actionneur et ainsi bloqué ou non le bouton d’activation manuel. Car oui, il est également possible d’activer manuellement chaque actionneur grâce à un bouton.

Étape 5 : Les graphiques

Pour ce qui est des graphiques nous avons utilisé une librairie externe que nous avons modifié pour la rendre compatible sur mobile. Cette librairie s’appelle Chartist. Grâce à elle nous avons pu faire de superbes graphiques.

Conclusion

Voilà qui conclut les grandes étapes de la réalisation de FriendLeaf. Comme vous avez pu le voir, la serre remplit complètement son rôle. C’est un projet ludique, simple à réaliser et facilement transposable sur d’autres installations grâce aux State Objects et aux messages Callback. C’est également un bon point de départ pour prendre en main la plateforme Constellation. Nous espérons vraiment qu’il vous a plu et que vous allez réaliser votre propre serre.

Nous tenons également à remercier Léa, le jardin de Théo et les parents de Marine qui nous ont fourni quelques accessoires nécessaires à la serre.

The post FriendLeaf : la serre connectée grâce à Constellation appeared first on Constellation.

Créer un boitier connecté « Mix box » permettant de contrôler votre ordinateur

Sebastien Warin — Wed, 16 May 2018 14:24:43 +0000

Tutoriel proposé par Marc-Antoine DUVAL, Joël GUILLEM et Quentin LEVERT.

Dans ce tutoriel, nous allons créer un boitier qui est relié à un ou plusieurs ordinateurs de la maison grâce à un ESP8266 connecté à constellation. Des LEDs permettent à l’utilisateur de suivre le résultat des commandes en temps réel. Le boitier permet de commander à distance le lecteur de vidéo VLC media player à travers différentes fonctionnalités. Il gère :

Le volume
La marche avant / marche arrière au cours d’un visionnage
La mise en lecture / pause d’une vidéo
La fermeture de VLC

Prérequis

Un ESP8266, nous utilisons un D1-mini
6 boutons poussoirs tactiles blancs
2 LEDs RGB
Une plaque de plexiglas noire
Une imprimante laser
Un serveur constellation
Le package « Windows Control » déployé sur une ou plusieurs sentinelles

Etape 1 : Réaliser le montage des boutons et LEDs

Dans un premier temps, nous allons réaliser le montage électronique des composants. Tout d’abord il est nécessaire de brancher l’ESP8266 à la breadboard et de l’alimenter en le connectant en mini-USB à une source d’alimentation. Il faut ensuite brancher la masse de l’ESP à la colonne de masse de la breadboard.

Pour les besoins de l’explication du montage, tous les autres composants seront connectés à la breadboard, cependant il est tout à fait possible de les connecter une fois insérés dans le boitier (voir Etape 2). Le schéma global est présenté ci-après.

Ici nous avons choisi 2 LEDs RGB afin d’améliorer l’effet visuel pour obtenir une LED de couleur jaune. La première LED verte pourra être connectée directement au pin D8 de l’ESP. Quant à la seconde LED RGB, il suffit de connecter les pattes correspondant aux LEDs rouge et verte à la même ligne, puis de lier cette ligne au pin D7 de l’ESP.

Les boutons poussoirs sont à connecter avec les broches 1 et 3 d’un côté et les broches 2 et 4 de l’autre. Le branchement est classique, à savoir les pin D1 à D6 connectés directement sur la patte 1 de chaque bouton, puis retour à la masse sur la patte 3 des boutons. Lorsque l’on appuie sur le bouton, le pin correspondant passera donc en état bas (LOW) et est en état haut (HIGH) tant que l’on n’appuie pas.

Une fois le câblage terminé, nous allons passer à la réalisation du boitier qui contiendra à l’intérieur l’ESP et la breadboard.

Etape 2 : Réaliser le boitier

Dans un second temps, il nous faut un boitier que nous pourrons ouvrir pour mettre notre ESP. Le design de la face de devant doit aussi correspondre au nombre de boutons et LED que l’on souhaite mettre en place.

Afin de résoudre cette problématique, nous avons décidé d’imprimer le boitier grâce à une imprimante laser. Nous avons utilisé une plaque de plexiglas noir d’une épaisseur de 3mm.

Tout d’abord, nous avons créé le fond de la boite sans le couvercle. Nous avons utilisé le site : http://carrefour-numerique.cite-sciences.fr/fablab/wiki/doku.php?id=projets:generateur_de_boites qui permet de générer automatique le fichier .svg qui sera reconnu et utilisé pour l’impression laser. Il suffit d’entrer les dimensions voulues.

Ensuite nous avons utilisé SolidWorks afin de créer notre face avant personnalisée. Nous avons choisi percer 2 trous pour les LEDs et 6 pour les boutons carrés. Après la réalisation de la pièce, plusieurs étapes sont alors nécessaires pour exporter le fichier SolidWorks en fichier .svg.

Sélectionner la vue correspondant à la pièce à réaliser
Enregistrer le fichier SolidWorks au format .DXF.
Sélectionner la vue à exporter. Ici, on sélectionne la vue en cours.

Installer Inkscape, ce logiciel permettra de créer le fichier pour l’imprimante laser.
Importer le fichier dans Inkscape. Il faut désactiver mise à l’échelle automatique.
Sauvegarder le fichier qui sera utilisé pour l’impression laser.

Enfin, nous avons assemblé toutes les pièces du boitier :

Etape 3 : Programmation

Dans un premier temps, il faut vous assurer que votre ESP8266 soit connecté à votre constellation, si vous ne savez pas comment vous y prendre, je vous invite donc à suivre le tutoriel réalisé par Sébastien Warin : https://developer.myconstellation.io/getting-started/connecter-un-arduino-ou-un-esp8266-constellation/ .

Pour commencer, il faut déclarer le matériel dans la méthode setup de notre ESP8266, conformément à l’étape 1, nous avons choisi les pin 1 à 6 en mode PULLUP pour les boutons et les pins 7 & 8 pour les LEDs :

pinMode(D1,INPUT_PULLUP);
  pinMode(D2,INPUT_PULLUP);
  pinMode(D3,INPUT_PULLUP);
  pinMode(D4,INPUT_PULLUP);
  pinMode(D5,INPUT_PULLUP);
  pinMode(D6,INPUT_PULLUP);
  pinMode(D7,OUTPUT);
  pinMode(D8,OUTPUT);
  digitalWrite(D7,LOW);
  digitalWrite(D8,LOW);

Nous avons associé à chaque bouton un messageCallback avec les paramètres permettant d’effectuer l’action voulu. Pour faire cela, nous avons réalisé une fonction « checkButtonState » qui permet de gérer les évènements d’appuie sur les boutons et d’appeler le messageCallback correspondant au bouton. Juste avant l’appel du messageCallback, la led cablée au pin D7 est allumée pour une période de 2 secondes afin de montrer à l’utilisateur que l’ESP8266 a bien réalisé l’action. Cela permettra en cas de disfonctionnement, que l’utilisateur puisse savoir si c’est le hardware ou la transmission Wifi/Constellation qui est défectueux.

Le tableau ci-dessous récapitule les actions, messageCallback et pins qui sont associés ensemble :

Ci-dessous le code de la fonction checkButtonState :

void checkButtonState(){
  
  static int lastButtonStateD1 = HIGH;
  static int lastButtonStateD2 = HIGH;
  static int lastButtonStateD3 = HIGH;
  static int lastButtonStateD4 = HIGH;
  static int lastButtonStateD5 = HIGH;
  static int lastButtonStateD6 = HIGH;
  static long led1TimeLitUP = 0;
  // If the led is lit up for 2 secondes, we shut off the led
  if(millis() - led1TimeLitUP >2000){
      digitalWrite(D7, LOW);
    }
  // We retrieve the pin value
  int reading = digitalRead(D1);
// If pin value has changed
  if (reading != lastButtonStateD1){
   // And if pin value is high which mean button is pushed, then we make the associated action
    if (reading == HIGH){
      // We lit up the led in order to show to the user that the messageCallback is sending
       digitalWrite(D7,HIGH);
       // "led1TimeLitUp" take the value of the moment when it has been litted up
       led1TimeLitUP = millis();
       // we use the messageCallback to do the wanted action
       constellation.sendMessage(Package, "WindowsControl", "VolumeUp","{}");
     
      }
      lastButtonStateD1 = reading ;
     
      return;
  }
  reading = digitalRead(D2);
  if (reading != lastButtonStateD2){
     if (reading == HIGH){
        digitalWrite(D7,HIGH); 
        led1TimeLitUP = millis();
        constellation.sendMessage(Package, "WindowsControl", "VolumeDown", "{}"); 
        
      }
      lastButtonStateD2 = reading;
      return;
    }
  reading = digitalRead(D3);
  if (reading != lastButtonStateD3){
     if (reading == HIGH){
        digitalWrite(D7,HIGH); 
        led1TimeLitUP = millis();
        constellation.sendMessage(Package, "WindowsControl", "SendKey", "SpaceBar");
       
      }
      lastButtonStateD3 = reading;
      return;
    }
    
  reading = digitalRead(D4);
  if (reading != lastButtonStateD4){
     if (reading == HIGH){
        digitalWrite(D7,HIGH); 
        led1TimeLitUP = millis();
        constellation.sendMessage(Package, "WindowsControl", "SendCombinationOfKey", "['ALT', 'Left']");
        
      }
      lastButtonStateD4 = reading;
      return;
    }
   reading = digitalRead(D5);
    if (reading != lastButtonStateD5){
     if (reading == HIGH){
        digitalWrite(D7,HIGH); 
        led1TimeLitUP = millis();
        constellation.sendMessage(Package, "WindowsControl", "SendCombinationOfKey", "['ALT', 'Right']");
      
      }
      lastButtonStateD5 = reading;
      return;
    }
    reading = digitalRead(D6);
    if (reading != lastButtonStateD6){
     if (reading == HIGH){
        digitalWrite(D7,HIGH); 
        led1TimeLitUP = millis();
        constellation.sendMessage(Package, "WindowsControl", "SendCombinationOfKey", "['CTRL', 'Q']");
        
      }
      lastButtonStateD6 = reading;
      return;
    }  
  }

Et voilà notre boitier de contrôle est opérationnel. Il ne reste plus qu’à l’alimenter et vous avons à notre disposition des boutons physiques pour piloter notre Windows facilement.

The post Créer un boitier connecté « Mix box » permettant de contrôler votre ordinateur appeared first on Constellation.

Créer une serrure connectée à Constellation

Sebastien Warin — Wed, 16 May 2018 14:05:31 +0000

Article proposé par Olivier MOUILLOT, Mohammed TAHRI JOUTEI HASSANI et Gaëtan DELABY

Vous attendez quelqu’un chez vous mais vous êtes occupé à faire autre chose. Cette serrure connectée vous permettra de contrôler l’ouverture de la porte d’entrée depuis n’importe quelle pièce de votre domicile, et cela en un clic grâce à votre smartphone. Nous allons voir pas à pas comment la mettre en place simplement.

Prérequis

Pour réaliser ce projet, il vous faut :

Une gâche électrique 12V / 500 A
Un ESP8266
Un régulateur de tension LM1117
Un transistor NPN TIP 110
Une résistance 5,6 KΩ
Deux condensateurs 0,1 µF et 0,33 µF
Du fil électrique
Une batterie 12V
Un serveur Constellation (Un ordinateur pourra faire l’affaire)

Etape 1 : réaliser une serrure connectée

Dans un premier temps, il nous a fallu trouver une serrure adaptée au développement du projet sur laquelle nous pouvions brancher nos fils électriques. Nous avons donc opté pour la serrure suivante que vous pourrez vous procurer via ce lien .

Pour de plus amples informations techniques sur la gâchette, vous pouvez également regarder ici.

Il faut ensuite créer le câblage nécessaire au fonctionnement de la serrure. Notre principal problème a été de convertir l’alimentation indispensable de 12V pour la serrure en une alimentation de 3,3V nécessaire à l’utilisation de notre ESP. A l’aide du régulateur de tension, nous avons réalisé le montage suivant en entrée de l’ESP.

Afin de laisser passer le courant et de faire fonctionner la gâchette, le transistor TIP110 en série avec une résistance 5,6kΩ se placent en sortie GPIO de l’ESP. Une LED peut être également placée à cette même sortie afin de visualiser l’état de la serrure.

Enfin, voici le montage final reprenant tous les composants :

Etape 2 : Programmation

Vous avez fait la moitié du travail, voyons ensemble comment coder notre ESP8266.

La fonction de base de la gâche électrique est assez simple : couper le courant à travers la serrure pour la fermer ou le laisser passer le courant afin d’ouvrir la serrure. En premier lieu, nous avons développé le code Arduino servant à faire faire passer du courant ou non dans la gâche. Pour cela nous devons dans un premier temps connecter notre ESP8266 à Constellation. Pour découvrir comment connecter votre ESP à Constellation, suivez ce guide.

En ce qui concerne le code Arduino permettant de contrôler la serrure, vous en trouverez ci-dessous l’intégralité.

#include 

// ESP8266 Wifi
#include 
char ssid[] = "MY-WIFI";
char password[] = "xxxxxxxx";

define LOCK_PIN D3

// Constellation client
Constellation constellation("172.20.10.2", 8088, "d1mini", "demoisen", "xxxxxxxx");

void setup(void) {
  Serial.begin(115200);  delay(10);

  //SET I/O 
  pinMode(LOCK_PIN, OUTPUT);
  // INITIAL mode
  digitalWrite(LOCK_PIN , LOW);

  // Set Wifi mode
  if (WiFi.getMode() != WIFI_STA) {
    WiFi.mode(WIFI_STA);
    delay(10);
  }
  
  // Connecting to Wifi  
  Serial.print("Connecting to ");
  Serial.println(ssid);  
  WiFi.begin(ssid, password);  
  while (WiFi.status() != WL_CONNECTED) {
    delay(500);
    Serial.print(".");
  }
  Serial.println("WiFi connected. IP: ");
  Serial.println(WiFi.localIP());

  constellation.pushStateObject("State", false);
  
  constellation.registerMessageCallback("OpenDoor", MessageCallbackDescriptor().setDescription("Ouvres la porte"),
      [](JsonObject& message) {
            digitalWrite(LOCK_PIN, HIGH);
            constellation.pushStateObject("State", true);
            delay(4000);
            digitalWrite(LOCK_PIN, LOW);   
            constellation.pushStateObject("State", false);    
      });
  
  // Declare the package descriptor
  constellation.declarePackageDescriptor();

  // WriteLog info
  constellation.writeInfo("Virtual Package on '%s' is started !", constellation.getSentinelName());  
}

void loop(void) {
  constellation.loop();
}

L’étape suivante a été d’utiliser la librairie Constellation pour ajouter un « MessageCallback » afin de contrôler le GPIO de la gâchette, couplé à un « StateObject » permettant de maintenir l’état de la serrure dans Constellation :

Constellation va aller garder en permanence l’état de la serrure grâce au StateObject « State ».

Dorénavant, n’importe qui connecté au serveur peut se servir du MessageCallback « OpenDoor» exposé par l’ESP que nous avons utilisé pour faire permuter l’ouverture et la fermeture automatique de la serrure. Un délai de 4 secondes est programmé avant que la serrure ne se referme après ouverture de la gâche. Nous avons ajouté cette fonctionnalité afin d’ajouter une partie sécurité à notre dispositif.

On obtient alors simplement le pilotage de notre gâchette avec Constellation, dont l’état pourra être contrôlé grâce à une page Web qu’on vous présente dans la partie suivante.

Etape 3 : Piloter sa serrure à l’aide d’une page web

Pour cette dernière étape qui consiste à piloter notre serrure connectée grâce à une page Web. Il s’agit principalement de l’interface via laquelle vous pourrez facilement décider de l’ouverture ou la fermeture de la serrure.

Voici le code HTML que nous avons mis en place :




    
    Serrure connectée

Avec quelques lignes de CSS, le rendu final de notre page est le suivant et on ne peut plus simple d’utilisation pour le pilotage :

Pour la suite il suffit d’héberger cette page HTML sur un serveur Web quelconque et vous pourrez ouvrir votre porte depuis un PC, un smartphone, une table ou autre.

Et comme l’ouverture de la porte est exposer comme un MessageCallback, vous pourrez l’ouvrir depusi un code C#, Python, Arduino ou même un simple appel HTTP à l’API Constellation. N’hésitez pas à utiliser le “Code Generator” de la console Constellation.

Au final avec une gâche électrique, un ESP8266, une Constellation et quelques lignes d’Arduino, on est capable d’ouvrir une porte depuis tous type d’application.

The post Créer une serrure connectée à Constellation appeared first on Constellation.

Créer une prise connectée avec un ESP8266

Lucas — Tue, 31 Oct 2017 11:29:46 +0000

Par Lucas Dupuis

La prise connectée est un élément phare de la domotique de la maison. Il permet d’allumer ou d’éteindre un équipement branché dessus ou encore de connaitre sa consommation en énergie. Dans mon cas, j’avais besoin d’allumer ou d’éteindre les enceintes de mon média center automatiquement lorsque ce dernier était démarré.

Découvrons ensemble comment créer sa prise connectée avec un ESP8266.

Prérequis

Pour ce tutoriel, il vous faut :

Un bloc prise avec un interrupteur
Un transformateur AC/DC 5v
Un ESP-01 (ESP8266)
Un régulateur de tension 3.3v
Un relais 220V pilotable en 5v
Un transistor, des résistances, des leds, une diode, des condensateurs
Du fil électrique
Un pistolet à colle et une drémel
Un serveur Constellation

Etape 1 : Construire la prise

Dans un premier temps, il nous faut un boitier abordable que nous pourrons ouvrir pour insérer notre ESP à l’intérieur. Après quelques recherches, j’ai opté pour le boitier Renkforce disponible chez Conrad pour 3€ environ.

On commence donc par l’ouvrir pour la vider littéralement :

Puis tous les supports plastique à l’intérieur doivent être cassés pour libérer un maximum de place. Je les ai cassés avec une pince coupante et j’ai fini de retirer le maximum de plastique avec un dremel. Sur cette photo j’avais retiré une partie du fond de la prise pour un autre projet.

Il faut ensuite préparer un câblage avec le relais pour qu’il s’intercale entre l’arrivée de la phase (mur) et la phase distribuée à l’élément branché sur la prise. Mais il faut également garder en tête que l’alimentation de l’ESP doit être permanente :

Mon principal problème dans ce tutoriel a été de tout faire rentrer dans la prise. En effet, l’alimentation + le relais prennent beaucoup de place et tout est rentré au chausse-pied, avec le câblage noyé dans la colle chaude afin d’assurer l’isolation.

Le transformateur alimente donc en 5v un régulateur de tension LM1117 3.3V avec deux condensateurs pour lisser du 3.3v pour l’ESP01.

Il alimente également directement la bobine du relais dont le circuit est interrompu par un transistor NPN BC547 dont la base sera pilotée en saturation par un GPIO de l’ESP.

L’ESP pilote deux leds de statut : une rouge et une verte et possède également son dernier GPIO en input pour un bouton physique placé sur le dessus du boitier. Si vous avez suivi jusque-là et que vous connaissez l’ESP01, vous aurez compris qu’il est impossible de le programmer directement dans la prise, deux des 4 GPIO devant normalement être utilisés pour la communication série.

Pour combler le « trou » du bouton physique original, j’ai choisi de coller par l’intérieur du boitier un petit bout de plexiglas translucide. Je l’ai ensuite percé pour faire passer les deux leds rouge et verte.

Et voilà, on obtient une prise connectée par Wifi avec un ESP8266 avec un bouton poussoir et deux LEDs, reste plus qu’à le programmer !

Etape 2 : la programmation

La fonction de base de la prise est assez simple : couper le courant ou le laisser passer. Dans un premier temps, j’ai uploadé un sketch de base Constellation avec Arduino sur l’ESP01 à l’extérieur de la prise. Je l’ai ensuite branché dans la prise que j’ai enfiché dans le mur. Bazinga, le régulateur 3.3v fait son job, l’ESP boote, se connecte à mon réseau wifi et envoie un « hello world » dans la console Constellation. Pour découvrir comment connecter un ESP8266 à Constellation, suivez ce guide.

Ensuite, j’ai utilisé la librairie Constellation pour ajouter un MessageCallback pour activer ou désactiver le GPIO de la prise, couplé à un StateObject pour maintenir l’état de la prise dans Constellation :

constellation.registerMessageCallback("Switch", MessageCallbackDescriptor().setDescription("Switch le statut du relais."),
  [](JsonObject & json) {
    statutRelais = !statutRelais;
    digitalWrite(gpioRelais, statutRelais);
    constellation.pushStateObject("Status", stringFormat("{ 'IsActivated':%s }", statutRelais ? "true" : "false" ));
  });

Ainsi Constellation a toujours connaissance de l’état de la prise via le StateObject nommé “Status” :

Et tout le monde peut maintenant découvrir et utiliser le MessageCallback “Switch” exposé par notre ESP pour permuter l’état de notre prise :

Bingo, on a donc une prise 220V connectée à Constellation qu’on pourra piloter depuis une page Web, un programme Python ou autre.

Pour vous donnez quelques idées, n’hésitez pas à relire ce tutoriel : Créer un relais connecté.

Etape 3 : Lier sa prise connectée à l’état de son média-center

Dans ma Constellation, je dispose d’un package « brain » développé en C# avec Visual Studio qui contient l’ensemble des règles de la maison (gestion du chauffages, lumières, volets, etc..).

Je l’ai enrichi pour faire en sorte que si Kodi est en train de lire un média (audio ou vidéo) et que la prise n’est pas allumée, alors il invoque le MessageCallback pour allumer la prise. Et inversement pour l’éteindre !

J’ai donc dans une classe C#, ajouté deux StateObjectLinks, c’est à dire que j’ai deux propriétés de mon code C# qui sont liées à mes StateObjets représentant l’état de mon media-center de l’état de ma prise !

Il me reste plus qu’à ajouter un handler sur le changement d’état du State Object de Kodi, afin d’ajouter deux conditions “if” :

Si la prise est éteinte alors que Kodi joue quelque chose (PlayerState différent de null) alors on allume la prise
Si la prise est allumée alors que Kodi joue rien (PlayerState null) alors on éteint la prise

Pour allumer ou éteindre la prise, il suffit d’invoquer le MessageCallback “Switch” exposé par notre code Arduino en créant un proxy vers notre package.

public class KodiDemo
{
    /// 
    /// StateObject XBMC. Permet de connaitre les infos de lecture.
    /// 
    [StateObjectLink(Package = "Xbmc", Name = "Kodi Salon NUC")]
    public StateObjectNotifier KodiNotifier { get; set; }

    /// 
    /// StateObject de l'ESP controlant le relais d'activation. Permet de synchroniser les infos de lecture avec la valeur du relais.
    /// 
    [StateObjectLink(Sentinel = "ESP8266-01-001", Package = "ESP_Relay_Button", Name = "Status")]
    public StateObjectNotifier PriseKodi { get; set; }

    public void Start()
    {
        this.KodiNotifier.ValueChanged += (s, e) =>
        {
            if (this.PriseKodi.DynamicValue.Status == false
                && e.IsNew == false
                && e.OldState.DynamicValue.PlayerState == null
                && e.NewState.DynamicValue.PlayerState != null)
            {
                // démarrage.
                PackageHost.WriteInfo("Activation de la prise.");
                PackageHost.CreateMessageProxy("ESP8266_01_002/ESP_Relay_Button").Switch();
            }

            if (this.PriseKodi.DynamicValue.Status == true
                && e.IsNew == false
                && e.OldState.DynamicValue.PlayerState != null
                && e.NewState.DynamicValue.PlayerState == null)
            {
                PackageHost.WriteInfo($"Arret de la prise.");
                PackageHost.CreateMessageProxy("ESP8266_01_002/ESP_Relay_Button").Switch();
            }
        };
    }
}

Et voilà comment en quelques lignes de C# et grâce à Constellation, mes enceintes seront automatiquement allumées ou éteintes selon que mon media-center diffuse ou non un média vidéo ou audio !

Pour aller plus loin

Pour aller plus loin, j’ai ajouté quelques fonctionnalités intéressantes :

J’ai pluggé le bouton poussoir ajouté sur le dessus de la prise pour qu’il change l’état du relais et mette à jour le state objet en conséquence.
J’ai ajouté la possibilité d’associer les leds de façade au fonctionnement de la prise en m’inspirant de ce qui existe sur les prises connectées du marché. La led rouge indique le statut de fonctionnement (power on / connexion au wifi en clignotant), la led verte indique l’état du relais.
J’ai ajouté également un mode « blind », je trouve que c’est une fonctionnalité intéressante mais qui est absente des prises sur le marché : Quand il fait noir dans une pièce et que la prise se reconnecte au wifi, cela peut être gênant de la voir clignoter. Un package de « brain » peut alors gérer les leds directement en fonction de mes volets
Ensuite, en cas de déconnection du wifi ou de coupure de courant, j’ai prévu un bout de code permettant, au démarrage de l’ESP, de requêter son propre StateObject. Cela permet à la prise de revenir à l’état dans lequel elle était avant la coupure.
J’ai également fait intervenir l’activation de mon projecteur. Ce dernier push un StateObject. Si le média center est éteint, il envoie un paquet WOL via le package networktools pour l’allumer et envoie une notification de fermeture des volets du salon. Le démarrage de la lecture du média sur kodi pilote la prise d’allumage des enceintes sans action manuelle. Ainsi, le démarrage du projecteur et la lecture sur kodi lancent l’ambiance parfaite pour profiter de mes séries en un seul geste.

The post Créer une prise connectée avec un ESP8266 appeared first on Constellation.

Connecter un vidéo projecteur standard à Constellation et synchroniser les volets

Lucas — Tue, 16 May 2017 10:23:36 +0000

Par Lucas Dupuis

Ayant fait récemment l’acquisition d’un vidéo-projecteur pour mes soirées films, je me suis vite rendu compte qu’avec les jours qui rallongent, j’ai besoin de fermer les volets de mon salon afin de rester dans une certaine pénombre.

La présentation de mon système de pilotage de volets n’est plus à faire, vous la retrouverez ici. Vous pouvez aussi utiliser des modules Z-Wave comme le FGR-211 qu’on connectera à Constellation via le package Vera ou Jeedom. Dans tous les cas, nous disposons un MessageCallback pour ouvrir ou fermer nos volets !

La problématique qui se pose est la suivante : comment savoir que le projecteur est allumé et que je m’apprête à regarder un film ?

J’ai réfléchi à plusieurs solutions :

Monitorer la consommation de la prise électrique afin de déduire que le projecteur est allumé
- Avantages :
  - Permet d’exposer un booléen indiquant que le projecteur est allumé et d’ouvrir/fermer les volets en conséquence
  - Permet de monitorer la consommation en temps réel
  - Permet de monitorer la durée d’utilisation de la lampe du vidéo-projecteur
- Inconvénients :
  - Nécessite une prise connectée avec conso-mètre (à fabriquer ou à acheter)
  - C’est potentiellement complexe et coûteux
Surveiller le StateObject de mon médiacenter Kodi (exposé par le package xbmc)
- Avantages :
  - J’ai déjà une routine surveillant le stateobject pour allumer et éteindre le système de son lorsqu’un média est joué
  - Il n’y a que du code à mettre en place dans le package « cerveau » de la maison
- Inconvénients :
  - Il n’y a pas de lien direct entre l’allumage du projecteur et une action sur les volets
  - La sélection du film ou du média sur l’écran se fait volets ouverts, et donc c’est potentiellement gênant en cas de luminosité importante
  - Cela ne tient pas compte des autres sources branchées sur le projecteur (TV, console, …)
Utiliser un déclencheur sur le projecteur
- Avantages :
  - Montage simple
  - Peu d’investissement
  - Système embarqué trivial
- Inconvénients :
  - Pas de monitoring de consommation

J’ai retenu la seconde et la troisième option : la seconde option, consistant à surveiller le stateobject de kodi permet l’allumage du système de son lorsqu’un média est lu, que ce soit un film ou un morceau de musique et la troisième option pour déclencher la fermeture des volets à l’allumage du vidéo projecteur.

Prerequis

Un serveur Constellation
Un vidéo-projecteur avec une sortie 12V
Un ESP8266 (ou Arduino connecté) avec un régulateur de tension
Le SDK Visual Studio

Etape 1 : connecter le vidéo projecteur dans Constellation

En regardant les caractéristiques de mon projecteur, je me suis rendu compte qu’il existait une sortie 12V permettant de déclencher un moteur pour une toile de projection.

À la maison je projette sur un mur blanc, je n’ai donc pas besoin de cette sortie. Il s’agit d’un connecteur jack mono que vous trouverez rapidement chez vous dans votre boite de récup’ ou bien directement sur le net pour quelques centimes.

Il suffit donc d’un ESP8266 (par exemple un ESP-01, très petit et peu cher) et d’un régulateur de tension 3.3v (ex. LD1117v33) acceptant en entrée une tension entre 5 et 15V et le tour est joué !

En effet, le projecteur envoie du 12v sur la sortie dès qu’il est sous tension et du 0v lorsqu’il est éteint. Ainsi notre ESP-01 sera alimenté par cette sortie. Lorsqu’on allume le vidéo-projecteur, l’ESP-01 sera démarré et lorsqu’on éteint le vidéo projecteur, il sera éteint car plus d’alimentation !

Aussi simple que cela !

L’ESP, de son côté, publie simplement toutes les secondes un StateObject ayant une durée de vie de 5 secondes pour indiquer que le projecteur est allumé.

Pour connecter un ESP8266 (ou un Arduino) suivez ce guide ! Une fois connecté dans ma Constellation, je publie le StateObject dans la boucle principale loop()

void loop() {
  constellation.loop();
 
  if(((millis() - lastTime) > 1000) 
    || (millis() < lastTime))
  {
    constellation.pushStateObject("Uptime",  millis(), 5);
    lastTime = millis();
  } 
}

On a donc dans les StateObjects de notre Constellation, un StateObject « Uptime » publié dans mon cas par le package (virtuel) « ESP01_Projector » qui contient l’uptime de mon projecteur :

Ce StateObject est mis à jour par l’ESP toutes les secondes avec une durée de vie de 5 secondes ! Ainsi je n’ai pas besoin de connaitre la valeur du StateObject, il me suffit juste de vérifier que le StateObject est « Valide » et non « Expiré » !

Si il est valide c’est que dans les 5 dernières secondes il y a bien publié son Uptime, donc l’ ESP est démarré ce qui implique que mon vidéo projecteur est bien démarré (pour alimenter l’ESP) !

En revanche si ce StateObject est expiré, c’est à dire que le StateObject n’a pas été mis à jour durant les 5 dernières secondes or l’ESP est censé le faire à chaque seconde ! L’ESP-01 est donc déconnecté ce qui impliquerai que le vidéo projecteur est arrêté !

Etape 2 : synchroniser le vidéo projecteur avec mes volets

Maintenant, dans mon package « cerveau » de Constellation, il suffit de surveiller ce StateObject et son état expiré ou non pour savoir quelle commande envoyer aux volets.

J’ai donc créé un package « cerveau » en C#.

Dans ma classe, je crée un StateObjectLink pour lier le StateObject de l’ESP dans une propriété .NET de mon code :

/// 
/// StateObject du projecteur. Permet de connaitre l'uptime du projecteur.
/// 
[StateObjectLink("ESP01_Projector", "Uptime")]
public StateObjectNotifier ProjectorUptime { get; set; }

Maintenant au démarrage de mon package, j’attache un « handler » sur l’événement « ValueChanged » permettant d’ajouter du code en cas de mise à jour du StateObject.

Ici je vérifie que mon StateObjectLink est bien lié au StateObject (HasValue) et que ce StateObject n’est pas expiré (IsExpired).

Si la condition est vrai, c’est que mon projecteur est allumé, alors je peux fermer mes volets autrement je restaure les volets dans leurs positions précédentes.

this.ProjectorUptime.ValueChanged += (s, e) =>
{
    // Projecteur allumé ?
    if (this.ProjectorUptime.HasValue == true && this.ProjectorUptime.Value.IsExpired == false)
    {
        // Si projecteur est allumé, on ferme les volets.
        foreach (var volet in this.voletConfig)
        {
            if (this.ShowDebug)
            {
                PackageHost.WriteWarn($"Fermeture du volet {volet.Name} à 100%.");
            }
            
            // On enregistre au passage la position de départ pour la restaurer à la fin.
            volet.PreviousPosition = volet.CurrentPosition; 
            
            // Ordre de fermeture (100%).
            PackageHost.CreateMessageScope("ESP_Shutters").ChangePercent(volet.Name, 100);
        }
    }
    else
    {
        // Si projecteur est éteint, on rouvre les volets.
        foreach (var volet in this.voletConfig)
        {
            if (this.ShowDebug)
            {
                PackageHost.WriteWarn($"Ouverture du volet {volet.Name} à l'ancienne position, {Convert.ToInt32(volet.Percent * 100.0)}->{volet.PreviousPosition}% après {this.tempoReouvertureVolets} secs d'inactivité.");
            }

            // Pour chaque volet, on revient à la position initiale
            PackageHost.CreateMessageScope("ESP_Shutters").ChangePercent(volet.Name, volet.PreviousPosition);
        }
    }
};

Conclusion

Une demi-heure de prototypage et de soudure, un petit quart d’heure de développement, et le challenge est relevé !

L’allumage du projecteur ferme les volets de mon salon selon une consigne, il déclenche également un scénario prédéfini pour les lampes Hue et active la prise du système de son. Le clic sur le bouton de la télécommande rend l’expérience du film beaucoup plus profitable avec Constellation !

The post Connecter un vidéo projecteur standard à Constellation et synchroniser les volets appeared first on Constellation.

Synchroniser un interrupteur mural avec des ampoules connectées et contrôler l’ambiance lumineuse de votre pièce

Sebastien Warin — Mon, 15 May 2017 23:12:13 +0000

Dans cet article nous allons découvrir comment contrôler l’ambiance lumineuse d’une pièce équipée d’ampoules connectées avec un simple interrupteur mural.

L’idée est à la fois de pouvoir allumer ou éteindre toutes les ampoules de la pièce à partir de l’interrupteur mais également de pouvoir sélectionner une ambiance lumineuse en fonction des circonstances, par exemple pour un salon : ambiance « réception », ambiance « soirée », ambiance « Ciné », ambiance « Feu de cheminée », etc…

Prérequis

Un serveur Constellation
Des lampes ou ampoules connectées, ici des Philips Hue
Un interrupteur mural connecté, ici un interrupteur Legrand relié à un module Z-Wave Fibaro FGS-211
Le SDK Constellation pour Visual Studio

Etape 1 : connecter un interrupteur mural

La première étape consiste donc à intégrer un interrupteur dans Constellation. Avec la polyvalence de la plateforme Constellation, il y a mille et une manière d’y parvenir.

Pour ma part, j’ai conservé les interrupteurs existants de la gamme Mosaic Legrand. Il s’agit pour être exacte d’un double bouton poussoir.

Pour le rendre connecté, j’ai ajouté un micro-module de la marque Fibaro spécialement conçu pour être intégré dans la boite d’encastrement juste derrière l’interrupteur.

Ce module Fibaro est un FGS-211 connecté en Z-Wave et disposant de deux relais en sortie pilotant des charges jusqu’à 1500W et de deux entrées. Dans mon cas, il n’y a aucune charge connectée sur ce module, il me sert juste de »capteur ».

Je rappelle aussi que les ampoules Philips Hue doivent être constamment alimentées en 220v de façon à être pilotable même après avoir fermé les lumières !

Le module Fibaro est simplement connecté sur le réseau électrique 220v pour son alimentation et aux deux boutons poussoir Legrand de la façon suivante :

Cela permettant d’avoir deux boutons connectés sur le même interrupteur : l’un servira pour allumer ou éteindre toutes les lumières du salon et l’autre permettra de changer la configuration lumineuse de la pièce.

Ce module Fibaro a été appairé sur mon contrôleur Z-Wave qui est une Vera Lite. Après avoir déployé le package Vera sur une des sentinelles de ma Constellation, on obtient différents StateObjects représentant l’état en temps réel de chaque device Z-Wave et des MessageCallbacks permettant de les piloter.

Les deux relais du FGS-221 sont considérés comme deux devices distincts de type « Switchs » (On ou Off). On a donc deux StateObjects dans Constellation pour représenter l’état de ces deux relais. Chacun de ces StateObjects contient la propriété « Status », un booléen indiquant si le relais est ouvert ou fermé.

On peut permuter l’état du relais informatiquement parlant par la Vera (ou par Constellation via le MessageCallback « SetSwitchState » du package Vera) ou directement en appuyant sur les boutons poussoirs.

Ainsi dès lors que l’utilisateur va appuyer sur l’un des boutons poussoirs, l’état du relais changera et donc le StateObject le représentant sera également mis à jour dans votre Constellation. On pourra donc s’abonner à ces deux StateObjects via l’API.NET, Python, Arduino ou autre pour réagir à ces changements d’état, par exemple pour allumer ou éteindre les ampoules Hue.

Etape 2 : connecter des lampes

Deuxième étape pour mener à bien notre projet : connecter des lampes dans Constellation. Il y a différentes solutions comme nous avons pu le découvrir dans cet autre tutoriel : solutions DIY, prises connectées en Wifi, RF, en Z-Wave, lampes ou ampoules connectées en Wifi, en ZeeBee, etc.. etc..

Dans mon cas, j’ai équipé les huit appliques de mon salon avec des ampoules Philips Hue.

Toutes les ampoules communiquent en ZeeBee à un pont Ethernet, nommé le bridge (à gauche de la photo ci-dessus). Grace au package Hue, vous disposez de différents MessageCallbacks pour contrôler chaque lampes Hue (état, intensité lumineuse, couleur, effet, etc..) et d’un StateObject par luminaire représentant son état en temps réel.

Etape 3 : synchroniser l’interrupteur avec les lampes

Passons au chose sérieuse, nous avons d’un côté deux StateObjects nous indiquant l’état des deux relais qu’on contrôle par les boutons poussoirs et de l’autre des MessageCallbacks nous permettant de contrôler les ampoules Hue du salon, reste juste à faire le lien !

Pour cela nous allons créer un package .NET en C# depuis Visual Studio.

Dans la classe principale (Program), nous allons ajouter deux StateObjectLinks, c’est à dire des propriétés dans notre code liées aux StateObjects représentant les états des interrupteurs :

[StateObjectLink("Vera", "Interrupteur Hue 1")]
public StateObjectNotifier InterrupteurHue1 { get; set; }

[StateObjectLink("Vera", "Interrupteur Hue 2")]
public StateObjectNotifier InterrupteurHue2 { get; set; }

Nous allons commencer par le bouton de gauche, c’est à dire l’interrupteur n°1 qui se chargera d’allumer ou d’éteindre toutes les ampoules du salon.

Pour cela nous allons attacher un « handler » qui réagira à la mise à jour du StateObject « Interrupteur Hue 1 ». Le handler commencera par vérifier que l’état à bien changé, c’est à dire que la propriété « Status » du « OldState » versus le « NewState » est bien différente (le StateObject peut être mis à jour par exemple dans le cas d’un « poll » Z-Wave à intervalle régulier sans pour autant que son Status ait changé !).

Ensuite on invoque simplement le MessageCallback « SetState » du package Hue. Le 1er argument est le n° de la lampe, 0 indiquant « toutes les lampes » et le 2ème argument est l’état (On ou Off) de la lampe. Ici on passera l’état du relais (propriété du Status).

this.InterrupteurHue1.ValueChanged += (s, e) =>
{
    if ((bool)e.OldState.DynamicValue.Status != (bool)e.NewState.DynamicValue.Status)
    {
        PackageHost.CreateMessageProxy("Hue").SetState(0, (bool)e.NewState.DynamicValue.Status);
    }
};

Ainsi dès que vous appuyez sur le bouton poussoir de gauche, le relais change d’état donc le code ci-dessus est invoqué ce qui allumera ou éteindra toutes vos lampes Hue !

Et voilà comment en quelques lignes on peut synchroniser des choses ensembles ! Au final, on obtient un interrupteur connecté pilotant plusieurs ampoules connectées.

Une fois votre package testé et validé, vous pouvez le publier dans votre Constellation et le déployer sur une de vos sentinelles (voir le guide). Simple et efficace !

Etape 4 : contrôler les ambiances lumineuses

Ce que nous avons fait jusqu’à présent est relativement simple : on synchronise simplement l’état du relais Fibaro (piloté par l’interrupteur) à l’état (state On/Off) des lampes Hue.

Le MessageCallback « SetState » allume ou éteint des lampes Hue. Dans le cas d’un allumage, les lampes reprendront leurs dernières configurations en terme de couleur et d’intensité.

Il existe d’autre MC sur ce package comme le SetColor, SetBrightness, ou le Set qui combine les 3 en un en prenant en paramètre à la fois l’état, la couleur et l’intensité.

Nous allons donc perfectionner notre package en utilisant un setting au format JSON pour décrire nos différentes ambiances lumineuses. L’interrupteur de gauche ne se contentera plus de faire un simple SetState sur chaque lampe mais appliquera la configuration dite par défaut que nous pourrons à tout moment mettre à jour dans les settings depuis la Console.

L’interrupteur n°2 quant à lui, celui de droite, servira pour appliquer la configuration suivante de façon cyclique (arrivé à la dernière, on revient au début).

Commençons d’abord par définir nos configurations lumineuses dans un setting JSON.

Créer des « configurations lumineuses »

Pour cela je vous propose de créer une page Web pour générer le setting de configuration sur base de l’état actuelle de vos lampes.

En clair, avec l’application officielle Hue, réglez vos lampes pour créer l’ambiance lumineuse souhaitée et en temps réel notre page Web générera l’objet JSON représentant votre configuration.

Nous allons simplement créer un simple page HTML en y ajoutant le module Constellation / AngularJS comme vu ici.

Lorsque nous sommes connecté, on enregistre un StateObjectLink sur tous les StateObjects du type « Q42.HueApi.Light » du package Hue. Pour chaque lampe Hue, on stocke la valeur du StateObject dans une variable de scope nommée « lights » :

constellation.registerStateObjectLink("*", "Hue", "*", "Q42.HueApi.Light", function (stateObject) { 
    $scope.$apply(function () {
        $scope.lights[stateObject.Name] = stateObject.Value;
    });
});

Ainsi l’état de chacune de nos lampes sera synchronisée en temps réel dans cette variable Javascript.

Maintenant dans le code HTML, générons une liste pour afficher le nom de chaque lampe, son ID, son état (on/off), sa couleur (Hue et Saturation) et son intensité (bri) avec un « ng-repeat » Angular :


    {{name}} = #{{value.id}} On:{{value.state.on}} Hue:{{value.state.hue}} Sat:{{value.state.sat}} Bri:{{value.state.bri}}

C’est aussi simple que cela !

Maintenant ajoutons une méthode « ExportCurrentConfig » qu’on appellera dans notre StateObjectLink dès qu’un StateObject est mis à jour :

$scope.ExportCurrentConfig = function() {
    var config = { ConfigName: "MyConfig", Lights: []};
    for(var name in $scope.lights) {
        var value = $scope.lights[name];
        config.Lights.push({ id: value.id, state: value.state.on, hue: value.state.hue, sat:value.state.sat, bri:value.state.bri });
    }
    $scope.strConfigs = JSON.stringify([ config ]).replace(/"/g, "'");
};

On crée un objet avec une propriété « ConfigName » pour nommer notre configuration et un tableau « Lights » qu’on remplit avec l’état connu de chaque lampe. Pour finir on « stringify » notre objet en JSON qu’on affichera ensuite dans un « textarea » sur la page :

Il ne reste plus qu’à générer différentes configurations notre « extracteur » pour la suite de notre tutoriel.

Le code complet de la page :




    Hue Configuration
        
    
    
    
    
     
    
    


    
        {{name}} = #{{value.id}} On:{{value.state.on}} Hue:{{value.state.hue}} Sat:{{value.state.sat}} Bri:{{value.state.bri}}
    
    
    Current configuration :
    {{strConfigs}}

Activer les configurations depuis interrupteur

Premièrement nous allons déclarer dans le manifeste de notre package (PackageInfo.xml) le setting « Hue.Configuration » par la ligne :

Le contenu de ce setting sera un tableau des différentes configurations générées par notre extracteur ci-dessus.

Pour ma part voici mes configurations à titre d’exemple :

[
   {
      'ConfigName':'Blanc chaud',
      'DefaultConfig':true,
      'Lights':[
         {
            'id':'1',
            'state':true,
            'hue':6479,
            'sat':252,
            'bri':254
         },
         {
            'id':'2',
            'state':true,
            'hue':13907,
            'sat':187,
            'bri':179
         },
         {
            'id':'3',
            'state':true,
            'hue':13907,
            'sat':187,
            'bri':254
         },
         {
            'id':'4',
            'state':true,
            'hue':14101,
            'sat':180,
            'bri':141
         },
         {
            'id':'5',
            'state':true,
            'hue':14101,
            'sat':180,
            'bri':254
         },
         {
            'id':'6',
            'state':true,
            'hue':14101,
            'sat':180,
            'bri':161
         },
         {
            'id':'7',
            'state':true,
            'hue':12778,
            'sat':219,
            'bri':120
         },
         {
            'id':'8',
            'state':true,
            'hue':12778,
            'sat':219,
            'bri':254
         }
      ]
   },
   {
      'ConfigName':'Film du soir',
      'Lights':[
         {
            'id':'1',
            'state':true,
            'hue':7157,
            'sat':243,
            'bri':104
         },
         {
            'id':'2',
            'state':false,
            'hue':13907,
            'sat':187,
            'bri':179
         },
         {
            'id':'3',
            'state':true,
            'hue':13122,
            'sat':211,
            'bri':80
         },
         {
            'id':'4',
            'state':true,
            'hue':12778,
            'sat':219,
            'bri':142
         },
         {
            'id':'5',
            'state':true,
            'hue':13122,
            'sat':211,
            'bri':80
         },
         {
            'id':'6',
            'state':false,
            'hue':14101,
            'sat':180,
            'bri':161
         },
         {
            'id':'7',
            'state':false,
            'hue':13122,
            'sat':211,
            'bri':120
         },
         {
            'id':'8',
            'state':false,
            'hue':4712,
            'sat':241,
            'bri':254
         }
      ]
   },
   {
      'ConfigName':'Cheminée',
      'Lights':[
         {
            'id':'2',
            'state':false,
            'hue':7980,
            'sat':252,
            'bri':79
         },
         {
            'id':'8',
            'state':true,
            'hue':4712,
            'sat':241,
            'bri':254
         },
         {
            'id':'5',
            'state':true,
            'hue':13122,
            'sat':211,
            'bri':91
         },
         {
            'id':'4',
            'state':false,
            'hue':7862,
            'sat':252,
            'bri':53
         },
         {
            'id':'3',
            'state':true,
            'hue':13122,
            'sat':211,
            'bri':91
         },
         {
            'id':'6',
            'state':true,
            'hue':8774,
            'sat':252,
            'bri':56
         },
         {
            'id':'7',
            'state':true,
            'hue':13122,
            'sat':211,
            'bri':120
         },
         {
            'id':'1',
            'state':true,
            'hue':6196,
            'sat':247,
            'bri':104
         }
      ]
   },
   {
      'ConfigName':'Tout éteind',
      'OffConfig':true,
      'Lights':[
         {
            'id':'1',
            'state':false,
            'hue':7157,
            'sat':243,
            'bri':104
         },
         {
            'id':'2',
            'state':false,
            'hue':13907,
            'sat':187,
            'bri':179
         },
         {
            'id':'3',
            'state':false,
            'hue':3584,
            'sat':252,
            'bri':254
         },
         {
            'id':'4',
            'state':false,
            'hue':12778,
            'sat':219,
            'bri':142
         },
         {
            'id':'5',
            'state':false,
            'hue':13122,
            'sat':211,
            'bri':80
         },
         {
            'id':'6',
            'state':false,
            'hue':14101,
            'sat':180,
            'bri':161
         },
         {
            'id':'7',
            'state':false,
            'hue':12778,
            'sat':219,
            'bri':120
         },
         {
            'id':'8',
            'state':false,
            'hue':12778,
            'sat':219,
            'bri':254
         }
      ]
   }
]

Vous remarquerez que j’ai ajouté sur la première configuration la propriété « DefaultConfig = true » et « OffConfig =true » sur la dernière. On se servira de ces deux propriétés pour savoir quelles sont les configurations à appliquer en cas de « On » et de « Off » sur notre interrupteur n°1.

Le setting est de type « JsonObject », on aura donc un bel éditeur dans la Console Constellation pour le déclarer ou le modifier. Pour vos développements vous pouvez aussi utiliser le fichier App.config.

Pour revenir à notre code C#, nous allons tout d’abord déclarer les variables privées suivantes :

private int currentConfigurationId = 0, defaultConfigurationId = 0, offConfigurationId = 0;
private List hueConfiguration = new List();

Dans la méthode démarrage (OnStart) on charge notre setting JSON dans la variable « hueConfiguration » avec la méthode « GetSettingAsJson » puis on récupère dans ce tableau l’index de la configuration « Default » et « Off » par la méthode .NET « FindIndex » :

hueConfiguration = new List(PackageHost.GetSettingAsJsonObject("Hue.Configurations"));
defaultConfigurationId = this.hueConfiguration.FindIndex(c => c.DefaultConfig == true);
offConfigurationId = this.hueConfiguration.FindIndex(c => c.OffConfig == true);

Créons maintenant la méthode « ApplyHueConfiguration » qui se chargera d’appliquer la configuration sur nos lampes Hue.

En quelques mots elle itère sur chaque « Light » de la configuration spécifiée par son index puis invoque le MessageCallback « Set » du package Hue en passant l’ID de la lampe avec son état (state, hue/sat et brightness). La configuration courante est sauvegardée dans la variable « currentConfigurationId« .

Il est aussi possible de spécifier optionnellement l’index de la configuration à exclure ce qui aura pour action d’appliquer automatique la configuration suivante.

private int ApplyHueConfigration(List configurationList, int configIdx, int configToExclude = -1)
{
    // Si la config selectionnée est à exclure ...
    if (configToExclude >= 0 && configIdx == configToExclude)
    {
        // On passe à la configuration suivante :
        return this.ApplyHueConfigration(configurationList, (configIdx + 1) % configurationList.Count, configToExclude);
    }
    else
    {
        // On récupere la configuration à partir de son Index
        var config = configurationList[configIdx];
        PackageHost.WriteInfo("Applying Hue configuration '{0}'", config.ConfigName);
        // On applique la configuration en invoquant le MC "Set" à chaque lampe
        this.currentConfigurationId = configIdx;
        foreach (dynamic hue in config.Lights)
        {
            PackageHost.CreateMessageProxy("Hue").Set(hue.id, hue.state, hue.hue, hue.sat, hue.bri);
            Thread.Sleep(100);
        }
        // On retourne l'Index de la configuration appliquée
        return configIdx;
    }
}

Maintenant modifions notre handler sur le StateObjectLink « InterrupteurHue1 » que nous avons créé précédemment.

Dès que cet interrupteur change d’état on applique la configuration « Default » ou « Off » en fonction de l’état du relais FGS-211 correspondant. On prendra garde de ne rien faire si l’interrupteur change à « On » alors que l’état des lampes n’est pas éteint et inversement, on ne fera rien si l’interrupteur change à « Off » alors que les lampes sont déjà éteintes.

this.InterrupteurHue1.ValueChanged += (s, e) =>
{
    // Si InterrupteurHue1 change d'état
    if ((bool)e.OldState.DynamicValue.Status != (bool)e.NewState.DynamicValue.Status)
    {
        if ((bool)e.NewState.DynamicValue.Status && this.currentConfigurationId != offConfigurationId)
        {
            // Ne rien faire si InterrupteurHue1 = ON et que la configuration actuelle n'est pas "tout eteint" !
            return;
        }
        else if ((bool)e.NewState.DynamicValue.Status == false && this.currentConfigurationId == offConfigurationId)
        {
            // Ne rien faire si InterrupteurHue1 = OFF et que la configuration actuelle est déjà "tout eteint" !
            return;
        }
        else
        {
            // Autrement on applique la configuration "default" si InterrupteurHue1 = ON ou "off" si InterrupteurHue1 = Off
            this.ApplyHueConfigration(hueConfiguration, (bool)e.NewState.DynamicValue.Status ? defaultConfigurationId : offConfigurationId);
        }
    }
};

Maintenant pour le deuxième interrupteur, dès qu’il changera d’état, deux cas :

Si l’interrupteur n°1 n’est pas allumé, on invoque le MC « SetSwitchState » du package Vera pour l’allumer. Ainsi son SO sera mis à jour et donc le code ci-dessus sera invoqué pour appliquer la configuration « Default » (synchronisation parfaite entre l’état du relais Fibaro et nos lampes)
Si l’interrupteur n°1 est déjà allumé, on appelle notre méthode « ApplyHueConfiguration » en spécifiant l’index de la prochaine configuration et en excluant la configuration « tout éteint » (Off)

// On permute les configurations avec InterrupteurHue2
this.InterrupteurHue2.ValueChanged += (s, e) =>
{
    // Si InterrupteurHue2 change d'état
    if ((bool)e.OldState.DynamicValue.Status != (bool)e.NewState.DynamicValue.Status)
    {
        // Si InterrupteurHue1 = OFF, on l'allume pour garder InterrupteurHue1 syncrhonisé !
        if ((bool)this.InterrupteurHue1.DynamicValue.Status == false)
        {
            // Cela déclenchera le handler ci-dessus ce qui appliquera la configuration "default".
            PackageHost.CreateMessageProxy("Vera").SetSwitchState(new { DeviceID = (int)this.InterrupteurHue1.DynamicValue.Id, State = true });
        }
        else // Si InterrupteurHue1 est déjà ON
        {
            // ON applique la configuration suivante de facon cyclique en excluant la configuration " tout éteint"
            this.ApplyHueConfigration(hueConfiguration, (this.currentConfigurationId + 1) % hueConfiguration.Count, configToExclude: offConfigurationId);
        }
    }
};

Ainsi on a bien l’interrupteur n°1 qui contrôle le relais n° 1 du Fibaro, lui même parfaitement synchronisé avec nos lampes. Si le relais est éteint, on applique la configuration « OffConfig » de notre setting et si le relais est allumé, on applique la configuration « DefaultConfig ».

Quand on appuie sur l’interrupteur n°2, on permute l’état du relais n° 2 du Fibaro ce qui applique donc, de manière cyclique, les différentes configurations de notre setting sur nos lampes Hue.

On peut modifier comme bon nous semble le setting depuis la Console Constellation pour changer la configuration par défaut, ajouter ou supprimer de nouvelles ambiances ou modifier celles existantes ! De même, si ajoutez des lampes dans votre pièce vous n’aurez qu’à les déclarer dans votre JSON;

De plus, avec n’importe quelle application ou contrôleur Z-Wave comme un Minimote par exemple, vous pouvez contrôler l’interrupteur n°1 qui se synchronisera parfaitement avec vos lampes Hue !

Pour aller plus loin

Ajoutons une dernière méthode nommée « ApplyHueConfiguration » qui accepte en paramètre le nom de la configuration à appliquer. On l’invoque avec le nom de la configuration (et non l’index) et elle se chargera d’appliquer cette configuration si elle existe bien dans votre setting.

Une fois n’est pas coutume, on enverra des messages au package Vera pour synchroniser l’état du relais n°1 si nécessaire.

[MessageCallback]
public int ApplyHueConfigration(string configName)
{
    // On récupere l'ID de la configuration à partir de son nom
    int configId = this.hueConfiguration.FindIndex(c => c.ConfigName == configName);
    if (configId >= 0)
    {
        // On synchronise l'interrupteur Fibaro avec les lampes (sens Hue -> Fibaro)
        if (configId != offConfigurationId && (bool)this.InterrupteurHue1.DynamicValue.State == false)
        {
            PackageHost.CreateMessageProxy("Vera").SetSwitchState(new { DeviceID = (int)this.InterrupteurHue1.DynamicValue.Id, State = true });
        }
        else if (configId == offConfigurationId && (bool)this.InterrupteurHue1.DynamicValue.State == true)
        {
            PackageHost.CreateMessageProxy("Vera").SetSwitchState(new { DeviceID = (int)this.InterrupteurHue1.DynamicValue.Id, State = false });
        }

        // On applique la configuration
        return this.ApplyHueConfigration(hueConfiguration, configId);
    }
    else
    {
        return configId;
    }
}

Vous remarquerez que nous avons ajouté l’attribut [MessageCallback] sur cette méthode ce qui veut dire que votre package exposera cette méthode, que l’on nomme MessageCallback, pour toute votre Constellation.

C’est à dire que n’importe quel autre package C#, Python, un script Powershell ou Bash, un Arduino ou ESP8266, une page Web, etc… Tous pourront envoyer un message à votre package pour appliquer des configurations lumineuses sur vos lampes Hue en fonction des configurations que nous avez configuré dans votre setting !

The post Synchroniser un interrupteur mural avec des ampoules connectées et contrôler l’ambiance lumineuse de votre pièce appeared first on Constellation.

Synchroniser la lampe du bureau avec sa session Windows

Sebastien Warin — Sun, 14 May 2017 12:35:00 +0000

L’un des avantages de Constellation est qu’il est très facile de faire « parler » des objets/systèmes entre eux. Dans ce tutoriel, nous allons lier notre lampe du bureau à notre session Windows.

L’idée est très simple : lorsque vous déverrouillez (ou ouvrez) votre session Windows on allumera automatiquement la lampe du bureau et lorsque vous verrouillez (ou fermez) votre session, la lampe s’éteindra automatiquement.

On peut même aller plus loin si vous avez un capteur de luminosité connecté pour n’allumer la lampe que lorsqu’il fait trop sombre.

Prérequis

Un serveur Constellation
Une lampe pilotable par Constellation
Le package WindowsControl déployé sur la sentinelle de l’ordinateur Windows à synchroniser avec la lampe
Optionnellement un capteur de luminosité connecté dans Constellation
Le SDK Constellation pour Visual Studio

Etape 1 : piloter une lampe par Constellation

Bien entendu il faut d’abord pouvoir piloter une lampe par Constellation pour réaliser ce tutoriel !

Vous pouvez par exemple piloter un relais depuis un Raspberry en créant un package Python ou bien depuis un Arduino ou un ESP8266 comme vu dans ce tutoriel. Il suffit de créer une fonction pilotant un relais (simple manipulation d’une sortie digitale) et d’exposer cette fonction comme MessageCallback. On pourra ainsi invoquer votre méthode pour ouvrir et fermer le relais et donc piloter une lampe depuis n’importe quel système connecté dans votre Constellation.

Autre solution utiliser une carte de relais connectée par USB qu’on pilotera avec le package RelayBoard. Ce package expose des MC permettant d’ouvrir ou fermer les relais et publie l’état de chacun d’entre eux comme StateObject. Il ne reste plus qu’à connecter une lampe sur l’un des relais.

On peut aussi utiliser des prises Wifi Belkin Wemo qu’on connectera à Constellation avec le package Wemo. Encore une fois ce package expose des MC permettant d’allumer ou d’éteindre la charge connectée dessus et publie son état en tant que StateObject. Il suffit d’y brancher une lampe !

Dans la même idée, on peut utiliser des prises Somfy qu’on connectera à Constellation avec le package RFXCOM nécessitant une passerelle RFXcom connectée en USB. Le package expose un MessageCallback permettant d’envoyer des ordres par radiofréquences aux équipements RTS (protocole Somfy) pour piloter par exemple des prises. Il n’y a pas de retour d’état sur ce protocole, donc il ne sera pas possible de récupérer son état mais on pourra allumer ou éteindre la prise et donc une lampe !

Encore une autre possibilité, utiliser des prises ou des modules Z-Wave. Il faut pour cela un contrôleur Z-Wave qu’on connectera à Constellation. Vous pouvez soit utiliser le package Jeedom ou soit le package Vera.

On pourrait également utiliser des lampes ou des ampoules connectées de la gamme Phillips Hue qu’on connectera à Constellation grâce au package Hue.

Pour ma part la lampe de mon bureau est contrôlée par une prise Z-Wave AN158 appairée sur une Vera Lite. Ce contrôleur Z-Wave est connecté à Constellation grâce au package Vera.

J’ai donc dans ma Constellation des StateObjets pour chaque périphérique Z-Wave et des MessageCallbacks pour envoyer des ordres Z-Wave. Par exemple depuis le MessageCallbacks Explorer, on retrouve le MC « SetSwitchState » permettant de définir l’état d’un switch (On/Off) Z-Wave.

Depuis l’API.net il me suffit d’invoquer le code suivant pour allumer le device #42 :

PackageHost.CreateMessageProxy("Vera").SetSwitchState(new { DeviceID = 42, State = true });

Vous pouvez appuyer sur le bouton pour obtenir les exemples de code pour chaque MessageCallback. Par exemple toujours pour allumer le device Z-Wave #42 depuis un Arduino :

constellation.sendMessage(Package, "Vera", "SetSwitchState", "{ 'DeviceID':42, 'State':true }");

Bref il existe différente méthode de piloter une lampe (ou n’importe quelle charge) depuis Constellation, soit en mode DIY en créant vous-même votre package réel (C#, Python, …) ou virtuel (Arduino, ESP8266, Gadgeteer, …) ou bien en utilisant des technologies telles RTS de Somfy, le Z-Wave, les lampes et ampoules Philips, les prises Wifi de Belkin, etc… avec les packages déjà disponibles dans le catalogue en ligne.

Et quand bien même il n’existe pas de connecteur Constellation pour piloter votre lampe, libre à vous de créer votre propre package créant ainsi la passerelle, le connecteur entre Constellation et votre lampe.

Etape 2 : connaitre l’état de la session avec le package WindowsControl

Maintenant que nous avons un MessageCallback pour piloter la lampe du bureau, faut-il encore savoir si la session est ouverte ou non.

Pour cela vous avez dans le catalogue en ligne, le package WindowsControl qui expose différent MessageCallbacks pour verrouiller ou fermer une session, pour arrêter ou redémarrer l’ordinateur, pour contrôler le volume ou la luminosité (comme vu dans ce tutoriel).

Ce package produit également un StateObject nommé « SessionLocked » de type booléen qui indique si la session est verrouillée (ou fermée) ou non.

Il suffit donc de déployer ce package depuis la Console Constellation sur la sentinelle UI du PC à synchroniser avec votre lampe. On suivra ainsi ce StateObject pour savoir quel est l’état de votre session et réagir tout changement d’état.

Etape 3 : synchroniser la lampe avec la session en C#

Passons au chose sérieuse, nous avons d’un côté un StateObject nous indiquant si la session est ouverte ou non et un MessageCallback nous permettant d’allumer ou d’éteindre la lampe du bureau, reste juste à créer le lien.

Pour cela nous allons créer un package .NET en C# depuis Visual Studio.

Dans la classe principale (Program), nous allons ajouter un StateObjectLink, c’est à dire une propriété dans notre code liée au StateObject représentant l’état de la session en ajoutant les lignes :

[StateObjectLink("WindowsControl", "SessionLocked")]
public StateObjectNotifier SessionLocked { get; set; }

Prenez garde toutefois, si vous avez déployé le package WindowsControl sur plusieurs sentinelles de votre Constellation, le StateObjectLink ci-dessus sera lié à plusieurs StateObjects et non au StateObject de votre ordinateur à scruter. L’unicité d’un StateObject est obtenu par le triplet : “Sentinel + Package + Nom” car un nom de StateObject est unique pour une instance de package (couple Sentinel / Package), de même qu’un package est unique pour une sentinelle et qu’une sentinelle est unique dans une Constellation.

De ce fait pour lier la propriété « SessionLocked » au StateObject « SessionLocked » de votre ordinateur on écrira :

[StateObjectLink("PC-SEB_UI", "WindowsControl", "SessionLocked")]
public StateObjectNotifier Session { get; set; }

Dans l’exemple ci-dessus, la machine est nommée « PC-SEB » et donc le nom de sa sentinelle « PC-SEB_UI » étant donné que le package WindowsControl est déployé sur la Sentinelle UI d’où le suffixe « _UI » dans le nom de la sentinelle. Vous pouvez bien entendu vérifier le nom exacte de votre sentinelle sur la Console Constellation.

Maintenant que l’état de la session de notre PC est synchronisé dans cette propriété .NET de notre code C#, nous allons ajouter un « handler » pour réagir au changement d’état :

this.SessionLocked.ValueChanged += (s, e) =>
{
    if ((bool)this.SessionLocked.DynamicValue)
    {
        PackageHost.WriteInfo("Verrouillage de la session : fermeture de la lampe");
    }
    else
    {
        PackageHost.WriteInfo("Session déverrouillée : allumage de la lampe");
    }
};

Maintenant pour allumer la lumière, il suffit d’envoyer un message pour déclencher le MessageCallback permettant de contrôler votre lampe. Comme expliqué ci-dessus, dans mon cas, la lampe sur mon bureau est contrôlée par une prise Z-Wave AN158 pilotable par le package Vera via le MessageCallback « SetSwitchState« .

On crée donc un proxy dynamique vers le package Vera et on invoque le MC comme on invoquerait une méthode .NET en passant en paramètre un objet contenant l’ID du device Z-Wave et l’état souhaité :

PackageHost.CreateMessageProxy("Vera").SetSwitchState(new { DeviceID = 42, State = true });

Pour connaitre l’ID du device Z-Wave on peut soit le rechercher dans le StateObjects Explorer et l’écrire en dur dans notre code C#, ou soit ajouter un autre StateObjectLink afin de récupérer dynamiquement son Id (car contenu dans le StateObject du device).

Le code de notre package sera donc :

public class Program : PackageBase
{
    [StateObjectLink("Vera", "Lampe Bureau Seb")]
    public StateObjectNotifier LampeBureau { get; set; }

    [StateObjectLink("PC-SEB_UI", "WindowsControl", "SessionLocked")]
    public StateObjectNotifier SessionLocked { get; set; }

    static void Main(string[] args)
    {
        PackageHost.Start(args);
    }

    public override void OnStart()
    {
        this.SessionLocked.ValueChanged += (s, e) =>
        {
            if ((bool)this.SessionLocked.DynamicValue)
            {
                PackageHost.WriteInfo("Verrouillage de la session : fermeture de la lampe");
                PackageHost.CreateMessageProxy("Vera").SetSwitchState(new { DeviceID = (int)this.LampeBureau.DynamicValue.Id, State = false });
            }
            else
            {
                PackageHost.WriteInfo("Session déverrouillée : allumage de la lampe");
                PackageHost.CreateMessageProxy("Vera").SetSwitchState(new { DeviceID = (int)this.LampeBureau.DynamicValue.Id, State = true });
            }
        };
    }
}

On peut maintenant lancer notre package en mode « Debug On Constellation » pour le tester depuis Visual Studio tout en le connectant dans votre Constellation :

Vous pouvez tester le fonctionnel de votre package : on verrouille la session, la lampe s’éteint, on la déverrouille, la lampe s’allume !

Une fois votre package testé et validé, vous pouvez le publier dans votre Constellation et le déployer sur une de vos sentinelles (voir le guide).

Etape 4 : ajouter un capteur de luminosité

Jusqu’à présent dès que la session est déverrouillée la lampe du bureau s’allume et dès qu’on la ferme elle s’éteint. Seulement en pleine journée ce n’est peut être pas très judicieux d’allumer la lumière !

Pour cela nous pouvons ajouter une condition supplémentaire basée sur la luminosité ambiante.

On pourrait utiliser un capteur sans fil du marché comme le Chacon DIO54783 connecté via le package RFXcom ou bien un capteur Z-Wave via le package Vera ou Jeedom. On peut aussi concevoir son propre capteur avec un Arduino ou un ESP8266 comme vu dans ce tutoriel ou avec un Raspberry Pi comme vu ici.

Dans notre article, prenons par exemple l’un des deux capteurs ci-dessus qui publient chacun un StateObject nommé « Lux » composé de 3 propriétés : Broadband, IR et Lux.

Pour intégrer cette « information » dans notre code C#, ajoutons un StateObjectLink vers le StateObject « Lux » :

[StateObjectLink("LightSensor", "Lux")]
public StateObjectNotifier LuxSensor { get; set; }

On peut maintenant modifier la condition d’allumage avec un « else if » qui vérifiera que la luminosité est inférieure à un seuil qu’on va déclarer dans les settings Constellation de façon à pouvoir modifier cette valeur à la volée depuis la Console Constellation :

else if (this.LuxSensor.DynamicValue.Lux < PackageHost.GetSettingValue("DaylightThreshold"))

Bien entendu comme tout setting, il est vivement recommandé de le déclarer dans le manifeste du package (le fichier PackageInfo.xml). De plus on pourra y définir la valeur par défaut ici fixée à 50 (lux) :

Pour finir, prenons le cas où la session est déjà déverrouillée et la soirée arrivant, la luminosité passe en dessous du seuil : il faut alors allumer la lumière bien que l’état de la session n’a pas changé !

Pour cela nous allons ajouter un « handler » pour réagir à chaque mise à jour du StateObject « Lux » du capteur de luminosité. A chaque nouvelle mesure, si la valeur est inférieure au seuil défini dans les settings et que la session est bien déverrouillée, on allumera la lumière :

this.LuxSensor.ValueChanged += (s, e) =>
{
    if (e.NewState.DynamicValue.Lux < PackageHost.GetSettingValue("DaylightThreshold") && (bool) this.SessionLocked.DynamicValue == false)
    {
        PackageHost.WriteInfo("Session déverrouillée à la tombée de la nuit : allumage de la lampe");
        PackageHost.CreateMessageProxy("Vera").SetSwitchState(new { DeviceID = (int)this.LampeBureau.DynamicValue.Id, State = true });
    }
};

Ainsi notre lumière de bureau est maintenant synchronisée à notre session et ne s’allumera que si la luminosité est faible. Elle sera donc éteinte dès qu’on ferme ou verrouille la session et s’allumera si la luminosité baisse sous le seuil défini dans les settings alors que la session est déjà déverrouillée ou vient d’être déverrouillée.

Etape 5 : fermer la lampe en cas de déconnexion du PC

Pour vraiment aller au fond des choses il y a encore un cas à gérer : que faire si le PC s’arrête proprement ou brutalement. En somme l’idée est de fermer la lampe si le PC est déconnecté de Constellation, que ce soit suite à un arrêt de l’ordinateur, un crash, une déconnexion quelconque, etc..

Pour savoir si le PC est bien connecté on va surveiller l’état de la sentinelle UI de votre PC. Pour cela il faut se connecter sur le hub de contrôle.

L’utilisation du hub de contrôle depuis un package C# est expliqué en détail dans cet article que je vous recommande de lire.

La première étape consiste donc à déclarer dans le manifeste du package (le fichier PackageInfo.xml) l’utilisation du hub de contrôle par votre package en ajoutant l’attribut suivant sur la balise Package :

EnableControlHub="true"

De plus il faut également, sur votre package, définir une clé d’accès ayant les droits d’accès au hub de contrôle. Vous pouvez vérifier la bonne connexion au hub de contrôle dans votre code par la propriété : « PackageHost.HasControlManager« .

Une fois connecté au hub de contrôle on va demander à recevoir les mises à jour des statuts des sentinelles de notre Constellation par la ligne :

PackageHost.ControlManager.RequestSentinelUpdates();

Cela nous permet ensuite d’attacher un « handler » qu’on filtrera sur notre sentinelle (ici nommée « PC-SEB_UI »). On stockera dans la variable « pcConnected » un booléen indiquant si la sentinelle de notre PC est connectée ou non. Si notre sentinelle n’est pas/plus connectée, on fermera immédiatement la lampe du bureau.

PackageHost.ControlManager.SentinelUpdated += (s, e) =>
{
    if (e.Sentinel.Description.SentinelName == "PC-SEB_UI")
    {
        this.pcConnected = e.Sentinel.IsConnected;
        PackageHost.WriteInfo("Le PC de Seb est '{0}'", e.Sentinel.IsConnected ? "connecté" : "déconnecté");
        if (!this.pcConnected)
        {
            // Éteindre la lampe si le PC est déconnecté !
            PackageHost.CreateMessageProxy("Vera").SetSwitchState(new { DeviceID = (int)this.LampeBureau.DynamicValue.Id, State = false });
        }
    }
};

De plus, dans la condition d’allumage, on rajoutera le fait de vérifier que le PC est bien connecté avant de prendre la décision d’allumer la lampe :

else if (this.pcConnected && this.LuxSensor.DynamicValue.Lux < PackageHost.GetSettingValue("DaylightThreshold"))

Et voilà, notre package est opérationnel ! La lampe est parfaitement synchronisée avec l’état de notre session Windows en tenant compte de la luminosité ambiante et des différents cas de figure pouvant apparaître, comme le redémarrage, l’arrêt ou le crash de notre PC !

Le code final est :

public class Program : PackageBase
{
    // Nom de la sentinelle Windows à syncrhoniser avec la lampe
    private const string SEB_PC_SENTINEL_NAME = "PC-SEB_UI";
    
    // PC Connecté? oui ou non !
    private bool pcConnected = false;

    // Lien vers le SO de la lampe du bureau
    [StateObjectLink("Vera", "Lampe Bureau Seb")]
    public StateObjectNotifier LampeBureau { get; set; }

    // Lien vers l'état de la session Windows
    [StateObjectLink(SEB_PC_SENTINEL_NAME, "WindowsControl", "SessionLocked")]
    public StateObjectNotifier SessionLocked { get; set; }

    // Lien vers le capteur de luminosité
    [StateObjectLink("LightSensor", "Lux")]
    public StateObjectNotifier LuxSensor { get; set; }

    // Démarrage du package
    static void Main(string[] args)
    {
        PackageHost.Start(args);
    }

    // Méthode de démarrage de notre package
    public override void OnStart()
    {
        // Si accès au ControlHub
        if (PackageHost.HasControlManager)
        {
            // Demande de reception des mise à jour des sentinelles
            PackageHost.ControlManager.RequestSentinelUpdates();
            // En cas de mise à jour de l'état d'une sentinelle
            PackageHost.ControlManager.SentinelUpdated += (s, e) =>
            {
                // Si cela concerne notre sentinelle
                if (e.Sentinel.Description.SentinelName == SEB_PC_SENTINEL_NAME)
                {
                    // On stocke dans la variable "pcConnected" l'état connecté ou déconnecté de notre PC
                    this.pcConnected = e.Sentinel.IsConnected;
                    PackageHost.WriteInfo("Le PC de Seb est '{0}'", e.Sentinel.IsConnected ? "connecté" : "déconnecté");
                    // Si le PC est maintenant déconnecté, on ferme la lampe !
                    if (!this.pcConnected)
                    {
                        SetLight(false);
                    }
                }
            };
        }
        else
        {
            // Pas d'accès au COntrolHub, on log une erreur ! Vérifiez votre clé d'accès !
            PackageHost.WriteError("Accès au ControlHub impossible !");
        }

        // En cas de mise à jour du StateObject "Lux" du package "LightSensor"
        this.LuxSensor.ValueChanged += (s, e) =>
        {
            // Si le PC est connecté, que la luminosité actuelle est inférieure au seuil défini dans les settings et que la session est bien dévérouillée
            if (this.pcConnected && e.NewState.DynamicValue.Lux < PackageHost.GetSettingValue("DaylightThreshold") && (bool) this.SessionLocked.DynamicValue == false)
            {
                // On allume la lampe !
                SetLight(true);
                PackageHost.WriteInfo("Session dévérouillée à la tombée de la nuit : allumage de la lampe");
            }
        };

        // En cas de mise à jour du StateObject "SessionLocked" du package "WindowsControl"
        this.SessionLocked.ValueChanged += (s, e) =>
        {
            // Si la session est vérouillée (ou fermée)
            if ((bool)this.SessionLocked.DynamicValue)
            {
                // On eteint la lampe
                SetLight(false);
                PackageHost.WriteInfo("Verrouillage de la session : fermeture de la lampe");
            }
            // Si le PC est connecté, que la luminosité actuelle est inférieure au seuil défini dans les settings et que la session est donc dévérouillée
            else if (this.pcConnected && this.LuxSensor.DynamicValue.Lux < PackageHost.GetSettingValue("DaylightThreshold"))
            {
                // On allume la lampe !
                SetLight(true);
                PackageHost.WriteInfo("Session déverrouillée avec luminosité faible : allumage de la lampe");
            }
        };
    }

    private void SetLight(bool state)
    {
        // Pour allumer la lumière, on invoque le MC "SetSwitchState" du package "Vera" en passant l'ID de la lampe (récupérée par son StateObjet)
        PackageHost.CreateMessageProxy("Vera").SetSwitchState(new { DeviceID = (int)this.LampeBureau.DynamicValue.Id, State = state });
    }
}

The post Synchroniser la lampe du bureau avec sa session Windows appeared first on Constellation.

Créer un capteur de luminosité dans une prise 220v avec un ESP8266

Sebastien Warin — Sat, 13 May 2017 13:35:14 +0000

Ce tutoriel est sur le principe identique à celui-ci : Créer un capteur de température, humidité et luminosité connecté sauf que nous allons utiliser un ESP-01 beaucoup plus petit et moins cher qu’un D1 Mini Pro.

Nous assemblerons l’ESP8266 et le capteur de luminosité TSL2561 dans une prise 220v avec un convertisseur 220v -> 3v3.

Prérequis

Un serveur Constellation
Un ESP8266 comme l’ESP-01 (entre 1,5€ et 2€)
Un capteur de luminosité TSL2561 (environ 2€)
Un convertisseur 220v -> 3v3 (environ 2€)
Un boitier/prise 220v (entre 5 et 15 €)

Le montage

Le capteur TSL2561 se connecte en I²C, il suffit donc de l’alimenter en 3v3 et de connecter les deux GPIO de l’ESP-01 (GPIO-0 et GPIO-2) aux pins SCL et SDA du capteur.

Le schéma de connexion est donc le suivant :

Sur le bornier 220v de notre prise nous allons souder deux fils (la phase et le neutre) vers l’entrée convertisseur 220v AC. En sortie du convertisseur, on a une tension de 3v3 DC que nous connecterons à l’ESP-01 ainsi qu’au TSL2561.

N’oubliez pas également de relier le port « CH_PD » de l’ESP-01 au 3v3 pour activer le Wifi.

Pour plus d’information, je vous invite à lire cet article.

Disposez les différents composants dans le boitier en prenant soin d’isoler les parties 220v (avec de la colle thermofusibles ou du ruban isolant).

Le code

L’ESP-01 ne dispose pas comme le D1 Mini Pro vu dans ce tutoriel d’une interface USB intégrée. Il vous faudra donc une interface USB/FTDI pour le programmer. Pour plus d’information, je vous invite à lire cet article.

A l’inverse du tutoriel précédent, ce code utilise la libraire TSL2561-Arduino-Library et non la « Unifed Sensor Library » afin de nous permettre de récupérer le Broadband et l’IR en plus des Lux.

Il faudra donc installer la libraire « TSL2561-Arduino-Library » depuis le Gestionnaire de bibliothèque. De plus on utilise ici « ArduinoThread » pour ordonner les mesures à intervalle régulier. Vous devrez également installer cette librairie.

Attention : si tout cela est nouveau pour vous, je vous recommande de suivre ce guide d’introduction à l’API Constellation pour Arduino/ESP8266.

Le code complet est :

#include 
const char* ssid     = "MON SSID";
const char* password = "lacléeWifi!!!!";

#include 
Constellation constellation("IP ou DNS du serveur Constellation", 8088, "ESP-LightSensorSalon", "LightSensor", "123456789");

#include 
#include 
TSL2561 tsl(TSL2561_ADDR_FLOAT); 

#include 
Thread thrPushLux = Thread();

void pushLuxOnConstellation() {  
  uint32_t lum = tsl.getFullLuminosity();
  uint16_t ir, full;
  ir = lum >> 16;
  full = lum & 0xFFFF;
  uint32_t lux = tsl.calculateLux(full, ir);
  
  constellation.pushStateObject("Lux", stringFormat("{ 'Lux':%d, 'Broadband':%d, 'IR':%d }", lux, full, ir), "LightSensor.Lux", 300);
}

void setup(void) {
  Serial.begin(115200);  delay(10);

  if (tsl.begin()) {
    Serial.println("Found sensor");
  } else {
    Serial.println("No sensor?");
    while (1);
  }
  
  // You can change the gain on the fly, to adapt to brighter/dimmer light situations
  //tsl.setGain(TSL2561_GAIN_0X);         // set no gain (for bright situtations)
  tsl.setGain(TSL2561_GAIN_16X);      // set 16x gain (for dim situations)  
  // Changing the integration time gives you a longer time over which to sense light
  // longer timelines are slower, but are good in very low light situtations!
  //tsl.setTiming(TSL2561_INTEGRATIONTIME_13MS);  // shortest integration time (bright light)
  //tsl.setTiming(TSL2561_INTEGRATIONTIME_101MS);  // medium integration time (medium light)
  tsl.setTiming(TSL2561_INTEGRATIONTIME_402MS);  // longest integration time (dim light)

  // Set Wifi mode
  if (WiFi.getMode() != WIFI_STA) {
    WiFi.mode(WIFI_STA);
    delay(10);
  }
  
  // Connect to Wifi  
  Serial.print("Connecting to ");
  Serial.println(ssid);
  WiFi.begin(ssid, password);  
  while (WiFi.status() != WL_CONNECTED) {
    delay(500);
    Serial.print(".");
  }
  Serial.println("WiFi connected. IP: ");
  Serial.println(WiFi.localIP());
  Serial.println(constellation.getSentinelName());
  
  JsonObject& settings = constellation.getSettings();
  int interval = 10000; //ms
  if(settings.containsKey("Interval")) {
    interval = settings["Interval"].as();
  }

  thrPushLux.onRun(pushLuxOnConstellation);
  thrPushLux.setInterval(interval);

  constellation.addStateObjectType("LightSensor.Lux", TypeDescriptor().setDescription("Lux data informations").addProperty("Broadband", "System.Int32").addProperty("IR", "System.Int32").addProperty("Lux", "System.Int32"));
  constellation.declarePackageDescriptor();
  
  constellation.writeInfo("ESP LightSensor '%s' is started (Push interval: %d sec)", constellation.getSentinelName(), interval);  
}

void loop(void) {
  if(thrPushLux.shouldRun()){
    thrPushLux.run();
  }
}

Pour démarrer vous devez dans Constellation déclarer une sentinelle associée à une clé d’accès et un package virtuel. Ici notre ESP8266 est représenté par la sentinelle nommée “ESP-LightSensorSalon” et le package virtuel se nomme “LightSensor”.

Ensuite il faut définir le nom de notre réseau Wifi (SSID) ainsi que sa clé d’accès puis nous configurerons le client Constellation en spécifiant l’identité de notre package virtuel, sa clé d’accès et l’adresse/port de notre serveur Constellation.

Dans la méthode « setup()« , on initialise le capteur TSL puis on se connecte au Wifi et enfin on déclare l’intervalle de temps entre chaque mesure, par défaut de 10 secondes qu’on peut modifier en ajoutant un setting « Interval » sur notre package virtuel.

On configure ensuite un « thread » qui exécutera à l’intervalle de temps spécifié la méthode « pushLuxOnConstellation« . Pour finir on déclare la description du StateObject par la méthode « constellation.addStateObjectType » et on affiche un log. Dans la loop(), on déclenche le thread.

La méthode « pushLuxOnConstellation » récupère les données du capteur et publie le StateObject « Lux » avec les trois propriétés :

constellation.pushStateObject("Lux", stringFormat("{ 'Lux':%d, 'Broadband':%d, 'IR':%d }", lux, full, ir), "LightSensor.Lux", 300);

Une fois le programme téléversé, votre prise publiera le StateObject à l’intervalle régulier la luminosité ambiante.

Exploiter le capteur

Comme vous le savez, une fois les données mesurées publiées dans un StateObject n’importe quel système connecté dans Constellation peut récupérer ou s’abonner en temps réel au StateObject.

On peut donc écrire des pages Web, des scripts, des packages .NET ou Python, Arduino, etc… qui exploiteront ces mesures en temps réel.

Je vous renvoie sur cette page ou cette autre page pour avoir quelques idées.

Pour ma part ce capteur installé dans le salon est affiché en temps réel sur un dashboard Web, stocké dans ElasticSearch et Cacti et exploité dans un package .NET nommé « MyBrain » car cette information sur la luminosité ambiante sert dans beaucoup de scénario : gestion des éclairages ou des volets.

The post Créer un capteur de luminosité dans une prise 220v avec un ESP8266 appeared first on Constellation.

Un capteur de luminosité extérieur piloté par un Raspberry avec un package Python

Sebastien Warin — Sat, 13 May 2017 12:46:15 +0000

Dans un précédent tutoriel, nous avons découvert comment créer un capteur de luminosité avec un ESP8266 connecté par Wifi. Ici je vous propose de créer un capteur extérieur piloté par un Raspberry Pi.

Pour être exact, le Raspberry Pi sera installé en intérieur, connecté au réseau filaire Ethernet et relié par un câble à un boitier étanche installé sur le toit qui contiendra une photorésistance et/ou un capteur TSL2561.

Nous allons utiliser un Raspberry B+ version 1 sur lequel nous installerons une sentinelle pour pouvoir déployer notre package depuis Visual Studio. Le package d’acquisition des données sera écrit en Python.

Prérequis

Un serveur Constellation
Un Raspberry Pi sur lequel nous installerons une sentinelle
Une photorésistance avec un condensateur 1uF et/ou un capteur TSL2561
Visual Studio avec le SDK Constellation

Mesurer la luminosité ambiante avec une photorésistance

Le montage

Tout d’abord, il nous faut un boitier étanche avec un couvercle transparent (pour mesurer la luminosité c’est mieux !) :

Sur une plaque epoxy, soudons la photorésistance avec un condensateur 1uF.

Une des deux pattes de la photorésistance sera reliée sur la pin « 3v3 » du Raspberry et la deuxième sera reliée à une entrée du Raspberry, disons la pin n°12 (soit la GPIO #18). Toujours sur cette 2ème patte, on soudera le pole « + » du condensateur. L’autre pole du condensateur, celle marquée « -« , devra être reliée à la masse, sur l’une des pins « GND » du Raspberry.

On a donc trois fils connectés entre le Raspberry et notre capteur : le 3V3 et la masse (Gnd) pour l’alimentation et un pour le signal (GPIO #18). L’idée est donc de « charger » le condensateur et de chronométrer le temps qu’il mets à se décharger.

Plus il y a de lumière et moins la résistance est forte, autrement dit le condensateur se déchargera très rapidement. A l’inverse, plus il fait sombre et plus la résistance sera forte. Autrement dit, moins il y a de lumière et moins vite se déchargera le condensateur.

On voit sur les photos ci-dessous, le fil Orange pour le 3V3, le fil Bleu pour la GPIO et le fil Blanc pour la masse (Gnd) :

Il fois les connexions réalisées, on peut refermer proprement notre boitier en vérifiant soigneusement son étanchéité avant de l’installer sur le toit.

Côté intérieur, on relie les 3 fils de notre boitier au Raspberry (3v3, Gnd et GPIO18), le câble Ethernet et l’alimentation MicroUSB.

Pour l’installation du système sur le Raspberry suivez ce guide puis installez-y une sentinelle. Votre Raspberry est prêt et connecté à Constellation, reste à développer notre package Python.

Programmation

Depuis Visual Studio, créons un nouveau projet de type « Constellation Python Package » que nous nommerons “LightSensor”.

Renommez le fichier « Demo.py » en « Light.py » et remplacez l’intégralité du contenu par le code suivant :

import Constellation
import RPi.GPIO as GPIO, time, os      

MAX_READING = 30000
LIGHT_SENSOR_GPIO = 18
MEASURE_INTERVAL = 10

def OnExit():
    GPIO.cleanup()

def RCtime (RCpin):
    reading = 0
    GPIO.setup(RCpin, GPIO.OUT)
    GPIO.output(RCpin, GPIO.LOW)
    time.sleep(0.1) 
    GPIO.setup(RCpin, GPIO.IN)
    # This takes about 1 millisecond per loop cycle
    while (GPIO.input(RCpin) == GPIO.LOW):
        if (reading > MAX_READING):
            break
        reading += 1
    return reading
 
def Start():
    global INTERVAL
    GPIO.setmode(GPIO.BCM)
    Constellation.OnExitCallback = OnExit
    lastSend = 0
    currentValue = 0
    count = 0
    Constellation.WriteInfo("LightSensor is ready !")
    while Constellation.IsRunning:
        currentValue = currentValue + RCtime(LIGHT_SENSOR_GPIO)
        count = count + 1
        ts = int(round(time.time()))
        if ts - lastSend >= int(Constellation.GetSetting("Interval")):
            avg = int(round(currentValue / count))
            Constellation.PushStateObject("Light", avg, "int")
            currentValue = 0
            count = 0
            lastSend = ts
        time.sleep(MEASURE_INTERVAL)

Constellation.Start(Start)

N’hésitez pas à relire le guide sur la création de package Python pour bien comprendre les bases d’un package Python.

Ici on démarre notre package par la méthode « Start » qui démarre une boucle pour appeler la méthode RCtime toutes les 10 secondes (variable MEASURE_INTERVAL).

La méthode RCtime charge le condensateur (mode output) puis passe l’I/O en « input » et incrémente la variable « reading » en continue tant que le condensateur n’est pas déchargé (input == « low »). Plus la valeur « reading » est élevée, plus le condensateur a mis du temps à se décharger et donc moins il y a de lumière. On a un garde-fou à « 30.000 » pour ne pas attendre indéfiniment dans le cas où il fait trop sombre.

Bien entendu on ne mesure pas une unité précise. Si vous déployez votre code sur un RPi V1 et V2 (plus puissant), vous n’aurez pas la même valeur pour les mêmes conditions.

Chaque mesure incrémente la variable « currentValue », puis dès qu’on atteint l’intervalle configuré dans les Settings Constellation, on fait la moyenne des mesures on publie un StateObject nommé « Light » de type « int ».

Dans le manifeste du package (PackageInfo.xml), n’oubliez pas de déclarer le setting « Interval » en lui spécifiant une valeur par défaut, ici de 10 seconde :

De même vous pouvez également modifier les informations de compatibilité des plateformes pour exclure la plateforme Windows dans la mesure où le package exploite les GPIO du Raspberry.

Et voilà le package est prêt, vous pouvez depuis Visual Studio le publier dans votre Constellation :

… puis le déployer sur votre sentinelle Raspberry depuis la Console Constellation, en cliquant sur le bouton “Deploy new package” :

Dans l’assistant de déploiement vous pourrez alors personnaliser le setting “Interval” ou bien laisser la valeur par défaut que nous avons fixé à 10 (secondes) :

Sur la Console Log, le package va être téléchargé et déployé par votre sentinelle Raspberry avant de démarrer :

Et en vous rendant dans le StateObjects Explorer, vous verrez votre package “LightSensor” publier un StateObject “Light” avec un entier comme valeur :

Votre package Python est opérationnel, on peut dés à présent exploiter cette valeur dans une page Web, un script, un programme .NET ou Python, un Arduino, etc… comme nous le verrons dans la suite de cet article.

Mesurer des lux avec un capteur TSL2561

Pour obtenir une mesure plus fiable et surtout exploitant une échelle de mesure universelle, nous allons utiliser un capteur de luminosité TSL2561 capable de mesurer des Lux.

Le montage

Dans cette deuxième version, j’ai conservé la photorésistance et simplement ajouté le capteur TSL2561. Celui-ci est également alimenté en 3V3, j’ai donc réutilisé les deux fils (Orange et Blanc) de la photorésistance pour alimenter le capteur également.

Le TSL2561 utilise l’I²C, j’ai donc ajouté deux fils entre le boitier étanche et le Raspberry pour connecter le capteur en i²C (SDA et SCL).

Sur le Raspberry, le SDA est la GPIO#2 et le SCL la GPIO #3, c’est à dire juste en dessus de la pin 3v3.

La programmation

Le plus simple et le plus fiable pour récupérer les données du capteur TSL2561 depuis un Raspberry est d’utiliser un programme natif. Pour cela nous allons utiliser le code publié à cette adresse : http://dino.ciuffetti.info/2014/03/tsl2561-light-sensor-on-raspberry-pi-in-c/.

Il suffit récupérer les 3 fichiers C et de les compiler avec GCC pour générer le binaire. Pour vous simplifier la tache, vous pouvez directement récupérer le binaire GetTSL2561 ici.

Ajoutez ensuite un deuxième script nommé « Lux.py » dans le répertoire « Scripts » de votre projet et n’oubliez pas d’inclure votre script dans le package en définissant la Build Action à « Content » et en activant la copie du fichier dans le répertoire de sortie :

Copiez également le binaire GetTSL2561 dans le répertoire « Scripts » de votre package en l’incluant également dans le package (Build Action à Content et Copy if newer).

Le contenu du script « Lux.py » sera :

import Constellation
import os, re, subprocess, time, stat

# Const
EXECUTABLE_FILENAME = "GetTSL2561"

def DoMeasure():
    # Start process
    process = subprocess.Popen("./" + EXECUTABLE_FILENAME, stdout=subprocess.PIPE)
    # Reading  output
    for line in iter(process.stdout.readline, ''):
        # Parse line
        matchObj = re.match('RC: (\d*)\((.*)\), broadband: (\d*), ir: (\d*), lux: (\d*)', line)
        if matchObj:
            # Reading value
            returnCode = int(matchObj.group(1))
            broadband = int(matchObj.group(3))
            ir = int(matchObj.group(4))
            lux = int(matchObj.group(5))
            # Push StateObject
            if returnCode != 0:
                Constellation.WriteWarn("Unknow return code %s : %s" % (returnCode, line))
            else:
                Constellation.PushStateObject("Lux", { "Broadband": broadband, "IR" : ir, "Lux" : lux }, "LightSensor.Lux")
        else:
            Constellation.WriteError("Unable to parse the output: %s" % line)

def Start():    
    # Make the "GetTSL2561" file as executable
    st = os.stat(EXECUTABLE_FILENAME)
    os.chmod(EXECUTABLE_FILENAME, st.st_mode | stat.S_IEXEC)
    Constellation.WriteInfo("LuxSensor is ready !")
    while Constellation.IsRunning:  
        DoMeasure()
        time.sleep(int(Constellation.GetSetting("Interval")))

Constellation.Start(Start)

Comme pour le script « Light.py », on déclare la méthode « Start » comme méthode de démarrage. Celle-ci boucle tant que le package est démarré à l’intervalle défini par le setting « Interval » qu’on a déclaré à 10 secondes par défaut dans le manifeste.

A chaque itération, on invoque la méthode « DoMeasure » qui démarre le programme « GetTSL2561 » et on parse avec une regex le résultat de la sortie du programme (process.stdout) pour extraire le code de retour, le broadband (spectre visible), l’infrarouge et le nombre de lux courant mesuré par le capteur.

Si le code de retour est égal à 0 c’est que la mesure est correcte, on publie alors un StateObject nommé « Lux » contenant les trois propriétés mesurées : Broadband, IR et Lux.

Constellation.PushStateObject("Lux", { "Broadband": broadband, "IR" : ir, "Lux" : lux }, "LightSensor.Lux")

Attention avant de déployer cette nouvelle version il faut activer l’I²C sur le Raspberry. Pour cela lancer la commande « sudo raspi-config » puis dans le menu « Advanced Options » activez l’I²C et chargez le module par défaut au démarrage.

On peut maintenant publier cette nouvelle version depuis Visual Studio et lancer un « Reload » sur notre package pour déployer cette nouvelle version sur notre Rapsberry.

Désormais nous avons deux StateObjects publiés par ce package : « Light » via la photorésistance et « Lux » via le TSL2561 :

Notre nouveau StateObject « Lux » est un objet complexe contenant trois propriétés :

Exploitez les données

Notre package Python vit sa vie sur notre Raspberry et publie à intervalle régulier deux StateObjects sur base des mesures réalisées par la photorésistance et/ou le capteur de lux TSL2561.

On peut maintenant écrire des pages Web, des scripts, des packages .NET ou Python, Arduino, etc… qui exploiteront ces mesures en temps réel.

Un dashboard Web

Depuis une page Web, il suffit d’ajouter un StateObjectLink. Vous pouvez vous inspirer de ce tutoriel par exemple.

constellation.registerStateObjectLink("*", "LightSensor", "Lux", "*", function (so) {
  $scope.$apply(function () {
    console.log("Lux = ", so.Value.Lux);
  });
});

Par exemple sur le projet S-Panel avec quelques composants Bootstrap :

Un programme .NET

Vous pouvez là aussi vous inspirer de ce tutoriel. En clair, il suffit dans votre code C# d’ajouter des StateObjectLinks avec l’API.NET :

[StateObjectLink("LightSensor", "Lux")]
public StateObjectNotifier Lux { get; set; }

Ainsi la propriété .NET nommée « Lux » ci-dessus sera liée en temps réel au StateObject « Lux » du package « LigthSensor ».

Vous pouvez ajouter des événements dès que la valeur change :

this.Lux.ValueChanged += (s, e) =>
{
    PackageHost.WriteInfo($"Nouvelle mesure à {this.Lux.Value.LastUpdate} = {this.Lux.DynamicValue.Lux} lux");
};

Vous pouvez ainsi faire ce que bon vous semble avec cette information. Par exemple allumer automatiquement les lumières si la luminosité est trop faible, fermer les volets, enregistrer la valeur des Lux dans un fichier Excel ou une base de données, etc.. etc..

Historisation avec ElasticSearch / Kibana

En utilisant le package Graylog du catalogue de package, on peut historiser les mesures de notre capteur dans une base ElasticSearch.

Dans la configuration du package Graylog, on aura quelque chose comme :

La documentation du package Graylog est disponible ici. En résumé on crée ici un abonnement pour la StateObject « Lux » du package « LightSensor » et dans les « outputs » on a déclaré notre serveur Graylog.

De ce fait dès que le StateObject « Lux » est mis à jour par notre package Python, le package Graylog enregistre la nouvelle version du StateObject sur le serveur Graylog qui lui-même utilise ElasticSearch comme base de stockage.

Ainsi on pourra utiliser un outil comme Kibana pour visualiser l’évolution de notre StateObject :

Un article complet sur le sujet a été publié ici.

Stats avec Cacti

On peut également écrire un script pour récupérer notre StateObject « Lux » depuis l’interface REST qu’on ajoutera en tant que « Data Input Methods » dans Cacti pour pouvoir créer des graphiques facilement :

The post Un capteur de luminosité extérieur piloté par un Raspberry avec un package Python appeared first on Constellation.

Pilotez une matrice de LED avec une page Web en temps réel

Sebastien Warin — Tue, 09 May 2017 12:48:57 +0000

Découvrons dans ce tutoriel comment piloter en temps réel une matrice de LED bicolore depuis une page Web en quelque ligne.

Pour cela nous allons utiliser une matrice de 8×8 LEDs pilotable en I²C que vous pouvez trouver chez Adafruit pour environ 15€. Pour piloter cette matrice nous allons utiliser un ESP8266, ici un D1 Mini Pro (environ 6€).

Prérequis

Pour réaliser ce tutoriel, vous aurez besoin :

Un serveur Constellation
Un ESP8266
Une matrice de LED I²C

Si c’est la première fois que vous utilisez un ESP8266 connecté à Constellation, je vous recommande de suivre ce guide d’introduction avant de commencer !

Etape 1 : connecter la matrice de LED

Nous avons ici utilisé un D1 Mini Pro, un ESP8266 intégrant nativement une interface de programmation USB, très pratique pour créer des prototypes rapides.

La matrice de LED se connecte à l’ESP8266 en I²C. Nous avons utilisé les fils Noir et Blanc pour alimenter la matrice depuis les pins “5V” et “GND” du D1 Mini ainsi que les fils Bleu et Vert pour connecter les ports D1 et D2 du D1 Mini aux ports SCL et SDA de la matrice de LED :

Et voilà le montage est déjà fini ! Vous pouvez maintenant connecter votre D1 Mini en USB à votre PC pour le programmer.

Etape 2 : programmer l’ESP8266

Pour démarrer vous devez dans Constellation déclarer une sentinelle associée à une clé d’accès et un package virtuel. Ici notre ESP8266 est représenté par la sentinelle nommée « ESP8266 » et le package virtuel se nomme « MatrixController ».

Dans l’Arduino IDE, nous créons un nouveau projet à partir du Starter Kit Constellation pour ESP8266 dans lequel nous allons définir le nom de notre réseau Wifi (SSID) ainsi que sa clé d’accès puis nous configurerons le client Constellation en spécifiant l’identité de notre package virtuel, sa clé d’accès et l’adresse/port de notre serveur Constellation :

// ESP8266 Wifi
#include 
char ssid[] = "MON SSID";
char password[] = "macléWifi!!!!";

// Constellation client
Constellation constellation("X.X.X.X", 8088, "ESP8266", "MatrixController", "xxxxxxxxxxxxxxxxx");

Encore une fois si tout cela est nouveau pour vous, je vous recommande de suivre ce guide d’introduction à l’API Constellation pour Arduino/ESP8266.

Maintenant que la coquille de notre package virtuel sur ESP8266 est prête, ajoutons les librairies d’Adafruit pour piloter la matrice de LED bicolore.

Dans le gestionnaire de bibliothèque (menu Croquis > Inclure une bibliothèque), installez les librairies suivantes :

Adafruit GFX
Adafruit LED Backpack

Puis dans votre code, ajoutez ces librairies et déclarez une variable de type « Adafruit_BicolorMatrix » que nous nommerons « matrix » :

#include "Adafruit_LEDBackpack.h"
#include "Adafruit_GFX.h"
#include 
Adafruit_BicolorMatrix matrix = Adafruit_BicolorMatrix();

Au démarrage, dans la méthode « setup() », initialisez la matrice de LED. Pour rappel nous avons branché la matrice I²C sur les ports D1 et D2 :

// Init matrix led
Wire.begin(D1, D2);
matrix.begin(0x70);

Toujours dans la méthode d’initialisation, enregistrons un premier MessageCallback que nous allons nommer « SetPixel ». Ce MessageCallback permettra d’allumer ou éteindre un pixel de la matrice.

Nous le déclarons avec 4 paramètres d’entrée :

x et y pour définir la position du pixel à piloter
state : un boolean indiquant si le pixel doit être allumé ou éteint
clear: un paramètre optionnel de type boolean pour indiquer si il faut effacer la matrice avant (par défaut « true »)

Comme vous le constatez ci-dessous, le code de ce MessageCallback commence par effacer la matrice si le dernière paramètre (clear) n’est pas défini (car optionnel) ou si il est à « true » en invoquant la méthode « matrix.clear()« .

Ensuite on appelle la méthode « drawPixel » en passant les arguments de notre MC, à savoir le « x », le « y » et le « state ».

Si le paramètre « state » est vrai, on allume le pixel en vert (LED_GREEN) sinon on l’éteint (LED_OFF).

Le code est donc :

// Register SetPixel
constellation.registerMessageCallback("SetPixel",
  MessageCallbackDescriptor().setDescription("Set Pixel On or Off").addParameter("x").addParameter("y").addParameter("state", "ON or OFF").addOptionalParameter("clear", true, "Clear matrix before drawn"),
  [](JsonObject& json) {
    if(json["Data"].size() < 4 || json["Data"][3].as()) {
      matrix.clear();
    }
    matrix.drawPixel(json["Data"][0].as(), json["Data"][1].as(), json["Data"][2].as() ? LED_GREEN : LED_OFF);  
    matrix.writeDisplay();
 });

Comme il s’agit d’une matrice bicolore, on peut allumer chaque pixel en vert ou en rouge, ou bien en vert ET en rouge ce qui donne du orange.

Nous allons donc ajouter un deuxième MessageCallback que nous nommerons « SetPixelColor » sensiblement identique au premier, sauf que le paramètre « state » est maintenant de type « int » et se nomme « color ».

D’après les constantes de la librairie d’Adafruit, LED_GREEN = 2, LED_OFF = 0, le rouge (LED_RED) = 1 et le Orange/Jaune = 2. Le code est donc :

// Register SetPixelColor
constellation.registerMessageCallback("SetPixelColor",
  MessageCallbackDescriptor().setDescription("Set Pixel On or Off").addParameter("x").addParameter("y").addParameter("color", "0 = Off, 1 = red, 2 = orange, 3 = green").addOptionalParameter("clear", true, "Clear matrix before drawn"),
  [](JsonObject& json) {
    if(json["Data"].size() < 4 || json["Data"][3].as()) {
      matrix.clear();
    }
    matrix.drawPixel(json["Data"][0].as(), json["Data"][1].as(), json["Data"][2].as());  
    matrix.writeDisplay();
 });

Pour finir, ajoutons un troisième et dernier MessageCallback pour effacer l’écran :

// Register Clear
constellation.registerMessageCallback("Clear",
  MessageCallbackDescriptor().setDescription("Clear matrix"),
  [](JsonObject& json) {
    matrix.clear();
    matrix.writeDisplay();
 });

Vous pouvez téléverser le programme puis en vous connectant sur le MessageCallbacks Explorer de la Console Constellation vous constaterez que les trois MessageCallbacks sont bien référencés dans votre Constellation.

Votre ESP8266 est prêt ! Vous pouvez tester les MC directement depuis la Console pour vous assurer que tout fonctionne correctement :

Par exemple en invoquant le MessageCallback « SetPixel » avec x=1, y=2 et state=true, le résultat est instantanément visible sur la matrice :

Etape 3 : créer une page Web

Maintenant que notre matrice connectée est prête, créons une page Web pour pouvoir la piloter.

Pour cela nous allons créer une grille de 8×8 représentant la matrice sur laquelle nous pourrions dessiner à la sourie ou au droit (touch) avec la possibilité de choisir la couleur entre le verte, le roue et le orange. Nous allons utiliser le Canvas HTML5 pour cela.

Inutile d’utiliser le framework AngularJS pour cela, nous utiliserons la librairie Constellation pour Javascript.

Commençons donc par créer une page HTML classique dans laquelle ajoutons dans l’entête les scripts nécessaires pour connecter la page à Constellation :

Nous avons également ajouté la meta « viewport » pour adapter proprement notre page sur un mobile.

Dans le corps de notre page ajoutons un canvas pour la grille, la liste des couleurs possibles et un bouton pour effacer l’écran :




    Eraser
    Rouge
    Orange
    Vert

Vous remarquerez que nous stockons dans des attributs « data- » l’ID de la couleur de la matrice de LED (0 à 3) et le nom de la couleur HTML équivalente (ex. red = 1). La couleur sélectionnée est repérée par la classe CSS « selected ».

Pour la mise en page justement, ajoutez le code CSS dans une balise