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

toggling grabbable #157

Open
mikejthomas opened this issue Sep 6, 2018 · 4 comments
Open

toggling grabbable #157

mikejthomas opened this issue Sep 6, 2018 · 4 comments

Comments

@mikejthomas
Copy link

Hi!,

I am creating a toggle component so that a user can switch entities from being grabbable or not. I have it on hover-start and on keyup for "g"...I basically just use removeAttribute or setAttribute for the DOM and I have a db that keeps track of all of the positions, rotations, etc (including whether its grabbable) and update the db on keyup as well...all of that is working fine, but say i change something from not having a grabbable attribute to having it with the keyup, it does not become grababble until I refresh the page and the object is loaded from the database.

Can such an attribute be changed after it has been rendered? Is there a better way to be doing the DOM manipulation for this than I am doing? Below is a snippet from the component. Thanks and I am a huge fan...keep it up. Note that the grabtext is an a-text that I am overlaying on top of the object while hovered to tell the user whether the object is currently grabbable or not.

if(event.which == 71) { if(el.hasAttribute("grabbable")){ var grabtext = document.querySelector('#grabtext'); grabtext.setAttribute('value', 'not grabbable'); el.removeAttribute('grabbable'); // send grabbable false to db } else { el.setAttribute('grabbable', 'true'); var grabtext = document.querySelector('#grabtext'); grabtext.setAttribute('value', 'grabbable'); } } })

@wmurphyrd
Copy link
Member

Yes you can add and remove grabbable on live entities.

It could be related to this statement which doesn't provide a valid property value for grabbable:

el.setAttribute('grabbable', 'true')

Use an empty string ('') or a literal true (true) to apply components with default settings.

@gabrieljbaker
Copy link

Hi @wmurphyrd , working on the same project as above! I've made the above switch, but still no dice on being able to switch grabbable back on once it's been turned off. I see in inspector the component is added/removed with the toggle, but still no dice.

@wmurphyrd
Copy link
Member

Hey @gabrieljbaker. Of course it wasn't that easy. Can you confirm your collision detection component is tracking the entities with grabbable added dynamically? If you're using attribute selectors and the raycaster or w/e is not auto updating, that would cause the issue.

@dsinni
Copy link

dsinni commented Sep 17, 2019

Hi, @wmurphyrd. Love super-hands! Amazing work.

I have however noticed a difference in behavior between 2.1.0 and 3.0.0, which appears to be a regression and is possibly the cause of the OP's issue.

In 3.0.0, it seems that you can't reattach grabbable (or other reaction components) once it has been removed. This doesn't appear to be true for 2.1.0, which allows me to add and remove repeatedly without fail.

The ideal situation would allow for it to bound to state like bind-toggle__grabbable="grabEnabled", which works in 2.1.0, but not in 3.0.0 after a cycle of adding and removing, as I mentioned.

Any thoughts on how this can be remedied?

Thanks and keep up the great work!

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

No branches or pull requests

4 participants