You are viewing a plain text version of this content. The canonical link for it is here.
Posted to batik-users@xmlgraphics.apache.org by Urs Reupke <ur...@gmx.net> on 2007/04/23 07:19:30 UTC
Interactors and DOM Events
Fellow Batik users,
I am currently toing with changes to my application's user interface.
I want the displayed image to move according to mouse movements,
unless the button was pressed on top of a specific class of node.
To this end, I have registered an interactor that reacts when the mouse
button is
pressed, and a DOM listener, that disables said interactor when the
cursor is inside the
node class.
For now, this structure performs as intended, but I fear that it might
break when the document
is modified later on.
Is there a best practice for cases like this, or could/should I just
replace the interactors by another set
of DOM listeners?
Thanks for your help
-Urs
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: Interactors and DOM Events
Posted by th...@kodak.com.
Hi Urs,
> Thomas DeWeese wrote:
> > Correct, right now the rect is 'on top' of everything so all events
> > are delivered to it. If you make it the first child of the SVG
element,
> > then it will be 'below' everything and it will only receive events if
> > they 'fall through' all the other elements in the document.
Urs Reupke <ur...@gmx.net> wrote on 04/29/2007 12:49:54 PM:
> I did that, but things still aren't right.
> Some events get through: I can register mouseup/mousedown and click
> events, as well as mousemove.
> Mouseout and mouseover events, which are unfortunately crucial to the
> (current) workings of the document, are not triggered. (If everything
> else fails, I could rewrite both mouseup- and mousedown- as
> mousemove-listeners.)
You mean the mouse out/over events are never delivered? If you
remove the rect they suddenly are? That would be a serious bug,
can you reproduce it easily?
> I have tried inserting the rectangle both behind and after the <defs>
> element, even as the first element inside the main group, but the
problem
> persists. All listeners I spoke about are added to the <g>-elements
> containing the <use>-references to the polygon symbols via the Java API.
>
> Is there another trap I could have stumbled into?
When you say mouse out/over aren't delivered are they not
delivered for the background rect or also for the bundling groups?
> Thanks for your help, and thanks for clearing up the fill-issue. It
> works like a charm now.
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: Interactors and DOM Events
Posted by Urs Reupke <ur...@gmx.net>.
Hello Thomas
>> Following the list, I had already learned about that technique and
>> attempted to implement it. However, once the rectangle was in place,
>> it seemed that none of the "underlying" elements received any events
>> any longer. [...] I believe I could fix this by inserting the rectangle
>> as the first child of the root SVG element. Correct?
>>
>
> Correct, right now the rect is 'on top' of everything so all events
> are delivered to it. If you make it the first child of the SVG element,
> then it will be 'below' everything and it will only receive events if
> they 'fall through' all the other elements in the document.
>
I did that, but things still aren't right.
Some events get through: I can register mouseup/mousedown and click
events, as well as mousemove.
Mouseout and mouseover events, which are unfortunately crucial to the
(current) workings of the document,
are not triggered. (If everything else fails, I could rewrite both
mouseup- and mousedown- as mousemove-listeners.)
This is the outline of my document:
<svg>
<defs>
<symbol/> ##defines the polygons from which I want to receive pointer
events
</defs>
<g> ##group that contains the rest of the document bundled in groups.
... ##visible content
</g>
</svg>
I have tried inserting the rectangle both behind and after the <defs>
element,
even as the first element inside the main group, but the problem persists.
All listeners I spoke about are added to the <g>-elements containing the
<use>-references
to the polygon symbols via the Java API.
Is there another trap I could have stumbled into?
Thanks for your help, and thanks for clearing up the fill-issue. It
works like a charm now.
-Urs
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: Interactors and DOM Events
Posted by th...@kodak.com.
Hi Urs,
Urs Reupke <ur...@gmx.net> wrote on 04/29/2007 03:25:22 AM:
> >> Is there a best practice for cases like this, or could/should I just
> >> replace the interactors by another set
> >> of DOM listeners?
> >
> > The best practice is to stick to DOM Event listeners when you can.
> > In this case the only slightly tricky bit is that you need to make
sure
> > that the canvas is fully covered by something (often a
visiblity="hidden"
> > rect with pointer-events="fill" that you ensure covers anything the
canvas
> > might show). Then you can register your listener on the root SVG and
> > receive all mouse move events in the canvas.
> Following the list, I had already learned about that technique and
> attempted to implement it. However, once the rectangle was in place,
> it seemed that none of the "underlying" elements received any events
> any longer. [...] I believe I could fix this by inserting the rectangle
> as the first child of the root SVG element. Correct?
Correct, right now the rect is 'on top' of everything so all events
are delivered to it. If you make it the first child of the SVG element,
then it will be 'below' everything and it will only receive events if
they 'fall through' all the other elements in the document.
> What's more, I've experimented with the pointer-events property for a
> bit in the hopes that it could solve another, simpler problem with
> interaction.
> I have a set of two polygons that are defined as a symbol and referenced
> troughout the document.
> Each reference is defined as an <g>-group to which first the
> <use>-reference and then a <text> is added.
> Most of these references have the "fill" property set to a color, but
> some remain at fill="none".
> This second class of unfilled polygons is causing me trouble, since I
> seem unable to get events from them, even though
> I have (now) set pointer-events="visible" on the <use> element.
This will only trigger events when they happen over 'visible'
parts of the element (this is in fact the default value). Since
your element doesn't have any fill the filled region isn't visible
and hence isn't sensitive to events. You probably want
pointer-events="all" or "fill".
> From the specification I take it that events should be triggered even
> though the polygons are fill="none"d.
> Does my description bring to your mind any obvious mistakes I could have
> made?
Yes, you misunderstood the spec. ;)
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: Interactors and DOM Events
Posted by Urs Reupke <ur...@gmx.net>.
Hi Thomas,
thanks for your swift reply.
>> Is there a best practice for cases like this, or could/should I just
>> replace the interactors by another set
>> of DOM listeners?
>>
>
> The best practice is to stick to DOM Event listeners when you can.
> In this case the only slightly tricky bit is that you need to make sure
> that the canvas is fully covered by something (often a visiblity="hidden"
> rect with pointer-events="fill" that you ensure covers anything the canvas
> might show). Then you can register your listener on the root SVG and
> receive all mouse move events in the canvas.
Following the list, I had already learned about that technique and
attempted to implement it. However, once the rectangle
was in place, it seemed that none of the "underlying" elements received
any events any longer.
I didn't know about the pointer-events-property, so maybe that's the
problems cause.
If it is not, I believe I could fix this by inserting the rectangle as
the first child of the root SVG element. Correct?
What's more, I've experimented with the pointer-events property for a
bit in the hopes that it could solve another, simpler problem with
interaction.
I have a set of two polygons that are defined as a symbol and referenced
troughout the document.
Each reference is defined as an <g>-group to which first the
<use>-reference and then a <text> is added.
Most of these references have the "fill" property set to a color, but
some remain at fill="none".
This second class of unfilled polygons is causing me trouble, since I
seem unable to get events from them, even though
I have (now) set pointer-events="visible" on the <use> element.
Listeners are registered on the group, but as far as I know, events on
contained elements are bubbled up to the container,
so an event triggered on the polygon should reach the group. Actual
behaviour, however, differs, with events only being registered
from the stroked perimeter or the inner text.
From the specification I take it that events should be triggered even
though the polygons are fill="none"d.
Does my description bring to your mind any obvious mistakes I could have
made?
Have a nice sunday
-Urs
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: Interactors and DOM Events
Posted by th...@kodak.com.
Hi Urs,
Urs Reupke <ur...@gmx.net> wrote on 04/23/2007 01:19:30 AM:
> I am currently toing with changes to my application's user interface.
>
> I want the displayed image to move according to mouse movements,
> unless the button was pressed on top of a specific class of node.
> To this end, I have registered an interactor that reacts when the mouse
> button is pressed, and a DOM listener, that disables said interactor
when the
> cursor is inside the node class.
> For now, this structure performs as intended, but I fear that it might
> break when the document is modified later on.
I would be worried about this as well. I don't think the order of
event dispatch should be counted on. Especially since the DOM events
are dispatched in a separate thread so a quick click/move would probably
try and move the image before the DOM event disabled it.
> Is there a best practice for cases like this, or could/should I just
> replace the interactors by another set
> of DOM listeners?
The best practice is to stick to DOM Event listeners when you can.
In this case the only slightly tricky bit is that you need to make sure
that the canvas is fully covered by something (often a visiblity="hidden"
rect with pointer-events="fill" that you ensure covers anything the canvas
might show). Then you can register your listener on the root SVG and
receive all mouse move events in the canvas.
>
> Thanks for your help
> -Urs
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
> For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
>
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org