Hey guys!

Im quite new to this processing malarky. I have been experimenting with a number of things. I am doing a project of going from gesture movement to sound to geometry using interactivity. Right now I am concentrating on the sound to geometry stage of it. I am using the mathematics of Lissajous curves(based on frequency, amplitude and phases) and I have managed to make a 2D version. I am trying to use OPENGL to  make it more appealing and 3dimensional. Can anyone help? I am not used to Open GL but here is my 2D version of the code. Please note right now I have been using Controllers with control P5 To manipulate the curve, but i also have a version using Arduino but since not everyone might have an arduino board it is easier to show this one.

/* This code is how to manipulate Lissajous or Bowditch curves with the use of controllers
The mathematics behind it is can be put in the following parametric equation

x(t) = a*(sin(w1(t) + THETA1))
y(t) = b*(sin(w2(t) + THETA2));

Time t is a parameter.
x(t) and y(t) are the moving points in the co-ordinate system
a and b are the amplitudes of those moving points along the x and Y axis
w1 and w2 are the angular frequencys along the x axis and y axis
THETA1 and THETA2 are the initial phases of the motions along the x and y axis */

import controlP5.*;      // allows one to put in controllers in this case knobs

ControlP5 gui;

// variables

public int iterations = 9000;
public float xRatio = 3;      // X frequency
public float xPhase = 0;      // X Phase
public float yRatio = 2;      // Y frequency
public float yPhase = 0;      // Y phase
//public float spin = 3;
//public float spinPhase = 0;
//public float decay = 2/10000;

float deg2rad = PI/60;
float cx, cy, x, y;

void setup(){
 size (800, 800);
 cx = (width/2);      // helps to get the amplitude a, it also positions the curve on the sheet
 cy = (height / 4);     // helps to get the amplitude b, it also positions the curve on the sheet
 
gui = new ControlP5(this);
gui.addKnob("xRatio",0, 1, ((width/2)-120), 650, 60);      //(Name, X position on knob, Y position on knob, absolute X co-ord, absolute Y co-ord, diameter)
gui.addKnob("xPhase", 0, 1, ((width/2)-40), 650, 60);
gui.addKnob("yRatio", 0, 1, ((width/2)+40), 650, 60);
gui.addKnob("yPhase", 0, 1, ((width/2)+120), 650, 60);
// gui.addKnob("spin", 0 , 1, 430, 650, 60);
// gui.addKnob("spinPhase", 0, 1, 500, 650, 60);
}


// The above will only draw the controllers but will not allow you to move them
// therefore one needs the gui.draw; command to allow one to manipulate the values

void draw()
{
 background(0);    //Black background
 gui.draw();      // Allows one to manipulate the controller
 translate(cx, cy);    // Positions the curve
 beginShape();
 for (int i=0;i < iterations; i++) {    
 x = (cx-50)*(sin(xRatio * i * deg2rad + xPhase));    // + cx*(sin(spin*i*deg2rad + spinPhase);
 y = (cy-50)*(sin(yRatio * i * deg2rad + yPhase));    // the reason for -50 in the amplitude is so it will not touch the edge of the screen
  float r = mouseX;               // Random Red value
  float g = mouseY;               // Random Blue value
  float b = mouseX*mouseY;        // Random Green value
   stroke(r, g, b);
   strokeWeight(1);
   noFill();
   curveVertex(x, y);
 }
 endShape();  
}