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

[enhancement] CSS Cursor Pointer Support #14

Open
dipamsen opened this issue Aug 2, 2020 · 3 comments · May be fixed by #31
Open

[enhancement] CSS Cursor Pointer Support #14

dipamsen opened this issue Aug 2, 2020 · 3 comments · May be fixed by #31

Comments

@dipamsen
Copy link
Contributor

dipamsen commented Aug 2, 2020

cursor should change to pointer during hover

(can be also a pointerOnHover property)

Demonstration:
https://editor.p5js.org/dipam2006/sketches/X5H7oqSjB

P.S. not related to this, but #9 can be a function :-)

@Samathingamajig
Copy link
Contributor

You can make a pull request for this.
Here's some things I would do for this:
this.pointerOnHover = "default"; have the default cursor be "default" since that's what it already is

Instead of:

if (mouseX >= this.x && mouseY >= this.y
			&& mouseX < this.x + this.width && mouseY < this.y + this.height) {
			cl_lastHovered = this;
			if (mouseIsPressed && !cl_mouseWasPressed)
				cl_lastClicked = this;
		}

Have this:

select("#defaultCanvas0").style("cursor", "default"); // To make a default cursor the normal
if (mouseX >= this.x && mouseY >= this.y
			&& mouseX < this.x + this.width && mouseY < this.y + this.height) {
                        select("#defaultCanvas0").style("cursor", this.pointerOnHover);
			cl_lastHovered = this;
			if (mouseIsPressed && !cl_mouseWasPressed)
				cl_lastClicked = this;
		}

Important!!

You'll need to fix the bug that I can already see now of having multiple clickables and the first one is hovered and makes a cursor change, but the second clickable is not hovered so it sets it to the default cursor

@Lartu
Copy link
Owner

Lartu commented Aug 13, 2020

I will add this to the library in the next update! Thank you very much!

@dipamsen
Copy link
Contributor Author

I did something similar to @Samathingamajig and came up with this. The problem is that the the cursor will have to be set back to default at the start of every draw loop, but p5.Clickable doesn't have access to start of draw loop

Demo

ArztKlein added a commit to ArztKlein/p5.clickable that referenced this issue Jun 27, 2022
@ArztKlein ArztKlein linked a pull request Jun 27, 2022 that will close this issue
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants