arduino, eletrônica, robotica...

Código HTML no Arduino

Boa noite gente, dando seguimento ao projeto que tenho fiz uma pequena página HTML, porém quando jogo no Arduino ele não reconhece e da erros em várias partes, porém ainda não entendi como funciona esta parte HTML no Arduino, segue abaixo o página quem puder me ajudar agradeço.

client.println("<html>"); //Início do código HTML

client.println("<h1>"); //Inicio do cabeçalho H1
client.println (<title>Renatinho</title>
<style type="text/css">
* {
font-family: Helvetica, Arial, sans-serif;
}
.container {
display: table; vertical-align: middle; text-align: center; width: 100%; padding-top: 30px;
}
.box {
background: grey; display: inline-block; margin: auto; padding: 20px 50px; border: 1px solid green; box-shadow: 0px 1px 5px red; border-radius: 8px;
}
.box h1 {
padding-top: 0; margin-top: 0; font-size: 20px;
}
.box p {
white-space: nowrap; cursor: pointer;
}
.on, .off {
display: inline-block; background: url("button.png") no-repeat; width: 38px; height: 17px; cursor: pointer; margin: 5px; position: relative;
}
.on em, .off em {
position: absolute; font-size: 10px; color: green; font-weight: bold; font-style: normal; top: 23px; left: 0; width: 100%; text-align: center;
}
.on {
background-position: 0 -17px;
}
.off {
background-position: 0 0;
}
.statusON, .statusOFF {
width: 54px; height: 56px; background: url("button.png") no-repeat -92px 0; margin: 35px auto 10px;
}
.statusOFF {
background-position: -38px 0;
}
</style>

</head>
<body>
<div class="container">
<div class="box">
<h1>Renatinho</h1>
<p>
<span class="on"> 
<em>Rele 1</em>
</span>
<span class="on"> 
<em>Rele 2</em>
</span>
<span class="off"> 
<em>Rele 3</em>
</span>
<span class="off"> 
<em>Rele 4</em>
</span>
</p>

<div class="statusON"></div> 

</div>
</div>
</body>
);

Curtir

0 membros curtem isto

Exibições: 2046

▶ Responder esta

Respostas a este tópico

Permalink Responder até Caique Freitas em 22 agosto 2012 at 23:44

Bem provável que o erro está nas aspas do HTML.

Tem que escapá-las, tipo, ao invés de " tem quer ser \" pra ele saber que as aspas nao fazem parte da sintaxe do código

----

Ah, tenta colocar uma aspas simples antes e depois do código.

Tipo:

client.println ('

CÓDIGO TODO AQUI

');

▶ Responder

Permalink Responder até Renato Estevam em 22 agosto 2012 at 23:56

Vlw Caique, vou testar e posto aqui o resultado

▶ Responder

Permalink Responder até Renato Estevam em 23 agosto 2012 at 0:25

Caique,

Algumas coisas resolveram com as aspas, mas mesmo assim ainda da alguns erros, HTML não é meu forte definitivamente !! hahahaha

▶ Responder

Permalink Responder até Caique Freitas em 23 agosto 2012 at 0:34

Pode dizer os erros ou tirar print?

▶ Responder

Permalink Responder até Renato Estevam em 23 agosto 2012 at 0:40

Primeiro eu fiz só um pedaço do código, e ele não reconheceu, quando eu acessei o IP do Arduino ele jogou na tela exatamente os códigos ao invés do texto formatado.

▶ Responder

Permalink Responder até Caique Freitas em 23 agosto 2012 at 1:42

Falta a tag <head>

voce fecha ela mas nao abre

▶ Responder

Permalink Responder até Hugo Bernard Armond Vieira em 23 agosto 2012 at 3:01

Olá, Renato, poste o seu código completo, talvez eu possa te ajudar.

Eu fiz uns testes a um tempo atrás com arduino e html puro e funcionou certinho e realmente tem umas manhas na hr de enviar alguns comandos.

http://www.youtube.com/watch?v=7nHiR4bpASk

▶ Responder

Permalink Responder até Renato Estevam em 23 agosto 2012 at 8:53

Hugo beleza?

Da uma olhada ai no código. Um outro problema que encontrei foi em não conseguir vincular o botão HTML com a saída do Arduino.

#include
#include
int sensorLDR = 0; //Sensor de luminosidade, porta analógica
int luminosidade = 0; //Variável para armazenar o valor do sensor

// 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,0, 198);
byte gateway[] = { 192, 168, 0, 1 }; // Gateway (opcional)
byte subnet[] = { 255, 255, 255, 0 }; // Mascara de subrede

// 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()
{
// start the Ethernet connection and the server:
Ethernet.begin(mac, ip);
server.begin();
Serial.begin(9600);
Serial.print("server is at ");
Serial.println(Ethernet.localIP());
pinMode(7, OUTPUT); //LED vermelho
pinMode(5, OUTPUT); //LED verde
}

void ligar(int valor){
digitalWrite(7, LOW);
digitalWrite(5, LOW);
digitalWrite(valor, HIGH);
}
void loop()
{
luminosidade = analogRead(sensorLDR);
Serial.println(luminosidade); //Saída da saída analógica
delay(500);
if(luminosidade < 300){
ligar(5);
}
if(luminosidade > 300){
ligar(7);
}
// 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();
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;
}
}
}
client.println(""); //Início do código HTML

client.println (

Renatinho

Rele 1

Rele 2

Rele 3

Rele 4

); if(digitalRead(5) == HIGH)
client.println("ON");
if(digitalRead(5) == LOW)
client.println("OFF");
client.println(""); //Fim do código HTML

}
// give the web browser time to receive the data
delay(1);
// close the connection:
client.stop();
Serial.println("client disonnected");
}