Datalogger (SD) combine with process(BridgeClient client)

Hi,

I'm saving the values of the analog ports with time stamp on the SD card; it works great.
But my index.html will not update anymore with the values as soon I write the values on the sd card. Each part for itself (updating the website - datalogger) works.
Maybe it is a wrong approach, since I'm new to Arduino Yun. Any advice/help/comment is welcome, thx.

HTML code:

<!DOCTYPE html>
<html>
<head>
<title>Optimization System</title>

<style type="text/css">
html, body {
  margin:0;
  padding:0;
  width:100%;
  height:100%;
  overflow:hidden;
}

body {
  font-family:sans-serif;
}

#background {
  position:absolute;
  width:100%;
  height:100%;
  z-index:1;
}

#scrollbereich {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  overflow:auto;
  z-index:2;
}

#inhalt {
  padding:20px 100px 30px 200px;
  z-index:2;
}

#footer {
    position:absolute;
    bottom: 0;
    width: 100%;
}

</style>
        <script type="text/javascript" src="zepto.min.js"></script>
          <script type="text/javascript">
                   function refresh() {
                          $('#temperatureSMU').load('/arduino/temperatureSMU');
                          $('#humiditySMU').load('/arduino/humiditySMU');
                          $('#temperatureDatarecorder').load('/arduino/temperatureDatarecorder')
                          $('#humidityDatarecorder').load('/arduino/humidityDatarecorder')
                          $('#temperatureLaser').load('/arduino/temperatureLaser')
                          $('#humidityLaser').load('/arduino/humidityLaser')
                  }
         </script>

</head>
<body>
<div>
<img id="background" src="background.jpg" alt="" title="" />
</div>

<div id="scrollbereich">
<h1>Temperature Optimization System</h1>

<div id="inhalt">
<h1>Systemparameters</h1>

<p>Eine mögliche Variante und Fenstergröße im Browser varrieren! Hintergrund austauschbar</p>


<table width="100%" border="2" bordercolor="#0080C0" cellpadding="3" cellspacing="3">
 <tr>
  <td>Location</td>
  <td>Temperature</td>
  <td>Humidity</td>
 </tr>
 <tr>
  <td>SMU</td>
  <td><span id="temperatureSMU"></span></td>
  <td><span id="humiditySMU"></span></td>
 </tr>
 <tr>
  <td>Datarecorder</td>
  <td><span id="temperatureDatarecorder"></td>
  <td><span id="humidityDatarecorder"></td>
 </tr>
 <tr>
  <td>Laser/Camera</td>
  <td><span id="temperatureLaser"></td>
  <td><span id="humidityLaser"></td>
 </tr>
</table>

</div>
<div id="footer">
<font size="-1">Administrator Panel</font>
<a href="http://incas.local/luci/webpanel/homepage"><img src="on.png" align="middle" border="0" width="" height=""></a>

</div>


        <body onload="setInterval(refresh, 500);">
        </body>
</html>

Arduino Code:

#include <Bridge.h>
#include <BridgeServer.h>
#include <BridgeClient.h>
#include <FileIO.h>

// Listen to the default port 5555, the Yún webserver
// will forward there all the HTTP requests you send
BridgeServer server;

void setup() {
  // Bridge startup
  pinMode(13, OUTPUT);
  digitalWrite(13, LOW);
  Bridge.begin();
  digitalWrite(13, HIGH); //on-board LED as a status light to know when Bridge has started
  
  Serial.begin(9600);
  FileSystem.begin();
  
  while (!SerialUSB); // wait for Serial port to connect.
  SerialUSB.println("Filesystem datalogger\n");
  
  server.listenOnLocalhost();
  server.begin();
  SerialUSB.println("server.begin\n");
}

void loop() {


  // make a string that start with a timestamp for assembling the data to log:
  {
  String dataString;
  dataString += getTimeStamp();
  dataString += " = ";

  // read analog sensors and append to the string:
  for (int analogPin = 0; analogPin < 6; analogPin++) {
    int sensor = analogRead(analogPin);
    dataString += String(sensor);
    if (analogPin < 5) {
      dataString += ",";  // separate the values with a comma
    }
  }

  File dataFile = FileSystem.open("/mnt/sd/datalog.txt", FILE_APPEND);

  // if the file is available, write to it:
  if (dataFile) {
    dataFile.println(dataString);
    dataFile.close();
    // print to the serial port too:
    SerialUSB.println(dataString);
  }
  // if the file isn't open, pop up an error:
  else {
    SerialUSB.println("error opening datalog.txt");
  }

  delay(2000);
  }


  
 
  // Get clients coming from server
  BridgeClient client = server.accept();

  // There is a new client?
  if (client) {
    // Process request
    process(client);

    // Close connection and free resources.
    client.stop();
  }

  delay(50); // Poll every 50ms
}


void process(BridgeClient client) {
  // read the command
  String command = client.readStringUntil('/');
  command.trim();
  
    if (command == "temperatureSMU") {
      int val = analogRead(A0);
      client.print(val);
    }
    if (command == "humiditySMU") {
      int humiditySMU = analogRead(A1);
      client.print(humiditySMU);
    }
    if (command == "temperatureDatarecorder") {
      int temperatureDatarecorder = analogRead(A2);
      client.print(temperatureDatarecorder);
    }
    if (command == "humidityDatarecorder") {
      int humidityDatarecorder = analogRead(A3);
      client.print(humidityDatarecorder);
    }
    if (command == "temperatureLaser") {
      int temperatureLaser = analogRead(A4);
      client.print(temperatureLaser);
    }
    if (command == "humidityLaser") {
      int humidityLaser = analogRead(A5);
      client.print(humidityLaser);
    }
}


// This function return a string with the time stamp
String getTimeStamp() {
  String result;
  Process time;
  // date is a command line utility to get the date and the time
  // in different formats depending on the additional parameter
  time.begin("date");
  time.addParameter("+%D-%T");  // parameters: D for the complete date mm/dd/yy
  //             T for the time hh:mm:ss
  time.run();  // run the command

  // read the output of the command
  while (time.available() > 0) {
    char c = time.read();
    if (c != '\n') {
      result += c;
    }
  }

  return result;
}

I think your problem is the use of the delay() function. As is so often the case, this function generally does more harm than good. For a simple "blink an LED and do nothing else" type of sketch, delay() is fine, but in most other cases it does nothing but cause problems.

Because of the delay() calls, every pass through loop() will take a minimum of 2050 milliseconds, plus the time it takes to collect the analog samples and write to the disk file. During that pass through loop(), it will accept and process at most one web data request. One call to refresh() on your web page makes six web requests, so it will take a minimum of 12.3 seconds for one refresh operation.

If you want this sketch to perform reasonably well, you need to eliminate all calls to delay(). The loop() function must do what it needs to do and return as soon as possible. Since it only handles one connection request per call to loop(), it will take at least six iterations of loop() each time your web page's refresh() function is called. Note that it is NOT a good idea to keep the two second delay in place and simply call the check for a client connection multiple times.

Take a look at the Blink Without Delay example sketch, and understand how it works. This will be the key to getting it to work. Use that logic to make your data collection/disk update code run once every two seconds. Then keep the one call to check for a connection, and get rid of the 50 ms delay() call. What you will have is a loop() function that gets called frequently and returns quickly (which is the way it should be.) That will allow it to quickly handle multiple web requests, while the blink without delay code will still limit the data collection to once every two seconds.

What you have now in loop():

collect analog data and write data to disk

wait 2000 ms

if there is an incoming connection
   process connection

wait 50 ms

This always takes at least 2050 ms.

What you should have in loop():

if two seconds has passed since the last update
   collect analog data and write data to disk


if there is an incoming connection
   process connection

This will usually take almost no time. Every two seconds it will take a little longer to collect and store the data, and every time a web request comes in it will take a little time to process it. But generally, there will be little interaction between the two operations and the response time will be fast.