Set "this" to the Dygraph object in all callbacks callback-this
authorDan Vanderkam <danvdk@gmail.com>
Thu, 13 Nov 2014 03:48:04 +0000 (22:48 -0500)
committerDan Vanderkam <danvdk@gmail.com>
Thu, 13 Nov 2014 03:58:14 +0000 (22:58 -0500)
auto_tests/tests/callback.js
dygraph-canvas.js
dygraph-interaction-model.js
dygraph.js

index af524a0..5fe1739 100644 (file)
@@ -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);
 };
index efcad10..ea488ca 100644 (file)
@@ -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();
   }
index 0011346..27c18b7 100644 (file)
@@ -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());
   }
 };
 
index 7b80e32..bc1b216 100644 (file)
@@ -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);
   }
 };