Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Changing rectMode #6

Open
zachmensch opened this issue Nov 19, 2019 · 5 comments
Open

Changing rectMode #6

zachmensch opened this issue Nov 19, 2019 · 5 comments
Labels
enhancement New feature or request

Comments

@zachmensch
Copy link

In my code I'm using rectMode(CENTER) to make playing the buttons on the screen a bit easier. This works for displaying the Clickable however the area for the onPress function still remains where it would be if I hadn't changed the rectMode. I'm new to coding so there may be a simple fix to this that I'm missing

@Samathingamajig
Copy link
Contributor

Click detection is done [as of 2020/08/04] on line 127-128

if (mouseX >= this.x && mouseY >= this.y
	&& mouseX < this.x + this.width && mouseY < this.y + this.height) {

This section is checking for if the mouse is below and to the right of the top left corner

if (mouseX >= this.x && mouseY >= this.y

And this section is making sure its above and to the left of the bottom right corner

&& mouseX < this.x + this.width && mouseY < this.y + this.height) {

If you want to, you could submit a pull request to add "this.rectMode" and add an if/else for the click detection.

Example:

// Corner is the default rectMode for p5.js
if (this.rectMode == CORNER) {
  if (mouseX >= this.x && mouseY >= this.y
    && mouseX < this.x + this.width && mouseY < this.y + this.height) {
      // Insert current click things
  }
} else if (this.rectMode == CENTER) {
  if (mouseX >= this.x - this.width/2 && mouseY >= this.y - this.height/2
	&& mouseX < this.x + this.width/2 && mouseY < this.y + this.height/2) {
        // Insert current click things
  }
}

remember to add a this.rectMode with a default value of CORNER without quotes,
and when drawing to have a rectMode(this.rectMode)
(CORNER and CENTER are p5.js global variables)

@Lartu Lartu added the enhancement New feature or request label Aug 13, 2020
@Lartu
Copy link
Owner

Lartu commented Aug 13, 2020

Hi there! I've left this library quite unattended for some time now, sorry. What @Samathingamajig says is right (thank you so much for taking the time to answer!) and I'll try to add this as a feature as soon as possible. Over the next few days I'll set some time aside to improve this library based on what people have been requesting ❤️

@sahej-dev
Copy link

Hi. Is this still an issue? If yes then I would like to work on it and submit a pull request.

@Lartu
Copy link
Owner

Lartu commented Feb 15, 2022

It's still an issue, I haven't had the time to work on this lib for some time now. If you want to do some housekeeping, you are more than welcome!

@sahej-dev
Copy link

sahej-dev commented Apr 26, 2022

Hey sorry about late reply. I did not know GitHub had a notifications panel, and I thought you had never replied. (I am pretty new to using GitHub for collaborating, so far mostly used it to keep a backup of my personal projects only). I will be submitting a pull request shortly.

sahej-dev added a commit to sahej-dev/p5.clickable that referenced this issue Apr 26, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

4 participants