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

Mouse constraint without renderer #73

Closed
dylancarlone opened this issue Mar 25, 2015 · 8 comments

Comments

@dylancarlone
Copy link

commented Mar 25, 2015

I'm having trouble using the mouse constraint without a renderer. I am updating DOM elements with the positions of bodies in the world. Unless I overlay an element with 0 opacity, clicking and dragging has no effect. Is there a way to get around this? The overlay works but I'm looking for a cleaner way. Do I need to create my own DOM renderer?

@liabru

This comment has been minimized.

Copy link
Owner

commented Mar 26, 2015

Try this:

var mouseConstraint = MouseConstraint.create(engine, {
    mouse: Mouse.create(element)
});

Where element is the container that's bounding your render area.

@dylancarlone

This comment has been minimized.

Copy link
Author

commented Mar 27, 2015

Doesn't seem to be working. I have a div for each point in a softbody that I am updating in the afterUpdate event. They are inside a container div. Passing an null/empty render element to Engine.create() and passing either document.body or the container div to the mouse option in MouseConstraint.create() doesn't have any effect.

@dylancarlone

This comment has been minimized.

Copy link
Author

commented Apr 16, 2015

Referring to #77,

Is that to say that passing a custom Mouse to MouseConstraint.create() isn't the right way to go, and that I need to create a custom renderer?

Thanks!

@liabru

This comment has been minimized.

Copy link
Owner

commented Apr 18, 2015

Can you provide a jsfiddle example so I can see your use case?

@dylancarlone

This comment has been minimized.

Copy link
Author

commented May 7, 2015

Sorry for the delay - https://jsfiddle.net/5nqsL3a7/2/

Still unsure what I'm missing. Thank you so much for your help!

@liabru liabru added the bug label Jun 20, 2016

@liabru

This comment has been minimized.

Copy link
Owner

commented Jun 20, 2016

I think these two lines in Matter.Mouse may have something to do with it. I think a fix is to use element.clientWidth and element.clientHeight.

@liabru liabru self-assigned this Jun 20, 2016

@liabru liabru removed the feature-request label Jun 21, 2016

@liabru liabru removed their assignment Jun 25, 2016

@liabru liabru closed this in 1340159 Jun 25, 2016

@zeezali

This comment has been minimized.

Copy link

commented Jul 29, 2016

@liabru - Just an FYI, I was having the same issue where the MouseConstraint wouldn't work without a renderer. In my case I was creating the Engine and Render (for debugging) separately and then adding the MouseConstraint to the engine.

The MouseConstraint wasn't working properly or firing an events at all. I came across the following in MouseConstraint.js:

Events.on(engine, 'tick', function() {
    var allBodies = Composite.allBodies(engine.world);
    MouseConstraint.update(mouseConstraint, allBodies);
    _triggerEvents(mouseConstraint);
});

In my case I had to manually fire the tick event on the Engine for the MouseConstraint to work like it does in your demos.

Events.trigger(engine, 'tick')

Hope that's useful info.

@liabru

This comment has been minimized.

Copy link
Owner

commented Jul 29, 2016

Hey, looks like you found a bug. There is no tick event on engine any more, so it looks like this needs to be updated. Thanks!

@liabru liabru reopened this Jul 29, 2016

@liabru liabru closed this in ffb128c Jan 15, 2017

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
3 participants
You can’t perform that action at this time.