And yet the code is very similar.

It runs fine from the sketch window but as soon as I dump it into a web page (like all my other sketches) or try to run it in Javascript -- even using the export-to-web tool, it simply will not run. I have tried it with processing.js, processing.min.js, and even processing-1.4.1.min.js.

I want to get back to studying the camera that Jeff showed me, but had to finish the piece I was working on. It's done now, and I'm happy with it. BUT though there are no errors -- it will not run on my website. And,  this is even based on code that already runs there.

I don't mind programming problems because in trying to figure them out I usually learn a great deal,  but I hate this kind of stuff because I don't know where to look.

I've checked books, but none seem to address this kind of issue.

1. // Title: Hard Edge Organics
2. // by Clair Dunn - September, 2013
3. int cr, cg, cb;
4. float xstrt, ystrt, squaresize;
5. void setup() {
6.   size(600, 600, P2D);
7.   frameRate(10);
8.   colorMode(HSB, 255);
9.   background(0);
10.   xstrt = random(10);
11.   ystrt = random(10);
12.   squaresize = height/8;
13. }
14. void draw() {
15.   xstrt += 0.02;
16.   ystrt += 0.01;
17.   float noise = noise(10);
18.   translate(width/2+noise, height/2+noise);
19.   float ynoise = ystrt;
20.   for (float y = -squaresize; y <= squaresize*noise; y+=3) {
21.     ynoise += 0.05;
22.     float xnoise = xstrt;
23.     for (float x = -squaresize; x <= squaresize; x+=3) {
24.       xnoise += 0.05;
25.       drawPoint(x, y, noise(xnoise, ynoise));
26.     }
27.   }
28. }
29. void drawPoint(float x, float y, float noiseFactor) {
30.   pushMatrix();
31.   translate(x * noiseFactor * 4, y * noiseFactor * 4);
32.   float edgeLen = noiseFactor * 50;
33.   stroke (0, 0, 0);
34.   rectMode(CORNER);
35.   rect(0, 0, edgeLen, edgeLen);
36.   cr = int(random(255));
37.   cg = int(random(127));
38.   cb = int(random(255));
39.   stroke(cr, cg, cb);
40.   triangle (0, 0, edgeLen, edgeLen, 35, 60);
41.   if ( (x >500) && (y < -500) ) {
42.     line(x, y, 600, 600);
43.   }
44.   popMatrix();
45. }