Namespace the canvas proxy in auto tests.
[dygraphs.git] / dygraph.js
index 77f9ab4..941badb 100644 (file)
@@ -44,7 +44,7 @@
  */
 
 /*jshint globalstrict: true */
-/*global DygraphRangeSelector:false, DygraphLayout:false, DygraphCanvasRenderer:false, G_vmlCanvasManager:false */
+/*global DygraphLayout:false, DygraphCanvasRenderer:false, DygraphOptions:false, G_vmlCanvasManager:false */
 "use strict";
 
 /**
@@ -415,12 +415,6 @@ Dygraph.prototype.__init__ = function(div, file, attrs) {
     // TODO(nikhilk): Add any other stackedGraph checks here.
   }
 
-  // These two options have a bad interaction. See issue 359.
-  if (attrs.showRangeSelector && attrs.animatedZooms) {
-    this.warn('You should not set animatedZooms=true when using the range selector.');
-    attrs.animatedZooms = false;
-  }
-
   // DEPRECATION WARNING: All option processing should be moved from
   // attrs_ and user_attrs_ to options_, which holds all this information.
   //
@@ -491,6 +485,8 @@ Dygraph.prototype.__init__ = function(div, file, attrs) {
     }
   }
 
+  this.createDragInterface_();
+
   this.start_();
 };
 
@@ -603,7 +599,8 @@ Dygraph.prototype.getOption = function(name, opt_seriesName) {
 
 Dygraph.prototype.getOptionForAxis = function(name, axis) {
   return this.attributes_.getForAxis(name, axis);
-}
+};
+
 /**
  * @private
  * @param  String} axis The name of the axis (i.e. 'x', 'y' or 'y2')
@@ -949,12 +946,6 @@ Dygraph.prototype.createInterface_ = function() {
   this.hidden_ = this.createPlotKitCanvas_(this.canvas_);
   this.hidden_ctx_ = Dygraph.getContext(this.hidden_);
 
-  if (this.attr_('showRangeSelector')) {
-    // The range selector must be created here so that its canvases and contexts get created here.
-    // For some reason, if the canvases and contexts don't get created here, things don't work in IE.
-    this.rangeSelector_ = new DygraphRangeSelector(this);
-  }
-
   // The interactive parts of the graph are drawn on top of the chart.
   this.graphDiv.appendChild(this.hidden_);
   this.graphDiv.appendChild(this.canvas_);
@@ -963,32 +954,30 @@ Dygraph.prototype.createInterface_ = function() {
   // Create the grapher
   this.layout_ = new DygraphLayout(this);
 
-  if (this.rangeSelector_) {
-    // This needs to happen after the graph canvases are added to the div and the layout object is created.
-    this.rangeSelector_.addToGraph(this.graphDiv, this.layout_);
-  }
-
   var dygraph = this;
 
-  this.mouseMoveHandler = function(e) {
+  this.mouseMoveHandler_ = function(e) {
     dygraph.mouseMove_(e);
   };
-  this.addEvent(this.mouseEventElement_, 'mousemove', this.mouseMoveHandler);
 
-  this.mouseOutHandler = function(e) {
+  this.mouseOutHandler_ = function(e) {
     dygraph.mouseOut_(e);
   };
-  this.addEvent(this.mouseEventElement_, 'mouseout', this.mouseOutHandler);
 
-  this.createDragInterface_();
+  this.addEvent(this.mouseEventElement_, 'mousemove', this.mouseMoveHandler_);
+  this.addEvent(this.mouseEventElement_, 'mouseout', this.mouseOutHandler_);
 
-  this.resizeHandler = function(e) {
-    dygraph.resize();
-  };
+  // Don't recreate and register the resize handler on subsequent calls.
+  // This happens when the graph is resized.
+  if (!this.resizeHandler_) {
+    this.resizeHandler_ = function(e) {
+      dygraph.resize();
+    };
 
-  // Update when the window is resized.
-  // TODO(danvk): drop frames depending on complexity of the chart.
-  this.addEvent(window, 'resize', this.resizeHandler);
+    // Update when the window is resized.
+    // TODO(danvk): drop frames depending on complexity of the chart.
+    this.addEvent(window, 'resize', this.resizeHandler_);
+  }
 };
 
 /**
@@ -1004,16 +993,24 @@ Dygraph.prototype.destroy = function() {
     }
   };
 
-  for (var idx = 0; idx < this.registeredEvents_.length; idx++) {
-    var reg = this.registeredEvents_[idx];
-    Dygraph.removeEvent(reg.elem, reg.type, reg.fn);
+  if (this.registeredEvents_) {
+    for (var idx = 0; idx < this.registeredEvents_.length; idx++) {
+      var reg = this.registeredEvents_[idx];
+      Dygraph.removeEvent(reg.elem, reg.type, reg.fn);
+    }
   }
+
   this.registeredEvents_ = [];
 
   // remove mouse event handlers (This may not be necessary anymore)
-  Dygraph.removeEvent(this.mouseEventElement_, 'mouseout', this.mouseOutHandler);
-  Dygraph.removeEvent(this.mouseEventElement_, 'mousemove', this.mouseMoveHandler);
+  Dygraph.removeEvent(this.mouseEventElement_, 'mouseout', this.mouseOutHandler_);
+  Dygraph.removeEvent(this.mouseEventElement_, 'mousemove', this.mouseMoveHandler_);
   Dygraph.removeEvent(this.mouseEventElement_, 'mousemove', this.mouseUpHandler_);
+
+  // remove window handlers
+  Dygraph.removeEvent(window,'resize',this.resizeHandler_);
+  this.resizeHandler_ = null;
+
   removeRecursive(this.maindiv_);
 
   var nullOut = function(obj) {
@@ -1023,9 +1020,6 @@ Dygraph.prototype.destroy = function() {
       }
     }
   };
-  // remove event handlers
-  Dygraph.removeEvent(window,'resize',this.resizeHandler);
-  this.resizeHandler = null;
   // These may not all be necessary, but it can't hurt...
   nullOut(this.layout_);
   nullOut(this.plotter_);
@@ -1287,6 +1281,12 @@ Dygraph.prototype.createDragInterface_ = function() {
         bindHandler(interactionModel[eventName]));
   }
 
+  // unregister the handler on subsequent calls.
+  // This happens when the graph is resized.
+  if (this.mouseUpHandler_) {
+    Dygraph.removeEvent(document, 'mouseup', this.mouseUpHandler_);
+  }
+
   // If the user releases the mouse button during a drag, but not over the
   // canvas, then it doesn't count as a zooming action.
   this.mouseUpHandler_ = function(event) {
@@ -1701,7 +1701,6 @@ Dygraph.prototype.findStackedPoint = function(domX, domY) {
   var row = this.findClosestRow(domX);
   var boundary = this.getLeftBoundary_();
   var rowIdx = row - boundary;
-  var sets = this.layout_.points;
   var closestPoint, closestSeries;
   for (var setIdx = 0; setIdx < this.layout_.datasets.length; ++setIdx) {
     var points = this.layout_.points[setIdx];
@@ -1852,7 +1851,8 @@ Dygraph.prototype.animateSelection_ = function(direction) {
  * @private
  */
 Dygraph.prototype.updateSelection_ = function(opt_animFraction) {
-  var defaultPrevented = this.cascadeEvents_('select', {
+  /*var defaultPrevented = */
+  this.cascadeEvents_('select', {
     selectedX: this.lastx_,
     selectedPoints: this.selPoints_
   });
@@ -2151,6 +2151,8 @@ Dygraph.prototype.extremeValues_ = function(series) {
 Dygraph.prototype.predraw_ = function() {
   var start = new Date();
 
+  this.layout_.computePlotArea();
+
   // TODO(danvk): move more computations out of drawGraph_ and into here.
   this.computeYAxes_();
 
@@ -2170,10 +2172,6 @@ Dygraph.prototype.predraw_ = function() {
 
   this.cascadeEvents_('predraw');
 
-  if (this.rangeSelector_) {
-    this.rangeSelector_.renderStaticLayer();
-  }
-
   // Convert the raw data (a 2D array) into the internal format and compute
   // rolling averages.
   this.rolledSeries_ = [null];  // x-axis is the first series and it's special
@@ -2376,9 +2374,7 @@ Dygraph.prototype.drawGraph_ = function() {
 
   if (this.attr_("timingName")) {
     var end = new Date();
-    if (console) {
-      console.log(this.attr_("timingName") + " - drawGraph: " + (end - start) + "ms");
-    }
+    Dygraph.info(this.attr_("timingName") + " - drawGraph: " + (end - start) + "ms");
   }
 };
 
@@ -2412,11 +2408,6 @@ Dygraph.prototype.renderGraph_ = function(is_initial_draw) {
   this.canvas_.getContext('2d').clearRect(0, 0, this.canvas_.width,
                                           this.canvas_.height);
 
-  // Generate a static legend before any particular point is selected.
-
-  if (this.rangeSelector_) {
-    this.rangeSelector_.renderInteractiveLayer();
-  }
   if (this.attr_("drawCallback") !== null) {
     this.attr_("drawCallback")(this, is_initial_draw);
   }
@@ -2433,10 +2424,9 @@ Dygraph.prototype.renderGraph_ = function(is_initial_draw) {
  *   indices are into the axes_ array.
  */
 Dygraph.prototype.computeYAxes_ = function() {
-
   // Preserve valueWindow settings if they exist, and if the user hasn't
   // specified a new valueRange.
-  var i, valueWindows, seriesName, axis, index, opts, v;
+  var valueWindows, axis, index, opts, v;
   if (this.axes_ !== undefined && this.user_attrs_.hasOwnProperty("valueRange") === false) {
     valueWindows = [];
     for (index = 0; index < this.axes_.length; index++) {
@@ -2448,7 +2438,7 @@ Dygraph.prototype.computeYAxes_ = function() {
   // data computation as well as options storage.
   // Go through once and add all the axes.
   this.axes_ = [];
-  
+
   for (axis = 0; axis < this.attributes_.numAxes(); axis++) {
     // Add a new axis, making a copy of its per-axis options.
     opts = { g : this };
@@ -2513,6 +2503,10 @@ Dygraph.prototype.axisPropertiesForSeries = function(series) {
  * This fills in the valueRange and ticks fields in each entry of this.axes_.
  */
 Dygraph.prototype.computeYAxisRanges_ = function(extremes) {
+  
+  var isNullUndefinedOrNaN = function(num) {
+    return isNaN(parseFloat(num));
+  };
   var series;
   var numAxes = this.attributes_.numAxes();
 
@@ -2523,7 +2517,7 @@ Dygraph.prototype.computeYAxisRanges_ = function(extremes) {
     var includeZero = this.attributes_.getForAxis("includeZero", i);
     series = this.attributes_.seriesForAxis(i);
 
-    if (series.length == 0) {
+    if (series.length === 0) {
       // If no series are defined or visible then use a reasonable default
       axis.extremeRange = [0, 1];
     } else {
@@ -2585,7 +2579,10 @@ Dygraph.prototype.computeYAxisRanges_ = function(extremes) {
       axis.computedValueRange = [axis.valueWindow[0], axis.valueWindow[1]];
     } else if (axis.valueRange) {
       // This is a user-set value range for this axis.
-      axis.computedValueRange = [axis.valueRange[0], axis.valueRange[1]];
+      axis.computedValueRange = [
+         isNullUndefinedOrNaN(axis.valueRange[0]) ? axis.extremeRange[0] : axis.valueRange[0],
+         isNullUndefinedOrNaN(axis.valueRange[1]) ? axis.extremeRange[1] : axis.valueRange[1]
+      ];
     } else {
       axis.computedValueRange = axis.extremeRange;
     }
@@ -2828,7 +2825,7 @@ Dygraph.prototype.setXAxisOptions_ = function(isDate) {
     this.attrs_.axes.x.ticker = Dygraph.numericLinearTicks;
     this.attrs_.axes.x.axisLabelFormatter = this.attrs_.axes.x.valueFormatter;
   }
-}
+};
 
 /**
  * Parses the value as a floating point number. This is like the parseFloat()
@@ -3419,6 +3416,7 @@ Dygraph.prototype.resize = function(width, height) {
       // createInterface_ reset the layout, so we need to do this.
       this.layout_.setAnnotations(this.annotations_);
     }
+    this.createDragInterface_();
     this.predraw_();
   }