Hello
I have a WiFly server with accelerometer data within HTML code being written to a page when i connect to the WiFly shield through the local network (192.168.X.X:2000).
The first time you enter the web address, everything works fine. However, if you refresh the page some of the HTML code is missing, resulting in the page not displaying correctly.
This is my Arduino Code:
#include <SPI.h>
#include <WiFly.h>
// Reference the I2C Library
#include <Wire.h>
// Reference the HMC5883L Compass Library
#include <HMC5883L.h>
// Store our compass as a variable.
HMC5883L compass;
// Record any errors that may occur in the compass.
int error = 0;
WiFlyServer server(2000);
const int pwmA = 3;
const int pwmB = 5;
const int brakeA = 9;
const int brakeB = 8;
const int dirA = 4;
const int dirB = 2;
const int speed = 255;
String readString; //create readString class
void setup() {
//Setup Channel A
pinMode(dirA, OUTPUT); //Initiates Motor Channel A pin
pinMode(brakeA, OUTPUT); //Initiates Brake Channel A pin
//Setup Channel B
pinMode(dirB, OUTPUT); //Initiates Motor Channel A pin
pinMode(brakeB, OUTPUT); //Initiates Brake Channel A pin
//enable serial data print
Serial.begin(9600);
Serial.println("Started");
// SET UP ACCELEROMETER
Serial.println("Starting the I2C interface.");
Wire.begin(); // Start the I2C interface.
Serial.println("Constructing new HMC5883L");
compass = HMC5883L(); // Construct a new HMC5883 compass.
Serial.println("Setting scale to +/- 1.3 Ga");
error = compass.SetScale(1.3); // Set the scale of the compass.
if(error != 0) // If there is an error, print it out.
Serial.println(compass.GetErrorText(error));
Serial.println("Setting measurement mode to continous.");
error = compass.SetMeasurementMode(Measurement_Continuous); // Set the measurement mode to Continuous
if(error != 0) // If there is an error, print it out.
Serial.println(compass.GetErrorText(error));
WiFly.begin();
if (!WiFly.join("BTHub3-HKP4", "9d7cdbc6ce")) {
while (1) {
// Hang on failure.
Serial.print("failed");
}
}
Serial.begin(9600);
Serial.print("IP: ");
Serial.println(WiFly.ip());
server.begin();
}
void loop(){
// Retrive the raw values from the compass (not scaled).
MagnetometerRaw raw = compass.ReadRawAxis();
// Retrived the scaled values from the compass (scaled to the configured scale).
MagnetometerScaled scaled = compass.ReadScaledAxis();
// Values are accessed like so:
int MilliGauss_OnThe_XAxis = scaled.XAxis;// (or YAxis, or ZAxis)
// Calculate heading when the magnetometer is level, then correct for signs of axis.
float heading = atan2(scaled.YAxis, scaled.XAxis);
// Once you have your heading, you must then add your 'Declination Angle', which is the 'Error' of the magnetic field in your location.
// Find yours here: http://www.magnetic-declination.com/
// Mine is: 2? 37' W, which is 2.617 Degrees, or (which we need) 0.0456752665 radians, I will use 0.0457
// If you cannot find your Declination, comment out these two lines, your compass will be slightly off.
float declinationAngle = 0.0457;
heading += declinationAngle;
// Correct for when signs are reversed.
if(heading < 0)
heading += 2*PI;
// Check for wrap due to addition of declination.
if(heading > 2*PI)
heading -= 2*PI;
// Convert radians to degrees for readability.
float headingDegrees = heading * 180/M_PI;
// Output the data via the serial port.
//Output(raw, scaled, heading, headingDegrees);
//WIFI SECTION
// Create a client connection
delay(500);
WiFlyClient client = server.available();
if (client) {
//Serial.println("Client connected");
while (client.connected()) {
if (client.available()) {
char c = client.read();
//read char by char HTTP request
if (readString.length() < 200) {
//store characters to string
readString += c;
}
//if HTTP request has ended
if (c == '\n') {
//now output HTML data header
client.println("HTTP/1.1 200 OK"); //send new page
client.println("Content-Type: text/html");
client.println();
client.println("<head>");
client.println("<style media=\"screen\" type=\"text/css\">");
client.println("#compass {");
client.println("width: 380px;");
client.println("height: 380px;");
client.println("background-image:url('http://localhost/compass.jpg');");
client.println("position: relative;");
client.println("}");
client.println("#arrow {");
client.println("width: 300px;");
client.println("height: 150px;");
client.println("background-image:url('http://localhost/arrow.png');");
client.println("position: absolute;");
client.println("top: 115px;");
client.println("left: 40px;");
client.print("-moz-transform:rotate(");
client.print(headingDegrees + 90);
client.println("deg);");
client.println("}");
client.println("</style>");
client.print("</head>");
client.print("<body>");
// print something, in HTML format:
client.print("WiFly Webserver Running!");
client.println("
");
client.print("IP: ");
client.println(WiFly.ip());
client.println("");
//Serial.print("readString = ");
//Serial.println(readString); //print to serial monitor for debugging
client.println("
");
client.print("Raw:\t");
client.print(raw.XAxis);
client.print(" ");
client.print(raw.YAxis);
client.print(" ");
client.print(raw.ZAxis);
client.print(" \tScaled:\t");
client.print(scaled.XAxis);
client.print(" ");
client.print(scaled.YAxis);
client.print(" ");
client.print(scaled.ZAxis);
client.print(" \tHeading:\t");
client.print(heading);
client.print(" Radians \t");
client.print(headingDegrees);
client.println(" Degrees \t");
client.println("<div id=\"compass\">");
client.println("<div id=\"arrow\"></div>");
client.println("</div>");
client.print("</body>");
delay(1);
//stopping client
client.stop();
//Serial.print("readString = ");
//Serial.println(readString); //print to serial monitor for debugging
Serial.println("Stopped client");
///////////////////// control arduino pin
MORE CODE BELOW FOR MOTOR CONTROL (shouldnt be relevant)
