Friday, February 1, 2013

My Tribute to Nyan Cat and Pokemon

I came across the Nyan Cat internet meme program on khanacademy and decided to make my own version as a tribute.

//Code:

var nyanscale=1.5;



var nyany=200;



var nyanx=0;







var drawStar = function(state, x, y) {

    switch (state) {

    case 0:

        point(x, y);

        break;

    case 1:

        line(x - 10, y, x - 8, y);

        line(x + 10, y, x + 8, y);

        line(x, y - 10, x, y - 8);

        line(x, y + 10, x, y + 8);

        break;

    case 2:

        point(x - 15, y);

        point(x + 15, y);

        point(x, y - 15);

        point(x, y + 15);

        point(x - 10, y - 10);

        point(x + 10, y + 10);

        point(x - 10, y + 10);

        point(x + 10, y - 10);

        break;

    case 3:

        point(x - 20, y);

        point(x + 20, y);

        point(x, y - 20);

        point(x, y + 20);

    }

};



var drawStars = function(state, dx) {

    stroke(0, 255, 183);

    drawStar(state, 400 - (dx % 400), 30);

    stroke(0, 255, 9);

    drawStar((state + 2) % 4, 400 - ((dx + 100) % 400), 100);

    stroke(255, 0, 255);

    drawStar((state + 1) % 4, 400 - ((dx - 60) % 400), 150);

    drawStar((state + 3) % 4, 400 - ((dx + 200) % 400), 230);

    stroke(255, 0, 0);

    drawStar((state + 2), 400 - ((dx + 300) % 400), 290);

    stroke(255, 255, 0);

    drawStar((state + 1), 400 - ((dx - 175) % 400), 370);

};



var drawRainbowStreak = function(shift, color, dy) {

    // each rainbow streak is sin wave

    stroke(color);

    var x = 0;

    var y = 10 * sin(x * 2 + shift);

    for (var i = 0; i < 134; i++) {

        y = 5 * sin(4 * x + shift);

        point(x, y + dy);

        x += 1;

    }

};



var drawRainbow = function(shift) {

    var red = color(0, 0, 0);

    var orange = color(255, 92, 71);

    var yellow = color(247, 189, 163);

    var green = color(255, 92, 71);

    var blue = color(247,189,163);

    var purple = color(0, 0, 0);



    strokeWeight(20);

    drawRainbowStreak(shift, red, 125);

    drawRainbowStreak(shift, orange, 145);

    drawRainbowStreak(shift, yellow, 165);

    drawRainbowStreak(shift, green, 185);

    drawRainbowStreak(shift, blue, 205);

    drawRainbowStreak(shift, purple, 225);

};



var drawNyanTail = function(state) {

    fill(247, 255, 0);

    switch (state) {

    case 1:

        strokeWeight(27);

        stroke(0, 0, 0);

        bezier(147, 204, 114, 211, 97, 198, 90, 186);

        strokeWeight(15);

        stroke(255, 234, 0);

        bezier(147, 204, 114, 211, 97, 198, 90, 186);

        break;

    case 3:

        strokeWeight(27);

        stroke(0, 0, 0);

        bezier(147, 204, 148, 196, 104, 197, 97, 218);

        strokeWeight(15);

        stroke(247, 255, 0);

        bezier(147, 204, 148, 196, 104, 197, 97, 218);

        break;

    default: // 0 and 2

        strokeWeight(27);

        stroke(0, 0, 0);

        bezier(147, 204, 114, 211, 97, 203, 88, 199);

        strokeWeight(15);

        stroke(247, 255, 0);

        bezier(147, 204, 114, 211, 97, 203, 88, 199);

    }

};



var drawNyanLegs = function(state) {

    stroke(0, 0, 0);

    strokeWeight(6);

    fill(255, 255, 0);

    switch (state) {

    case 0:

        // front legs

        translate(300, 251);

        rotate(-50);

        ellipse(0, 0, 28, 42);

        ellipse(-28, -28, 29, 44);

        resetMatrix();

        // back legs

        translate(194, 251);

        rotate(-46);

        ellipse(0, 0, 26, 43);

        ellipse(-26, -25, 25, 41);

        resetMatrix();

        break;

    case 1:

        ellipse(296, 252, 28, 37);

        ellipse(256, 252, 29, 37);

        ellipse(187, 252, 29, 37);

        ellipse(148, 252, 29, 37);

        break;

    case 2:

        // front legs

        translate(282, 251);

        rotate(31);

        ellipse(0, 0, 28, 42);

        ellipse(-35, 20, 31, 44);

        resetMatrix();

        // back legs

        translate(187, 255);

        rotate(51);

        ellipse(0, 0, 29, 43);

        ellipse(-27, 31, 29, 41);

        resetMatrix();

        break;

    case 3:

        ellipse(290, 240, 28, 37);

        ellipse(253, 240, 29, 37);

        ellipse(187, 240, 29, 37);

        ellipse(148, 240, 29, 37);

    }

};



var drawNyanPoptart = function(state) {

    stroke(0, 0, 0);

    strokeWeight(6);



    // poptart

    var poptartDeltY = 0;

    if (state === 3) {

        poptartDeltY = -5;

    }



    fill(238, 255, 0);

    ellipse(215, 185 + poptartDeltY, 163, 135);

    



    

};



var drawNyanHead = function(state) {

    strokeWeight(6);

    stroke(0, 0, 0);

    

    // head

    var headDeltY = 0;

    var headDeltX = 0;

    switch(state) {

    case 0:

        headDeltX = 10;

        headDeltY = -6;

        break;

    case 2:

        headDeltX = -2;

        headDeltY = -6;

        break;

    case 3:

        headDeltY = -15;

    }



    fill(238, 255, 0);    

    ellipse(275 + headDeltX, 209 + headDeltY, 108, 80);



    // ears

    bezier(223 + headDeltX,

            197 + headDeltY,

            3 + headDeltX,

            158 + headDeltY,

            215 + headDeltX,

            133 + headDeltY,

            262 + headDeltX,

            171 + headDeltY);

    

    bezier(329 + headDeltX,

            199 + headDeltY,

            450 + headDeltX,

            149 + headDeltY,

            321 + headDeltX,

            133 + headDeltY,

            285 + headDeltX,

            169 + headDeltY);



    // eyes

    strokeWeight(14);

    point(252 + headDeltX, 207 + headDeltY);

    point(300 + headDeltX, 207 + headDeltY);



    // nose

    strokeWeight(8);

    point(283 + headDeltX, 217 + headDeltY);



    // mouth

    strokeWeight(4);

    bezier(259 + headDeltX,

            225 + headDeltY,

            262 + headDeltX,

            235 + headDeltY,

            287 + headDeltX,

            231 + headDeltY,

            284 + headDeltX,

            226 + headDeltY);

  

    bezier(300 + headDeltX,

            225 + headDeltY,

            300 + headDeltX,

            232 + headDeltY,

            282 + headDeltX,

            232 + headDeltY,

            284 + headDeltX,

            226 + headDeltY);



    // cheeks

    strokeWeight(16);

    stroke(255, 0, 0);

    point(244 + headDeltX, 225 + headDeltY);

    point(313 + headDeltX, 222 + headDeltY);



    // eye highlights

    strokeWeight(8);

    stroke(255, 255, 255);

    point(250 + headDeltX, 205 + headDeltY);

    point(298 + headDeltX, 205 + headDeltY);

    

        noStroke();



    if (mouseIsPressed) {



        fill(255, 0, 0);



    } else {



        noFill();



    }



   rect(headDeltX+245,headDeltY+202,3310,10,90);



};



var drawNyanCat = function(state) {

    drawNyanTail(state);

    drawNyanLegs(state);

    drawNyanPoptart(state);

    drawNyanHead(state);

};



var state = 0;

var draw = function() {

    background(8, 52, 107);



    // there are only 4 states in the animation:

    //      0, 1, 2, and 3

    drawStars(state % 4, frameCount * 20);

    drawRainbow(frameCount * 20);

    drawNyanCat(state % 4);



    // only increase the state every 4 frames, to slow

    // down the animation

    if (frameCount % 4 === 0) {

        state += 1;

    }

};