83 lines
1.8 KiB
JavaScript
Executable File
83 lines
1.8 KiB
JavaScript
Executable File
let slider, clearButton;
|
|
|
|
function setup(){
|
|
createCanvas(windowWidth-20,windowHeight-20);
|
|
background(200);
|
|
|
|
slider = createSlider(1,50,1);
|
|
slider.position(10,15);
|
|
slider.style('width', '80px');
|
|
|
|
clearButton = createButton('Clear');
|
|
clearButton.position(width - 50, 10);
|
|
clearButton.mousePressed(clearBoard)
|
|
|
|
|
|
}
|
|
|
|
function draw(){
|
|
let val = slider.value();
|
|
|
|
fill(240);
|
|
strokeWeight(0);
|
|
rect(0,0,width,60);
|
|
|
|
fill(0);
|
|
text(val, 100, 22.5);
|
|
|
|
//colors
|
|
fill(255,0,0);
|
|
rect(120,5,50,50);
|
|
|
|
fill(0,255,0);
|
|
rect(170,5,50,50);
|
|
|
|
fill(0,0,255);
|
|
rect(220,5,50,50);
|
|
|
|
fill(255,255,0);
|
|
rect(270,5,50,50);
|
|
|
|
fill(0);
|
|
rect(320,5,50,50);
|
|
|
|
fill(255);
|
|
rect(370,5,50,50);
|
|
|
|
if (mouseIsPressed === true) {
|
|
if(mouseY <= 50){
|
|
//not on whiteboard
|
|
|
|
switch(true){
|
|
case (mouseX > 120 && mouseX < 170):
|
|
stroke(255,0,0)
|
|
break;
|
|
case (mouseX > 170 && mouseX < 220):
|
|
stroke(0,255,0)
|
|
break;
|
|
case (mouseX > 220 && mouseX < 270):
|
|
stroke(0,0,255)
|
|
break;
|
|
case (mouseX > 270 && mouseX < 320):
|
|
stroke(255,255,0)
|
|
break;
|
|
case (mouseX > 320 && mouseX < 370):
|
|
stroke(0,0,0)
|
|
break;
|
|
case (mouseX > 370 && mouseX < 420):
|
|
stroke(200)
|
|
break;
|
|
}
|
|
|
|
} else {
|
|
//onwhiteboard
|
|
strokeWeight(val);
|
|
line(mouseX, mouseY, pmouseX, pmouseY);
|
|
}
|
|
}
|
|
}
|
|
|
|
function clearBoard(){
|
|
background(200);
|
|
}
|