Mouseover and Mouseout

511 views
Skip to first unread message

Mads Jon Nielsen

unread,
Aug 18, 2011, 3:08:40 AM8/18/11
to LimeJS HTML5 Game Framework
Hey..

I think i have found an odd behavior.
Either that or i don't quite understand how lime handle Mouseover and
Mouseout events.

----
Here is a app created in pure JS where i'm testing how onmouseover and
onmouseout is working.
The behavior of this example was how i expected lime to work as well,
but that is not the case.
Pure JS (https://docs.google.com/viewer?
a=v&pid=explorer&chrome=true&srcid=0B6ZsgTnq8nlhZjFhY2I4MzQtZDEzNy00Y2NiLWE
3OGEtN2EzZTNjODYzMzQ5&hl=en_US)
----

----
I have added a sprite to a scene in this example and listening on
mouseover and mouseouts on the scene and the sprite.

Heres my issue:
I'm not receiving mouseout on SCENE, when i hover the SPRITE, instead
i'm getting a mouseout on the sprite.
When i'm exiting the SPRITE, i'm receiving a mouseover and mouseout on
the SPRITE. Expected behavior should be mouseout on Sprite mouseover
on Scene.
LimeJS Example (https://docs.google.com/leaf?
id=0B6ZsgTnq8nlhMTYzMDJhOTYtNmJiNi00MDg1LThkN2UtYjViOTg0Y2ZiNTlj&sort=name&layout=list&num=50)
(23mb)
----

Is this a bug, or is it just me that don't understand the behavior of
mouseover and mouseout in Lime?
Best Regards
Mads Jon




Tõnis

unread,
Aug 18, 2011, 4:53:19 AM8/18/11
to LimeJS HTML5 Game Framework
Hi

Yes, mouseover and mouseout are tricky because LimeJS does not rely on
events on actual Dom nodes. All core events are actually dispatched
from single parent node. This lets use use canvas based render trees
and provide touch support on the same level as mouse
interaction(obviously no mousover/mousout there though).

Simple solution is to listen events on dom nodes(if you know you will
always have them). Other way is to keep a value if shape is currently
hovered or not in Javascript. I wrote a gist that should do that:
https://gist.github.com/1153666 . I didn't include it in the source
cause it isn't really in same style as rest of the API. If you have
suggestions how to make it better (or if it still does not give right
results) let me know.

Mads Jon Nielsen

unread,
Aug 19, 2011, 2:33:02 AM8/19/11
to LimeJS HTML5 Game Framework
Yups, listening on the dom element did the trick.

I'll let you know if i come up with any nifty way to do this...

Best Regards
Mads Jon Nielsen

On Aug 18, 10:53 am, Tõnis <tonisti...@gmail.com> wrote:
> Hi
>
> Yes, mouseover and mouseout are tricky because LimeJS does not rely on
> events on actual Dom nodes. All core events are actually dispatched
> from single parent  node. This lets use use canvas based render trees
> and provide touch support on the same level as mouse
> interaction(obviously no mousover/mousout there though).
>
> Simple solution is to listen events on dom nodes(if you know you will
> always have them). Other way is to keep a value if shape is currently
> hovered or not in Javascript. I wrote a gist that should do that:https://gist.github.com/1153666. I didn't include it in the source

jo...@cheesehater.com

unread,
Sep 18, 2012, 2:19:19 PM9/18/12
to lim...@googlegroups.com

This worked for me:

goog.events.listen(square, 'mouseover', function(e) { 
this.setFill(128,0,0); //highlight

var key = goog.events.listen(this.getParent(), 'mousemove', function(e) {
if (!this.hitTest(e))
{
this.setFill(128,128,128); // unhighlight
goog.events.unlistenByKey(key);
}

},null,this);
});


cheers,
John

ashusa...@gmail.com

unread,
Jan 5, 2018, 5:26:44 AM1/5/18
to LimeJS HTML5 Game Framework
poker_room.min.js:520 Uncaught TypeError: c.hitTest is not a function.

this code is giving error which i mentioned in upper line.
Reply all
Reply to author
Forward
0 new messages