PathShape p;
float t;

void setup() {
  size(400,400);
  p=new PathShape(0,0, 1);
  p.moveTo(0,0);
  p.curveTo(300,0,
    200,200,
    400,400);
  p.curveTo(200,350,
    200,50,
    400,0);
  p.curveTo(400,200,
    100,300,
    0,400);
}

void draw() {
//  background(200);
  noFill();
  p.draw();

  fill(255);
  t=t+0.01;
  if(t>1) t=0;

  float pos [] = p.calcPosAndNormal(t);

  // draw ellipse at position t on the path
  ellipse(pos[0],pos[1], 20,20);

  // draw normal at position t
  line(pos[0]+pos[2]*30,pos[1]+pos[3]*30,
    pos[0]-pos[2]*30,pos[1]-pos[3]*30);
}

class PathShape extends Shape {
  float pt[];
  int num;

  public PathShape(float _x,float _y,float _rad) {
    super(_x,_y,_rad);  // Calls Shape's constructor
    pt=new float[10*6+2];
  }

  void moveTo(float _x,float _y) {
    pt[0]=_x;
    pt[1]=_y;
  }

  void curveTo(float x1,float y1,
    float x2,float y2,
    float x3,float y3) {

    int index=num*6;

    // check to see if we have space for more points
    if(index==pt.length) {
      // create an array of twice the size
      float [] tmp=new float[pt.length*2];

      // copy the values from the old array
      for(int i=0; i<pt.length; i++) tmp[i]=pt[i];

      // set pt to point to the new array
      pt=tmp;
    }

    pt[index++]=x1;
    pt[index++]=y1;
    pt[index++]=x2;
    pt[index++]=y2;
    pt[index++]=x3;
    pt[index++]=y3;

    num++;
  }

  void draw() {
    int index=0;

    pushMatrix();
    translate(x,y);
    scale(rad);

    beginShape();
    vertex(pt[index++],pt[index++]);
    for(int i=0; i<num; i++)
      bezierVertex(pt[index++],pt[index++],
        pt[index++],pt[index++],
        pt[index++],pt[index++]);
    endShape();


    popMatrix();
  }

  // calculate y position on curve at t == n
  float calcX(float t) {
    t*=num;
    int curveNum=(int)t;
    t=t-curveNum;

    int index=curveNum*6;

    return bezierPoint(
      pt[index],pt[index+2],
      pt[index+4],pt[index+6], t);
  }

  // calculate y position on curve at t == n
  float calcY(float t) {
    t*=num;
    int curveNum=(int)t;
    t=t-curveNum;

    int index=curveNum*6;

    return bezierPoint(
      pt[index+1],pt[index+3],
      pt[index+5],pt[index+7], t);
  }

  // calculates position and normal at t == n
  float [] calcPosAndNormal(float t) {
    float px,py,xD,yD,l,t2;
    float [] pos=new float[4];

    // calculate X,Y position
    pos[0]=calcX(t);
    pos[1]=calcY(t);

    // find previous point on curve

    t2=t-0.001;
    if(t2<0) { // calculate point after t
      t2=t+0.001;
      px=calcX(t2);
      py=calcY(t2);
      xD=px-pos[0];
      yD=py-pos[1];
    }
    else { // calculate point before t
      px=calcX(t2);
      py=calcY(t2);
      xD=pos[0]-px;
      yD=pos[1]-py;
    }

    // find length of xD,yD and normalize
    l=sqrt(xD*xD+yD*yD);
    xD/=l;
    yD/=l;

    // fill tangent into array
    pos[2]=-yD;
    pos[3]=xD;

    return pos;
  }
}

class Shape {
  float x,y,rad;

  public Shape(float _x,float _y,float _rad) {
    x=_x;
    y=_y;
    rad=_rad;
    println("Shape.Shape()");
  }

  void draw() {
    //println("Shape.draw()");
  }
}