From 2b72beaff73b92ea98482d4551cd04d9518f665a Mon Sep 17 00:00:00 2001 From: Dan Vanderkam Date: Sun, 1 Sep 2013 09:24:27 -0400 Subject: [PATCH] use module pattern in dygraph.js --- dygraph.js | 77 ++++++++++++++++++++++++++++++----------------- plugins/annotations.js | 8 ++--- plugins/axes.js | 8 ++++- plugins/grid.js | 2 +- plugins/legend.js | 10 +++--- plugins/range-selector.js | 4 ++- 6 files changed, 69 insertions(+), 40 deletions(-) diff --git a/dygraph.js b/dygraph.js index 50524b2..4f09f31 100644 --- a/dygraph.js +++ b/dygraph.js @@ -43,9 +43,7 @@ */ -/*jshint globalstrict: true */ /*global DygraphLayout:false, DygraphCanvasRenderer:false, DygraphOptions:false, G_vmlCanvasManager:false,ActiveXObject:false */ -"use strict"; /** * Creates an interactive, zoomable chart. @@ -66,6 +64,51 @@ * list of options, see http://dygraphs.com/options.html. */ function Dygraph(div, file, opt_attrs) { + "use strict"; + this.init_(div, file, opt_attrs); +} + +/** + * Point structure. + * + * xval_* and yval_* are the original unscaled data values, + * while x_* and y_* are scaled to the range (0.0-1.0) for plotting. + * yval_stacked is the cumulative Y value used for stacking graphs, + * and bottom/top/minus/plus are used for error bar graphs. + * + * @typedef {{ + * idx: number, + * name: string, + * x: ?number, + * xval: ?number, + * y_bottom: ?number, + * y: ?number, + * y_stacked: ?number, + * y_top: ?number, + * yval_minus: ?number, + * yval: ?number, + * yval_plus: ?number, + * yval_stacked + * }} + */ +Dygraph.PointType = undefined; + +(function() { + +"use strict"; + +/** + * (see comments on Dygraph constructor) + * @param {!HTMLDivElement|string} div + * @param {DygraphDataArray| + * google.visualization.DataTable| + * string| + * function():(DygraphDataArray|google.visualization.DataTable|string)} + * file + * @param {Object=} opt_attrs + * @private + */ +Dygraph.prototype.init_ = function(div, file, opt_attrs) { // Support two-argument constructor var attrs = opt_attrs || {}; @@ -86,7 +129,7 @@ function Dygraph(div, file, opt_attrs) { document.readyState != 'complete') { var self = this; setTimeout(function() { - Dygraph.call(self, div, file, attrs); + self.init_(div, file, attrs); }, 100); return; } @@ -244,6 +287,7 @@ function Dygraph(div, file, opt_attrs) { this.start_(); }; + Dygraph.NAME = "Dygraph"; Dygraph.VERSION = "1.0.1"; Dygraph.__repr__ = function() { @@ -2296,31 +2340,6 @@ Dygraph.prototype.predraw_ = function() { }; /** - * Point structure. - * - * xval_* and yval_* are the original unscaled data values, - * while x_* and y_* are scaled to the range (0.0-1.0) for plotting. - * yval_stacked is the cumulative Y value used for stacking graphs, - * and bottom/top/minus/plus are used for error bar graphs. - * - * @typedef {{ - * idx: number, - * name: string, - * x: ?number, - * xval: ?number, - * y_bottom: ?number, - * y: ?number, - * y_stacked: ?number, - * y_top: ?number, - * yval_minus: ?number, - * yval: ?number, - * yval_plus: ?number, - * yval_stacked - * }} - */ -Dygraph.PointType = undefined; - -/** * Calculates point stacking for stackedGraph=true. * * For stacking purposes, interpolate or extend neighboring data across @@ -3647,3 +3666,5 @@ Dygraph.prototype.ready = function(callback) { callback(this); } }; + +})(); diff --git a/plugins/annotations.js b/plugins/annotations.js index 090f00d..e518fe3 100644 --- a/plugins/annotations.js +++ b/plugins/annotations.js @@ -144,13 +144,13 @@ annotations.prototype.didDrawChart = function(e) { a.div = div; g.addAndTrackEvent(div, 'click', - bindEvt('clickHandler', 'annotationClickHandler', p, this)); + bindEvt('clickHandler', 'annotationClickHandler', p)); g.addAndTrackEvent(div, 'mouseover', - bindEvt('mouseOverHandler', 'annotationMouseOverHandler', p, this)); + bindEvt('mouseOverHandler', 'annotationMouseOverHandler', p)); g.addAndTrackEvent(div, 'mouseout', - bindEvt('mouseOutHandler', 'annotationMouseOutHandler', p, this)); + bindEvt('mouseOutHandler', 'annotationMouseOutHandler', p)); g.addAndTrackEvent(div, 'dblclick', - bindEvt('dblClickHandler', 'annotationDblClickHandler', p, this)); + bindEvt('dblClickHandler', 'annotationDblClickHandler', p)); containerDiv.appendChild(div); this.annotations_.push(div); diff --git a/plugins/axes.js b/plugins/axes.js index cacda86..d1fe9b9 100644 --- a/plugins/axes.js +++ b/plugins/axes.js @@ -135,6 +135,12 @@ axes.prototype.willDrawChart = function(e) { y2 : makeLabelStyle('y2') }; + /** + * @param {string} txt + * @param {string} axis + * @param {?string=} prec_axis + * @return {!HTMLDivElement} + */ var makeDiv = function(txt, axis, prec_axis) { /* * This seems to be called with the following three sets of axis/prec_axis: @@ -142,7 +148,7 @@ axes.prototype.willDrawChart = function(e) { * y: y1 * y: y2 */ - var div = document.createElement("div"); + var div = /**@type{!HTMLDivElement}*/(document.createElement("div")); var labelStyle = labelStyles[prec_axis == 'y2' ? 'y2' : axis]; for (var name in labelStyle) { if (labelStyle.hasOwnProperty(name)) { diff --git a/plugins/grid.js b/plugins/grid.js index 425d93f..1fb34fc 100644 --- a/plugins/grid.js +++ b/plugins/grid.js @@ -52,7 +52,7 @@ grid.prototype.willDrawChart = function(e) { if (g.getOption('drawYGrid')) { var axes = ["y", "y2"]; var strokeStyles = [], lineWidths = [], drawGrid = [], stroking = [], strokePattern = []; - for (var i = 0; i < axes.length; i++) { + for (i = 0; i < axes.length; i++) { drawGrid[i] = g.getOptionForAxis("drawGrid", axes[i]); if (drawGrid[i]) { strokeStyles[i] = g.getOptionForAxis('gridLineColor', axes[i]); diff --git a/plugins/legend.js b/plugins/legend.js index 4c37d75..6684641 100644 --- a/plugins/legend.js +++ b/plugins/legend.js @@ -50,15 +50,15 @@ var generateLegendHTML, generateLegendDashHTML; * - Registering event listeners * * @param {Dygraph} g Graph instance. - * @return {object.} Mapping of event names to callbacks. + * @return {Object.} Mapping of event names to callbacks. */ legend.prototype.activate = function(g) { var div; - var divWidth = g.getOption('labelsDivWidth'); + var divWidth = g.getNumericOption('labelsDivWidth'); var userLabelsDiv = g.getOption('labelsDiv'); - if (userLabelsDiv && null !== userLabelsDiv) { - if (typeof(userLabelsDiv) == "string" || userLabelsDiv instanceof String) { + if (userLabelsDiv) { + if (typeof(userLabelsDiv) == "string") { div = document.getElementById(userLabelsDiv); } else { div = userLabelsDiv; @@ -79,7 +79,7 @@ legend.prototype.activate = function(g) { "overflow": "hidden"}; // TODO(danvk): get rid of labelsDivStyles? CSS is better. - Dygraph.update(messagestyle, g.getOption('labelsDivStyles')); + Dygraph.update(messagestyle, /**@type{!Object}*/(g.getOption('labelsDivStyles'))); div = document.createElement("div"); div.className = "dygraph-legend"; for (var name in messagestyle) { diff --git a/plugins/range-selector.js b/plugins/range-selector.js index e3f0755..5c9df58 100644 --- a/plugins/range-selector.js +++ b/plugins/range-selector.js @@ -268,7 +268,9 @@ rangeSelector.prototype.createZoomHandles_ = function() { */ rangeSelector.prototype.initInteraction_ = function() { var self = this; - var topElem = this.isIE_ ? document : window; + // TODO(danvk): ask Paul why this is here. + // var topElem = this.isIE_ ? document : window; + var topElem = document; var clientXLast = 0; var handle = null; var isZooming = false; -- 2.7.4