kadenze_p5js_animation

function setup() {

  createCanvas(windowWidth, windowHeight);

  background(100);

  strokeWeight(3);

  noFill();

  //stroke(255,0,0,)

​

}

​

function draw() {

  // draw a continous line

  //line(mouseX, mouseY, pmouseX, pmouseY); // pmouseX = previous mouse pos

  // conditional draw red on screen left & black on screen right

  // map() function to vary color remap canvas size values 0 - 1920 to color 0 - 255 

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

  // map circle size to mouseX pos  

  var mSize = map(mouseX,0,width,50,100);

  if(mouseX > width / 2)

  {

    stroke(255,0,0);

  }

  else

  {

    stroke(0);

  }

  if(mouseIsPressed == true)

  {

    stroke(grey);

    ellipse(mouseX,mouseY,mSize,mSize);

  }

}