Can't read .txt file which data update continually

fakepuppet

Processing.js doesn't support PrintWriter function and Table class(CMIIW), so I load file data using loadStrings function. I running 2 different sketch in same time.
-1st sketch is an example "Java/Topics/File IO/SaveFile1" w/ mod file path to "LoadFile1/data" running in Java Mode.
-2nd sketch is an example "Java/Topics/File IO/LoadFile1" w/ mod plot line and running in JS Mode.

I run 1st sketch, plot some line then run 2nd sketch. After running, browser show the line. Then I plot some line again in 1st sketch but in browser doesn't draw line. If I rerun 2nd sketch, it's working and if reload browser it doesn't work.

I know the problem is lines.length() is static (doesn't increase). I want solution, how to make my 2nd sketch (js) reading data continually. Another problem is I'm still new with javascript.
My project is log data from xbee usb adapter and share it via browser.. since Processing.js doesn't work with serialEvent, I run sketch with Java Mode then save data log into file. Then I want draw data from file using Processing.js. I love processing, it's friendly.. I hope my solution is processing code..
Sorry if my English is bad.

1st sketch

int[] x = new int[0];
int[] y = new int[0];
void setup() 
{
  size(200, 200);
}

void draw() 
{
  background(204);
  stroke(0);
  noFill();
  beginShape();
  for (int i = 0; i < x.length; i++) {
    vertex(x[i], y[i]);
  }
  endShape();
  // Show the next segment to be added
  if (x.length >= 1) {
    stroke(255);
    line(mouseX, mouseY, x[x.length-1], y[x.length-1]);
  }
}

void mousePressed() { // Click to add a line segment
  x = append(x, mouseX);
  y = append(y, mouseY);
  String[] lines = new String[x.length];
  for (int i = 0; i < x.length; i++) {
    lines[i] = x[i] + "\t" + y[i];
  }
  saveStrings("C:/Users/Bayu/Documents/Processing/LoadFile1/data/lines.txt", lines);
}
void keyPressed() {
  exit();
}

2nd sketch

String[] lines;
int index = 0;
int x;
int y;
int x0=0;
int y0=0;

void setup() {
  size(200, 200);
  background(0);
  stroke(255);
  frameRate(12);
  lines = loadStrings("lines.txt");
}

void draw() {
  println(index+" ");
  println(lines.length+" length");
  if (index < lines.length) {
    String[] pieces = split(lines[index], '\t');
    if (pieces.length == 2) {
      int x = int(pieces[0]);
      int y = int(pieces[1]);
      if (x0!=0 && y0!=0) {
        line(x, y, x0, y0);
      }
      x0=x;
      y0=y;
      index = index + 1;
    }
  }
}

GoToLoop

Better take a look @ Processing.JS's loadStrings() own reference too:
http://processingjs.org/reference/loadStrings_/

When dealing w/ something new, like JavaScript Mode, we should start slowly and simple.
Check whether code below works for ya. it did for me:

String lines[] = loadStrings("list.txt");
for (int i=0; i < lines.length; println (lines[i++]));
println("\nThere are " + lines.length + " lines\n");
exit();

fakepuppet

It Doesn't work.. I still need to rerun my processing.js to make sketch working..

GoToLoop

Re-run to work? Perhaps it's related to JS's asynchronous loading:
http://processingjs.org/articles/p5QuickStart.html#synchronousIO

fakepuppet

Hmm.. It still not working.. I need something working like this.
"If my data (in txt) at last row (length) available then draw it and if it doesn't available then wait 1 second, if still not available wait again 1s until new data exist" "This process continue until I close sketch"
When I use my sketch, lines.length() value is static (lines.length() scan sketch only once while it running)..

GoToLoop

Hmm.. It's still not working...

If my simple sample code above didn't work, it's pretty much hopeless trying something more complicated!
Perhaps you should try a more specific JS framework like P5.JS: http://p5js.org

P.S.: Don't forget that all resource files should be inside sketch's subfolder: "/data/"! L-)

fakepuppet

Haha.. Maybe It was so hard to make live streaming text data from text file on browser.. I have another solution, using software called LiveGraph. Poorly, it can't go to localhost (browser)
My project similar to like this highcharts.com/demo/dynamic-update and fastly.github.io/epoch/real-time/#line
Both code above are random data. I need data from textfile and I don't understand javascript especially extension javasript like D3, HighChart, Epoch, etc.

fakepuppet

Hi GoToLoop.. I finally success make sketch (realtime streaming data) working in java mode but not for javascript.. What happen with javascrpit?? Can you help me??
I move loadString() function from setup() to draw(). then you can play your data with notepad, edit>>save>>edit>>save

int index = 0;
int x;
int y;
int x0=0;
int y0=0;

void setup() {
  size(200, 200);
  background(0);
  stroke(255);
  frameRate(12);
}

void draw() {
  String[] lines = loadStrings("lines.txt");
  println(index+" ");
  println(lines.length+" length");
  if (index < lines.length) {
    String[] pieces = split(lines[index], '\t');
    if (pieces.length == 2) {
      int x = int(pieces[0]);
      int y = int(pieces[1]);
      if (x0!=0 && y0!=0) {
        line(x, y, x0, y0);
      }
      x0=x;
      y0=y;
      index = index + 1;
    }
  }
}

GoToLoop

I move loadStrings() function from setup() to draw().

That's a very bad move! Resources should be read in setup(), so they're ready to use in draw().
Functions like loadStrings(), and specially saveStrings(), aren't fast! (~~)

Why don't you place the loaded data in some arrays or a class. Then read them inside draw()! /:)

PhiLho

Well, you can call loadStrings() in draw, but with conditionals around it, to load it only every n seconds or every n frames. Not on each frame!

fakepuppet

Thank you for your help and suggest.. Now I can make chart (area/dot/line) with processing..
I use core temp in my tray.. When I loadStrings() in draw.. My CPU load is low (about 7%-15%) and CPU temperature is normal (about 45 C-50 C).
I have another question.. How to make sketch large than your computer resolution, running like browser (with vertical and horizontal scroll)?

PhiLho

In general, it can be simpler / easier to compute your drawing and draw only the visible part. I have shown in the past some sketches doing such scrolling.