# Maybe one bug in the p5

**URL:** <https://discourse.processing.org/t/maybe-one-bug-in-the-p5/29400>\
**Category:** Beginners\
**Tags:** homework\
**Created:** [April 16, 2021, 6:50am UTC](https://discourse.processing.org/t/maybe-one-bug-in-the-p5/29400 "2021-04-16T06:50:31Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![turtle](https://avatars.discourse-cdn.com/v4/letter/t/ecb155/32.png) [@turtle](https://discourse.processing.org/u/turtle)\
**Post date:** [April 16, 2021, 6:50am UTC](https://discourse.processing.org/t/maybe-one-bug-in-the-p5/29400/1 "2021-04-16T06:50:31Z")

</div>

the code as following

```javascript
let x = 50;
let y = 50;
let diameter = 100;
let bgColor = 200;

function setup() {
  createCanvas(400, 400);
  background(bgColor);
  noStroke();
}

function touchMoved() {
  print(x-diameter/2, x+diameter/2, y-diameter/2, y+diameter/2);
  if ((x-diameter/2 < mouseX < x+diameter/2) && (y-diameter/2 < mouseY < y+diameter/2)) {
    // clear();
    background(bgColor);
    fill("red");
    ellipse(x, y, diameter);
    x = mouseX;
    y = mouseY;
    // return false;
  }
  print(mouseX, mouseY);
}

```

I want to move the ellipse only if when the mouse is in its area, but the result is unexpected, whereever my mouse is, the ellipse will be moved. So what’s wrong with my code of any bug?

---

<div class="post-metadata">

**Author:** ![micuat](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/micuat/32/19407_2.png) [@micuat](https://discourse.processing.org/u/micuat)\
**Post date:** [April 16, 2021, 7:13am UTC](https://discourse.processing.org/t/maybe-one-bug-in-the-p5/29400/2 "2021-04-16T07:13:45Z")

</div>

> [@turtle](#):
>
> `x-diameter/2 < mouseX < x+diameter/2`

Unfortunately you can’t chain like that ☹ it makes sense for people, but computers need different notation:

```javascript
x-diameter/2 < mouseX && mouseX < x+diameter/2

```

Or

```javascript
abs(x - mouseX) < diameter/2

```

---

<div class="post-metadata">

**Author:** ![javagar](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/javagar/32/11434_2.png) [@javagar](https://discourse.processing.org/u/javagar)\
**Post date:** [April 16, 2021, 7:29am UTC](https://discourse.processing.org/t/maybe-one-bug-in-the-p5/29400/3 "2021-04-16T07:29:09Z")

</div>

@turtle, you will need to make sure you are using the Euclidean (Pythagorean) distance formula correctly. Alternatively, you could consider using the p5.js `dist()` function.

See:

- [Wikipedia: Euclidean distance](https://en.wikipedia.org/wiki/Euclidean_distance#:~:text=In%20mathematics%2C%20the%20Euclidean%20distance,being%20called%20the%20Pythagorean%20distance.)
- [p5.js Reference: `dist()`](https://p5js.org/reference/#/p5/dist)

---

<div class="post-metadata">

**Author:** ![turtle](https://avatars.discourse-cdn.com/v4/letter/t/ecb155/32.png) [@turtle](https://discourse.processing.org/u/turtle)\
**Post date:** [April 16, 2021, 9:18am UTC](https://discourse.processing.org/t/maybe-one-bug-in-the-p5/29400/4 "2021-04-16T09:18:12Z")

</div>

Thanks for your reply to a newbie 😀

---

<div class="post-metadata">

**Author:** ![turtle](https://avatars.discourse-cdn.com/v4/letter/t/ecb155/32.png) [@turtle](https://discourse.processing.org/u/turtle)\
**Post date:** [April 16, 2021, 9:20am UTC](https://discourse.processing.org/t/maybe-one-bug-in-the-p5/29400/5 "2021-04-16T09:20:09Z")

</div>

Thanks so much, and I learn a lot.

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [April 16, 2021, 9:20am UTC](https://discourse.processing.org/t/maybe-one-bug-in-the-p5/29400/6 "2021-04-16T09:20:36Z")

</div>

[CrHallberg.com/CollisionDetection/Website/point-circle.html](http://CrHallberg.com/CollisionDetection/Website/point-circle.html)

---

<div class="post-metadata">

**Author:** ![javagar](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/javagar/32/11434_2.png) [@javagar](https://discourse.processing.org/u/javagar)\
**Post date:** [April 16, 2021, 11:46am UTC](https://discourse.processing.org/t/maybe-one-bug-in-the-p5/29400/7 "2021-04-16T11:46:26Z")

</div>

> [@turtle](#):
>
> Thanks so much …

You are welcome. If you use your own custom formula for determining whether or not the mouse coordinates are inside the ellipse, such as a condition that relies upon the `&&` operator, please remember to check the result carefully. In that case, doing something like this might help as a test:

![circle_in_square](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/6/6e57859fa81b7f9862a29f7c2c1b52131c67540c.png)

Make sure that dragging inside the red circle moves the shapes, but that dragging inside the blue area does not. The correct interdependent relationship between the `x` and `y` coordinates is important.

If you post your next revision of the code, we will be happy to check it.

---

<div class="post-metadata">

**Author:** ![turtle](https://avatars.discourse-cdn.com/v4/letter/t/ecb155/32.png) [@turtle](https://discourse.processing.org/u/turtle)\
**Post date:** [April 16, 2021, 12:12pm UTC](https://discourse.processing.org/t/maybe-one-bug-in-the-p5/29400/8 "2021-04-16T12:12:16Z")

</div>

Thanks for your further reply, and maybe this url [http://crhallberg.com/CollisionDetection/Website/point-circle.html](http://crhallberg.com/CollisionDetection/Website/point-circle.html) which recommended by warm-hearted [@GoToLoop](https://discourse.processing.org/u/GoToLoop) is about what you said, and yes I have noticed that my current code is not perfect. In fact, I am go to create one sketch board for my students who are with autism, cerebral palsy, Down syndrome and other disorders. I want to make a perfect one for them, but I am a newbie in programming with a little knowledge about Python and Javascript, so maybe a lot of question will come soon to you guys, thanks very very much 😃!  
I will put my complete project on the forum as soon as it is finished 🤗.

---

<div class="post-metadata">

**Author:** ![javagar](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/javagar/32/11434_2.png) [@javagar](https://discourse.processing.org/u/javagar)\
**Post date:** [April 16, 2021, 12:15pm UTC](https://discourse.processing.org/t/maybe-one-bug-in-the-p5/29400/9 "2021-04-16T12:15:40Z")

</div>

> [@turtle](#):
>
> … recommended by warm-hearted [GoToLoop](https://discourse.processing.org/u/GoToLoop) is about what you said …

Yes, indeed, it is about that topic, which is appropriate for this task. 😄

_EDIT (April 16, 2021) …_

> [@turtle](#):
>
> … a little knowledge about Python and Javascript …

Oh, since the subject of chaining came up [here](https://discourse.processing.org/t/maybe-one-bug-in-the-p5/29400/2), you might be interested in knowing that Python would interpret this as chaining while JavaScript would not:

```auto
x-diameter/2 < mouseX < x+diameter/2

```