DrawingToolfini_Joana Liu

var colorSlider;

var thicknessSlider;

var brightnessSlider;

​

function setup() {

  createCanvas(windowWidth,windowHeight);

  background(255);

  //create slider - goes from 0 to 360, starts at 100

  //360 because that's the maximum hue value

  colorSlider = createSlider(0, 360, 100);

  //position

  colorSlider.position(windowWidth-windowWidth+30, 40);

  //change color mode to Hue Saturation and brightness\

  colorMode(HSB,360,100,100);

​

  rect(0,0,width,80); //

  thicknessSlider = createSlider(1,50,10);

  thicknessSlider.position(windowWidth-windowWidth+220,40); //right is thickness

  stroke(0,0,0);

  fill(0,0,0);

  rect(0,0,width,50);

  brightnessSlider = createSlider(0,100,50);

  brightnessSlider.position(windowWidth-windowWidth+420,40);

  fill(0,0,0);

  rect(15,10,340,30);

  ra = random(-20,20);

}

​

function draw() {

  colorMode(HSB,360,100,100,100);

  var color = ra+colorSlider.value();

  var thick = thicknessSlider.value();

  var brightness = brightnessSlider.value();

  rect(170,12,30,30);

  if(mouseIsPressed){

    strokeWeight(thick);

    stroke(color+ra,100,brightness,10);

    fill(color,120,brightness,10);

    line(mouseX,mouseY,pmouseX,pmouseY);

  }

  if (mouseIsPressed && key == "q") {

      stroke("#white");

      fill("#white");

      ellipse(pmouseX, pmouseY,thick,thick);

  } 

  else if (mouseIsPressed && key != "q"){

    fill(color,100,90,20);

    strokeWeight(mouseX-pmouseX);

    ellipse(mouseX+ra,mouseY+ra/2,thick/3,thick/3);

    line(pmouseX, pmouseY,mouseX,mouseY);

  }

  noStroke();

  fill(0,0,0);

  rect(0,0,windowWidth,70);

  colorMode(RGB);

  fill(0,0,0);

  rect(0,6,windowWidth*2,75);

  fill('white');

  text('Make sure ur in splitscreen mode. Press q, then move mouse to erase. Press any other key to go back to normal.', 20, 25);

​

}

​

​

​

​

​

​

​