Commit | Line | Data |
---|---|---|
88e95c46 DV |
1 | /** |
2 | * @license | |
3 | * Copyright 2011 Robert Konigsberg (konigsberg@google.com) | |
4 | * MIT-licensed (http://opensource.org/licenses/MIT) | |
5 | */ | |
846f3d2d | 6 | |
88e95c46 | 7 | /** |
846f3d2d DV |
8 | * @fileoverview The default interaction model for Dygraphs. This is kept out |
9 | * of dygraph.js for better navigability. | |
10 | * @author Robert Konigsberg (konigsberg@google.com) | |
11 | */ | |
12 | ||
758a629f DV |
13 | /*jshint globalstrict: true */ |
14 | /*global Dygraph:false */ | |
c0f54d4f DV |
15 | "use strict"; |
16 | ||
846f3d2d DV |
17 | /** |
18 | * A collection of functions to facilitate build custom interaction models. | |
19 | * @class | |
20 | */ | |
21 | Dygraph.Interaction = {}; | |
22 | ||
23 | /** | |
24 | * Called in response to an interaction model operation that | |
25 | * should start the default panning behavior. | |
26 | * | |
27 | * It's used in the default callback for "mousedown" operations. | |
28 | * Custom interaction model builders can use it to provide the default | |
29 | * panning behavior. | |
30 | * | |
31 | * @param { Event } event the event object which led to the startPan call. | |
32 | * @param { Dygraph} g The dygraph on which to act. | |
33 | * @param { Object} context The dragging context object (with | |
34 | * dragStartX/dragStartY/etc. properties). This function modifies the context. | |
35 | */ | |
36 | Dygraph.Interaction.startPan = function(event, g, context) { | |
758a629f | 37 | var i, axis; |
846f3d2d DV |
38 | context.isPanning = true; |
39 | var xRange = g.xAxisRange(); | |
40 | context.dateRange = xRange[1] - xRange[0]; | |
41 | context.initialLeftmostDate = xRange[0]; | |
42 | context.xUnitsPerPixel = context.dateRange / (g.plotter_.area.w - 1); | |
43 | ||
44 | if (g.attr_("panEdgeFraction")) { | |
45 | var maxXPixelsToDraw = g.width_ * g.attr_("panEdgeFraction"); | |
46 | var xExtremes = g.xAxisExtremes(); // I REALLY WANT TO CALL THIS xTremes! | |
47 | ||
48 | var boundedLeftX = g.toDomXCoord(xExtremes[0]) - maxXPixelsToDraw; | |
49 | var boundedRightX = g.toDomXCoord(xExtremes[1]) + maxXPixelsToDraw; | |
50 | ||
51 | var boundedLeftDate = g.toDataXCoord(boundedLeftX); | |
52 | var boundedRightDate = g.toDataXCoord(boundedRightX); | |
53 | context.boundedDates = [boundedLeftDate, boundedRightDate]; | |
54 | ||
55 | var boundedValues = []; | |
56 | var maxYPixelsToDraw = g.height_ * g.attr_("panEdgeFraction"); | |
57 | ||
758a629f DV |
58 | for (i = 0; i < g.axes_.length; i++) { |
59 | axis = g.axes_[i]; | |
846f3d2d DV |
60 | var yExtremes = axis.extremeRange; |
61 | ||
62 | var boundedTopY = g.toDomYCoord(yExtremes[0], i) + maxYPixelsToDraw; | |
63 | var boundedBottomY = g.toDomYCoord(yExtremes[1], i) - maxYPixelsToDraw; | |
64 | ||
65 | var boundedTopValue = g.toDataYCoord(boundedTopY); | |
66 | var boundedBottomValue = g.toDataYCoord(boundedBottomY); | |
67 | ||
68 | boundedValues[i] = [boundedTopValue, boundedBottomValue]; | |
69 | } | |
70 | context.boundedValues = boundedValues; | |
71 | } | |
72 | ||
73 | // Record the range of each y-axis at the start of the drag. | |
74 | // If any axis has a valueRange or valueWindow, then we want a 2D pan. | |
97583b90 DV |
75 | // We can't store data directly in g.axes_, because it does not belong to us |
76 | // and could change out from under us during a pan (say if there's a data | |
77 | // update). | |
846f3d2d | 78 | context.is2DPan = false; |
97583b90 | 79 | context.axes = []; |
758a629f DV |
80 | for (i = 0; i < g.axes_.length; i++) { |
81 | axis = g.axes_[i]; | |
97583b90 | 82 | var axis_data = {}; |
846f3d2d DV |
83 | var yRange = g.yAxisRange(i); |
84 | // TODO(konigsberg): These values should be in |context|. | |
85 | // In log scale, initialTopValue, dragValueRange and unitsPerPixel are log scale. | |
86 | if (axis.logscale) { | |
97583b90 DV |
87 | axis_data.initialTopValue = Dygraph.log10(yRange[1]); |
88 | axis_data.dragValueRange = Dygraph.log10(yRange[1]) - Dygraph.log10(yRange[0]); | |
846f3d2d | 89 | } else { |
97583b90 DV |
90 | axis_data.initialTopValue = yRange[1]; |
91 | axis_data.dragValueRange = yRange[1] - yRange[0]; | |
846f3d2d | 92 | } |
97583b90 DV |
93 | axis_data.unitsPerPixel = axis_data.dragValueRange / (g.plotter_.area.h - 1); |
94 | context.axes.push(axis_data); | |
846f3d2d DV |
95 | |
96 | // While calculating axes, set 2dpan. | |
97 | if (axis.valueWindow || axis.valueRange) context.is2DPan = true; | |
98 | } | |
99 | }; | |
100 | ||
101 | /** | |
102 | * Called in response to an interaction model operation that | |
103 | * responds to an event that pans the view. | |
104 | * | |
105 | * It's used in the default callback for "mousemove" operations. | |
106 | * Custom interaction model builders can use it to provide the default | |
107 | * panning behavior. | |
108 | * | |
109 | * @param { Event } event the event object which led to the movePan call. | |
110 | * @param { Dygraph} g The dygraph on which to act. | |
111 | * @param { Object} context The dragging context object (with | |
112 | * dragStartX/dragStartY/etc. properties). This function modifies the context. | |
113 | */ | |
114 | Dygraph.Interaction.movePan = function(event, g, context) { | |
115 | context.dragEndX = g.dragGetX_(event, context); | |
116 | context.dragEndY = g.dragGetY_(event, context); | |
117 | ||
118 | var minDate = context.initialLeftmostDate - | |
119 | (context.dragEndX - context.dragStartX) * context.xUnitsPerPixel; | |
120 | if (context.boundedDates) { | |
121 | minDate = Math.max(minDate, context.boundedDates[0]); | |
122 | } | |
123 | var maxDate = minDate + context.dateRange; | |
124 | if (context.boundedDates) { | |
125 | if (maxDate > context.boundedDates[1]) { | |
126 | // Adjust minDate, and recompute maxDate. | |
127 | minDate = minDate - (maxDate - context.boundedDates[1]); | |
128 | maxDate = minDate + context.dateRange; | |
129 | } | |
130 | } | |
131 | ||
132 | g.dateWindow_ = [minDate, maxDate]; | |
133 | ||
134 | // y-axis scaling is automatic unless this is a full 2D pan. | |
135 | if (context.is2DPan) { | |
136 | // Adjust each axis appropriately. | |
137 | for (var i = 0; i < g.axes_.length; i++) { | |
138 | var axis = g.axes_[i]; | |
97583b90 | 139 | var axis_data = context.axes[i]; |
846f3d2d DV |
140 | |
141 | var pixelsDragged = context.dragEndY - context.dragStartY; | |
97583b90 | 142 | var unitsDragged = pixelsDragged * axis_data.unitsPerPixel; |
920208fb | 143 | |
846f3d2d DV |
144 | var boundedValue = context.boundedValues ? context.boundedValues[i] : null; |
145 | ||
146 | // In log scale, maxValue and minValue are the logs of those values. | |
97583b90 | 147 | var maxValue = axis_data.initialTopValue + unitsDragged; |
846f3d2d DV |
148 | if (boundedValue) { |
149 | maxValue = Math.min(maxValue, boundedValue[1]); | |
150 | } | |
97583b90 | 151 | var minValue = maxValue - axis_data.dragValueRange; |
846f3d2d DV |
152 | if (boundedValue) { |
153 | if (minValue < boundedValue[0]) { | |
154 | // Adjust maxValue, and recompute minValue. | |
155 | maxValue = maxValue - (minValue - boundedValue[0]); | |
97583b90 | 156 | minValue = maxValue - axis_data.dragValueRange; |
846f3d2d DV |
157 | } |
158 | } | |
159 | if (axis.logscale) { | |
160 | axis.valueWindow = [ Math.pow(Dygraph.LOG_SCALE, minValue), | |
161 | Math.pow(Dygraph.LOG_SCALE, maxValue) ]; | |
162 | } else { | |
163 | axis.valueWindow = [ minValue, maxValue ]; | |
164 | } | |
165 | } | |
166 | } | |
167 | ||
168 | g.drawGraph_(false); | |
169 | }; | |
170 | ||
171 | /** | |
172 | * Called in response to an interaction model operation that | |
173 | * responds to an event that ends panning. | |
174 | * | |
175 | * It's used in the default callback for "mouseup" operations. | |
176 | * Custom interaction model builders can use it to provide the default | |
177 | * panning behavior. | |
178 | * | |
6125fedf | 179 | * @param { Event } event the event object which led to the endPan call. |
846f3d2d DV |
180 | * @param { Dygraph} g The dygraph on which to act. |
181 | * @param { Object} context The dragging context object (with | |
182 | * dragStartX/dragStartY/etc. properties). This function modifies the context. | |
183 | */ | |
184 | Dygraph.Interaction.endPan = function(event, g, context) { | |
185 | context.dragEndX = g.dragGetX_(event, context); | |
186 | context.dragEndY = g.dragGetY_(event, context); | |
187 | ||
188 | var regionWidth = Math.abs(context.dragEndX - context.dragStartX); | |
189 | var regionHeight = Math.abs(context.dragEndY - context.dragStartY); | |
190 | ||
191 | if (regionWidth < 2 && regionHeight < 2 && | |
758a629f | 192 | g.lastx_ !== undefined && g.lastx_ != -1) { |
846f3d2d DV |
193 | Dygraph.Interaction.treatMouseOpAsClick(g, event, context); |
194 | } | |
195 | ||
846f3d2d DV |
196 | // TODO(konigsberg): mouseup should just delete the |
197 | // context object, and mousedown should create a new one. | |
198 | context.isPanning = false; | |
199 | context.is2DPan = false; | |
200 | context.initialLeftmostDate = null; | |
201 | context.dateRange = null; | |
202 | context.valueRange = null; | |
203 | context.boundedDates = null; | |
204 | context.boundedValues = null; | |
97583b90 | 205 | context.axes = null; |
846f3d2d DV |
206 | }; |
207 | ||
208 | /** | |
209 | * Called in response to an interaction model operation that | |
210 | * responds to an event that starts zooming. | |
211 | * | |
212 | * It's used in the default callback for "mousedown" operations. | |
213 | * Custom interaction model builders can use it to provide the default | |
214 | * zooming behavior. | |
215 | * | |
216 | * @param { Event } event the event object which led to the startZoom call. | |
217 | * @param { Dygraph} g The dygraph on which to act. | |
218 | * @param { Object} context The dragging context object (with | |
219 | * dragStartX/dragStartY/etc. properties). This function modifies the context. | |
220 | */ | |
221 | Dygraph.Interaction.startZoom = function(event, g, context) { | |
222 | context.isZooming = true; | |
223 | }; | |
224 | ||
225 | /** | |
226 | * Called in response to an interaction model operation that | |
227 | * responds to an event that defines zoom boundaries. | |
228 | * | |
229 | * It's used in the default callback for "mousemove" operations. | |
230 | * Custom interaction model builders can use it to provide the default | |
231 | * zooming behavior. | |
232 | * | |
233 | * @param { Event } event the event object which led to the moveZoom call. | |
234 | * @param { Dygraph} g The dygraph on which to act. | |
235 | * @param { Object} context The dragging context object (with | |
236 | * dragStartX/dragStartY/etc. properties). This function modifies the context. | |
237 | */ | |
238 | Dygraph.Interaction.moveZoom = function(event, g, context) { | |
239 | context.dragEndX = g.dragGetX_(event, context); | |
240 | context.dragEndY = g.dragGetY_(event, context); | |
241 | ||
242 | var xDelta = Math.abs(context.dragStartX - context.dragEndX); | |
243 | var yDelta = Math.abs(context.dragStartY - context.dragEndY); | |
244 | ||
245 | // drag direction threshold for y axis is twice as large as x axis | |
246 | context.dragDirection = (xDelta < yDelta / 2) ? Dygraph.VERTICAL : Dygraph.HORIZONTAL; | |
247 | ||
248 | g.drawZoomRect_( | |
249 | context.dragDirection, | |
250 | context.dragStartX, | |
251 | context.dragEndX, | |
252 | context.dragStartY, | |
253 | context.dragEndY, | |
254 | context.prevDragDirection, | |
255 | context.prevEndX, | |
256 | context.prevEndY); | |
257 | ||
258 | context.prevEndX = context.dragEndX; | |
259 | context.prevEndY = context.dragEndY; | |
260 | context.prevDragDirection = context.dragDirection; | |
261 | }; | |
262 | ||
263 | Dygraph.Interaction.treatMouseOpAsClick = function(g, event, context) { | |
264 | var clickCallback = g.attr_('clickCallback'); | |
265 | var pointClickCallback = g.attr_('pointClickCallback'); | |
266 | ||
267 | var selectedPoint = null; | |
268 | ||
269 | // Find out if the click occurs on a point. This only matters if there's a pointClickCallback. | |
270 | if (pointClickCallback) { | |
271 | var closestIdx = -1; | |
272 | var closestDistance = Number.MAX_VALUE; | |
273 | ||
274 | // check if the click was on a particular point. | |
275 | for (var i = 0; i < g.selPoints_.length; i++) { | |
276 | var p = g.selPoints_[i]; | |
277 | var distance = Math.pow(p.canvasx - context.dragEndX, 2) + | |
278 | Math.pow(p.canvasy - context.dragEndY, 2); | |
fbff6d71 DV |
279 | if (!isNaN(distance) && |
280 | (closestIdx == -1 || distance < closestDistance)) { | |
846f3d2d DV |
281 | closestDistance = distance; |
282 | closestIdx = i; | |
283 | } | |
284 | } | |
285 | ||
286 | // Allow any click within two pixels of the dot. | |
287 | var radius = g.attr_('highlightCircleSize') + 2; | |
288 | if (closestDistance <= radius * radius) { | |
289 | selectedPoint = g.selPoints_[closestIdx]; | |
290 | } | |
291 | } | |
292 | ||
293 | if (selectedPoint) { | |
294 | pointClickCallback(event, selectedPoint); | |
295 | } | |
296 | ||
297 | // TODO(danvk): pass along more info about the points, e.g. 'x' | |
298 | if (clickCallback) { | |
299 | clickCallback(event, g.lastx_, g.selPoints_); | |
300 | } | |
301 | }; | |
302 | ||
303 | /** | |
304 | * Called in response to an interaction model operation that | |
305 | * responds to an event that performs a zoom based on previously defined | |
306 | * bounds.. | |
307 | * | |
308 | * It's used in the default callback for "mouseup" operations. | |
309 | * Custom interaction model builders can use it to provide the default | |
310 | * zooming behavior. | |
311 | * | |
312 | * @param { Event } event the event object which led to the endZoom call. | |
313 | * @param { Dygraph} g The dygraph on which to end the zoom. | |
314 | * @param { Object} context The dragging context object (with | |
315 | * dragStartX/dragStartY/etc. properties). This function modifies the context. | |
316 | */ | |
317 | Dygraph.Interaction.endZoom = function(event, g, context) { | |
318 | context.isZooming = false; | |
319 | context.dragEndX = g.dragGetX_(event, context); | |
320 | context.dragEndY = g.dragGetY_(event, context); | |
321 | var regionWidth = Math.abs(context.dragEndX - context.dragStartX); | |
322 | var regionHeight = Math.abs(context.dragEndY - context.dragStartY); | |
323 | ||
324 | if (regionWidth < 2 && regionHeight < 2 && | |
758a629f | 325 | g.lastx_ !== undefined && g.lastx_ != -1) { |
846f3d2d DV |
326 | Dygraph.Interaction.treatMouseOpAsClick(g, event, context); |
327 | } | |
328 | ||
329 | if (regionWidth >= 10 && context.dragDirection == Dygraph.HORIZONTAL) { | |
330 | g.doZoomX_(Math.min(context.dragStartX, context.dragEndX), | |
331 | Math.max(context.dragStartX, context.dragEndX)); | |
332 | } else if (regionHeight >= 10 && context.dragDirection == Dygraph.VERTICAL) { | |
333 | g.doZoomY_(Math.min(context.dragStartY, context.dragEndY), | |
334 | Math.max(context.dragStartY, context.dragEndY)); | |
335 | } else { | |
920208fb | 336 | g.clearZoomRect_(); |
846f3d2d DV |
337 | } |
338 | context.dragStartX = null; | |
339 | context.dragStartY = null; | |
340 | }; | |
341 | ||
342 | /** | |
6125fedf DV |
343 | * @private |
344 | */ | |
345 | Dygraph.Interaction.startTouch = function(event, g, context) { | |
346 | event.preventDefault(); // touch browsers are all nice. | |
347 | var touches = []; | |
348 | for (var i = 0; i < event.touches.length; i++) { | |
349 | var t = event.touches[i]; | |
350 | // we dispense with 'dragGetX_' because all touchBrowsers support pageX | |
351 | touches.push({ | |
352 | pageX: t.pageX, | |
353 | pageY: t.pageY, | |
354 | dataX: g.toDataXCoord(t.pageX), | |
355 | dataY: g.toDataYCoord(t.pageY) | |
356 | // identifier: t.identifier | |
357 | }); | |
358 | } | |
359 | context.initialTouches = touches; | |
360 | ||
361 | if (touches.length == 1) { | |
362 | // This is just a swipe. | |
363 | context.initialPinchCenter = touches[0]; | |
364 | context.touchDirections = { x: true, y: true }; | |
365 | } else if (touches.length == 2) { | |
366 | // It's become a pinch! | |
367 | ||
368 | // only screen coordinates can be averaged (data coords could be log scale). | |
369 | context.initialPinchCenter = { | |
370 | pageX: 0.5 * (touches[0].pageX + touches[1].pageX), | |
371 | pageY: 0.5 * (touches[0].pageY + touches[1].pageY), | |
372 | ||
373 | // TODO(danvk): remove | |
374 | dataX: 0.5 * (touches[0].dataX + touches[1].dataX), | |
375 | dataY: 0.5 * (touches[0].dataY + touches[1].dataY), | |
376 | }; | |
377 | ||
378 | // Make pinches in a 45-degree swath around either axis 1-dimensional zooms. | |
379 | var initialAngle = 180 / Math.PI * Math.atan2( | |
380 | context.initialPinchCenter.pageY - touches[0].pageY, | |
381 | touches[0].pageX - context.initialPinchCenter.pageX); | |
382 | ||
383 | // use symmetry to get it into the first quadrant. | |
384 | initialAngle = Math.abs(initialAngle); | |
385 | if (initialAngle > 90) initialAngle = 90 - initialAngle; | |
386 | ||
387 | context.touchDirections = { | |
388 | x: (initialAngle < (90 - 45/2)), | |
389 | y: (initialAngle > 45/2) | |
390 | }; | |
391 | } | |
392 | ||
393 | // save the full x & y ranges. | |
394 | context.initialRange = { | |
395 | x: g.xAxisRange(), | |
396 | y: g.yAxisRange() | |
397 | }; | |
398 | }; | |
399 | ||
400 | /** | |
401 | * @private | |
402 | */ | |
403 | Dygraph.Interaction.moveTouch = function(event, g, context) { | |
404 | var touches = []; | |
405 | for (var i = 0; i < event.touches.length; i++) { | |
406 | var t = event.touches[i]; | |
407 | touches.push({ | |
408 | pageX: t.pageX, | |
409 | pageY: t.pageY, | |
410 | }); | |
411 | } | |
412 | var initialTouches = context.initialTouches; | |
413 | ||
414 | var c_now; | |
415 | ||
416 | // old and new centers. | |
417 | var c_init = context.initialPinchCenter; | |
418 | if (touches.length == 1) { | |
419 | c_now = touches[0]; | |
420 | } else { | |
421 | c_now = { | |
422 | pageX: 0.5 * (touches[0].pageX + touches[1].pageX), | |
423 | pageY: 0.5 * (touches[0].pageY + touches[1].pageY) | |
424 | }; | |
425 | } | |
426 | ||
427 | // this is the "swipe" component | |
428 | // we toss it out for now, but could use it in the future. | |
429 | var swipe = { | |
430 | pageX: c_now.pageX - c_init.pageX, | |
431 | pageY: c_now.pageY - c_init.pageY, | |
432 | }; | |
433 | var dataWidth = context.initialRange.x[1] - context.initialRange.x[0]; | |
434 | var dataHeight = context.initialRange.y[0] - context.initialRange.y[1]; | |
435 | swipe.dataX = (swipe.pageX / g.plotter_.area.w) * dataWidth; | |
436 | swipe.dataY = (swipe.pageY / g.plotter_.area.h) * dataHeight; | |
437 | var xScale, yScale; | |
438 | ||
439 | // The residual bits are usually split into scale & rotate bits, but we split | |
440 | // them into x-scale and y-scale bits. | |
441 | if (touches.length == 1) { | |
442 | xScale = 1.0; | |
443 | yScale = 1.0; | |
444 | } else if (touches.length == 2) { | |
445 | var initHalfWidth = (initialTouches[1].pageX - c_init.pageX); | |
446 | xScale = (touches[1].pageX - c_now.pageX) / initHalfWidth; | |
447 | ||
448 | var initHalfHeight = (initialTouches[1].pageY - c_init.pageY); | |
449 | yScale = (touches[1].pageY - c_now.pageY) / initHalfHeight; | |
450 | } | |
451 | ||
452 | // Clip scaling to [1/8, 8] to prevent too much blowup. | |
453 | xScale = Math.min(8, Math.max(0.125, xScale)); | |
454 | yScale = Math.min(8, Math.max(0.125, yScale)); | |
455 | ||
456 | if (context.touchDirections.x) { | |
457 | g.dateWindow_ = [ | |
458 | c_init.dataX - swipe.dataX + (context.initialRange.x[0] - c_init.dataX) / xScale, | |
459 | c_init.dataX - swipe.dataX + (context.initialRange.x[1] - c_init.dataX) / xScale, | |
460 | ]; | |
461 | } | |
462 | ||
463 | if (context.touchDirections.y) { | |
464 | for (var i = 0; i < 1 /*g.axes_.length*/; i++) { | |
465 | var axis = g.axes_[i]; | |
466 | if (axis.logscale) { | |
467 | // TODO(danvk): implement | |
468 | } else { | |
469 | axis.valueWindow = [ | |
470 | c_init.dataY - swipe.dataY + (context.initialRange.y[0] - c_init.dataY) / yScale, | |
471 | c_init.dataY - swipe.dataY + (context.initialRange.y[1] - c_init.dataY) / yScale, | |
472 | ]; | |
473 | } | |
474 | } | |
475 | } | |
476 | ||
477 | g.drawGraph_(false); | |
478 | }; | |
479 | ||
480 | /** | |
481 | * @private | |
482 | */ | |
483 | Dygraph.Interaction.endTouch = function(event, g, context) { | |
484 | if (event.touches.length != 0) { | |
485 | // this is effectively a "reset" | |
486 | Dygraph.Interaction.startTouch(event, g, context); | |
487 | } | |
488 | }; | |
489 | ||
490 | /** | |
846f3d2d DV |
491 | * Default interation model for dygraphs. You can refer to specific elements of |
492 | * this when constructing your own interaction model, e.g.: | |
493 | * g.updateOptions( { | |
494 | * interactionModel: { | |
495 | * mousedown: Dygraph.defaultInteractionModel.mousedown | |
496 | * } | |
497 | * } ); | |
498 | */ | |
499 | Dygraph.Interaction.defaultModel = { | |
500 | // Track the beginning of drag events | |
501 | mousedown: function(event, g, context) { | |
502 | context.initializeMouseDown(event, g, context); | |
503 | ||
504 | if (event.altKey || event.shiftKey) { | |
505 | Dygraph.startPan(event, g, context); | |
506 | } else { | |
507 | Dygraph.startZoom(event, g, context); | |
508 | } | |
509 | }, | |
510 | ||
511 | // Draw zoom rectangles when the mouse is down and the user moves around | |
512 | mousemove: function(event, g, context) { | |
513 | if (context.isZooming) { | |
514 | Dygraph.moveZoom(event, g, context); | |
515 | } else if (context.isPanning) { | |
516 | Dygraph.movePan(event, g, context); | |
517 | } | |
518 | }, | |
519 | ||
520 | mouseup: function(event, g, context) { | |
521 | if (context.isZooming) { | |
522 | Dygraph.endZoom(event, g, context); | |
523 | } else if (context.isPanning) { | |
524 | Dygraph.endPan(event, g, context); | |
525 | } | |
526 | }, | |
527 | ||
6125fedf DV |
528 | touchstart: function(event, g, context) { |
529 | Dygraph.Interaction.startTouch(event, g, context); | |
530 | }, | |
531 | touchmove: function(event, g, context) { | |
532 | Dygraph.Interaction.moveTouch(event, g, context); | |
533 | }, | |
534 | touchend: function(event, g, context) { | |
535 | Dygraph.Interaction.endTouch(event, g, context); | |
536 | }, | |
537 | ||
846f3d2d DV |
538 | // Temporarily cancel the dragging event when the mouse leaves the graph |
539 | mouseout: function(event, g, context) { | |
540 | if (context.isZooming) { | |
541 | context.dragEndX = null; | |
542 | context.dragEndY = null; | |
543 | } | |
544 | }, | |
545 | ||
546 | // Disable zooming out if panning. | |
547 | dblclick: function(event, g, context) { | |
548 | if (event.altKey || event.shiftKey) { | |
549 | return; | |
550 | } | |
551 | // TODO(konigsberg): replace g.doUnzoom()_ with something that is | |
552 | // friendlier to public use. | |
553 | g.doUnzoom_(); | |
554 | } | |
555 | }; | |
556 | ||
557 | Dygraph.DEFAULT_ATTRS.interactionModel = Dygraph.Interaction.defaultModel; | |
558 | ||
559 | // old ways of accessing these methods/properties | |
560 | Dygraph.defaultInteractionModel = Dygraph.Interaction.defaultModel; | |
561 | Dygraph.endZoom = Dygraph.Interaction.endZoom; | |
562 | Dygraph.moveZoom = Dygraph.Interaction.moveZoom; | |
563 | Dygraph.startZoom = Dygraph.Interaction.startZoom; | |
564 | Dygraph.endPan = Dygraph.Interaction.endPan; | |
565 | Dygraph.movePan = Dygraph.Interaction.movePan; | |
566 | Dygraph.startPan = Dygraph.Interaction.startPan; | |
567 | ||
0290d079 | 568 | Dygraph.Interaction.nonInteractiveModel_ = { |
027e9e9b DV |
569 | mousedown: function(event, g, context) { |
570 | context.initializeMouseDown(event, g, context); | |
571 | }, | |
572 | mouseup: function(event, g, context) { | |
573 | // TODO(danvk): this logic is repeated in Dygraph.Interaction.endZoom | |
574 | context.dragEndX = g.dragGetX_(event, context); | |
575 | context.dragEndY = g.dragGetY_(event, context); | |
576 | var regionWidth = Math.abs(context.dragEndX - context.dragStartX); | |
577 | var regionHeight = Math.abs(context.dragEndY - context.dragStartY); | |
578 | ||
579 | if (regionWidth < 2 && regionHeight < 2 && | |
758a629f | 580 | g.lastx_ !== undefined && g.lastx_ != -1) { |
027e9e9b DV |
581 | Dygraph.Interaction.treatMouseOpAsClick(g, event, context); |
582 | } | |
583 | } | |
584 | }; | |
3417f017 DV |
585 | |
586 | // Default interaction model when using the range selector. | |
587 | Dygraph.Interaction.dragIsPanInteractionModel = { | |
588 | mousedown: function(event, g, context) { | |
589 | context.initializeMouseDown(event, g, context); | |
590 | Dygraph.startPan(event, g, context); | |
591 | }, | |
592 | mousemove: function(event, g, context) { | |
593 | if (context.isPanning) { | |
594 | Dygraph.movePan(event, g, context); | |
595 | } | |
596 | }, | |
597 | mouseup: function(event, g, context) { | |
598 | if (context.isPanning) { | |
599 | Dygraph.endPan(event, g, context); | |
600 | } | |
601 | } | |
602 | }; |