calling math experts - Mathematical Steps of the algorithm !

raj

Thank you a lot for looking into :
I am simply trying to replicate p5.js script to local .pde working. and then I plan to make it audio reactive. However I am stuck at replicating itself. I would really appreciate look into. with some work, i could finally make it work error free but I am missing the mathematical logic (not my forte).. The orginal sketch @ https://openprocessing.org/sketch/404046

my code : .......

int NB_FRAMES = 100;
int id;
int frame_count = 0;
Object[] objects;
int NB = 100;
int curSeed;


class Object{
        int objID ;
        int t ;
        float x0;
        float theta ;
        float xx;
        float yy = 0;
        int Nt = 75;
        float step ;
        float turn;

        Object(int objIDtemp){
          objID = objIDtemp;
        }

        void update(){
          t = ((frame_count)%NB_FRAMES)/NB_FRAMES;
          theta = PI/2;
          step = height/Nt;
          x0 = lerp(0,width,objID/NB);
          xx = x0;
          turn = lerp(0,0.4,activation((objID/NB+0*t)%1)); 
        }

        float activation(int t) {
        return ((1-cos(2*PI*t))/2)*1;
        }  

        void display(){
        stroke(255);
        strokeWeight(1);
        noFill();
        beginShape();
        println("objID ----- "+objID);
        vertex(xx,yy);
        for(int i=0;i<=Nt;i++){
            theta += turn*sin(100*noise(1000)+2*PI*(15*noise(0.2*objID/NB,0.02*i)+t));
            //theta += turn*sin(100*noise(1000)+2*PI*(20*noise(0.02*i)+t + 0.1*sin(2*PI*this.id/NB)));
            xx += step*cos(theta);
            yy += step*sin(theta);

            float xx2 = lerp(xx,x0,(i/Nt)*(i/Nt)*(i/Nt));
            float yy2 = lerp(yy,lerp(0,height-0,i/Nt),max((i/Nt),1-sqrt(i/Nt)));
            //println("xx ---- "+ xx2+"yy -----"+yy2);
            vertex(xx2,yy2);
        }
        endShape();
    }
}


void setup() {
    curSeed = 11;
    noiseSeed(curSeed);
    randomSeed(1);
    size(800,600);
    objects = new Object[NB];
    background(0);
    int counter=0;
    for(int i = 0;i<NB;i++) {
        objects[counter++] = new Object(i);

    }
   // mode='A';
}

void mousePressed(){
    curSeed = floor(random(1,1000));//*10000
    noiseSeed(curSeed);
    //console.log(curSeed);
}

void draw() {
    background(0);
    for (Object mod : objects) {
      mod.update();
      mod.display();
    }

  noStroke();
  fill(255);
    text("seed : " + curSeed, 10, 10);

    frame_count++;
    if (frame_count<=100 && frame_count>80) {
        //saveCanvas('s5_'+frame_count+'.png');
    }
}

raj

Sorry community - is it a bad question ? 19 views but none commented ?

Lord_of_the_Galaxy

People don't comment if it is a particularly lengthy question - this could take some time to do. But the major problem is that the title of the question doesn't describe it correctly.

koogs

The obvious thing to check is integer division problems. In Java, with ints, 5/2 is 2. In JavaScript you'll get 2.5...

koogs

The noise implementations between the two are also subtly different iirc.

kfrajer

You missed a line from your original code: yy=0;

Change few subtle things here and there. Object is a base class in Java so another name is preferred.

Kf

float NB_FRAMES = 100;
int id;
int frame_count = 0;
UnObject[] objects;
float NB = 100;
int curSeed;


class UnObject {
  int objID ;
  float t ;
  float x0;
  float theta ;
  float xx;
  float yy = 0;
  float Nt = 75;
  float step ;
  float turn;

  UnObject(int objIDtemp) {
    objID = objIDtemp;
  }

  void update() {
    t = ((frame_count)%NB_FRAMES)/NB_FRAMES;
    theta = PI/2;
    step = height/Nt;
    x0 = lerp(0, width, objID/NB);
    xx = x0;
    yy=0;
    turn = lerp(0, 0.4, activation((objID/NB+0*t)%1));
  }

  float activation(float t) {
    //if(frameCount%100==0) println("Curr t: "+t);
    return ((1-cos(2*PI*t))/2.0);
  }  

  void display() {
    stroke(255);
    strokeWeight(1);
    noFill();
    beginShape();
    //println("objID ----- "+objID);
    vertex(xx, yy);
    for (float i=0; i<=Nt; i++) {
      theta += turn*sin(100*noise(1000)+2*PI*(15*noise(0.2*objID/NB, 0.02*i)+t));
      //theta += turn*sin(100*noise(1000)+2*PI*(20*noise(0.02*i)+t + 0.1*sin(2*PI*this.id/NB)));
      xx += step*cos(theta);
      yy += step*sin(theta);

      float xx2 = lerp(xx, x0, (i/Nt)*(i/Nt)*(i/Nt));
      float yy2 = lerp(yy, lerp(0, height, i/Nt), max((i/Nt), 1-sqrt(i/Nt)));
      //if(frameCount%60==0) println("xx ---- "+ xx2+" yy -----"+yy2);
      vertex(xx2, yy2);
    }
    endShape();
  }
}


void setup() {
  curSeed = 11;
  noiseSeed(curSeed);
  randomSeed(1);
  size(800, 600);
  objects = new UnObject[int(NB)];
  background(0);
  int counter=0;
  for (int i = 0; i<NB; i++) {
    objects[counter++] = new UnObject(i);
  }
  // mode='A';
}

void mousePressed() {
  curSeed = floor(random(1, 1000));//*10000
  noiseSeed(curSeed);

}

void draw() {
  background(0);
  for (UnObject mod : objects) {
    mod.update();
    mod.display();
  }

  noStroke();
  fill(255);
  text("seed : " + curSeed, 10, 10);

  frame_count++;
}

koogs

Object is a base class in Java

ha, good spot.

GoToLoop

Object is a base class in Java...

Not only in Java, but in JS as well: ~O)

1. http://docs.oracle.com/javase/8/docs/api/java/lang/Object.html
2. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object

Even in Python. Although it's in lower case as object: :(|)
https://docs.Python.org/3/library/functions.html#object

raj

Thank you so much for your time. I promise to be clear and make my code short to look and analyze. Else please don't EVER answer .. I think its high time to learn diff between java, js, p5.js .. Thank you a lot again !

koogs

the code was fine, the problem was you expected answers to something quite complicated in too short a time - my half the world was asleep for one thing.

raj

Thanks you from east side of the world. T is all new and am so excited with the possibilities !

Lord_of_the_Galaxy

But take note that a proper title for the question would be - "Problem converting p5.js code to Processing (Java)". The title of a question is fairly important too. And of course, like I said, this type of question can take some time.