NatureOfCode2/ang-rot2.1.html at master · brlebtag/NatureOfCode2 · GitHub

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
<html>
    <head>
        <title>Angles and Rotation 2.1 - Grab and Release</title>
        <script src="https://cdn.jsdelivr.net/npm/p5@1.5.0/lib/p5.min.js"></script>
        <script>

            let angle = 0;
            let angleVelocity = 0;
            let angleAcceleration = 0.001;
            let pAngle = 0;

            function setup() {
                createCanvas(windowWidth, windowHeight);
                angleMode(RADIANS);
            }

            function mouseDragged() {
                let v = createVector(pmouseX - width / 2, pmouseY - height / 2);
                pAngle = v.heading();
            }

            function mouseReleased() {
                let v2 = createVector(mouseX - width / 2, mouseY - height / 2);
                angleVelocity = v2.heading() - pAngle;
                console.log(angleVelocity);
            }

            function draw() {

                if (mouseIsPressed) {
                    let v = createVector(mouseX - width / 2, mouseY - height / 2);
                    angle = v.heading();
                }

                background(146, 83, 161);
                noStroke();
                fill(240, 99, 164);
                rectMode(CENTER);
                translate(width / 2, height / 2);
                rotate(angle);
                rect(0, 0, 256, 32);

                angle += angleVelocity;
                angleVelocity += angleAcceleration;
            }
        </script>
    </head>
</html>