closurize dygraph-interaction-model.js
authorDan Vanderkam <danvdk@gmail.com>
Mon, 22 Jul 2013 21:55:52 +0000 (17:55 -0400)
committerDan Vanderkam <danvdk@gmail.com>
Mon, 22 Jul 2013 21:55:52 +0000 (17:55 -0400)
closure-todo.txt
dygraph-externs.js
dygraph-interaction-model.js
dygraph-layout.js
dygraph-utils.js
dygraph.js

index 3d724bb..e639042 100644 (file)
@@ -10,7 +10,7 @@ under the Closure Compiler without any errors or warnings.
 
 Core:
 x dygraph-canvas.js
-- dygraph-interaction-model.js
+x dygraph-interaction-model.js
 x dygraph-layout.js
 x dygraph-options.js
 - dygraph.js
@@ -32,7 +32,7 @@ Plugins:
 
 Here's a command that can be used to build dygraphs using the closure
 compiler:
-java -jar ../../closure-compiler-read-only/build/compiler.jar --js=dygraph-utils.js --js=dashed-canvas.js --js=dygraph-options-reference.js --js=dygraph-tickers.js --js=dygraph-gviz.js --js=dygraph-options.js --js=dygraph-layout.js --js_output_file=/tmp/out.js --compilation_level ADVANCED_OPTIMIZATIONS --warning_level VERBOSE --externs dygraph-externs.js
+java -jar ../../closure-compiler-read-only/build/compiler.jar --js=dygraph-utils.js --js=dashed-canvas.js --js=dygraph-options-reference.js --js=dygraph-tickers.js --js=dygraph-gviz.js --js=dygraph-options.js --js=dygraph-layout.js --js=dygraph-canvas.js --js_output_file=/tmp/out.js --compilation_level ADVANCED_OPTIMIZATIONS --warning_level VERBOSE --externs dygraph-externs.js
 
 As each file is closurized, it can be added as a "--js" parameter.
 
index 171d90d..bc6a684 100644 (file)
@@ -95,6 +95,8 @@ Dygraph.PointType;
 Dygraph.prototype.attrs_;
 /** @type {Object} */
 Dygraph.prototype.user_attrs_;
+/** @type {Array.<Object>} */
+Dygraph.prototype.selPoints_;  // TODO(danvk): type actually has .canvasx, ...
 
 /**
  * @param {string} name the name of the option.
@@ -102,9 +104,45 @@ Dygraph.prototype.user_attrs_;
 Dygraph.prototype.attr_ = function(name) {};
 
 /**
- * @return {{w: number, h: number}} object.
+ * @return {{width: number, height: number}} object.
  */
-Dygraph.prototype.size;
+Dygraph.prototype.size = function() {};
+
+/**
+ * @return {Dygraph.Rect}
+ */
+Dygraph.prototype.getArea = function() {};
+
+/**
+ * @return {!Array.<number>}
+ */
+Dygraph.prototype.xAxisExtremes = function() {};
+
+/**
+ * @param {?number} x The data x-value.
+ * @return {?number} The DOM coordinate, or null if the input is null.
+ */
+Dygraph.prototype.toDomXCoord = function(x) {};
+
+/**
+ * @param {?number} y The data y-value.
+ * @param {number=} opt_axis The axis number (0=primary).
+ * @return {?number} The DOM coordinate, or null if the input is null.
+ */
+Dygraph.prototype.toDomYCoord = function(y, opt_axis) {};
+
+/**
+ * @param {?number} x The DOM x-coordinate.
+ * @return {?number} The data x-coordinate, or null if the input is null.
+ */
+Dygraph.prototype.toDataXCoord = function(x) {};
+
+/**
+ * @param {?number} y The DOM y-coordinate.
+ * @param {number=} opt_axis The axis number (0=primary).
+ * @return {?number} The data y-value, or null if the input is null.
+ */
+Dygraph.prototype.toDataYCoord = function(y, opt_axis) {};
 
 /**
  * @type {DygraphLayout}
@@ -156,11 +194,33 @@ Dygraph.prototype.hidden_ctx_;
 Dygraph.prototype.colorsMap_;
 
 /**
+ * TODO(danvk): be more specific
+ * @type {Array.<Object>}
+ */
+Dygraph.prototype.axes_;
+
+/**
+ * @type {number}
+ */
+Dygraph.prototype.lastx_;
+
+/**
  * @return {!Array.<number>} two element [left, right] array.
  */
 Dygraph.prototype.xAxisRange = function() {};
 
 /**
+ * @param {number=} opt_axis Optional axis (0=primary).
+ * @return {Array.<number>} A two-element array: [bottom, top].
+ */
+Dygraph.prototype.yAxisRange = function(opt_axis) {};
+
+/**
+ * @return {!Array.<!Array.<number>>}
+ */
+Dygraph.prototype.yAxisRanges = function() {};
+
+/**
  * @param {string} setName Set name.
  * @return {Object} axis properties for the series.
  */
@@ -191,6 +251,46 @@ Dygraph.prototype.getLabels = function() {};
  */
 Dygraph.prototype.getColors = function() {};
 
+/**
+ */
+Dygraph.prototype.drawGraph_ = function() {};
+
+/**
+ * @param {number} direction 
+ * @param {number} startX
+ * @param {number} endX
+ * @param {number} startY
+ * @param {number} endY
+ * @param {number} prevDirection
+ * @param {number} prevEndX
+ * @param {number} prevEndY
+ * @private
+ */
+Dygraph.prototype.drawZoomRect_ = function(direction, startX, endX, startY,
+                                           endY, prevDirection, prevEndX,
+                                           prevEndY) {};
+
+
+Dygraph.prototype.clearZoomRect_ = function() {};
+Dygraph.prototype.resetZoom = function() {};
+
+/**
+ * @param {number} lowX
+ * @param {number} highX
+ */
+Dygraph.prototype.doZoomX_ = function(lowX, highX) {};
+
+/**
+ * @param {number} lowY
+ * @param {number} highY
+ */
+Dygraph.prototype.doZoomY_ = function(lowY, highY) {};
+
+/** @type {number} */
+Dygraph.HORIZONTAL;
+/** @type {number} */
+Dygraph.VERTICAL;
+
 /** @type {{axes: Object}} */
 Dygraph.DEFAULT_ATTRS;
 
@@ -255,3 +355,18 @@ Dygraph.AxisType;
  * @typedef {function(Object)}
  */
 Dygraph.PlotterType;
+
+
+/**
+ * @typedef {{
+ *   px: number,
+ *   py: number,
+ *   isZooming: boolean,
+ *   isPanning: boolean,
+ *   is2DPan: boolean,
+ *   cancelNextDblclick: boolean,
+ *   initializeMouseDown:
+ *       function(!Event, !Dygraph, !Dygraph.InteractionContext)
+ * }}
+ */
+Dygraph.InteractionContext;
index 2af345c..09b82fa 100644 (file)
  * @author Robert Konigsberg (konigsberg@google.com)
  */
 
+(function() {
+
 /*jshint globalstrict: true */
 /*global Dygraph:false */
 "use strict";
 
 /**
  * A collection of functions to facilitate build custom interaction models.
- * @class
  */
 Dygraph.Interaction = {};
 
@@ -28,10 +29,10 @@ Dygraph.Interaction = {};
  * Custom interaction model builders can use it to provide the default
  * panning behavior.
  *
- * @param {Event} event the event object which led to the startPan call.
- * @param {Dygraph} g The dygraph on which to act.
- * @param {Object} context The dragging context object (with
- *     dragStartX/dragStartY/etc. properties). This function modifies the
+ * @param {!Event} event the event object which led to the startPan call.
+ * @param {!Dygraph} g The dygraph on which to act.
+ * @param {!Dygraph.InteractionContext} context The dragging context object
+ *     (with dragStartX/dragStartY/etc. properties). This function modifies the
  *     context.
  */
 Dygraph.Interaction.startPan = function(event, g, context) {
@@ -40,10 +41,11 @@ Dygraph.Interaction.startPan = function(event, g, context) {
   var xRange = g.xAxisRange();
   context.dateRange = xRange[1] - xRange[0];
   context.initialLeftmostDate = xRange[0];
-  context.xUnitsPerPixel = context.dateRange / (g.plotter_.area.w - 1);
+  context.xUnitsPerPixel = context.dateRange / (g.getArea().w - 1);
 
   if (g.attr_("panEdgeFraction")) {
-    var maxXPixelsToDraw = g.width_ * g.attr_("panEdgeFraction");
+    var size = g.size();
+    var maxXPixelsToDraw = size.width * /**@type{number}*/(g.getOption("panEdgeFraction"));
     var xExtremes = g.xAxisExtremes(); // I REALLY WANT TO CALL THIS xTremes!
 
     var boundedLeftX = g.toDomXCoord(xExtremes[0]) - maxXPixelsToDraw;
@@ -54,11 +56,11 @@ Dygraph.Interaction.startPan = function(event, g, context) {
     context.boundedDates = [boundedLeftDate, boundedRightDate];
 
     var boundedValues = [];
-    var maxYPixelsToDraw = g.height_ * g.attr_("panEdgeFraction");
+    var maxYPixelsToDraw = size.height * /**@type{number}*/(g.attr_("panEdgeFraction"));
 
     for (i = 0; i < g.axes_.length; i++) {
       axis = g.axes_[i];
-      var yExtremes = axis.extremeRange;
+      var yExtremes = axis['extremeRange'];
 
       var boundedTopY = g.toDomYCoord(yExtremes[0], i) + maxYPixelsToDraw;
       var boundedBottomY = g.toDomYCoord(yExtremes[1], i) - maxYPixelsToDraw;
@@ -92,7 +94,7 @@ Dygraph.Interaction.startPan = function(event, g, context) {
       axis_data.initialTopValue = yRange[1];
       axis_data.dragValueRange = yRange[1] - yRange[0];
     }
-    axis_data.unitsPerPixel = axis_data.dragValueRange / (g.plotter_.area.h - 1);
+    axis_data.unitsPerPixel = axis_data.dragValueRange / (g.getArea().h - 1);
     context.axes.push(axis_data);
 
     // While calculating axes, set 2dpan.
@@ -108,15 +110,15 @@ Dygraph.Interaction.startPan = function(event, g, context) {
  * Custom interaction model builders can use it to provide the default
  * panning behavior.
  *
- * @param {Event} event the event object which led to the movePan call.
- * @param {Dygraph} g The dygraph on which to act.
- * @param {Object} context The dragging context object (with
- *     dragStartX/dragStartY/etc. properties). This function modifies the
+ * @param {!Event} event the event object which led to the movePan call.
+ * @param {!Dygraph} g The dygraph on which to act.
+ * @param {!Dygraph.InteractionContext} context The dragging context object
+ *     (with dragStartX/dragStartY/etc. properties). This function modifies the
  *     context.
  */
 Dygraph.Interaction.movePan = function(event, g, context) {
-  context.dragEndX = g.dragGetX_(event, context);
-  context.dragEndY = g.dragGetY_(event, context);
+  context.dragEndX = Dygraph.dragGetX_(event, context);
+  context.dragEndY = Dygraph.dragGetY_(event, context);
 
   var minDate = context.initialLeftmostDate -
     (context.dragEndX - context.dragStartX) * context.xUnitsPerPixel;
@@ -162,15 +164,15 @@ Dygraph.Interaction.movePan = function(event, g, context) {
       }
       var logscale = g.attributes_.getForAxis("logscale", i);
       if (logscale) {
-        axis.valueWindow = [ Math.pow(Dygraph.LOG_SCALE, minValue),
-                             Math.pow(Dygraph.LOG_SCALE, maxValue) ];
+        axis.valueWindow = [ Math.pow(10, minValue),
+                             Math.pow(10, maxValue) ];
       } else {
         axis.valueWindow = [ minValue, maxValue ];
       }
     }
   }
 
-  g.drawGraph_(false);
+  g.drawGraph_();
 };
 
 /**
@@ -181,15 +183,15 @@ Dygraph.Interaction.movePan = function(event, g, context) {
  * Custom interaction model builders can use it to provide the default
  * panning behavior.
  *
- * @param {Event} event the event object which led to the endPan call.
- * @param {Dygraph} g The dygraph on which to act.
- * @param {Object} context The dragging context object (with
- *     dragStartX/dragStartY/etc. properties). This function modifies the
+ * @param {!Event} event the event object which led to the endPan call.
+ * @param {!Dygraph} g The dygraph on which to act.
+ * @param {!Dygraph.InteractionContext} context The dragging context object
+ *     (with dragStartX/dragStartY/etc. properties). This function modifies the
  *     context.
  */
 Dygraph.Interaction.endPan = function(event, g, context) {
-  context.dragEndX = g.dragGetX_(event, context);
-  context.dragEndY = g.dragGetY_(event, context);
+  context.dragEndX = Dygraph.dragGetX_(event, context);
+  context.dragEndY = Dygraph.dragGetY_(event, context);
 
   var regionWidth = Math.abs(context.dragEndX - context.dragStartX);
   var regionHeight = Math.abs(context.dragEndY - context.dragStartY);
@@ -219,10 +221,10 @@ Dygraph.Interaction.endPan = function(event, g, context) {
  * Custom interaction model builders can use it to provide the default
  * zooming behavior.
  *
- * @param {Event} event the event object which led to the startZoom call.
- * @param {Dygraph} g The dygraph on which to act.
- * @param {Object} context The dragging context object (with
- *     dragStartX/dragStartY/etc. properties). This function modifies the
+ * @param {!Event} event the event object which led to the startZoom call.
+ * @param {!Dygraph} g The dygraph on which to act.
+ * @param {!Dygraph.InteractionContext} context The dragging context object
+ *     (with dragStartX/dragStartY/etc. properties). This function modifies the
  *     context.
  */
 Dygraph.Interaction.startZoom = function(event, g, context) {
@@ -238,16 +240,16 @@ Dygraph.Interaction.startZoom = function(event, g, context) {
  * Custom interaction model builders can use it to provide the default
  * zooming behavior.
  *
- * @param {Event} event the event object which led to the moveZoom call.
- * @param {Dygraph} g The dygraph on which to act.
- * @param {Object} context The dragging context object (with
- *     dragStartX/dragStartY/etc. properties). This function modifies the
+ * @param {!Event} event the event object which led to the moveZoom call.
+ * @param {!Dygraph} g The dygraph on which to act.
+ * @param {!Dygraph.InteractionContext} context The dragging context object
+ *     (with dragStartX/dragStartY/etc. properties). This function modifies the
  *     context.
  */
 Dygraph.Interaction.moveZoom = function(event, g, context) {
   context.zoomMoved = true;
-  context.dragEndX = g.dragGetX_(event, context);
-  context.dragEndY = g.dragGetY_(event, context);
+  context.dragEndX = Dygraph.dragGetX_(event, context);
+  context.dragEndY = Dygraph.dragGetY_(event, context);
 
   var xDelta = Math.abs(context.dragStartX - context.dragEndX);
   var yDelta = Math.abs(context.dragStartY - context.dragEndY);
@@ -271,9 +273,9 @@ Dygraph.Interaction.moveZoom = function(event, g, context) {
 };
 
 /**
- * @param {Dygraph} g
- * @param {Event} event
- * @param {Object} context
+ * @param {!Dygraph} g
+ * @param {!Event} event
+ * @param {!Dygraph.InteractionContext} context
  */
 Dygraph.Interaction.treatMouseOpAsClick = function(g, event, context) {
   var clickCallback = g.attr_('clickCallback');
@@ -325,16 +327,16 @@ Dygraph.Interaction.treatMouseOpAsClick = function(g, event, context) {
  * Custom interaction model builders can use it to provide the default
  * zooming behavior.
  *
- * @param {Event} event the event object which led to the endZoom call.
- * @param {Dygraph} g The dygraph on which to end the zoom.
- * @param {Object} context The dragging context object (with
- *     dragStartX/dragStartY/etc. properties). This function modifies the
+ * @param {!Event} event the event object which led to the endZoom call.
+ * @param {!Dygraph} g The dygraph on which to end the zoom.
+ * @param {!Dygraph.InteractionContext} context The dragging context object
+ *     (with dragStartX/dragStartY/etc. properties). This function modifies the
  *     context.
  */
 Dygraph.Interaction.endZoom = function(event, g, context) {
   context.isZooming = false;
-  context.dragEndX = g.dragGetX_(event, context);
-  context.dragEndY = g.dragGetY_(event, context);
+  context.dragEndX = Dygraph.dragGetX_(event, context);
+  context.dragEndY = Dygraph.dragGetY_(event, context);
   var regionWidth = Math.abs(context.dragEndX - context.dragStartX);
   var regionHeight = Math.abs(context.dragEndY - context.dragStartY);
 
@@ -474,8 +476,8 @@ Dygraph.Interaction.moveTouch = function(event, g, context) {
   };
   var dataWidth = context.initialRange.x[1] - context.initialRange.x[0];
   var dataHeight = context.initialRange.y[0] - context.initialRange.y[1];
-  swipe.dataX = (swipe.pageX / g.plotter_.area.w) * dataWidth;
-  swipe.dataY = (swipe.pageY / g.plotter_.area.h) * dataHeight;
+  swipe.dataX = (swipe.pageX / g.getArea().w) * dataWidth;
+  swipe.dataY = (swipe.pageY / g.getArea().h) * dataHeight;
   var xScale, yScale;
 
   // The residual bits are usually split into scale & rotate bits, but we split
@@ -520,7 +522,7 @@ Dygraph.Interaction.moveTouch = function(event, g, context) {
     }
   }
 
-  g.drawGraph_(false);
+  g.drawGraph_();
 
   // We only call zoomCallback on zooms, not pans, to mirror desktop behavior.
   if (didZoom && touches.length > 1 && g.attr_('zoomCallback')) {
@@ -645,8 +647,8 @@ Dygraph.Interaction.nonInteractiveModel_ = {
   },
   mouseup: function(event, g, context) {
     // TODO(danvk): this logic is repeated in Dygraph.Interaction.endZoom
-    context.dragEndX = g.dragGetX_(event, context);
-    context.dragEndY = g.dragGetY_(event, context);
+    context.dragEndX = Dygraph.dragGetX_(event, context);
+    context.dragEndY = Dygraph.dragGetY_(event, context);
     var regionWidth = Math.abs(context.dragEndX - context.dragStartX);
     var regionHeight = Math.abs(context.dragEndY - context.dragStartY);
 
@@ -674,3 +676,5 @@ Dygraph.Interaction.dragIsPanInteractionModel = {
     }
   }
 };
+
+})();
index 79f4b27..76cdb5f 100644 (file)
@@ -118,8 +118,8 @@ DygraphLayout.prototype.computePlotArea = function() {
   };
 
   var size = this.dygraph_.size();
-  area.w = size.w - area.x - /** @type{number} */(this.attr_('rightGap'));
-  area.h = size.h;
+  area.w = size.width - area.x - /** @type{number} */(this.attr_('rightGap'));
+  area.h = size.height;
 
   // Let plugins reserve space.
   var e = {
index 55e4da6..e9dcd26 100644 (file)
@@ -375,6 +375,28 @@ Dygraph.pageY = function(e) {
 };
 
 /**
+ * Converts page the x-coordinate of the event to pixel x-coordinates on the
+ * canvas (i.e. DOM Coords).
+ * @param {!Event} e Drag event.
+ * @param {!Dygraph.InteractionContext} context Interaction context object.
+ * @return {number} The amount by which the drag has moved to the right.
+ */
+Dygraph.dragGetX_ = function(e, context) {
+  return Dygraph.pageX(e) - context.px;
+};
+
+/**
+ * Converts page the y-coordinate of the event to pixel y-coordinates on the
+ * canvas (i.e. DOM Coords).
+ * @param {!Event} e Drag event.
+ * @param {!Dygraph.InteractionContext} context Interaction context object.
+ * @return {number} The amount by which the drag has moved down.
+ */
+Dygraph.dragGetY_ = function(e, context) {
+  return Dygraph.pageY(e) - context.py;
+};
+
+/**
  * This returns true unless the parameter is 0, null, undefined or NaN.
  * TODO(danvk): rename this function to something like 'isNonZeroNan'.
  *
index ec04936..f751c7d 100644 (file)
@@ -360,8 +360,8 @@ var parseFloat_;
 
 // Directions for panning and zooming. Use bit operations when combined
 // values are possible.
-var HORIZONTAL = 1;
-var VERTICAL = 2;
+Dygraph.HORIZONTAL = 1;
+Dygraph.VERTICAL = 2;
 
 // Installed plugins, in order of precedence (most-general to most-specific).
 // Plugins are installed after they are defined, in plugins/install.js.
@@ -708,6 +708,7 @@ Dygraph.prototype.xAxisRange = function() {
 /**
  * Returns the lower- and upper-bound x-axis values of the
  * data set.
+ * @return {!Array.<number>}
  */
 Dygraph.prototype.xAxisExtremes = function() {
   var pad = this.attr_('xRangePad') / this.plotter_.area.w;
@@ -729,10 +730,11 @@ Dygraph.prototype.xAxisExtremes = function() {
  * Returns the currently-visible y-range for an axis. This can be affected by
  * zooming, panning or a call to updateOptions. Axis indices are zero-based. If
  * called with no arguments, returns the range of the first axis.
- * Returns a two-element array: [bottom, top].
+ * @param {number=} opt_axis Optional axis (0=primary).
+ * @return {Array.<number>} A two-element array: [bottom, top].
  */
-Dygraph.prototype.yAxisRange = function(idx) {
-  if (typeof(idx) == "undefined") idx = 0;
+Dygraph.prototype.yAxisRange = function(opt_axis) {
+  var idx = opt_axis || 0;
   if (idx < 0 || idx >= this.axes_.length) {
     return null;
   }
@@ -744,6 +746,9 @@ Dygraph.prototype.yAxisRange = function(idx) {
  * Returns the currently-visible y-ranges for each axis. This can be affected by
  * zooming, panning, calls to updateOptions, etc.
  * Returns an array of [bottom, top] pairs, one for each y-axis.
+ *
+ * @return {!Array.<!Array.<number>>} An array of [bottom, top] pairs, one for
+ *     each axis.
  */
 Dygraph.prototype.yAxisRanges = function() {
   var ret = [];
@@ -772,6 +777,8 @@ Dygraph.prototype.toDomCoords = function(x, y, axis) {
  * If specified, do this conversion for the coordinate system of a particular
  * axis.
  * Returns a single value or null if x is null.
+ * @param {?number} x The data x-value.
+ * @return {?number} The DOM coordinate, or null if the input is null.
  */
 Dygraph.prototype.toDomXCoord = function(x) {
   if (x === null) {
@@ -788,9 +795,12 @@ Dygraph.prototype.toDomXCoord = function(x) {
  * axis. Uses the first axis by default.
  *
  * returns a single value or null if y is null.
+ * @param {?number} y The data y-value.
+ * @param {number=} opt_axis The axis number (0=primary).
+ * @return {?number} The DOM coordinate, or null if the input is null.
  */
-Dygraph.prototype.toDomYCoord = function(y, axis) {
-  var pct = this.toPercentYCoord(y, axis);
+Dygraph.prototype.toDomYCoord = function(y, opt_axis) {
+  var pct = this.toPercentYCoord(y, opt_axis);
 
   if (pct === null) {
     return null;
@@ -816,6 +826,8 @@ Dygraph.prototype.toDataCoords = function(x, y, axis) {
  * Convert from canvas/div x coordinate to data coordinate.
  *
  * If x is null, this returns null.
+ * @param {?number} x The DOM x-coordinate.
+ * @return {?number} The data x-coordinate, or null if the input is null.
  */
 Dygraph.prototype.toDataXCoord = function(x) {
   if (x === null) {
@@ -832,16 +844,20 @@ Dygraph.prototype.toDataXCoord = function(x) {
  *
  * If y is null, this returns null.
  * if axis is null, this uses the first axis.
+ * @param {?number} y The DOM y-coordinate.
+ * @param {number=} opt_axis The axis number (0=primary).
+ * @return {?number} The data y-value, or null if the input is null.
  */
-Dygraph.prototype.toDataYCoord = function(y, axis) {
+Dygraph.prototype.toDataYCoord = function(y, opt_axis) {
   if (y === null) {
     return null;
   }
 
   var area = this.plotter_.area;
-  var yRange = this.yAxisRange(axis);
+  var yRange = this.yAxisRange(opt_axis);
+
+  var axis = opt_axis || 0;
 
-  if (typeof(axis) == "undefined") axis = 0;
   if (!this.axes_[axis].logscale) {
     return yRange[0] + (area.y + area.h - y) / area.h * (yRange[1] - yRange[0]);
   } else {
@@ -1245,24 +1261,6 @@ Dygraph.prototype.createRollInterface_ = function() {
 };
 
 /**
- * @private
- * Converts page the x-coordinate of the event to pixel x-coordinates on the
- * canvas (i.e. DOM Coords).
- */
-Dygraph.prototype.dragGetX_ = function(e, context) {
-  return Dygraph.pageX(e) - context.px;
-};
-
-/**
- * @private
- * Converts page the y-coordinate of the event to pixel y-coordinates on the
- * canvas (i.e. DOM Coords).
- */
-Dygraph.prototype.dragGetY_ = function(e, context) {
-  return Dygraph.pageY(e) - context.py;
-};
-
-/**
  * Set up all the mouse handlers needed to capture dragging behavior for zoom
  * events.
  * @private
@@ -1322,8 +1320,8 @@ Dygraph.prototype.createDragInterface_ = function() {
       var canvasPos = Dygraph.findPos(g.canvas_);
       contextB.px = canvasPos.x;
       contextB.py = canvasPos.y;
-      contextB.dragStartX = g.dragGetX_(event, contextB);
-      contextB.dragStartY = g.dragGetY_(event, contextB);
+      contextB.dragStartX = Dygraph.dragGetX_(event, contextB);
+      contextB.dragStartY = Dygraph.dragGetY_(event, contextB);
       contextB.cancelNextDblclick = false;
       contextB.tarp.cover();
     }
@@ -1378,20 +1376,20 @@ Dygraph.prototype.createDragInterface_ = function() {
  * avoid extra redrawing, but it's tricky to avoid interactions with the status
  * dots.
  *
- * @param {Number} direction the direction of the zoom rectangle. Acceptable
- * values are HORIZONTAL and VERTICAL.
- * @param {Number} startX The X position where the drag started, in canvas
- * coordinates.
- * @param {Number} endX The current X position of the drag, in canvas coords.
- * @param {Number} startY The Y position where the drag started, in canvas
- * coordinates.
- * @param {Number} endY The current Y position of the drag, in canvas coords.
- * @param {Number} prevDirection the value of direction on the previous call to
- * this function. Used to avoid excess redrawing
- * @param {Number} prevEndX The value of endX on the previous call to this
- * function. Used to avoid excess redrawing
- * @param {Number} prevEndY The value of endY on the previous call to this
- * function. Used to avoid excess redrawing
+ * @param {number} direction the direction of the zoom rectangle. Acceptable
+ *     values are Dygraph.HORIZONTAL and Dygraph.VERTICAL.
+ * @param {number} startX The X position where the drag started, in canvas
+ *     coordinates.
+ * @param {number} endX The current X position of the drag, in canvas coords.
+ * @param {number} startY The Y position where the drag started, in canvas
+ *     coordinates.
+ * @param {number} endY The current Y position of the drag, in canvas coords.
+ * @param {number} prevDirection the value of direction on the previous call to
+ *     this function. Used to avoid excess redrawing
+ * @param {number} prevEndX The value of endX on the previous call to this
+ *     function. Used to avoid excess redrawing
+ * @param {number} prevEndY The value of endY on the previous call to this
+ *     function. Used to avoid excess redrawing
  * @private
  */
 Dygraph.prototype.drawZoomRect_ = function(direction, startX, endX, startY,
@@ -1400,22 +1398,22 @@ Dygraph.prototype.drawZoomRect_ = function(direction, startX, endX, startY,
   var ctx = this.canvas_ctx_;
 
   // Clean up from the previous rect if necessary
-  if (prevDirection == HORIZONTAL) {
+  if (prevDirection == Dygraph.HORIZONTAL) {
     ctx.clearRect(Math.min(startX, prevEndX), this.layout_.getPlotArea().y,
                   Math.abs(startX - prevEndX), this.layout_.getPlotArea().h);
-  } else if (prevDirection == VERTICAL) {
+  } else if (prevDirection == Dygraph.VERTICAL) {
     ctx.clearRect(this.layout_.getPlotArea().x, Math.min(startY, prevEndY),
                   this.layout_.getPlotArea().w, Math.abs(startY - prevEndY));
   }
 
   // Draw a light-grey rectangle to show the new viewing area
-  if (direction == HORIZONTAL) {
+  if (direction == Dygraph.HORIZONTAL) {
     if (endX && startX) {
       ctx.fillStyle = "rgba(128,128,128,0.33)";
       ctx.fillRect(Math.min(startX, endX), this.layout_.getPlotArea().y,
                    Math.abs(endX - startX), this.layout_.getPlotArea().h);
     }
-  } else if (direction == VERTICAL) {
+  } else if (direction == Dygraph.VERTICAL) {
     if (endY && startY) {
       ctx.fillStyle = "rgba(128,128,128,0.33)";
       ctx.fillRect(this.layout_.getPlotArea().x, Math.min(startY, endY),
@@ -1443,8 +1441,8 @@ Dygraph.prototype.clearZoomRect_ = function() {
  * points near lowX or highX. Don't confuse this function with doZoomXDates,
  * which accepts dates that match the raw data. This function redraws the graph.
  *
- * @param {Number} lowX The leftmost pixel value that should be visible.
- * @param {Number} highX The rightmost pixel value that should be visible.
+ * @param {number} lowX The leftmost pixel value that should be visible.
+ * @param {number} highX The rightmost pixel value that should be visible.
  * @private
  */
 Dygraph.prototype.doZoomX_ = function(lowX, highX) {
@@ -1494,8 +1492,8 @@ Dygraph.prototype.doZoomXDates_ = function(minDate, maxDate) {
  * Zoom to something containing [lowY, highY]. These are pixel coordinates in
  * the canvas. This function redraws the graph.
  *
- * @param {Number} lowY The topmost pixel value that should be visible.
- * @param {Number} highY The lowest pixel value that should be visible.
+ * @param {number} lowY The topmost pixel value that should be visible.
+ * @param {number} highY The lowest pixel value that should be visible.
  * @private
  */
 Dygraph.prototype.doZoomY_ = function(lowY, highY) {
@@ -1659,7 +1657,7 @@ Dygraph.prototype.doAnimatedZoom = function(oldXRange, newXRange, oldYRanges, ne
 /**
  * Get the current graph's area object.
  *
- * Returns: {x, y, w, h}
+ * @return {Dygraph.Rect} An {x, y, w, h} object.
  */
 Dygraph.prototype.getArea = function() {
   return this.plotter_.area;
@@ -3742,7 +3740,7 @@ Dygraph.prototype.setVisibility = function(num, value) {
 /**
  * How large of an area will the dygraph render itself in?
  * This is used for testing.
- * @return A {width: w, height: h} object.
+ * @return {{width: number, height: number}} The size of the chart element.
  * @private
  */
 Dygraph.prototype.size = function() {