Skip to content

Commit 2f16227

Browse files
mbostockmbostock
committed
Restore conservative click canceling.
See d3#312. The also fixes the zoom behavior so that it cleans up temporary state when the zoom gesture is done. And, it fixes both behaviors such that the mouseup event is always stopped from propagation if a gesture occurs (even if a subsequent click is not prevented).
1 parent 18dcad7 commit 2f16227

4 files changed

Lines changed: 60 additions & 48 deletions

File tree

‎d3.js‎

Lines changed: 29 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -4287,6 +4287,7 @@ d3.behavior.drag = function() {
42874287
// snapshot the local context for subsequent dispatch
42884288
function start() {
42894289
d3_behavior_dragEvent = event;
4290+
d3_behavior_dragEventTarget = d3.event.target;
42904291
d3_behavior_dragTarget = this;
42914292
d3_behavior_dragArguments = arguments;
42924293
d3_behavior_dragOrigin = d3_behavior_dragPoint();
@@ -4319,12 +4320,12 @@ d3.behavior.drag = function() {
43194320
};
43204321

43214322
var d3_behavior_dragEvent,
4323+
d3_behavior_dragEventTarget,
43224324
d3_behavior_dragTarget,
43234325
d3_behavior_dragArguments,
43244326
d3_behavior_dragOffset,
43254327
d3_behavior_dragOrigin,
4326-
d3_behavior_dragMoved,
4327-
d3_behavior_dragStopClick;
4328+
d3_behavior_dragMoved;
43284329

43294330
function d3_behavior_dragDispatch(type) {
43304331
var p = d3_behavior_dragPoint(),
@@ -4372,24 +4373,25 @@ function d3_behavior_dragUp() {
43724373
if (!d3_behavior_dragTarget) return;
43734374
d3_behavior_dragDispatch("dragend");
43744375

4375-
d3_behavior_dragEvent =
4376-
d3_behavior_dragTarget =
4377-
d3_behavior_dragArguments =
4378-
d3_behavior_dragOffset =
4379-
d3_behavior_dragOrigin = null;
4380-
43814376
// If the node was moved, prevent the mouseup from propagating.
43824377
// Also prevent the subsequent click from propagating (e.g., for anchors).
43834378
if (d3_behavior_dragMoved) {
4384-
d3_behavior_dragStopClick = true;
43854379
d3_eventCancel();
4380+
d3_behavior_dragMoved = d3.event.target === d3_behavior_dragEventTarget;
43864381
}
4382+
4383+
d3_behavior_dragEvent =
4384+
d3_behavior_dragEventTarget =
4385+
d3_behavior_dragTarget =
4386+
d3_behavior_dragArguments =
4387+
d3_behavior_dragOffset =
4388+
d3_behavior_dragOrigin = null;
43874389
}
43884390

43894391
function d3_behavior_dragClick() {
4390-
if (d3_behavior_dragStopClick) {
4392+
if (d3_behavior_dragMoved) {
43914393
d3_eventCancel();
4392-
d3_behavior_dragStopClick = false;
4394+
d3_behavior_dragMoved = 0;
43934395
}
43944396
}
43954397
// TODO unbind zoom behavior?
@@ -4427,7 +4429,7 @@ d3.behavior.zoom = function() {
44274429
function mousedown() {
44284430
start.apply(this, arguments);
44294431
d3_behavior_zoomPanning = d3_behavior_zoomLocation(d3.svg.mouse(d3_behavior_zoomTarget));
4430-
d3_behavior_zoomMoved = false;
4432+
d3_behavior_zoomMoved = 0;
44314433
d3.event.preventDefault();
44324434
window.focus();
44334435
}
@@ -4482,8 +4484,7 @@ var d3_behavior_zoomDiv,
44824484
d3_behavior_zoomEventTarget,
44834485
d3_behavior_zoomTarget,
44844486
d3_behavior_zoomArguments,
4485-
d3_behavior_zoomMoved,
4486-
d3_behavior_zoomStopClick;
4487+
d3_behavior_zoomMoved;
44874488

44884489
function d3_behavior_zoomLocation(point) {
44894490
return [
@@ -4563,27 +4564,32 @@ function d3_behavior_zoomTouchmove() {
45634564
function d3_behavior_zoomMousemove() {
45644565
d3_behavior_zoomZooming = null;
45654566
if (d3_behavior_zoomPanning) {
4566-
d3_behavior_zoomMoved = true;
4567+
d3_behavior_zoomMoved = 1;
45674568
d3_behavior_zoomTo(d3_behavior_zoomXyz[2], d3.svg.mouse(d3_behavior_zoomTarget), d3_behavior_zoomPanning);
45684569
}
45694570
}
45704571

45714572
function d3_behavior_zoomMouseup() {
45724573
if (d3_behavior_zoomPanning) {
4573-
if (d3_behavior_zoomMoved && d3_behavior_zoomEventTarget === d3.event.target) {
4574-
d3_behavior_zoomStopClick = true;
4574+
if (d3_behavior_zoomMoved) {
4575+
d3_eventCancel();
4576+
d3_behavior_zoomMoved = d3_behavior_zoomEventTarget === d3.event.target;
45754577
}
4576-
d3_behavior_zoomMousemove();
4578+
4579+
d3_behavior_zoomXyz =
4580+
d3_behavior_zoomExtent =
4581+
d3_behavior_zoomDispatch =
4582+
d3_behavior_zoomEventTarget =
4583+
d3_behavior_zoomTarget =
4584+
d3_behavior_zoomArguments =
45774585
d3_behavior_zoomPanning = null;
45784586
}
45794587
}
45804588

45814589
function d3_behavior_zoomClick() {
4582-
if (d3_behavior_zoomStopClick && d3_behavior_zoomEventTarget === d3.event.target) {
4583-
d3.event.stopPropagation();
4584-
d3.event.preventDefault();
4585-
d3_behavior_zoomStopClick = false;
4586-
d3_behavior_zoomEventTarget = null;
4590+
if (d3_behavior_zoomMoved) {
4591+
d3_eventCancel();
4592+
d3_behavior_zoomMoved = 0;
45874593
}
45884594
}
45894595

‎d3.min.js‎

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/behavior/drag.js‎

Lines changed: 13 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ d3.behavior.drag = function() {
2020
// snapshot the local context for subsequent dispatch
2121
function start() {
2222
d3_behavior_dragEvent = event;
23+
d3_behavior_dragEventTarget = d3.event.target;
2324
d3_behavior_dragTarget = this;
2425
d3_behavior_dragArguments = arguments;
2526
d3_behavior_dragOrigin = d3_behavior_dragPoint();
@@ -52,12 +53,12 @@ d3.behavior.drag = function() {
5253
};
5354

5455
var d3_behavior_dragEvent,
56+
d3_behavior_dragEventTarget,
5557
d3_behavior_dragTarget,
5658
d3_behavior_dragArguments,
5759
d3_behavior_dragOffset,
5860
d3_behavior_dragOrigin,
59-
d3_behavior_dragMoved,
60-
d3_behavior_dragStopClick;
61+
d3_behavior_dragMoved;
6162

6263
function d3_behavior_dragDispatch(type) {
6364
var p = d3_behavior_dragPoint(),
@@ -105,23 +106,24 @@ function d3_behavior_dragUp() {
105106
if (!d3_behavior_dragTarget) return;
106107
d3_behavior_dragDispatch("dragend");
107108

108-
d3_behavior_dragEvent =
109-
d3_behavior_dragTarget =
110-
d3_behavior_dragArguments =
111-
d3_behavior_dragOffset =
112-
d3_behavior_dragOrigin = null;
113-
114109
// If the node was moved, prevent the mouseup from propagating.
115110
// Also prevent the subsequent click from propagating (e.g., for anchors).
116111
if (d3_behavior_dragMoved) {
117-
d3_behavior_dragStopClick = true;
118112
d3_eventCancel();
113+
d3_behavior_dragMoved = d3.event.target === d3_behavior_dragEventTarget;
119114
}
115+
116+
d3_behavior_dragEvent =
117+
d3_behavior_dragEventTarget =
118+
d3_behavior_dragTarget =
119+
d3_behavior_dragArguments =
120+
d3_behavior_dragOffset =
121+
d3_behavior_dragOrigin = null;
120122
}
121123

122124
function d3_behavior_dragClick() {
123-
if (d3_behavior_dragStopClick) {
125+
if (d3_behavior_dragMoved) {
124126
d3_eventCancel();
125-
d3_behavior_dragStopClick = false;
127+
d3_behavior_dragMoved = 0;
126128
}
127129
}

‎src/behavior/zoom.js‎

Lines changed: 16 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ d3.behavior.zoom = function() {
3333
function mousedown() {
3434
start.apply(this, arguments);
3535
d3_behavior_zoomPanning = d3_behavior_zoomLocation(d3.svg.mouse(d3_behavior_zoomTarget));
36-
d3_behavior_zoomMoved = false;
36+
d3_behavior_zoomMoved = 0;
3737
d3.event.preventDefault();
3838
window.focus();
3939
}
@@ -88,8 +88,7 @@ var d3_behavior_zoomDiv,
8888
d3_behavior_zoomEventTarget,
8989
d3_behavior_zoomTarget,
9090
d3_behavior_zoomArguments,
91-
d3_behavior_zoomMoved,
92-
d3_behavior_zoomStopClick;
91+
d3_behavior_zoomMoved;
9392

9493
function d3_behavior_zoomLocation(point) {
9594
return [
@@ -169,27 +168,32 @@ function d3_behavior_zoomTouchmove() {
169168
function d3_behavior_zoomMousemove() {
170169
d3_behavior_zoomZooming = null;
171170
if (d3_behavior_zoomPanning) {
172-
d3_behavior_zoomMoved = true;
171+
d3_behavior_zoomMoved = 1;
173172
d3_behavior_zoomTo(d3_behavior_zoomXyz[2], d3.svg.mouse(d3_behavior_zoomTarget), d3_behavior_zoomPanning);
174173
}
175174
}
176175

177176
function d3_behavior_zoomMouseup() {
178177
if (d3_behavior_zoomPanning) {
179-
if (d3_behavior_zoomMoved && d3_behavior_zoomEventTarget === d3.event.target) {
180-
d3_behavior_zoomStopClick = true;
178+
if (d3_behavior_zoomMoved) {
179+
d3_eventCancel();
180+
d3_behavior_zoomMoved = d3_behavior_zoomEventTarget === d3.event.target;
181181
}
182-
d3_behavior_zoomMousemove();
182+
183+
d3_behavior_zoomXyz =
184+
d3_behavior_zoomExtent =
185+
d3_behavior_zoomDispatch =
186+
d3_behavior_zoomEventTarget =
187+
d3_behavior_zoomTarget =
188+
d3_behavior_zoomArguments =
183189
d3_behavior_zoomPanning = null;
184190
}
185191
}
186192

187193
function d3_behavior_zoomClick() {
188-
if (d3_behavior_zoomStopClick && d3_behavior_zoomEventTarget === d3.event.target) {
189-
d3.event.stopPropagation();
190-
d3.event.preventDefault();
191-
d3_behavior_zoomStopClick = false;
192-
d3_behavior_zoomEventTarget = null;
194+
if (d3_behavior_zoomMoved) {
195+
d3_eventCancel();
196+
d3_behavior_zoomMoved = 0;
193197
}
194198
}
195199

0 commit comments

Comments
 (0)