diff --git a/1.Basics.md b/1.Basics.md index f2c274a..484bf8c 100644 --- a/1.Basics.md +++ b/1.Basics.md @@ -115,4 +115,43 @@ function mouseMoved() { print("Moved: " + mouseX + " - " + mouseY) ; // see the console below ↓ } -// Reference: https://p5js.org/reference/``` +// Reference: https://p5js.org/reference/ +``` + +### Sketch: Distance and Text + +```javascript +// Distance and Text! + +var previous_mouseX_pressed = 0; +var previous_mouseY_pressed = 0; +var distance_previous_current = 0; + +function setup() { + createCanvas(400, 400); +} + +function draw() { + background(220); + + distance_previous_current = dist(previous_mouseX_pressed, previous_mouseY_pressed, mouseX, mouseY); // calculate distance + + circle(previous_mouseX_pressed, previous_mouseY_pressed, 5); // draw circle at the previous location + line(previous_mouseX_pressed, previous_mouseY_pressed, mouseX, mouseY); // draw line between previous and current + circle(mouseX, mouseY, 5); // draw circle at the current location + + text(distance_previous_current, mouseX, mouseY); // write distance as text at the current location + + if(mouseIsPressed) { + let current_mouseX_pressed = mouseX; + let current_mouseY_pressed = mouseY; + + print("Pressed: " + current_mouseX_pressed + " - " + current_mouseY_pressed) ; + + previous_mouseX_pressed = current_mouseX_pressed; + previous_mouseY_pressed = current_mouseY_pressed; + } +} + +// Reference: https://p5js.org/reference/ +```