From 4ee251cb5a4f2f1f460facb47f6b30ab9fca6ebb Mon Sep 17 00:00:00 2001 From: Dan Vanderkam Date: Wed, 12 Nov 2014 22:48:04 -0500 Subject: [PATCH] Set "this" to the Dygraph object in all callbacks --- auto_tests/tests/callback.js | 181 +++++++++++++++++++++++-------------------- dygraph-canvas.js | 2 +- dygraph-interaction-model.js | 6 +- dygraph.js | 20 ++--- 4 files changed, 113 insertions(+), 96 deletions(-) diff --git a/auto_tests/tests/callback.js b/auto_tests/tests/callback.js index af524a0..5fe1739 100644 --- a/auto_tests/tests/callback.js +++ b/auto_tests/tests/callback.js @@ -34,7 +34,8 @@ CallbackTestCase.prototype.testHighlightCallbackIsCalled = function() { var h_row; var h_pts; - var highlightCallback = function(e, x, pts, row) { + var highlightCallback = function(e, x, pts, row) { + assertEquals(g, this); h_row = row; h_pts = pts; }; @@ -64,12 +65,13 @@ CallbackTestCase.prototype.testDrawPointCallback_disabled = function() { var called = false; var callback = function() { + assertEquals(g, this); called = true; }; var graph = document.getElementById("graph"); var g = new Dygraph(graph, data, { - drawPointCallback : callback, + drawPointCallback: callback, }); assertFalse(called); @@ -80,18 +82,21 @@ CallbackTestCase.prototype.testDrawPointCallback_disabled = function() { */ CallbackTestCase.prototype.testDrawPointCallback_enabled = function() { var called = false; + var callbackThis = null; var callback = function() { + callbackThis = this; called = true; }; var graph = document.getElementById("graph"); var g = new Dygraph(graph, data, { - drawPoints : true, - drawPointCallback : callback + drawPoints: true, + drawPointCallback: callback }); assertTrue(called); + assertEquals(g, callbackThis); }; /** @@ -102,23 +107,24 @@ CallbackTestCase.prototype.testDrawPointCallback_pointSize = function() { var count = 0; var callback = function(g, seriesName, canvasContext, cx, cy, color, pointSizeParam) { + assertEquals(g, this); pointSize = pointSizeParam; count++; }; var graph = document.getElementById("graph"); var g = new Dygraph(graph, data, { - drawPoints : true, - drawPointCallback : callback + drawPoints: true, + drawPointCallback: callback }); assertEquals(1.5, pointSize); assertEquals(12, count); // one call per data point. var g = new Dygraph(graph, data, { - drawPoints : true, - drawPointCallback : callback, - pointSize : 8 + drawPoints: true, + drawPointCallback: callback, + pointSize: 8 }); assertEquals(8, pointSize); @@ -133,6 +139,7 @@ CallbackTestCase.prototype.testDrawPointCallback_isolated = function() { var g; var callback = function(g, seriesName, canvasContext, cx, cy, color, pointSizeParam) { + assertEquals(g, this); var dx = g.toDataXCoord(cx); xvalues.push(dx); Dygraph.Circles.DEFAULT.apply(this, arguments); @@ -174,7 +181,8 @@ CallbackTestCase.prototype.testDrawPointCallback_isolated = function() { CallbackTestCase.prototype.testDrawHighlightPointCallbackIsCalled = function() { var called = false; - var drawHighlightPointCallback = function() { + var drawHighlightPointCallback = function() { + assertEquals(g, this); called = true; }; @@ -182,8 +190,8 @@ CallbackTestCase.prototype.testDrawHighlightPointCallbackIsCalled = function() { var g = new Dygraph(graph, data, { width: 100, - height : 100, - drawHighlightPointCallback : drawHighlightPointCallback + height: 100, + drawHighlightPointCallback: drawHighlightPointCallback }); assertFalse(called); @@ -219,7 +227,8 @@ var runClosestTest = function(isStacked, widthNormal, widthHighlighted) { } }); - var highlightCallback = function(e, x, pts, row, set) { + var highlightCallback = function(e, x, pts, row, set) { + assertEquals(g, this); h_row = row; h_pts = pts; h_series = set; @@ -285,7 +294,7 @@ CallbackTestCase.prototype.testClosestPointStackedCallback = function() { */ CallbackTestCase.prototype.testClosestPointCallbackCss1 = function() { var css = "div.dygraph-legend > span { display: block; }\n" + - "div.dygraph-legend > span.highlight { border: 1px solid grey; }\n"; + "div.dygraph-legend > span.highlight { border: 1px solid grey; }\n"; this.styleSheet.innerHTML = css; runClosestTest(false, 2, 4); this.styleSheet.innerHTML = ''; @@ -296,7 +305,7 @@ CallbackTestCase.prototype.testClosestPointCallbackCss1 = function() { */ CallbackTestCase.prototype.testClosestPointCallbackCss2 = function() { var css = "div.dygraph-legend > span { display: none; }\n" + - "div.dygraph-legend > span.highlight { display: inline; }\n"; + "div.dygraph-legend > span.highlight { display: inline; }\n"; this.styleSheet.innerHTML = css; runClosestTest(false, 10, 15); this.styleSheet.innerHTML = ''; @@ -342,7 +351,8 @@ CallbackTestCase.prototype.testNaNData = function() { var h_row; var h_pts; - var highlightCallback = function(e, x, pts, row) { + var highlightCallback = function(e, x, pts, row) { + assertEquals(g, this); h_row = row; h_pts = pts; }; @@ -394,7 +404,8 @@ CallbackTestCase.prototype.testNaNDataStack = function() { var h_row; var h_pts; - var highlightCallback = function(e, x, pts, row) { + var highlightCallback = function(e, x, pts, row) { + assertEquals(g, this); h_row = row; h_pts = pts; }; @@ -459,7 +470,8 @@ CallbackTestCase.prototype.testGapHighlight = function() { var h_row; var h_pts; - var highlightCallback = function(e, x, pts, row) { + var highlightCallback = function(e, x, pts, row) { + assertEquals(g, this); h_row = row; h_pts = pts; }; @@ -472,7 +484,7 @@ CallbackTestCase.prototype.testGapHighlight = function() { connectSeparatedPoints: true, drawPoints: true, labels: ['x', 'A', 'B'], - highlightCallback : highlightCallback + highlightCallback: highlightCallback }); DygraphOps.dispatchMouseMove(g, 1.1, 10); @@ -533,6 +545,7 @@ CallbackTestCase.prototype.testFailedResponse = function() { CallbackTestCase.prototype.testHighlightCallbackRow = function() { var highlightRow; var highlightCallback = function(e, x, pts, row) { + assertEquals(g, this); highlightRow = row; }; @@ -581,6 +594,7 @@ CallbackTestCase.prototype.underlayCallback_noSeries = function() { var yMin, yMax; var callback = function(canvas, area, g) { + assertEquals(g, this); called = true; yMin = g.yAxisRange(0)[0]; yMax = g.yAxisRange(0)[1]; @@ -604,6 +618,7 @@ CallbackTestCase.prototype.underlayCallback_yAxisRange = function() { var yMin, yMax; var callback = function(canvas, area, g) { + assertEquals(g, this); yMin = g.yAxisRange(0)[0]; yMax = g.yAxisRange(0)[1]; }; @@ -622,73 +637,75 @@ CallbackTestCase.prototype.underlayCallback_yAxisRange = function() { * Test that drawPointCallback is called for isolated points and correct idx for the point is returned. */ CallbackTestCase.prototype.testDrawPointCallback_idx = function() { - var indices = []; - - var g; - var callback = function(g, seriesName, canvasContext, cx, cy, color, pointSizeParam,idx) { - indices.push(idx); - Dygraph.Circles.DEFAULT.apply(this, arguments); - }; - - var graph = document.getElementById("graph"); - - var testdata = [[10, 2], [11, 3], [12, NaN], [13, 2], [14, NaN], [15, 3]]; - var graphOpts = { - labels: ['X', 'Y'], - valueRange: [0, 4], - drawPoints : false, - drawPointCallback : callback, - pointSize : 8 - }; - - // Test that correct idx for isolated points are passed to the callback. - g = new Dygraph(graph, testdata, graphOpts); - assertEquals(2, indices.length); - assertEquals([3, 5],indices); - - // Test that correct indices for isolated points + gap points are passed to the callback when - // drawGapEdgePoints is set. This should add one point at the right - // edge of the segment at x=11, but not at the graph edge at x=10. - indices = []; // Reset for new test - graphOpts.drawGapEdgePoints = true; - g = new Dygraph(graph, testdata, graphOpts); - assertEquals(3, indices.length); - assertEquals([1, 3, 5],indices); - - - //Test that correct indices are passed to the callback when zoomed in. - indices = []; // Reset for new test - graphOpts.dateWindow = [12.5,13.5] - graphOpts.drawPoints = true; - testdata = [[10, 2], [11, 3], [12, 4], [13, 2], [14, 5], [15, 3]]; - g = new Dygraph(graph, testdata, graphOpts); - assertEquals(3, indices.length); - assertEquals([2, 3, 4],indices); + var indices = []; + + var g; + var callback = function(g, seriesName, canvasContext, cx, cy, color, pointSizeParam,idx) { + assertEquals(g, this); + indices.push(idx); + Dygraph.Circles.DEFAULT.apply(this, arguments); + }; + + var graph = document.getElementById("graph"); + + var testdata = [[10, 2], [11, 3], [12, NaN], [13, 2], [14, NaN], [15, 3]]; + var graphOpts = { + labels: ['X', 'Y'], + valueRange: [0, 4], + drawPoints : false, + drawPointCallback : callback, + pointSize : 8 + }; + + // Test that correct idx for isolated points are passed to the callback. + g = new Dygraph(graph, testdata, graphOpts); + assertEquals(2, indices.length); + assertEquals([3, 5],indices); + + // Test that correct indices for isolated points + gap points are passed to the callback when + // drawGapEdgePoints is set. This should add one point at the right + // edge of the segment at x=11, but not at the graph edge at x=10. + indices = []; // Reset for new test + graphOpts.drawGapEdgePoints = true; + g = new Dygraph(graph, testdata, graphOpts); + assertEquals(3, indices.length); + assertEquals([1, 3, 5],indices); + + + //Test that correct indices are passed to the callback when zoomed in. + indices = []; // Reset for new test + graphOpts.dateWindow = [12.5,13.5] + graphOpts.drawPoints = true; + testdata = [[10, 2], [11, 3], [12, 4], [13, 2], [14, 5], [15, 3]]; + g = new Dygraph(graph, testdata, graphOpts); + assertEquals(3, indices.length); + assertEquals([2, 3, 4],indices); }; /** * Test that the correct idx is returned for the point in the onHiglightCallback. */ CallbackTestCase.prototype.testDrawHighlightPointCallback_idx = function() { - var idxToCheck = null; - - var drawHighlightPointCallback = function(g, seriesName, canvasContext, cx, cy, color, pointSizeParam,idx) { - idxToCheck = idx; - }; - var testdata = [[1, 2], [2, 3], [3, NaN], [4, 2], [5, NaN], [6, 3]]; - var graph = document.getElementById("graph"); - var g = new Dygraph(graph, testdata, - { - drawHighlightPointCallback : drawHighlightPointCallback - }); - - assertNull(idxToCheck); - DygraphOps.dispatchMouseMove(g, 3, 0); - // check that NaN point is not highlighted - assertNull(idxToCheck); - DygraphOps.dispatchMouseMove(g, 1, 2); - // check that correct index is returned - assertEquals(0,idxToCheck); - DygraphOps.dispatchMouseMove(g, 6, 3); - assertEquals(5,idxToCheck); + var idxToCheck = null; + + var drawHighlightPointCallback = function(g, seriesName, canvasContext, cx, cy, color, pointSizeParam,idx) { + assertEquals(g, this); + idxToCheck = idx; + }; + var testdata = [[1, 2], [2, 3], [3, NaN], [4, 2], [5, NaN], [6, 3]]; + var graph = document.getElementById("graph"); + var g = new Dygraph(graph, testdata, + { + drawHighlightPointCallback : drawHighlightPointCallback + }); + + assertNull(idxToCheck); + DygraphOps.dispatchMouseMove(g, 3, 0); + // check that NaN point is not highlighted + assertNull(idxToCheck); + DygraphOps.dispatchMouseMove(g, 1, 2); + // check that correct index is returned + assertEquals(0,idxToCheck); + DygraphOps.dispatchMouseMove(g, 6, 3); + assertEquals(5,idxToCheck); }; diff --git a/dygraph-canvas.js b/dygraph-canvas.js index efcad10..ea488ca 100644 --- a/dygraph-canvas.js +++ b/dygraph-canvas.js @@ -366,7 +366,7 @@ DygraphCanvasRenderer._drawPointsOnLine = function( for (var idx = 0; idx < pointsOnLine.length; idx++) { var cb = pointsOnLine[idx]; ctx.save(); - drawPointCallback( + drawPointCallback.call(e.dygraph, e.dygraph, e.setName, ctx, cb[0], cb[1], color, pointSize, cb[2]); ctx.restore(); } diff --git a/dygraph-interaction-model.js b/dygraph-interaction-model.js index 0011346..27c18b7 100644 --- a/dygraph-interaction-model.js +++ b/dygraph-interaction-model.js @@ -317,12 +317,12 @@ Dygraph.Interaction.treatMouseOpAsClick = function(g, event, context) { } if (selectedPoint) { - pointClickCallback(event, selectedPoint); + pointClickCallback.call(g, event, selectedPoint); } // TODO(danvk): pass along more info about the points, e.g. 'x' if (clickCallback) { - clickCallback(event, g.lastx_, g.selPoints_); + clickCallback.call(g, event, g.lastx_, g.selPoints_); } }; @@ -535,7 +535,7 @@ Dygraph.Interaction.moveTouch = function(event, g, context) { // We only call zoomCallback on zooms, not pans, to mirror desktop behavior. if (didZoom && touches.length > 1 && g.getFunctionOption('zoomCallback')) { var viewWindow = g.xAxisRange(); - g.getFunctionOption("zoomCallback")(viewWindow[0], viewWindow[1], g.yAxisRanges()); + g.getFunctionOption("zoomCallback").call(g, viewWindow[0], viewWindow[1], g.yAxisRanges()); } }; diff --git a/dygraph.js b/dygraph.js index 7b80e32..bc1b216 100644 --- a/dygraph.js +++ b/dygraph.js @@ -1621,7 +1621,7 @@ Dygraph.prototype.doZoomXDates_ = function(minDate, maxDate) { var that = this; this.doAnimatedZoom(old_window, new_window, null, null, function() { if (that.getFunctionOption("zoomCallback")) { - that.getFunctionOption("zoomCallback")( + that.getFunctionOption("zoomCallback").call(that, minDate, maxDate, that.yAxisRanges()); } }); @@ -1654,7 +1654,7 @@ Dygraph.prototype.doZoomY_ = function(lowY, highY) { this.doAnimatedZoom(null, null, oldValueRanges, newValueRanges, function() { if (that.getFunctionOption("zoomCallback")) { var xRange = that.xAxisRange(); - that.getFunctionOption("zoomCallback")( + that.getFunctionOption("zoomCallback").call(that, xRange[0], xRange[1], that.yAxisRanges()); } }); @@ -1709,7 +1709,7 @@ Dygraph.prototype.resetZoom = function() { } this.drawGraph_(); if (this.getFunctionOption("zoomCallback")) { - this.getFunctionOption("zoomCallback")( + this.getFunctionOption("zoomCallback").call(this, minDate, maxDate, this.yAxisRanges()); } return; @@ -1752,7 +1752,7 @@ Dygraph.prototype.resetZoom = function() { } } if (that.getFunctionOption("zoomCallback")) { - that.getFunctionOption("zoomCallback")( + that.getFunctionOption("zoomCallback").call(that, minDate, maxDate, that.yAxisRanges()); } }); @@ -1989,7 +1989,7 @@ Dygraph.prototype.mouseMove_ = function(event) { var callback = this.getFunctionOption("highlightCallback"); if (callback && selectionChanged) { - callback(event, + callback.call(this, event, this.lastx_, this.selPoints_, this.lastRow_, @@ -2119,7 +2119,7 @@ Dygraph.prototype.updateSelection_ = function(opt_animFraction) { ctx.lineWidth = this.getNumericOption('strokeWidth', pt.name); ctx.strokeStyle = color; ctx.fillStyle = color; - callback(this, pt.name, ctx, canvasx, pt.canvasy, + callback.call(this, this, pt.name, ctx, canvasx, pt.canvasy, color, circleSize, pt.idx); } ctx.restore(); @@ -2202,10 +2202,10 @@ Dygraph.prototype.setSelection = function(row, opt_seriesName, opt_locked) { */ Dygraph.prototype.mouseOut_ = function(event) { if (this.getFunctionOption("unhighlightCallback")) { - this.getFunctionOption("unhighlightCallback")(event); + this.getFunctionOption("unhighlightCallback").call(this, event); } - if (this.getFunctionOption("hideOverlayOnMouseOut") && !this.lockedSet_) { + if (this.getBooleanOption("hideOverlayOnMouseOut") && !this.lockedSet_) { this.clearSelection(); } }; @@ -2691,7 +2691,7 @@ Dygraph.prototype.renderGraph_ = function(is_initial_draw) { if (this.getFunctionOption('underlayCallback')) { // NOTE: we pass the dygraph object to this callback twice to avoid breaking // users who expect a deprecated form of this callback. - this.getFunctionOption('underlayCallback')( + this.getFunctionOption('underlayCallback').call(this, this.hidden_ctx_, this.layout_.getPlotArea(), this, this); } @@ -3719,7 +3719,7 @@ Dygraph.prototype.ready = function(callback) { if (this.is_initial_draw_) { this.readyFns_.push(callback); } else { - callback(this); + callback.call(this, this); } }; -- 2.7.4