Go Down

Topic: Web page with updating data frame (Read 1 time) previous topic - next topic

zoomkat

Dec 25, 2012, 06:39 pm Last Edit: Dec 25, 2012, 06:43 pm by zoomkat Reason: 1
Something that might be of interest for those who might want a web based robot control page. The below code makes a main web page with an iframe page that refreshes with data from the arduino. The rest of the page could contain the bot controls and maybe a video feed. Set the refresh rate to 0 for the fastest update.

Code: [Select]

// zoomkat's meta refresh data iframe test page 12/24/12
// use http://192.168.1.102:84 in your brouser for main page
// http://192.168.1.102:84/data static data page
// http://192.168.1.102:84/datastart meta refresh data page
// for use with W5100 based ethernet shields
// set the refresh rate to 0 for fastest update
// use STOP for single data updates

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

byte mac[] = { 0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED }; //physical mac address
byte ip[] = { 192, 168, 1, 102 }; // arduino ip in lan
byte gateway[] = { 192, 168, 1, 1 }; // internet access via router
byte subnet[] = { 255, 255, 255, 0 }; //subnet mask
EthernetServer server(84); //server port
unsigned long int x=0; //set refresh counter to 0
String readString;

//////////////////////

void setup(){
 Serial.begin(9600);
 Ethernet.begin(mac, ip, gateway, gateway, subnet);
 server.begin();
 Serial.println("meta refresh data frame test"); // so I can keep track of what is loaded
}

void loop(){
 EthernetClient client = server.available();
 if (client) {
   while (client.connected()) {
     if (client.available()) {
       char c = client.read();
        if (readString.length() < 100) {
         readString += c;
        }
       //check if HTTP request has ended
       if (c == '\n') {

         //check get atring received
         Serial.println(readString);

         //output HTML data header
         client.println("HTTP/1.1 200 OK");
         client.println("Content-Type: text/html");
         client.println();

         //generate data page
         if(readString.indexOf("data") >0) {  //checks for "data" page
           x=x+1; //page upload counter
           client.print("<HTML><HEAD>");
           //meta-refresh page every 1 seconds if "datastart" page
           if(readString.indexOf("datastart") >0) client.print("<meta http-equiv='refresh' content='1'>");
           client.print("<title>Zoomkat's meta-refresh test</title></head><BODY><br>");
           client.print("page refresh number ");
           client.print(x); //current refresh count
           client.print("<br><br>");
             //output the value of each analog input pin
            for (int analogChannel = 0; analogChannel < 6; analogChannel++) {
            client.print("analog input ");
            client.print(analogChannel);
            client.print(" is ");
            client.print(analogRead(analogChannel));
            client.print("<br>");
            }
           client.print("</BODY></HTML>");
          }
         //generate main page with iframe
         else
         {
           client.print("<HTML><HEAD><TITLE>Zoomkat's frame refresh test</TITLE></HEAD>");
           client.print("Zoomkat's Arduino frame meta refresh test 12/24/12");
           client.print("<BR><BR>Arduino analog input data frame:<BR>");
           client.print("&nbsp;&nbsp;&nbsp;&nbsp;<a href='http://192.168.1.102:84/datastart' target='DataBox' title=''yy''>REFRESH</a>");
           client.print("&nbsp;&nbsp;&nbsp;&nbsp;<a href='http://192.168.1.102:84/data' target='DataBox' title=''xx''>STOP</a><BR>");
           client.print("<iframe src='http://192.168.1.102:84/data' width='35%' height='250' name='DataBox'>");
           client.print("</iframe><BR></HTML>");
         }
         delay(1);
         //stopping client
         client.stop();
         //clearing string for next read
         readString="";
       }
     }
   }
 }
}

 
Consider the daffodil. And while you're doing that, I'll be over here, looking through your stuff.   8)

Go Up