comment mettre en forme page html serveur web ?

Bonjour , j’ai récupérer ce petit programme que je compte utiliser en partie seulement pour piloter une porte de garage .

Il fonctionne parfaitement aujourd’hui pour piloter quelques led , ma question :

Comment mettre en forme le texte , il est trop petit , j’aimerais surtout comprendre comment on fait pour le positionner en colonne et en ligne , taille police , etc …

Si quelqu’un sait ou je peu trouver un tuto , ou prendre le temps de m’expliquer , merci beaucoup . :wink:

#include <Ethernet.h>

#include <SPI.h>

//network NB: Pins 10, 11, 12 and 13 are reserved for Ethernet module.

byte mac[] = { 0x00, 0x00, 0x00, 0x00, 0x00, 0x00 }; //entrer votre adresse mac 

byte ip[] = { 192, 1xx, xx, xx }; // ip in lan remplacer les x par votre adresse ip
byte gateway[] = { 192, 168, 0, 1 }; // internet access via router
byte subnet[] = { 255, 255, 255, 0 }; //subnet mask

String inString = String(35);

String Led;

int led[] = {00, 1, 2, 3, 4, 5, 6, 7, }; //Led pins num 0 in arry is not used

int numofleds = 8; //numofleds

String value[] = {"on","on","on","on","on","on","on","on","on"}; //startup all led are off

EthernetServer server(80);

String data;

void setup()

{

Serial.begin(9600);

Ethernet.begin(mac, ip,gateway,subnet);

server.begin();

//set pin mode

for (int j = 0; j < (numofleds + 1); j++){

pinMode(led[j], OUTPUT);

}

Serial.println("Serial READY");

Serial.println("Ethernet READY");

Serial.println("Server READY");

}

void loop()

{

EthernetClient client = server.available();

if(client){

// an http request ends with a blank line

boolean current_line_is_blank = true;

while (client.connected()) {

if(client.available()) {

char c = client.read();

// if we've gotten to the end of the line (received a newline

// character) and the line is blank, the http request has ended,

// so we can send a reply

if (inString.length() < 35) {

inString.concat(c);

}

if (c == '\n' && current_line_is_blank) {

// send a standard http response header

client.println("HTTP/1.1 200 OK");

client.println("Content-Type: text/html");

client.println();

client.println("<html><body><form method=get>");

client.println("<p>Led controller</p>");

for(int i=1;i < (numofleds + 1) ;i++){

Led = String("led") + i;

if(inString.indexOf(Led+"=on")>0 || inString.indexOf("all=on")>0){

Serial.println(Led+"on");

digitalWrite(led[i], HIGH);

value[i] = "off";

}else if(inString.indexOf(Led+"=off")>0 || inString.indexOf("all=off")>0 ){

Serial.println(Led+"on");

digitalWrite(led[i], LOW);

value[i] = "on";

}

client.println("
"+Led+" <input type=submit name="+Led+" value="+value[i]+">");

}

client.println("
All <input type=submit name=all value=on><input type=submit name=all value=off>");

client.println("</form><html></body>");

break;

}

if (c == '\n') {

// we're starting a new line

current_line_is_blank = true;

} else if (c != '\r') {

// we've gotten a character on the current line

current_line_is_blank = false;

}

}

}

// give the web browser time to receive the data

delay(10);

inString = "";

client.stop();

}

}

Bonsoir , personne pour m'aider ?

Bonsoir,

Je ne sais pas si je peux t'aider car je suis débutant aussi :) je ne connais pas non plus l' ethernet shield de l' arduino Par contre j' ai réalisé un serveur web qui affiche les données de température et de luminosité avec des sondes sur arduino, la partie web étant gérée par un serveur web sur raspberry/debian, avec un websocket pour l' affichage en temps réel. La transmission des données entre l' arduino et le serveur web se fait par le bus I2C, pas par un shield.

Mais bon ca ne change rien concernant le codage en html, mon code et mon soutien est à ta disposition si tu le souhaites :)

Fabrice

Bonsoir,

la mise en page d’une page html se fait via les css ou feuilles de style.

tu a un bon tuto sur le site d’openclass room

bonjour , merci , je vais regarder ça . merci

Pour de l’arduino, tu a des exemple pré-fait dans l’IDE, menue fichier => exemple… un petit code d’un des exemples :

/*
  Web Server

 A simple web server that shows the value of the analog input pins.
 using an Arduino Wiznet Ethernet shield.

 Circuit:
 * Ethernet shield attached to pins 10, 11, 12, 13
 * Analog inputs attached to pins A0 through A5 (optional)

 created 18 Dec 2009
 by David A. Mellis
 modified 9 Apr 2012
 by Tom Igoe

 */

#include <SPI.h>
#include <Ethernet.h>

// Enter a MAC address and IP address for your controller below.
// The IP address will be dependent on your local network:
byte mac[] = {
  0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED
};
IPAddress ip(192, 168, 66, 81);

// Initialize the Ethernet server library
// with the IP address and port you want to use
// (port 80 is default for HTTP):
EthernetServer server(80);

void setup() {
  // Open serial communications and wait for port to open:
  Serial.begin(9600);
 // while (!Serial) {
 //   ; // wait for serial port to connect. Needed for Leonardo only
  }


  // start the Ethernet connection and the server:
  Ethernet.begin(mac, ip);
  server.begin();
  Serial.print("server is at ");
  Serial.println(Ethernet.localIP());
}


void loop() {
  // listen for incoming clients
  EthernetClient client = server.available();
  if (client) {
    Serial.println("new client");
    // an http request ends with a blank line
    boolean currentLineIsBlank = true;
    while (client.connected()) {
      if (client.available()) {
        char c = client.read();
        Serial.write(c);
        // if you've gotten to the end of the line (received a newline
        // character) and the line is blank, the http request has ended,
        // so you can send a reply
        if (c == '\n' && currentLineIsBlank) {
          // send a standard http response header
          client.println("HTTP/1.1 200 OK");
          client.println("Content-Type: text/html");
          client.println("Connection: close");  // the connection will be closed after completion of the response
          client.println("Refresh: 0.3");  // refresh the page automatically every 5 sec
          client.println();
          client.println("<!DOCTYPE HTML>");
          client.println("<html>");
          // output the value of each analog input pin
          for (int analogChannel = 0; analogChannel < 6; analogChannel++) {
            int sensorReading = analogRead(analogChannel);
            client.print("analog input ");
            client.print(analogChannel);
            client.print(" is ");
            client.print(sensorReading);
            client.println("
");
          }
          client.println("</html>");
          break;
        }
        if (c == '\n') {
          // you're starting a new line
          currentLineIsBlank = true;
        }
        else if (c != '\r') {
          // you've gotten a character on the current line
          currentLineIsBlank = false;
        }
      }
    }
    // give the web browser time to receive the data
    delay(1);
    // close the connection:
    client.stop();
    Serial.println("client disconnected");
  }
}

ça devrait probablement t’aider un peut. Perso je me suis servit de ça pour faire un serveur web qui se raffraihis toutes les 0.3s, pour afficher les valeurs d’un multimètre créer à base d’une arduino Due

Bonjour , merci pour l'info alex34000 , je vais étudier tout ça .Et surtout comprendre .......

bye