Message from discussion
setTimeout
Date: Wed, 29 Aug 2012 23:01:08 -0700 (PDT)
From: Alex <alexpreyno...@gmail.com>
To: d3-js@googlegroups.com
Message-Id: <d5716ec0-5670-428d-af04-54e8c420d0b2@googlegroups.com>
In-Reply-To: <CACioZisjHmL9xqEqBB0WnkkW=hZtASSwYFNFno=tSt-LfGtZow@mail.gmail.com>
References: <7940AE73-D845-4CF4-810C-A42C6A1B81A2@gmail.com>
<CACioZisvcfmCArUsFP6m7pZQhyZMXLJ-G4Ldbsrm4iuF3B-QJw@mail.gmail.com> <3c9b6a60-09b1-482a-939b-db4024f04403@googlegroups.com>
<CACioZisjHmL9xqEqBB0WnkkW=hZtASSwYFNFno=tSt-LfGtZow@mail.gmail.com>
Subject: Re: setTimeout
MIME-Version: 1.0
Content-Type: multipart/mixed;
boundary="----=_Part_397_26649500.1346306468479"
------=_Part_397_26649500.1346306468479
Content-Type: multipart/alternative;
boundary="----=_Part_398_13589685.1346306468479"
------=_Part_398_13589685.1346306468479
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: quoted-printable
This is almost identical to the code I posted. But this will not work, in=
=20
any case, because I need to pass node data and index parameters through the=
=20
timer, and the problem is that the parameters do not get passed through in=
=20
your example. In my example, my closure passes parameters, but the timer=20
seems to mangle them in some way.
Has anyone successfully handled double-click events without single-click=20
events getting triggered?
On Wednesday, August 29, 2012 6:42:01 PM UTC-7, marc fawzi wrote:
>
> don't know exactly the right way in D3 but in JS/jQuery=20
>
> $(someNode).bind("click", waitThenAct)
> $(someNode).bind("dblclick", cancelAction)
> =20
> var clickTimer;
> =20
> var waitThenReact =3D function() {
> =20
> clickTimer =3D setTimeout(function() {
> // act on something here
> }, 500 /*wait time*/) =20
> }
>
> var cancelAction =3D function() {
> clearTimeout(clickTimer)
> }
>
> Not sure if 500ms is the right period to wait, but close enough
>
>
> On Wed, Aug 29, 2012 at 5:28 PM, Alex <alexpr...@gmail.com <javascript:>>=
wrote:
>
>> Can you explain the second option in more detail? I think that's what I=
=20
>> am trying to do with the code I posted, or is there another way? Do you=
=20
>> have an example code snippet to demonstrate an alternative approach?
>>
>> Regards,
>> Alex
>>
>>
>> On Wednesday, August 29, 2012 4:13:39 PM UTC-7, marc fawzi wrote:
>>
>>> The "this" inside foo is no longer the clicked node, but instead it's=
=20
>>> the window object (assuming the code is running in that context)
>>>
>>> you could pass "this" into foo from clickedNode=20
>>>
>>> but in general, to prevent response to double click and enable it for=
=20
>>> single click I would set timeout on click (to do something in 500ms) an=
d=20
>>> clear it on double click
>>>
>>> On Wed, Aug 29, 2012 at 4:06 PM, Alex Reynolds <alexpr...@gmail.com>wr=
ote:
>>>
>>>> I'd like to ignore (or stop processing) events associated with a singl=
e=20
>>>> click, if there is a double-click event.
>>>>
>>>> I tried using setTimeout to accomplish this, to delay processing of a=
=20
>>>> single click by some short enough timespan that a double-click event c=
an be=20
>>>> recognized.
>>>>
>>>> I tried passing d3 parameters directly and through a closure, but=20
>>>> neither seem to work.
>>>>
>>>> Let's say I associate clickNode() and dblclickNode() functions with=20
>>>> single- and double-click events, respectively:
>>>>
>>>> var node =3D nodes.selectAll("g.node")
>>>> =E2=80=A6
>>>> .on("click", clickNode)
>>>> .on("dblclick", dblclickNode)
>>>> .call(force.drag);
>>>>
>>>> ...
>>>>
>>>> var dblclickTimer =3D null;
>>>> function clickNode(d, i) {
>>>> var timerFn =3D function() { foo(d, i); } /* closure */
>>>> dblclickTimer =3D setTimeout(timerFn, 200);
>>>> }
>>>>
>>>> function dblclickNode(d, i) {
>>>> clearTimeout(dblclickTimer);
>>>> ...
>>>> }
>>>>
>>>> function foo(d, i) {
>>>> var id =3D d3.select(this).attr("id");
>>>> ...
>>>> }
>>>>
>>>> This code returns a "No Attribute" error the line 'var id =3D =E2=80=
=A6'.
>>>>
>>>> Is there a better way to mask single clicks, when a double-click event=
=20
>>>> occurs?
>>>>
>>>> Thanks for any advice.
>>>>
>>>> -Alex
>>>
>>>
>>>
>
------=_Part_398_13589685.1346306468479
Content-Type: text/html; charset=utf-8
Content-Transfer-Encoding: quoted-printable
This is almost identical to the code I posted. But this will not work,=
in any case, because I need to pass node data and index parameters through=
the timer, and the problem is that the parameters do not get passed throug=
h in your example. In my example, my closure passes parameters, but the tim=
er seems to mangle them in some way.<div><div><br></div><div>Has anyone suc=
cessfully handled double-click events without single-click events getting t=
riggered?</div><div><br>On Wednesday, August 29, 2012 6:42:01 PM UTC-7, mar=
c fawzi wrote:<blockquote class=3D"gmail_quote" style=3D"margin: 0;margin-l=
eft: 0.8ex;border-left: 1px #ccc solid;padding-left: 1ex;"><div>don't know =
exactly the right way in D3 but in JS/jQuery </div><div><br></div><div=
>$(someNode).bind("click", waitThenAct)</div><div>$(someNode).bind("dblclic=
k", cancelAction)</div><div> </div><div>
var clickTimer;</div><div> </div><div>var waitThenReact =3D function()=
{</div><div> </div><div> clickTimer =
=3D setTimeout(function() {</div><div> // =
act on something here</div><div> }, 500 /*wait time*/) &=
nbsp; </div>
<div>}</div><div><br></div><div>var cancelAction =3D function() {</div><div=
> clearTimeout(clickTimer)</div><div>}<br><br>Not sure if 500m=
s is the right period to wait, but close enough</div><div><br></div><div><b=
r><div class=3D"gmail_quote">
On Wed, Aug 29, 2012 at 5:28 PM, Alex <span dir=3D"ltr"><<a href=3D"java=
script:" target=3D"_blank" gdf-obfuscated-mailto=3D"PEsDe-ALanMJ">alexpr...=
@gmail.com</a>></span> wrote:<br><blockquote class=3D"gmail_quote" style=
=3D"margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">
Can you explain the second option in more detail? I think that's what I am =
trying to do with the code I posted, or is there another way? Do you have a=
n example code snippet to demonstrate an alternative approach?<div>
<br></div><div>Regards,</div><div>Alex<div><br><br>On Wednesday, August 29,=
2012 4:13:39 PM UTC-7, marc fawzi wrote:</div><blockquote class=3D"gmail_q=
uote" style=3D"margin:0;margin-left:0.8ex;border-left:1px #ccc solid;paddin=
g-left:1ex">
<div>The "this" inside foo is no longer the clicked node, but instead it's =
the window object (assuming the code is running in that context)<div><br></=
div><div>you could pass "this" into foo from clickedNode </div>
<div><br></div></div><div><div>but in general, to prevent response to doubl=
e click and enable it for single click I would set timeout on click (to do =
something in 500ms) and clear it on double click<br><br></div>
<div><div class=3D"gmail_quote">
On Wed, Aug 29, 2012 at 4:06 PM, Alex Reynolds <span dir=3D"ltr"><<a>ale=
xpr...@gmail.com</a>></span> wrote:<br>
<blockquote class=3D"gmail_quote" style=3D"margin:0 0 0 .8ex;border-left:1p=
x #ccc solid;padding-left:1ex">I'd like to ignore (or stop processing) even=
ts associated with a single click, if there is a double-click event.<br>
<br>
I tried using setTimeout to accomplish this, to delay processing of a singl=
e click by some short enough timespan that a double-click event can be reco=
gnized.<br>
<br>
I tried passing d3 parameters directly and through a closure, but neither s=
eem to work.<br>
<br>
Let's say I associate clickNode() and dblclickNode() functions with single-=
and double-click events, respectively:<br>
<br>
var node =3D nodes.selectAll("g.node")<br>
=E2=80=A6<br>
.on("click", clickNode)<br>
.on("dblclick", dblclickNode)<br>
.call(force.drag);<br>
<br>
...<br>
<br>
var dblclickTimer =3D null;<br>
function clickNode(d, i) {<br>
var timerFn =3D function() { foo(d, i); } /* closure */<br>
dblclickTimer =3D setTimeout(timerFn, 200);<br>
}<br>
<br>
function dblclickNode(d, i) {<br>
clearTimeout(dblclickTimer);<br>
...<br>
}<br>
<br>
function foo(d, i) {<br>
var id =3D d3.select(this).attr("id");<br>
...<br>
}<br>
<br>
This code returns a "No Attribute" error the line 'var id =3D =E2=80=A6'.<b=
r>
<br>
Is there a better way to mask single clicks, when a double-click event occu=
rs?<br>
<br>
Thanks for any advice.<br>
<span><font color=3D"#888888"><br>
-Alex</font></span></blockquote></div><br></div></div>
</blockquote></div></blockquote></div><br></div>
</blockquote></div></div>
------=_Part_398_13589685.1346306468479--
------=_Part_397_26649500.1346306468479--