ESP8266 - A Pequena Maravilha para Comunicação WIFI

lucianolcoa · 21 de outubro de 2016

15 minutos atrás, alexandre.mbm disse:

@aphawk, esses exemplos usam a linguagem do Esp8266Basic para fazer CSS inline em HTML sem template. Os templates, até podemos deixar de canto, por enquanto, mas como "importar" um arquivo CSS não remoto? A dica de usar Bootstrap implica nisso.

@lucianolcoa, eu sei do Tasker como um ferramenta automatizadora de tarefas. Fiquei curioso para ver a funcionalidade que você menciona.

Um cara me passou o link de um programa que ele fez que "pesca" a pagina da internet, nome no google play: auto input. Só que infelizmente meu cel não tinha compatibilidade para com o programa.

adicionado 10 minutos depois

13 minutos atrás, rodrigocirilo disse:

@lucianolcoa Eu vi um exemplo assim.. mas não testei e acho que nao ficaria legal hehe.. mas valeu pela dica..

Imaginei, ate mesmo falei que esteticamente e feio, eu que sou um cara largadao achei meio ruim fazer assim, mas faço pois ainda não manjo o suficiente de css para incorpora-lo ao espbasic para fazer funcionar o htmlvar, ate tentei implementar, mas não logrei exito, depois continuarei de onde eu parei.... 1° vou treinar um pouco na força *momento star wars*

Não é com desanimo ou tristeza que eu me considero o mais fraco dos que aqui estão no grupo partilhando experimentos, almejo um dia chegar ao nível de vocês, |0| e venho me esforçando bastante para tal, as vezes acertando e outras vezes não.

Mas então, com meu parco conhecimento ja fiz minha automação na casa, controlando as luzes pelo espbasic, funciona direitinho, ficou a noite toda em standby*estava dormindo* e de manha funcionou com um simples clique de cel, maravilha *-*

E também posso confirmar o que o Aphawk falou, da pra voce atualizar o codigo sem o bixo ta plugado, atualizei o codigo pois havia um "erro" pelo propio cel e foi, impressionante X_X

Quase queimei meu ventilador de teto, mas valeu a pena.:)

aphawk · 21 de outubro de 2016

@alexandre.mbm ,

voce pode gravar o seu arquivo CSS dentro do ESPBASIC, e incluir no seu programa para executar !

Veja neste link um exemplo :

http://www.esp8266.com/viewtopic.php?f=41&t=11791

Repare que o segundo programa é o arquivo CSS.

@_xyko_ ,

Parece bem legal , mas pelo que lí só pode fazer a página em computadores normais. Ou você sabe se podemos depois passar isso para um celular tipo Mac ou Android ?

Vou ver de noite em casa.

Pulo

lucianolcoa · 21 de outubro de 2016

13 minutos atrás, _xyko_ disse:

@lucianolcoa É o quero que os senhores analisem. Estou muito ocupado agora e o anúncio desta IDE chegou hoje no meu email porque programo em Purebasic para PC, cujo desenvolvedor do SpiderBasic é o mesmo.

Não tive tempo de testar.

Eu quebrei a cabeça esses dias com a ajuda do Alexandre pra descobrir o que o espbasic manda por "debaixo dos panos". Alguma string esse diabo manda, mas como não é get, não sei qual string ele manda. E por post tem 1 trilhão de possibilidades.É peneirando e achar a resposta hehe.

ViniciusKruz · 21 de outubro de 2016

@Papibakigrafo

Aqui está sua resposta: http://forum.clubedohardware.com.br/forums/topic/1134300-esp8266-a-pequena-maravilha-para-comunicação-internet/?page=34#comment-6542649

rodrigocirilo · 21 de outubro de 2016

4 horas atrás, aphawk disse:
@Papibakigrafo E @rodrigocirilo

Isso não tem nada a ver com ESPBasic.... é posicionamento via HTML e CSS .

Existem comandos que fixam também a largura da tela, posicionam relativo ao ultimo objeto, ou a um canto, ou em função do tamanhona tela ..... tem tanta coisa que dá até tonteira de ver ....

Eu usei no Firefox, e funcionaram direitinho com minhas telas.

Rodrigo, o problema não é se você está usando Arduino, C , Basic, etc .... o problema é que agora você está programando uma tela em um browser de Internet !

Olha este pedaço que retireI de um programinha do Fórum do ESP8266Basic :
wprint "</td>"
wprint "<th</th></table><br>"
wprint "<table align='center' width='200' bgcolor='LIGHTBLUE' border='2' cellpadding='2'>"
wprint "<td>"
button "ROOM TEMP-C",[NIL]
cssid htmlid(), "background-color:LIGHTGREEN;text-align: center;display:block;width:200px"
wprint "<b>"
wprint "<center>"
wprint "<mark>" & htmlvar(outc) & "</mark>"
wprint "</center>"
wprint "</b>"
wprint "</td>"
Independente de qualquer linguagem, esses montes de comandos HTML e CSS tem de ser usados para posicionar o Button no local correto que o autor desejou, com as cores corretas e tudo, e depois ele posiciona novamente a saída da variável outc usando posicionamentos CSS junto com a instrução htmlvar(outc) .

Tem muito exemplo la no Fórum do ESP8266Basic, mas sem você saber o mínimo sobre HTML e CSS, fica impossível fazer uma boa tela na iNTERNET. Eu tive essa mesma dificuldade 30 dias atrás e tive de dar uma estudadinha rápida nisso ... e olha, depois de velho isso é um saco viu !

Estude o que fazem esses comandos , o WPRINT o HTMLVAR(), e principalmente o HTMLID() . Esses são mesmo comandos do ESPBASIC, mas que são usados com HTML e com CSS .

Paulo

Testei esse fragmento de codigo, ele gera um botão no meio da pagina ( um botão bem legal por sinal) e coloca a variavel outc embaixo... porém ao setar o ligado ou desligado o valor dela também não muda, mesmo com esse monte de html e css...

Ai fiz o teste que o colega lucianolcoa de cria um texbox com o nome dessa variavel.. e bingo.. ao setar o valor, ele seta o valor dentro do textbox..

Incrível né... um textboa ele seta o valor, uma variavel não !!!

aphawk · 21 de outubro de 2016

@rodrigocirilo ,

Eu acho que você precisa usar o RETURNGUI para atualizar as variáveis.

Paulo

Papibakigrafo · 21 de outubro de 2016

@ViniciusKruz Então, eu estava com o seu código aberto! Fiz um exemplo aqui em HTML e consegui fazer! Mas olha o tamanho do meu código! AUAhAUhau

Exemplo em HTML para atualizar os botões via AJAX/JQuery:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>AJAX - RETORNO</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
  <meta name="apple-mobile-web-app-title" content="AJAX - RETORNO">
  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="apple-mobile-web-app-status-bar-style" content="white">
  
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

</head> 

<body>
<div align="center" class="container" >

<button id="btn_1" class="btn btn-success">xxxx</button>
<button id="btn_2" class="btn btn-success">xxxx</button>

<!-- DIVS ONDE RECEBERÃO OS DADOS INICIAIS PELO ESP/ARDUINO -->
<div id="estado">1</div>
<div id="estado2">0</div>

</div>
</body>

<script>
$("#btn_1").click(function(){
  var estado = $("#estado").text();
  $.get("http://192.168.1.10");
  if (estado === "0" ){
    $("#estado").text("1");
    $("#btn_1").addClass("btn btn-danger");
    $("#btn_1").html("Desligar Relê");
  } else {
    $("#estado").text("0");
    $("#btn_1").removeClass();
    $("#btn_1").addClass("btn btn-success");
    $("#btn_1").html("Ligar Relê");
  }
});

$("#btn_2").click(function(){
  var estado2 = $("#estado2").text();
  $.get("http://192.168.1.10");
  if (estado2 === "0" ){
    $("#estado2").text("1");
    $("#btn_2").addClass("btn btn-danger");
    $("#btn_2").html("Desligar Relê");
  } else {
    $("#estado2").text("0");
    $("#btn_2").removeClass();
    $("#btn_2").addClass("btn btn-success");
    $("#btn_2").html("Ligar Relê");
  }
});

function verifica(){
  var estado = $("#estado").text();
  var estado2 = $("#estado2").text();
  if (estado === "0"){
    $("#estado").text("1");
    $("#btn_1").addClass("btn btn-danger");
    $("#btn_1").html("Desligar Relê");
  } else {
    $("#estado").text("0");
    $("#btn_1").removeClass();
    $("#btn_1").addClass("btn btn-success");
    $("#btn_1").html("Ligar Relê");
  }
  if (estado2 === "0"){
    $("#estado2").text("1");
    $("#btn_2").addClass("btn btn-danger");
    $("#btn_2").html("Desligar Relê");
  } else {
    $("#estado2").text("0");
    $("#btn_2").removeClass();
    $("#btn_2").addClass("btn btn-success");
    $("#btn_2").html("Ligar Relê");
  }
};
//Verifica os dados quando abre a página
setTimeout(function(){
    verifica();
  }, 1000);

</script>
<html>

Caso tenham alguma dúvida, só perguntar!

É só adaptar no ESP ou Arduino! Assim que os meus chegarem, e e fizer um exemplo com 2 relês, posto aqui!

ViniciusKruz · 21 de outubro de 2016

@Papibakigrafo

Como é que você ta testando isso aí sem o ESP?

rodrigocirilo · 21 de outubro de 2016

42 minutos atrás, aphawk disse:

@rodrigocirilo ,

Eu acho que você precisa usar o RETURNGUI para atualizar as variáveis.

Paulo

Então, eu ja testei o returngui e funcionou ai ele atualiza.. mas ele dá aquele refresh na pagina ( tipo apertar F5) pra atualizar.. e fica estranho.. cada vez que apertar o botão ele dar esse "refresh".... o que acho estranho é que se uso um textbox (como falei) ele atualiza sem o returngui.. atualiza direto...

Extra topic:

Paulo sobre a acentuação que você perguntou lá no espbasic.. o que virou.. resolveu a questão da acentuação da lingua portuguesa?

Papibakigrafo · 21 de outubro de 2016

@ViniciusKruzFiz apenas em HTML. O endereço eu modifiquei, estava usando o da minha hospedagem!

Mas no meu código da IDE, ele envia o estado numa div id="estado", portanto, irá funcionar

ViniciusKruz · 21 de outubro de 2016

@Papibakigrafo Imaginei que você estivesse usando um Arduíno, mas aí iria precisar de uma placa de rede nele.

Embora funcione no servidor, não tem garantia de que funcione no ESP viu rsrsrs. Eu tenho códigos aqui que funcionam em qualquer página, mas quando coloco para o ESP gerar eles, não sei porquê, não funciona, aquele caso do javascript/Ajax mesmo, funcionava perfeitamente inserido em uma página comum, mas quando colocava no ESP, a coisa não rodava, até que descobri que não bastava somente colocar <script> que tinha que setar também a "language", deu foi canseira. Creio que seja algo relacionado com caracteres especiais sei lá.

O legal é que pelo menos você vai matando a ansiedade né.

Papibakigrafo · 21 de outubro de 2016

@ViniciusKruz Exatamente! Eu "acredito" que irá funcionar! kkkk

Mas obrigado pela ajuda, de todos! O grupo aqui é bem diferente dos outros fóruns! =)

aphawk · 21 de outubro de 2016

1 hora atrás, rodrigocirilo disse:

Extra topic:

Paulo sobre a acentuação que você perguntou lá no espbasic.. o que virou.. resolveu a questão da acentuação da lingua portuguesa?

Po nem me fala viu, é um problema maldito da biblioteca do Arduíno, teria de modificar ela, senão é impossível.

Leia lá até o final .....

Paulo

lucianolcoa · 21 de outubro de 2016

58 minutos atrás, ViniciusKruz disse:

@Papibakigrafo Imaginei que você estivesse usando um Arduíno, mas aí iria precisar de uma placa de rede nele.

Embora funcione no servidor, não tem garantia de que funcione no ESP viu rsrsrs. Eu tenho códigos aqui que funcionam em qualquer página, mas quando coloco para o ESP gerar eles, não sei porquê, não funciona, aquele caso do javascript/Ajax mesmo, funcionava perfeitamente inserido em uma página comum, mas quando colocava no ESP, a coisa não rodava, até que descobri que não bastava somente colocar <script> que tinha que setar também a "language", deu foi canseira. Creio que seja algo relacionado com caracteres especiais sei lá.

O legal é que pelo menos você vai matando a ansiedade né.

Pra mim o combo do futuro e colocar o rasp+arduino. Não tem node que aguente. voce pode fazer todo o grossão usando o apache e colocar o css e o scambal a 4 e o arduino se comunica apenas com a serial. No rasp voce ainda pode adicionar uma camera*ja vi em foruns americanos nego fazendo isso* pra rodar jundo com os togle buttons e disparo de sensores... Só não faço isso por que o rasp e caro e se eu usar ele na automação de minha humilde residencia e por uma ventura danada ele queimar, irei chorar bastante

aphawk · 21 de outubro de 2016

@lucianolcoa ,

Eu já tenho outra opinião... Pelo que eu lí do ESP32, pode esquecer o Rasp, só ia atrasar o bichinho.... kkkk

Tem tanta potência que não precisa de mais nada viu ...

Paulo

ViniciusKruz · 21 de outubro de 2016

@aphawk @lucianolcoa Tem projeto por aí em que os caras colocam uma câmera no ESP, ele vira uma câmera de segurança rsrsrs.

Depois que passei a usar os ESPs, não consegui ainda imaginar uma necessidade de outro processamento junto dele, seja PIC, Raspberry, ou qualquer outra coisa. Penso que se precisar de alguma coisa mais "potente" que o ESP, talvez seja hora de pensar em programar para Desktop.

lucianolcoa · 21 de outubro de 2016

14 minutos atrás, aphawk disse:

@lucianolcoa ,

Eu já tenho outra opinião... Pelo que eu lí do ESP32, pode esquecer o Rasp, só ia atrasar o bichinho.... kkkk

Tem tanta potência que não precisa de mais nada viu ...

Paulo

Num li ainda desse esp32, ja vi um nego falar dele,mas por baixo. Ele supera o orange pi também?

adicionado 3 minutos depois

4 minutos atrás, ViniciusKruz disse:

@aphawk @lucianolcoa Tem projeto por aí em que os caras colocam uma câmera no ESP, ele vira uma câmera de segurança rsrsrs.

Depois que passei a usar os ESPs, não consegui ainda imaginar uma necessidade de outro processamento junto dele, seja PIC, Raspberry, ou qualquer outra coisa. Penso que se precisar de alguma coisa mais "potente" que o ESP, talvez seja hora de pensar em programar para Desktop.

Camera de segurança da pra fazer até mesmo com PIC.... Tem que ver o processamento de frames que o bichinho suporta. O rasp processa os frames em tempo real, como se voce tivesse vendo um filme *-*. Os lags porventura ocorreriam mais por velocidade do modem do que o processamento do chip propiamente dito. Ainda não vi nada igual ao Orangue PI, que é da "familia" dos rasps,mas vou procurar sobre os esps32, se eles forem potentes assim, irei querer ter um *-*

aphawk · 23 de outubro de 2016

@lucianolcoa ,

Bom, se eu estivesse procurando pura potência bruta, usaria um Pentium 3 rodando a 3.2 Ghz, certo ? Kkkk

É melhor pensar num conjunto de características em um só produto, que seja muito potente e custe barato !

O que eu posso te dizer do ESP32 :

Clock de 240 Mhz !

32 bits

520K Sram ( compare com 56K dos EsP8266 .... )

16 Mb flash embutido

dual Core !!

Bluetooth !

32 I/Os

12 canais A/D !

2 canais D/A

criptografia por hardware inclusive RSA 4096

2 interfaces I2C

3 UART

3 SPI

Timer/ PWM em todos os pinos de I/O !

chega, cansei....

Assustador, não é ?

Isso elimina completamente a necessidade de qualquer outro microcontrolador adicional, seja ele qual for !

Fico imaginando um compilador Basic feito para usar esta pequena maravilha, já pensou a facilidade ?

Se quiser saber mais :

https://espressif.com/en/products/hardware/esp32/overview

Esquece Orange, Raspberry, Arduino, ficou tudo obsoleto ...

E o melhor por ultimo :

Custa menos de US$ 7 !!!

Pode comprar o seu já :

http://www.cnx-software.com/2016/09/05/you-can-now-buy-esp3212-esp32-wifi-bluetooth-module-for-6-95/

Paulo

ViniciusKruz · 23 de outubro de 2016

@aphawk

Será que melhoraram o buffer e o processamento do webserver dele? Só ta faltando isso pra ele não faltar mais nada né rs.

Papibakigrafo · 23 de outubro de 2016

Será que terá alguma placa para "juntar" o EPS? Tipo o nodeMCU?

Ali já tem: aqui

lucianolcoa · 23 de outubro de 2016

15 horas atrás, aphawk disse:

@aphawkRealmente, nao tem nem o que falar, 7 dolares LoL x_x

Intrudera6 · 23 de outubro de 2016

Infelizmente o ESP32 ainda não está sendo entregue, onde vende está em "preorder", e quando liberarem devem cobrar caro pelos primeiros, neste caso é melhor ter paciência para não acabar pagando muito caro. Eu também estou de olho, mas o eBay (junto com a Receita Federal e os Correios) me ensinou a ter paciência, muita paciência.

alexandre.mbm · 23 de outubro de 2016

Em 21/10/2016 às 11:40, _xyko_ disse:

Peço aos interessados que baixem o demo (para qté 800 linhas de programa) e testem [o SpiderBasic].

Provavelmente essa não será a única limitação. Certamente o demo é apenas para estudo e experimentação.

Em 21/10/2016 às 11:40, lucianolcoa disse:

Um cara me passou o link de um programa que ele fez que "pesca" a pagina da internet, nome no google play: auto input. Só que infelizmente meu cel não tinha compatibilidade para com o programa.

Muitíssimo interessante! Mas o próprio Tasker requer root, não?!

Esse autor tem uma série de outras apps Auto*.

Em 21/10/2016 às 13:54, Papibakigrafo disse:

Fiz um exemplo aqui em HTML e consegui fazer! Mas olha o tamanho do meu código! AUAhAUhau

Que tal separar os arquivos (HTML, Javascript, CSS)?!

Em 21/10/2016 às 15:49, aphawk disse:

Po nem me fala viu, é um problema maldito da biblioteca do Arduíno, teria de modificar ela, senão é impossível.

Eu estava querendo usar DigiKeyboard (coisa de Digispark ATtiny85) com caracteres acentuados e descobri que a biblioteca é dessa forma por causa da limitação "processador 8 bits".

adicionado 7 minutos depois

@aphawk, sabe nos dizer por que não acho sobre CSS em avrhelp.mcselec.com?

aphawk · 23 de outubro de 2016

1 hora atrás, alexandre.mbm disse:

adicionado 7 minutos depois

@aphawk, sabe nos dizer por que não acho sobre CSS em avrhelp.mcselec.com?

Sim, sei.

Isso de CSS é para formatar saídas para a Internet.

Repare que você nào vai achar isso nos microcontroladores normais, pois eles são projetados para controlar hardwares, apresentar saída em Displays LCDs, ou enviar via Serial, etc. Até recentemente, enviar telas para a Internet era algo muito distante....

Isso de fazer saída formatada para WEB não vai encontrar como padrão em nenhum compilador normal.Nem nos Avrs, nem nos Pics ....

Paulo

alexandre.mbm · 23 de outubro de 2016

@aphawk , eu esperava encontrar os comandos "html", "css" e "cssid". Os comandos que você usou, e que até onde me consta são BASCOM. Eu sei bem que CSS e HTML não o são, mas estes foram apenas valores ou parâmetros.

~~Onde você aprendeu que pode comandar "cssid"?!~~

Ah! Aquilo é Esp8266Basic, não é BASCOM...

Citação
HTMLID():

The html id function will return the randomly generated id for the last gui object created. Useful for javascript interaction capabilities.
htmlid()
CSSID:

The cssid command will apply css to the desired item by id. This should be executed immediately after creating a gui object.

Example:
cssid htmlid(), "background-color: yellow;"
CSSCLASS:

The cssclass command will apply css to the desired class of gui objects.

Example: Will set all buttons to color yellow.
cssclass "button", "background-color: yellow;"
JAVASCRIPT:

Will allow you to include javascript files in your page. File must be uploaded to the device using the file manager.
javascript {filename}
CSS:

Will allow you to include css files in your page. File must be uploaded to the device using the file manager.

See the CSS example here.
css {filename}