Project 7: Curves

wpf-curves.js
//Patrick Fisher, Section B, wpf@andrew.cmu.edu Assignment -07-project
var functionState = 1;
function setup() {
    createCanvas(480, 480);
    frameRate(10);
}

function draw() {
    var nPoints = 80;
    var radius = 150;
    var separation = 120;

    if(functionState == 1){ //glitchy circle
        background(0);
        fill(255, 255, 255, 64);
        var mouseXincrease = map(mouseX,0,width,-40,40);
        var mouseYincrease = map(mouseY,0,height,-40,40);
        var colorXY = map(mouseX + mouseY,0,960,0,255);
    
        push();
    
        translate(2*separation, height / 2);
        fill(255,0,colorXY);
        beginShape();
        for (var i = 0; i < nPoints; i++) {
            var theta = map(i, 0, nPoints, 0, TWO_PI);
            var px = radius * cos(theta);
            var py = radius * sin(theta);
            vertex(px + random(-40, mouseXincrease), py + random(-40, mouseYincrease));
        }
        endShape(CLOSE);
        pop();
    } 

    else if(functionState == 2) {
        var mouseXpoints = map(mouseX,0,width/2,1,30);
        var oppoY = map(mouseY,0,width,255,0);

        background(240);
        push();
        fill(oppoY)
        translate(2*separation, height / 2);
        beginShape();
        for (var i = 0; i < mouseXpoints; i++) {
            var theta = map(i, 0, mouseXpoints, 0, TWO_PI);
            var px = radius * cos(theta);
            var py = radius * sin(theta);
            vertex(px,py); 
            ellipse(px, py, 3,3);
        }
        endShape(CLOSE);
        pop();
    }    
}

function mousePressed(){
    if(functionState ==1){
        functionState = 2;
    } else if(functionState ==2){
        functionState = 1;
    }
}

I am very conflicted on the result of this project. I had a major lack of inspiration when it came to ideas, so I ended up taking some of the shapes shown in the sample and playing around a bit with them. I had difficulty with some of my map functions as they were not working as I had intended for some reason. However, I do like in the end what I came up with. The circle getting more and more glitchy is really fun and I really love how the vertices of the second circle spring out of the original one like a clown car.

Leave a Reply