system variables example

2/28/2024

*/

​

function setup() {

  createCanvas(500, 500);

}

  function draw (){

    background(255,255,255)  //pure green 128,0,128

  var x = mouseX;

    var y = mouseY; //255

    var s = 240; //head

    // head

    var r = map(mouseX, 0, width, 0, 255);   

      noStroke();

    fill(r, 128, 0, 128); //purple color

  ellipse(260, 255, 130, 240);   

    // Mouth found through reference page

     var s = map(mouseY,0,height,50,100,true);

    var x = map(mouseX,0,width,200,300) //(x + 50, 220, 38);

    //var r = map(mouseX, 0, width, 0, PI + QUARTER_PI, CHORD) //(255);

    noStroke();

  fill(255, 0, 255); // Fuchsia smirk

   arc(x,280, 40,15,0,PI + QUARTER_PI, CHORD,s);

    // wheels 

     //var s = map(mouseY,0,height,50,100,true);

    //var x = map(mouseX,0,width,200,300) //(x + 50, 220, 38);

  //fill(0); // Black wheels

  //ellipse(275, 400, 30,s); // Front wheel //275, 400, 30, 30

  //ellipse(330, 400, 30,s); // Back wheel   //330, 400, 30, 30

   //Eyes

  var x = map(mouseX,0,width,200,300, false) //(x + 50, 220, 38);

    fill(0);

  circle(x + 50, height/2,5);   //s);

  circle(x - 40, height/2,5);  //s);

   // Pupils

    var s = map(mouseY,0,height,50,100,true);

    var x = map(mouseX,0,width,200,300) //(x + 50, 220, 38);

  //noStroke();

  fill(r,128,0,128);  //128,0,128

  ellipse(x + 50, height/2,s);

  ellipse(x - 40, height/2,s);

     //baseball cap function was found through Ai

 //var r = map(mouseX, 200, width, 80, 30, -PI / 6) //(255);

  drawBaseballCap(260,200,150, 80, 30, -PI / 6); // Adjust parameters as needed

}

// Define function to draw a baseball cap

function drawBaseballCap(

  centerX,

  centerY,

  capWidth,

  capHeight,

  brimLength,

  brimAngle

) {

  // Set fill color for the cap (adjust as needed)

     var r = map(mouseX, 0, width, 0, 255);    //s);  

  fill(255, 0, 255); // fuschia

      //var r = map(mouseX, 0, width, 0, 255);    //s);  

      //noStroke();

    fill(r, 128, 0, 128); //purple color

  //ellipse(260, 255, 130, 240);   //(x/2, y/2,130, s)    //(width/2,height/2, width); 

​

  // Calculate brim endpoint coordinates based on angle and length

  const brimTipX = centerX + brimLength * cos(brimAngle);

  const brimTipY = centerY + brimLength * sin(brimAngle);

​

  // Draw the main part of the cap (rounded top)

  ellipse(centerX, centerY - capHeight / 2, capWidth, capHeight);

​

  // Draw the brim using two triangles for a smooth curve

  beginShape();

  // Connect cap edge to brim tip

  vertex(centerX - capWidth / 2, centerY);

  vertex(brimTipX, brimTipY);

  // Connect brim tip to other side of cap edge

  vertex(centerX + capWidth / 2, centerY);

  endShape(CLOSE);

​

  // Draw the button on the front (optional)

  fill(153, 0, 153);

  ellipse(centerX, centerY - (capHeight * 2) / 3, 10, 10);

    // bike frame

  fill(255, 165, 0); // Orange frame

  rect(260, 350, 80, 50, 10); // Main body

// wheels 

     var s = map(mouseY,0,height,50,100,true);

    var x = map(mouseX,0,width,200,300) //(x + 50, 220, 38);

  fill(0); // Black wheels

  ellipse(275, 400, 30,s); // Front wheel //275, 400, 30, 30

  ellipse(330, 400, 30,s); // Back wheel   //330, 400, 30, 30

       // Pupils

    //var s = map(mouseY,0,height,50,100,true);

    //var x = map(mouseX,0,width,200,300) //(x + 50, 220, 38);

  //noStroke();

  //fill(80, 30, 10);

  //ellipse(x + 50, height/2, s);

  //ellipse(x - 40, height/2, s);

   }

  function mousePressed() {

  save('artmovementone.jpg');

  }