​

let bodyX, bodyY, bodyW, bodyH;

let faceXdis, faceYdis, faceDia;

let scoresignX, scoresignY, scoresignD;

let eyexdis, eyeydis, eyedia;

let catheadx, catheady, catheadd, catheadsp, catbodywidth, catbodyheight, catbodycenterx, catbodycentery;

​

​

// jake: create staff for wei and laser beam

​

let staffX1, staffY1, staffX2, staffY2, staffX3, staffY3, staffX4, staffY4;

let staffjewelX, staffjewelY, staffjewelW, staffjewelH, staffJewelGlow, staffJewelAlpha;

let stafftrangleX1, stafftrangleY1, stafftrangleX2, stafftrangleY2, stafftrangleX3, stafftrangleY3;

​

let battleMode;

​

// jake figure variables

​

let alphaMax;

let alphaMin;

let strokeOne;

​

//set up skateboard's speed

let jakesp=3;

let skate2x,skate2y;

let wheel2x;

​

//wei part:set up a attack ball

let attackballOn=false;

let attackballx,attackbally,attackballd,ballspeed;

​

//draw jake variables

let jakeLeftFootX;

let jakeFootY;

let jakeRightFootX;

let jakeFootW;

​

let jakeBodyX;

let jakeBodyY;

let jakeBodyW;

let jakeBodyH;

let jakePantsH;

let jakePantsY;

let jakePantsAlpha;

​

let jakePantsLegStroke;

let jakeBodyShirtColor;

​

​

let jakeSkateboard;

let jakeSkateboardWheel1;

let jakeSkateboardWheel2;

let skateboardAlpha;

let skateboardNinjaAlpha;

​

​

let jakeHandRightX;

let jakeHandLeftX;

let jakeHandY;

let jakeHandRightY;

let jakeHandW;

​

​

let jakeHeadX;

let jakeHeadY;

let jakeHeadWidth;

let jakeHeadHeight;

let jakeHeadColor;

​

let jakeEyeY;

let jakeLeftEyeX;

let jakeRightEyeX;

let jakeLeftPupilX;

let jakeRightPupilX;

​

let jakeMouthX;

let jakeMouthY;

let jakeMouthPI;

let mouthNoseColor;

​

let jakeHatp1X;

let jakeHatp1Y;

let jakeHatp2X;

let jakeHatp2Y;

let jakeHatp6X;

let jakeHatp6Y;

let jakeHatp7X;

let jakeHatp7Y;

let jakeHatColor;

​

let mousePressedOnce;

​

let countDown;

​

​

function setup() {

  createCanvas(750, 920);

  //createCanvas(windowWidth, windowHeight);

  //body

  bodyX = width / 8;

  bodyY = 2 * height / 3;

  bodyW = width / 6;

  bodyH = height / 3;

​

  //face

  faceX = bodyX + bodyW / 2;

  faceY = bodyY * 0.85;

  faceDia = bodyW * 0.8;

​

  //eye

  eyexdis = faceX / 6;

  eyeydis = faceY;

  eyedia = faceDia / 10;

​

  //scoresign

  scoresignX = bodyX + bodyW / 2;

  scoresignY = bodyY + bodyH / 2;

  scoresignD = bodyW / 2;

​

  //cat

  catheadx = width / 2;

  catheady = scoresignY;

  catheadd = 3 * scoresignD / 4;

  catheadsp = 3;

  catbodycenterx = width / 2;

  catbodycentery = catheady;

  catbodywidth = catheadd;

  catbodyheight = catheady;

  catmovebodyheight = catbodyheight / 2;

​

​

  // jakes added variables for wei staff intialization

​

  staffX1 = width / 10 * 0.5; // btm right

  staffY1 = height;

  staffX2 = staffX1; // top right

  staffY2 = height / 10 * 6.5;

  staffX3 = staffX1 - 20; //top left

  staffY3 = height / 10 * 6.5;

  staffX4 = staffX1 - 20; //btm left

  staffY4 = staffY1;

  staffjewelX = staffX3 + 10

  staffjewelY = staffY3 + 5;

  staffjewelW = (staffX1 - staffX3) + 20;

  staffjewelH = height / 10 * 1;

  staffJewelAlpha = 255;

  staffJewelGlow = 1;

  stafftrangleX1 = staffX3 - 19;

  stafftrangleY1 = staffY3;

  stafftrangleX2 = stafftrangleX1 + 28.5;

  stafftrangleY2 = stafftrangleY1 + 80;

  stafftrangleX3 = stafftrangleX1 + 60

  stafftrangleY3 = stafftrangleY1;

​

​

  alphaMax = 255;

  alphaMin = 0;

  strokeOne = 1;

​

  //body

  jakeBodyX = 7 * (width / 8.25);

  jakeBodyY = 6 * height / 8;

  jakeBodyW = 100;

  jakeBodyH = height / 4;

​

  jakeBodyColor = "blue";

  jakePantsH = jakeBodyH;

  jakePantsY = jakeBodyY;

  jakePantsAlpha = alphaMax;

  jakeBodyShirtColor = "orange";

​

  jakeNinjaLegColor = alphaMin;

  jakePantsLegStroke = strokeOne;

​

​

  //feet  

  jakeLeftFootX = jakeBodyX + (jakeBodyW * 0.15);

  jakeRightFootX = jakeBodyX - (jakeBodyW * 0.15);

  jakeFootY = jakeBodyY + (jakeBodyH * 0.47);

  jakeFootW = 40;

​

  //hand  

  jakeHandRightX = jakeBodyX + (jakeBodyW * 0.5);

  jakeHandLeftX = jakeBodyX - (jakeBodyW * 0.5);

  jakeHandY = jakeBodyY - (jakeBodyH * 0.07);

  jakeHandRightY = jakeHandY;

  jakeHandW = 20;

​

  //head 

  jakeHeadX = jakeBodyX;

  jakeHeadY = jakeBodyY - (jakeBodyH * 0.5);

  jakeHeadWidth = 99;

  jakeHeadHeight = 95;

  jakeHeadColor = 255;

​

  //eyes

  jakeEyeY = jakeBodyY - (jakeBodyH * 0.54);

  jakeLeftEyeX = jakeBodyX + (jakeBodyW * 0.22);

  jakeRightEyeX = jakeBodyX - (jakeBodyW * 0.22);

  jakeLeftPupilX = jakeLeftEyeX;

  jakeRightPupilX = jakeRightEyeX;

​

  //mouth & nose

  jakeMouthPi = PI;

  jakeMouthX = jakeBodyX;

  jakeMouthY = jakeBodyY - (jakeBodyH * 0.4);

  jakeNoseX = jakeBodyX;

  jakeNoseY = jakeBodyY - (jakeBodyH * 0.48);

  mouthNoseColor = 255;

​

  //jakeHat

  jakeHatp1X = jakeHeadX - (jakeHeadWidth / 1.98);

  jakeHatp1Y = jakeHeadY - (jakeHeadHeight / 10);

  jakeHatp2X = jakeHatp1X;

  jakeHatp2Y = jakeHeadY - (jakeHeadHeight / 3.25);

  jakeHatp6X = jakeHeadX + (jakeHeadWidth / 2);

  jakeHatp6Y = jakeHeadY - (jakeHeadHeight / 8);

  jakeHatp7X = jakeHatp6X;

  jakeHatp7Y = jakeHeadY - (jakeHeadHeight / 10);

  jakeHatColor = "blue";

​

​

  jakeSkateboardX = jakeBodyX - (jakeBodyX / 2);

  jakeSkateboardY = jakeBodyY;

  jakeSkateboardW = jakeBodyW / 10 * 2;

  jakeSkateboardH = jakeBodyH / 2;

​

  skateboardAlpha = alphaMax;

  skateboardNinjaAlpha = alphaMin;

​

  skateboardStroke = strokeOne;

  skateboardNinjaeBoardStroke = alphaMin;

   //wei part: change the skateboard 2

  skate2x=jakeBodyX + (jakeBodyW / 10 * 6.5);

  skate2y=jakeBodyY - (jakeBodyH / 10 * 6.85);

  wheel2x=jakeBodyX + (jakeBodyW / 10 * 8.1);

  //wei part: set up attact ball

  attackballx=0;

  attackbally=jakeHeadY+jakeHeadHeight/2;

  attackballd=20;

  ballspeed=4;

​

  mousePressedOnce = false;

​

  clickToBattleText = 'Click anywhere to enter battle mode';

  countDown = 80;

​

}

​

function draw() {

  background(222);

  //draw white sky

  fill(255);

  rect(0,0,width,height - (height / 4 * 0.90));

  //draw red sun

  fill(255,0,0);

  ellipse(width - (width/4 *0.15), height - (height / 4 * 4), 400, 400);

  //horizon line

  line(width - width, height - (height / 4 * 0.90), width, height - (height / 4 * 0.90));

  push();

  noFill();

  noStroke();

  //charactor's body

  fill("palevioletred");

  rect(bodyX, bodyY, bodyW, bodyH, 60);

  rect(bodyX, bodyY + bodyY / 5, bodyW, bodyH);

​

  //charactor's hair

  fill(10, 10, 10);

  arc(faceX, faceY + faceY / 10, faceDia + faceDia / 2, 2 * faceDia + faceDia / 2, PI - PI / 15, PI / 15, CHORD);

​

  //charactor's face

  fill("mistyrose");

  circle(faceX, faceY, faceDia);

  ellipse(faceX, faceY + faceDia / 2, faceDia / 5, faceDia / 3);

​

  //charactor's forehead hair

  fill(10, 10, 10);

  arc(faceX, faceY - faceY / 10, faceDia + faceDia / 5, faceDia, PI - PI / 12, QUARTER_PI - PI / 6, CHORD);

​

  //charactor's eyes  

  circle(faceX - eyexdis, eyeydis, eyedia);

  circle(faceX + eyexdis, eyeydis, eyedia);

​

  //charactor's nose

  fill("indianred");

  triangle(faceX, faceY, faceX - eyexdis / 6, faceY + faceDia / 4, faceX + eyexdis / 6, faceY + faceDia / 4)

​

  //charactor's scoresign

  fill("white");

  circle(scoresignX, scoresignY, scoresignD);

  fill("red");

  circle(scoresignX, scoresignY, 2 * scoresignD / 3);

  fill("white");

  circle(scoresignX, scoresignY, 2 * scoresignD / 5);

​

  //cat head

  fill("sandybrown");

  circle(catheadx, catheady, catheadd);

  catheady = catheady + catheadsp;

​

  //cat ears

  triangle(catheadx - catheadd / 2, catheady - catheadd, catheadx - catheadd / 2, catheady, catheadx, catheady);

​

  triangle(catheadx + catheadd / 2, catheady - catheadd, catheadx + catheadd / 2, catheady, catheadx, catheady);

​

​

  //cat body move part

  rect(catbodycenterx - catbodywidth / 2, catbodycentery, catbodywidth, catmovebodyheight);

  catbodycentery = catbodycentery + catheadsp;

​

  if (catbodycentery < height / 3 || catbodycentery > 17 * height / 20) {

    catheadsp = catheadsp * -1;

  }

​

  //cat eyes

  fill(0);

  circle(catheadx - catheadd / 4, catheady, catheadd / 6);

  circle(catheadx + catheadd / 4, catheady, catheadd / 6);

​

  //if mouse touches cat, cat will elarge eyes and mouth

  if (mouseX > catbodycenterx - catbodywidth / 2 && mouseX < catbodywidth + catbodycenterx - catbodywidth / 2 && mouseY > catbodycentery && mouseY < catmovebodyheight + catbodycentery) {

​

    circle(catheadx - catheadd / 4, catheady, catheadd / 3);

    circle(catheadx + catheadd / 4, catheady, catheadd / 3);

​

    fill(255, 0, 0);

    rect(catheadx - catheadd / 4, catheady + catheadd / 3, catheadd / 2, catheadd / 3);

​

  }

​

  //jake: use anything you like to reach the scoresign on body

  // I added a staff as a weapon for you

  //draw staff as quad so we can extend it in battlemode

  fill(0);

  quad(staffX1, staffY1, staffX2, staffY2, staffX3, staffY3, staffX4, staffY4);

​

  // draw staff jewel holder

  fill("red");

  triangle(stafftrangleX1, stafftrangleY1, stafftrangleX2, stafftrangleY2, stafftrangleX3, stafftrangleY3);

​

  // draw background ellipse for jewel shimmer

  fill(255);

  ellipse(staffjewelX, staffjewelY, staffjewelW - 10, staffjewelH - 10);

​

  // draw jewel with alpha for shimmer

  fill(0, 0, 255, staffJewelAlpha);

  ellipse(staffjewelX, staffjewelY, staffjewelW, staffjewelH);

  pop();

​

  // increment staffJewelGlow to check for modulus remainder

  staffJewelGlow = staffJewelGlow + 1;

​

​

  if (battleMode) {

    if (staffJewelGlow % 5 === 0) {

      staffJewelAlpha = 100;

      // ninjaJake();

    } else {

      staffJewelAlpha = 255;

      //resetJake();

    }

​

    staffY2 = height / 10 * 3;

    staffY3 = height / 10 * 3;

    staffjewelY = staffY3;

    stafftrangleY1 = staffjewelY;

    stafftrangleY2 = stafftrangleY1 + 80;

    stafftrangleY3 = stafftrangleY1;

​

​

  } else {

    resetJake();

    //reset staff

    staffY2 = height / 10 * 6.5;

    staffY3 = height / 10 * 6.5;

    staffjewelY = staffY3 + 5;

    staffJewelAlpha = 255;

    stafftrangleY1 = staffY3;

    stafftrangleY2 = stafftrangleY1 + 80;

    stafftrangleY3 = stafftrangleY1;

​

  }

​

​

​

  //Jake

​

  //hair

  fill("#392e28");

  arc(jakeHeadX - 2, jakeHeadY + 26, jakeHeadWidth + 5, jakeHeadHeight * 1.75, PI - PI / 15, PI / 15);

​

  fill("blue");

  fill(jakeBodyColor);

​

  //jake body

  //jake body shirt

  push();

  translate(width / 2, height / 2);

  scale(-1) // used scale to flip the arc

  fill(jakeBodyShirtColor);

  arc(((width / 5.75) * 2) * -1, ((height / 8) * 2) * -1, jakeBodyW, jakeBodyH, 0, PI, CHORD);

  pop();

​

​

  //ninja leg right

  push();

  noStroke();

  fill(jakeHeadColor, jakeNinjaLegColor);

  translate(width / 2, height / 2);

  rotate(QUARTER_PI);

  arc(width / 8 * 3.65, height / 6 * 0.11, 60, 240, 0, QUARTER_PI - PI, OPEN);

​

  pop();

​

​

​

​

​

  //jake body pants

  fill(0, 0, 255, jakePantsAlpha);

  arc(jakeBodyX, jakePantsY, jakeBodyW, jakePantsH, 0, PI, CHORD);

  stroke(0);

​

​

  //ninja leg left

  push();

  noStroke();

  fill(jakeHeadColor, jakeNinjaLegColor);

  translate(width / 2, height / 2);

  rotate(HALF_PI + QUARTER_PI);

  scale(-1);

  arc(width / 8 * 0.16, height / 10 * 4.1, 60, 220, 0, QUARTER_PI - PI, OPEN);

​

  pop();

​

​

  //jake body pants leg line

  push();

  strokeWeight(jakePantsLegStroke);

  line(jakeBodyX, jakeBodyY, jakeBodyX, jakeBodyY + jakeBodyH / 2);

  pop();

​

​

​

​

​

  //jake feet

  fill(0);

  ellipse(jakeLeftFootX, jakeFootY, jakeFootW, 15);

  ellipse(jakeRightFootX, jakeFootY, jakeFootW, 15);

  fill(255);

​

  //jake head

  fill(jakeHeadColor);

  ellipse(jakeHeadX, jakeHeadY, 99, 95);

  noStroke();

  fill(255, alphaMax);

  ellipse(jakeHeadX, jakeHeadY - (jakeHeadHeight / 10 * 1), 99, 35);

  stroke(0);

  fill("white");

  ellipse(jakeLeftEyeX, jakeEyeY, 30, 10);

  ellipse(jakeRightEyeX, jakeEyeY, 30, 10);

  fill(0);

  ellipse(jakeLeftPupilX, jakeEyeY, 10, 10);

  ellipse(jakeRightPupilX, jakeEyeY, 10, 10);

​

  //fill("white");

  fill(mouthNoseColor);

  arc(jakeMouthX, jakeMouthY, 30, 20, 0, jakeMouthPi, CHORD); //mouth

  arc(jakeNoseX, jakeNoseY, 10, 5, 0, PI, OPEN); //nose

​

  // jake hands

  fill("white");

  ellipse(jakeHandRightX, jakeHandRightY, jakeHandW, 25)

  ellipse(jakeHandLeftX, jakeHandY, jakeHandW, 25)

​

  //jake hat

  fill(jakeHatColor);

  beginShape();

  vertex(jakeHatp1X, jakeHatp1Y);

  vertex(jakeHatp2X, jakeHatp2Y);

  //from left to right

  bezierVertex(jakeHatp2X + 10, jakeHatp2Y - 40, jakeHatp2X + 40, jakeHatp2Y - 65, jakeHatp2X + 80, jakeHatp2Y - 20);

​

​

​

  vertex(jakeHatp6X, jakeHatp6Y);

  vertex(jakeHatp7X, jakeHatp7Y);

  //bezier coords - from right to left

  bezierVertex(jakeHatp7X - 10, jakeHatp7Y - 10, jakeHatp7X - 20, jakeHatp7Y - 20, jakeHatp7X - 60, jakeHatp7Y - 10);

  endShape();

​

  beginShape();

  vertex(55, 80);

  endShape();

​

​

​

​

​

  //skateboard

​

  push();

  strokeWeight(skateboardStroke);

  fill(0, skateboardAlpha);

  rect(jakeBodyX - (jakeBodyW / 10 * 5.5), jakeBodyY + (jakeBodyH / 10 * 4.85), 110, 7, 20);

  fill(255, skateboardAlpha);

  //skateboard wheel 1

  ellipse(jakeBodyX - (jakeBodyW / 10 * 3.1), jakeBodyY + (jakeBodyH / 10 * 5.40), 15, 15);

  //skateboard wheel 2

  ellipse(jakeBodyX - (jakeBodyW / 10 * -3.5), jakeBodyY + (jakeBodyH / 10 * 5.40), 15, 15);

  pop();

​

  //skateboard 2 

​

  push();

​

  push();

  strokeWeight(skateboardNinjaeBoardStroke);

  fill(0, skateboardNinjaAlpha);

  rect(skate2x, skate2y, 7, 110, 20);

  fill(255, skateboardNinjaAlpha);

  if(battleMode){

    countDown--;

    if (countDown < 0){

    console.log(" ninja go");

     skate2x=skate2x-jakesp;

    }

  }

  //console.log(countDown);

  //skateboard wheel 1

  ellipse(wheel2x, jakeBodyY - (jakeBodyH / 10 * 5.95), 15, 15);

  //skateboard wheel 2

  ellipse(wheel2x, jakeBodyY - (jakeBodyH / 10 * 2.90), 15, 15);

  wheel2x=skate2x+10;

​

​

  //wei part:add moving skateboard as protection  

//  if(skate2x<=jakeHandLeftX||skate2x>=jakeHandRightX){

 if(skate2x<=width/2||skate2x>=jakeHandRightX){

    jakesp=jakesp*-1;

     }  

  pop();

  //battle mode text

  push();

  fill(0);

  textSize(18);

  textAlign(CENTER);

  text(clickToBattleText, width / 2, 20);

  pop();

​

​

}

​

​

function mousePressed() {

  //initiate battlemode

​

  battleMode = !battleMode;

  ninjaJake();

​

}

​

function ninjaJake() {

​

  jakeMouthPi = HALF_PI;

  jakeHeadColor = 0;

  jakeBodyShirtColor = 0;

  mouthNoseColor = jakeHeadColor;

  jakeLeftPupilX = jakeLeftEyeX - 10;

  jakeRightPupilX = jakeRightEyeX - 10;

  jakeNinjaLegColor = alphaMax;

  skateboardAlpha = alphaMin;

  skateboardNinjaAlpha = alphaMax;

  jakeLeftFootX = jakeLeftFootX - (jakeFootW * 3.25);

  jakeRightFootX = jakeRightFootX + (jakeFootW * 2.3);

  jakeHandRightX = jakeHandRightX + (jakeHandW * 1);

  jakeHandLeftX = jakeHandLeftX - (jakeHandW * 4.115);

  jakeHandRightY = jakeHandRightY - (jakeHandW * 1.9);

  skateboardStroke = alphaMin;

  skateboardNinjaeBoardStroke = strokeOne;

  jakePantsLegStroke = alphaMin;

  jakePantsH = jakePantsH - (jakePantsH / 3 * 2);

  jakePantsY = jakePantsY - (jakePantsY / 120 * 2);

  jakeHatColor = 0;

  mousePressedOnce = true;

  clickToBattleText = 'Click anywhere to exit battle mode';

​

​

}

​

​

​

function resetJake() {

  fill(255);

  jakeHeadColor = 255;

  jakeBodyShirtColor = "orange";

  mouthNoseColor = jakeHeadColor;

  jakeLeftPupilX = jakeLeftEyeX;

  jakeRightPupilX = jakeRightEyeX;

  jakeMouthPi = PI;

  jakeShieldColorA = alphaMin;

  jakeShieldStrokeA = alphaMin;

  jakeNinjaLegColor = alphaMin;

  jakeLeftFootX = jakeBodyX + (jakeBodyW * 0.15);

  jakeRightFootX = jakeBodyX - (jakeBodyW * 0.15);

  jakeHandRightX = jakeBodyX + (jakeBodyW * 0.5);

  jakeHandLeftX = jakeBodyX - (jakeBodyW * 0.5);

  skateboardAlpha = alphaMax;

  skateboardNinjaAlpha = alphaMin;

  jakeHandRightY = jakeHandY;

  skateboardStroke = strokeOne;

  skateboardNinjaeBoardStroke = alphaMin;

  jakePantsLegStroke = strokeOne;

  jakePantsY = jakeBodyY;

  jakePantsH = jakeBodyH;

  jakePantsAlpha = alphaMax;

  jakeHatColor = "blue";

  mousePressedOnce = false;

  clickToBattleText = 'Click anywhere to enter battle mode';

  countDown = 80;

  skate2x=jakeBodyX + (jakeBodyW / 10 * 6.5);

  skate2y=jakeBodyY - (jakeBodyH / 10 * 6.85);

  wheel2x=jakeBodyX + (jakeBodyW / 10 * 8.1);

}

​

​

​

​

​

​