Mouse Functions
Click on the box and drag it across the screen.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
let bx;
let by;
let boxSize = 75;
let overBox = false;
let locked = false;
let xOffset = 0.0;
let yOffset = 0.0;
function setup() {
createCanvas(720, 400);
bx = width / 2.0;
by = height / 2.0;
rectMode(RADIUS);
strokeWeight(2);
}
function draw() {
background(237, 34, 93);
// Test if the cursor is over the box
if (
mouseX > bx - boxSize &&
mouseX < bx + boxSize &&
mouseY > by - boxSize &&
mouseY < by + boxSize
) {
overBox = true;
if (!locked) {
stroke(255);
fill(244, 122, 158);
}
} else {
stroke(156, 39, 176);
fill(244, 122, 158);
overBox = false;
}
// Draw the box
rect(bx, by, boxSize, boxSize);
}
function mousePressed() {
if (overBox) {
locked = true;
fill(255, 255, 255);
} else {
locked = false;
}
xOffset = mouseX - bx;
yOffset = mouseY - by;
}
function mouseDragged() {
if (locked) {
bx = mouseX - xOffset;
by = mouseY - yOffset;
}
}
function mouseReleased() {
locked = false;
}
