# Ex 2.7 tossing a ball - The Nature of code

**URL:** <https://discourse.processing.org/t/ex-2-7-tossing-a-ball-the-nature-of-code/42551>\
**Category:** Beginners\
**Created:** [August 4, 2023, 2:55pm UTC](https://discourse.processing.org/t/ex-2-7-tossing-a-ball-the-nature-of-code/42551 "2023-08-04T14:55:52Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Delain](https://avatars.discourse-cdn.com/v4/letter/d/8edcca/32.png) [@Delain](https://discourse.processing.org/u/Delain)\
**Post date:** [August 4, 2023, 2:55pm UTC](https://discourse.processing.org/t/ex-2-7-tossing-a-ball-the-nature-of-code/42551/1 "2023-08-04T14:55:52Z")

</div>

I am following along with The nature of Code of Daniel Shiffman. And I am stuck on exercises 2.7 of tossing a circle with mouse interaction.

I think in circles and I hope some body can shine a light on it. I looked in the nature of code github and I see the examples, but not the solution to the exercises. Maybe I am missing something?

Link to what I have so far  
[https://editor.p5js.org/Delain/sketches/oxzGxsdIO](https://editor.p5js.org/Delain/sketches/oxzGxsdIO)

What I want it to do:

1. ball moves when the mouse moves
2. when I release the mouse the ball it gets speed and direction, from the point I release the mouse.

It does what I want for point 1, but not for point 2. I am using the mouseIsPressed Boolean which means that I have to keep pressing the mouse to keep the animation going and means it will keeps adding acceleration even when the ball is falling. I can not get it work in the mousePressed and  
mouseReleased function. Can somebody put me on the right track.

let mover;

function setup() {  
createCanvas(640, 240);

mover = new Mover(mouseX, mouseY, 5);  
}

function draw() {  
background(255);

if (mouseIsPressed === false) {  
mover.showMouse();  
}

let gravity = createVector(0, 0.1);  
let gravityA = p5.Vector.mult(gravity, mover.mass);  
mover.applyForce(gravityA);

if (mouseIsPressed) {  
mover.clicked(mouseX, mouseY);  
mover.show();  
mover.update();  
mover.frictionF(0.005);  
mover.bounceEdges();  
}  
}

class Mover {  
constructor(x, y, mass) {  
this.pos = createVector(x, y);  
this.vel = createVector(0, 0);  
this.acc = createVector(0, 0);  
this.mass = mass;  
this.r = this.mass \* 8; //diameter is this.mass \* 16, dus r is  
}

clicked(px, py) {  
// let d = dist(px, py, this.pos.x, this.pos.y);  
// if (d \< this.r) {  
let throwX = (mouseX - pmouseX) / 10;  
let throwY = (mouseY - pmouseY) / 10;  
let throwF = createVector(throwX, throwY);  
this.applyForce(throwF);  
console.log(“clicked”);  
// }  
}

applyForce(force) {  
let f = p5.Vector.div(force, this.mass);  
this.acc.add(f);  
}

contactEdge() {  
return this.pos.y \> height - this.r - 1;  
}

frictionF(c) {  
if (this.contactEdge()) {  
let normal1 = this.mass;  
let frictionMag = c \* normal1;

```
  let friction = this.vel.copy();
  friction.normalize();
  friction.mult(-1);

  friction.mult(frictionMag);

  this.applyForce(friction);
}

```

}

bounceEdges() {  
let bounce = 0.9;

```
if (this.pos.x >= width - this.r) {
  this.pos.x = width - this.r;
  this.vel.x *= -bounce;
} else if (this.pos.x <= this.r) {
  this.pos.x = this.r;
  this.vel.x *= -bounce;
}

if (this.pos.y > height - this.r - 1) {
  this.pos.y = height - this.r;
  this.vel.y *= -bounce;
} else if (this.pos.y <= this.r - 1) {
  this.pos.y = this.r;
  this.vel.y *= -bounce;
}

```

}

update() {  
this.vel.add(this.acc);  
this.pos.add(this.vel);  
this.acc.mult(0);  
}

show() {  
stroke(0);  
fill(175);  
circle(this.pos.x, this.pos.y, this.r \* 2);  
}

showMouse() {  
stroke(0);  
fill(175);  
circle(mouseX, mouseY, this.r \* 2);  
}  
}

---

<div class="post-metadata">

**Author:** ![Delain](https://avatars.discourse-cdn.com/v4/letter/d/8edcca/32.png) [@Delain](https://discourse.processing.org/u/Delain)\
**Post date:** [August 5, 2023, 10:35am UTC](https://discourse.processing.org/t/ex-2-7-tossing-a-ball-the-nature-of-code/42551/2 "2023-08-05T10:35:10Z")

</div>

Nevermind. I was overthinking it. I simplified what I wanted the code to do. Which is just to move over a stationary ball to throw it.

You can find my solution here:  
[https://editor.p5js.org/Delain/sketches/-7QaXxT3o](https://editor.p5js.org/Delain/sketches/-7QaXxT3o)