Objectif :

L’objectif de cet atelier est de créer un prototype d’une poupée commandé à distance. Il consiste  à réaliser un système qui permet aux propriétaires de changer l’état des bras et tête de la poupée selon leurs demandes via une interface web en utilisant Wifi.

Fonctions :

Setup() :

La fonction setup () ne fonctionnera qu'une seule fois, après chaque mise sous tension ou réinitialisation de la carte Arduino. Utilisez-le pour initialiser les variables, les modes broches, commencer à utiliser les bibliothèques, etc.

Loop() :

Fonction fait précisément ce que son nom suggère et effectue des boucles consécutives, permettant à votre programme de changer et de répondre. Utilisez-le pour contrôler activement la carte Arduino.

delay(ms) :

Met le programme en pause pour la durée (en millisecondes) spécifiée en paramètre. (Il y a 1000 millisecondes par seconde.)

ms: le nombre de millisecondes à suspendre

connect() :

Connectez-vous à l'adresse IP et au port spécifiés dans le constructeur. La valeur de retour indique le succès ou l'échec. 

client .connect (ip, port) 
client .connect (URL, port)

ip: l'adresse IP à laquelle le client se connectera (tableau de 4 octets)

URL: le nom de domaine auquel le client se connectera (string, ex.:"arduino.cc ")

port: le port auquel le client se connectera (int)

attach() :

Prend en argument un unique paramètre obligatoire correspond au numéro de broche sur laquelle le servomoteur est câblé

Servo.attach(PIN)

write() :

Permet de modifier l'angle du bras du servomoteur en donnant en paramètre l'angle en question, sous la forme d'un nombre entier compris entre 0° et 180°

 Servo.write (N)

Matériels :

ESP8266 v3 :

Figure 1:  Esp8266 v3

BreadBoard :

Figure 2 :  BreadBoard

 

Câbles : (dans cet atelier nous allons utiliser les câbles de type male-male)

 

Figure 3: Câbles

Servomotor :

Figure 4: Servomotor

Code Source:

#include <ArduinoJson.h>

#include <ESP8266WiFi.h>

#include <Servo.h>

 

Servo monServomoteur;

Servo monServomoteur1;

Servo monServomoteur2;

 

const char* ssid = "*****";

const char* password = "*****";

String path= "/projects/etat.json";

const char* host     = "ipoupee.000webhostapp.com/";

 

WiFiClient client;            // Use this for WiFi instead of EthernetClient

// le code dans cette fonction est exécuté une fois au début

void setup() {

   Serial.begin(9600);  

   monServomoteur.attach(D0);

   monServomoteur1.attach(D1);

   monServomoteur2.attach(D2);

   delay(10);

   Serial.print("Connecting to ");

   Serial.println(ssid);

   WiFi.begin(ssid, password);

   while (WiFi.status() != WL_CONNECTED) {

    delay(500);

    Serial.print(".");

   }

   Serial.println("WiFi connected");

   Serial.println("IP address: " + WiFi.localIP());

}

 

// le code dans cette fonction est exécuté en boucle

void loop() { 

  if(client.connect(host,80)) {

    client.print(String("GET ") + path + " HTTP/1.1\r\n" + "Host: " + host + "\r\n" + "Connection: keep-alive\r\n\r\n"); 

    String section="header";

    while(client.available()){

       String line = client.readStringUntil('\r');

       if (section=="header") { // headers..

              Serial.print(".");

                 if (line=="\n") { // skips the empty space at the beginning

                      section="json";

                    }  

            }

    

 

 

      else if (section=="json") {  // print the good stuff

         section="ignore";

         String result = line.substring(1);      // Parse JSON

         int size = result.length() + 1;

         char json[size];

         result.toCharArray(json, size);

         StaticJsonBuffer<200> jsonBuffer;

         JsonObject& json_parsed = jsonBuffer.parseObject(json);

         if (!json_parsed.success()) {

               Serial.println("parseObject() failed");

               return;

               }

      

        if ((strcmp(json_parsed["tete"], "enface") == 0)&& (strcmp(json_parsed["bras1"], "normal") == 0)&& (strcmp(json_parsed["bras2"], "normal") == 0)) {

              monServomoteur.write(90);

              monServomoteur1.write(0);

              monServomoteur2.write(0);   

              Serial.println("enface");

              }

     

        else if ((strcmp(json_parsed["tete"], "droit") == 0)&& (strcmp(json_parsed["bras1"], "normal") == 0)&& (strcmp(json_parsed["bras2"], "normal") == 0)) {

              monServomoteur.write(45);  

              monServomoteur1.write(0);

              monServomoteur2.write(0);

              Serial.println("droit");

             }

       else if ((strcmp(json_parsed["tete"], "gauche") == 0)&& (strcmp(json_parsed["bras1"], "normal") == 0)&& (strcmp(json_parsed["bras2"], "normal") == 0)) {

              monServomoteur.write(135);  

              monServomoteur1.write(0);

              monServomoteur2.write(0);

              Serial.println("gauche");

            }

     else if ((strcmp(json_parsed["tete"], "enface") == 0)&& (strcmp(json_parsed["bras1"], "slt") == 0)&& (strcmp(json_parsed["bras2"], "slt") == 0)) {

             monServomoteur.write(90);

             monServomoteur1.write(45);

             monServomoteur2.write(45);

             }

     else if ((strcmp(json_parsed["tete"], "enface") == 0)&& (strcmp(json_parsed["bras1"], "droit") == 0)&& (strcmp(json_parsed["bras2"], "droit") == 0)) {

           monServomoteur.write(90);

           monServomoteur1.write(90);

           monServomoteur2.write(90);

      }

    else if ((strcmp(json_parsed["tete"], "gauche") == 0)&& (strcmp(json_parsed["bras1"], "slt") == 0)&& (strcmp(json_parsed["bras2"], "haut") == 0)) {

          monServomoteur.write(45);

          monServomoteur1.write(45);

         monServomoteur2.write(135);

      }

    }                             

}

  }

  }

 

Code PHP & HTML & CSS:

<?php

$etat = $_GET['etat'];

 

if($etat == "enface_normal_normal") { 

  $file = fopen("etat.json", "w") or die("can't open file");

  fwrite($file, '{"tete": "enface","bras1":"normal","bras2":"normal"}');

  fclose($file);

}

else if ($etat == "droit_normal_normal") { 

  $file = fopen("etat.json", "w") or die("can't open file");

  fwrite($file, '{"tete": "droit","bras1":"normal","bras2":"normal"}');

  fclose($file);

}

else if ($etat == "gauche_normal_normal") { 

  $file = fopen("etat.json", "w") or die("can't open file");

  fwrite($file, '{"tete": "gauche","bras1":"normal","bras2":"normal"}');

  fclose($file);

}

else if ($etat == "enface_slt_slt") { 

  $file = fopen("etat.json", "w") or die("can't open file");

  fwrite($file, '{"tete": "enface","bras1":"slt","bras2":"slt"}');

  fclose($file);

}

else if ($etat == "enface_droit_droit") { 

  $file = fopen("etat.json", "w") or die("can't open file");

  fwrite($file, '{"tete": "enface","bras1":"droit","bras2":"droit"}');

  fclose($file);

}

else if ($etat == "gauche_slt_haut") { 

  $file = fopen("etat.json", "w") or die("can't open file");

  fwrite($file, '{"tete": "gauche","bras1":"slt","bras2":"haut"}');

  fclose($file);

}

?>

<!DOCTYPE HTML>

<html>

<head>

          <meta charset="utf-8" />

          <title>Smart Poupee</title>

     </head>

<body style="background-image: url('/i.jpg');background-repeat: no-repeat;">

    <h1 style="color:white;text-align:center;font-style: italic;font-size: 70px;">         Smart PouPee </h1>

    <div style="text-align:center;margin-top:5%;">

        <a id="tete_enface" href="/?etat=enface_normal_normal" style="margin-right:5%;">

           <img src="/e1.jpg" height="150" width="150">

        </a>

        <a id="tete_droit" href="/?etat=droit_normal_normal" style="margin-right:5%;">

            <img src="/e2.jpg" height="150" width="150">

        </a>

        <a id="tete_gauche" href="/?etat=gauche_normal_normal" style="margin-right:5%;">

            <img src="/e3.jpg" height="150" width="150">

        </a>

    </div>

    <div style="text-align:center;margin-top:5%;">

       <a id="tete_enface" href="/?etat=enface_slt_slt" style="margin-right:5%;">

           <img src="/e4.jpeg" height="150" width="150">

       </a>    

       <a id="tete_droit" href="/?etat=enface_droit_droit" style="margin-right:5%;">

           <img src="/e5.jpg" height="150" width="150">

       </a>

       <a id="tete_gauche" href="/?etat=gauche_slt_haut" style="margin-right:5%;">

             <img src="/e6.jpg"  height="150" width="150"></a>

     </div>

</body>

</html>

 

Tables de correspondance :

 

ServoMotor

ESP8266 v3

-

GND

+

5v

Signal

D2

 

Etapes de réalisation:

  1. Créer un nouveau programme arduino (Sketch)
  2. Vérifier le programme
  3. Connexion d’ESP8266 v3 à l’ordinateur via port USB
  4. Transférer le programme a ESP8266 v3
  5. Montage du circuit de l’application
  6. Tester le fonctionnement du système

 

Résultats:

  • Interface Web :

Figure 5: Interface

  • Interaction:
    • Fichier json

Figure 6: Fichier etat.json

  • Servomotors
    • Tête

 

Figure 7: Servomotor1

 

  • Bras 1

Figure 8: Servomotor2

 

  • Bras 2

Figure 9: Servomotor3