Comments (3)
Hi Thomas,
there's no workaround for the behavior you explain.
CAAT manages a scenegraph as it main data structure, so elements which lie
nearer to the root element will capture mouse events, obscuring or
preventing the event flow to element's that lie below them. This behavior
is exactly the same as the DOM behavior.
In the other hand, CAAT can handle perfect collistion detection against
actor's bounding boxes. If you happened to be using rectangular images or
shapes, you'd not have such problem.
In the other hand, if you can detect by code, that your element is drop
inside the box, you could disable mouse input to any on-screen actor by
calling actor.enableEvents(false), which will make the actor 'transparent'
to mouse input.
Despite I think I understand your problem, could you post an example so i
can make sure I understand you ?
In the other hand, how would you suggest a solution for this problem ?
Thanks for asking,
Regards,
-ibon
2012/1/24 Thomas Karolski <
[email protected]
Hello there,
I am writing a simple game where the solution is to drag & drop in item
into a box. The box is animated using its mouseEnter/mouseExit events.
However, when I drag another item on top of the box, it no longer is being
animated - probably because the dragged Actor consumes the mouse events. Is
there any way around this?
Reply to this email directly or view it on GitHub:
#30
from caat.
Unfortunately I already fixed the problem, so I don't have an example. But the problem is really simple:
- Create 2 objects A & B on a scene
- Implement
mouseEnter
on A - Make B draggable by invoking
enableDrag
Problem: As you drag B over A, A'smouseEnter
method is not being called.
This is to be expected. Usually (i.e. in other event handling frameworks) however there exists some way to set an event to not be consumed after invoking a handler.
An easy way to accomplish this, would be to add a variable handled
to any event. Upon invoking a handler, say, mouseEnter
, the user could set handled
to false and return. The invoker of the handler (i.e. CAAT) would check for the handled
variable and if it is false, look for another element under the mouse to invoke mouseEnter
on.
Personally, what I did to solve my problem was different. I have overridden mouseDrag
on B to check whether the current mouse position is inside A, and if so, start the animation on A (which would usually be started by the mouseEnter handler). Then I called the default mouseDrag
function on B.
from caat.
Ok,
I see your point.
Will close this issue and open another one regarding some testing on the
event.consumed behavior. Will get back to you with the results.
Unfortunately, I can't tell when.
Thanks for the suggestion.
Regards,
-ibon
2012/1/24 Thomas Karolski <
[email protected]
Unfortunately I already fixed the problem, so I don't have an example. But
the problem is really simple:
- Create 2 objects A & B on a scene
- Implement
mouseEnter
on A- Make B draggable by invoking
enableDrag
Problem: As you drag B over A, A'smouseEnter
method is not being
called.This is to be expected. Usually (i.e. in other event handling frameworks)
however there exists some way to set an event to not be consumed after
invoking a handler.
An easy way to accomplish this, would be to add a variablehandled
to
any event. Upon invoking a handler, say,mouseEnter
, the user could set
handled
to false and return. The invoker of the handler (i.e. CAAT) would
check for thehandled
variable and if it is false, look for another
element under the mouse to invokemouseEnter
on.Personally, what I did to solve my problem was different. I have
overriddenmouseDrag
on B to check whether the current mouse position is
inside A, and if so, start the animation on A (which would usually be
started by the mouseEnter handler). Then I called the defaultmouseDrag
function on B.
Reply to this email directly or view it on GitHub:
#30 (comment)
from caat.
Related Issues (20)
- audio loop issue in firefox
- Exact pixel hit detection HOT 2
- Rendering wrong when use director.enableResizeEvents(CAAT.Director.RESIZE_PROPORTIONAL) HOT 2
- Actor SetAsButton Touch not working on CocoonJS 1.3 ? HOT 3
- Actors with SpriteImage can't rotate or scale correctly with anchors HOT 6
- Is CAAT running well in mobile
- Wrong license creation produced invalid js files within build folder. HOT 1
- Bug in actor.js /setRotationAnchor()
- Inconsistencies when hiding actor after a end of a behavior
- Cannot Remove Directors
- CSS renderer seems to be broken
- Small bug in __mouseDownHandler in Director.js
- Stop sprite image animation HOT 4
- collision image HOT 5
- uncaught exception: adding to a container an element with parent. HOT 3
- Demo not working HOT 1
- disable ctrl rotation in actor with enableDrag true
- How to add a method on complete event of RotateBehavior HOT 2
- Need to allow user to enter his name for score submission
- Path management example starting point
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from caat.