# Converting JS (DTwitter) code into Processing

Hi,

is it possible to convert this JS (Dtwitter) code into regular Processing code?

function u(t) {
T([0,0,c.width|=T=(A,i=0,z,p=S(t++)/3+.5)=>i++>12?x.strokeRect(...A):T(A=[...A],i,z=A[2+i%2]*=p,T(A,i),A[i%=2]+=z,A[2+i]=z/p-z),1080])
}


where

  u(t) is called 60 times per second.
t: elapsed time in seconds.
c: A 1920x1080 canvas.
x: A 2D context for that canvas.
S: Math.sin
C: Math.cos
T: Math.tan
R: Generates rgba-strings, ex.: R(255, 255, 255, 0.5)


this is the original:
https://www.dwitter.net/d/23448

Thanks a lot!!

It should be possible. But that’d be a daunting task to pull out on Java/Processing syntax! To help you get started I’ve indented & commented the code, so it’s slightly more readable: function u(t) {
T([
0, // 1st elem
0, // 2nd elem
c.width |= // 3rd elem
T = (A, i = 0, z, p = S(t++)/3 + .5) => // 4-param lambda
i++ > 12 ?
x.strokeRect(...A) :
T(
A = [...A], // 1st param
i, // 2nd param
z = A[2 + i%2] *= p, // 3rd param
T(A, i), // 4th param (void)
A[i %= 2] += z, // ignored param
A[2 + i] = z/p - z // ignored param
),
1080 // 4th elem
])
}

2 Likes

You say so because of the lambda and three dots ... operators (rest parameters / spread operators)?

Would it be possible then to have this code running in p5.js somehow?

You can use the ... (varargs) in Java (But only in the function definition, not when you call it). Also Processing 4 (Java 17) provides Lambda.

So I’ve done this now and it definitely looks like something but not like the original sketch. So I must have made a mistake somewhere. If I can find it, I’ll send a new version.

void setup() {
size(500, 500);
}

void draw() {
background(255);

noFill();
stroke(0);
strokeWeight(1);
u(millis() / 1000f);
}

void T(float t, float[] A) {
T(t, A, 0);
}
void T(float t, float[] A, int i) {
t += 1;
T(t, A, i, 0, sin(t)/3 + 0.5);
}
void T(float t, float[] A, int i, float z, float p) {
i++;
if(i > 12) {
rect(A, A, A, A);
}else{
float[] param1 = new float[A.length];
arrayCopy(A, param1);

int param2 = i;

A[2 + i%2] *= p;
z = A[2 + i%2];
float param3 = z;

T(t, A, i);

i %= 2;
A[i] += z;

A[2 + i] = z/p - z;

T(t,
param1,
param2,
param3,
0
);
}
}
void u(float t) {
T(t, new float[]{
0, // 1st elem
0, // 2nd elem
width, // 3th elem
height // 4th elem
});
}

1 Like

Thanks a lot!!! Now I can get into it better!

Some people there said it is based on binary trees. By that, can I expect that this recursion is supposed to produce only 0 or 2 child?

Finally I’ve hit the correct recipe I guess: /**
* Subdivision Waves [Java Mode] (v1.0.9)
* mod by GoToLoop (2022/Dec/10)
*
* https://Dwitter.net/d/23448
*
* https://Discourse.Processing.org/t/
*/

static final int ITERS = 12;
static final float STEP = .025;

float t;

void setup() {
size(700, 400);
background(-1);
}

void draw() {
t = frameCount * STEP;
T(0, 0, width, height);
}

void mousePressed() {
looping ^= true;
}

void keyPressed() {
mousePressed();
}

@SafeVarargs final void T(final float... A) {
assert A.length >= 4: "Requires 4 values";
T(A, 0);
}

void T(float[] A, int i) {
++t;

if (i++ > ITERS) {
rect(A, A, A, A);
return;
}

A = A.clone();

final int
ii = i % 2,
idx = ii + 2;

final float
p = sin(t)/3 + .5,
z = A[idx] *= p;

T(A, i);

A[ii] += z;
A[idx] = z/p - z;

T(A, i);
}

4 Likes

Converted it to Python Mode: 2 Likes

Thanks a lot, this is great!!!

1 Like