Fix the event handlers: make sure that the event object is passed eve…

…rywhere.
hiddenloop · Aug 31, 2016 · 8102f93 · 8102f93
1 parent 2fc4e3a
commit 8102f93
Show file tree

Hide file tree

Showing 6 changed files with 69 additions and 72 deletions.
diff --git a/src/lib/plot/series/abstract-series.js b/src/lib/plot/series/abstract-series.js
@@ -52,60 +52,23 @@ class AbstractSeries extends PureRenderComponent {
 
   constructor(props) {
     super(props);
-
-    /**
-     * Mouse over handler for the series without single values.
-     * @type {function}
-     * @protected
-     */
-    this._mouseOver = this._mouseOverHandler.bind(this, false);
-
-    /**
-     * Mouse over handler for the series **with** single values.
-     * @type {function}
-     * @protected
-     */
-    this._mouseOverWithValue = this._mouseOverHandler.bind(this, true);
-
-    /**
-     * Mouse out handler for the series without single values.
-     * @type {function}
-     * @protected
-     */
-    this._mouseOut = this._mouseOutHandler.bind(this, false);
-
-    /**
-     * Mouse out handler for the series **with** single values.
-     * @type {function}
-     * @protected
-     */
-    this._mouseOutWithValue = this._mouseOutHandler.bind(this, true);
-
-    /**
-     * Click handler for the series without single values.
-     * @type {function}
-     * @protected
-     */
-    this._click = this._clickHandler.bind(this, false);
-
-    /**
-     * Click handler for the series **with** single values.
-     * @type {function}
-     * @protected
-     */
-    this._clickWithValue = this._clickHandler.bind(this, true);
+    this._seriesMouseOverHandler = this._seriesMouseOverHandler.bind(this);
+    this._valueMouseOverHandler = this._valueMouseOverHandler.bind(this);
+    this._seriesMouseOutHandler = this._seriesMouseOutHandler.bind(this);
+    this._valueMouseOutHandler = this._valueMouseOutHandler.bind(this);
+    this._seriesClickHandler = this._seriesClickHandler.bind(this);
+    this._valueClickHandler = this._valueClickHandler.bind(this);
   }
 
   /**
-   * Mouse over handler for all series.
-   * @param {boolean} useValue Use value handler if true.
+   * Mouse over handler for the specific series' value.
    * @param {Object} d Value object
    * @param {Object} event Event.
-   * @private
+   * @protected
    */
-  _mouseOverHandler(useValue, d, event) {
+  _valueMouseOverHandler(d, event) {
     const {onValueMouseOver, onSeriesMouseOver} = this.props;
-    if (useValue && onValueMouseOver) {
+    if (onValueMouseOver) {
       onValueMouseOver(d, {event});
     }
     if (onSeriesMouseOver) {
@@ -114,15 +77,26 @@ class AbstractSeries extends PureRenderComponent {
   }
 
   /**
-   * Mouse out handler for all series.
-   * @param {boolean} useValue Use value handler if true.
+   * Mouse over handler for the entire series.
+   * @param {Object} event Event.
+   * @protected
+   */
+  _seriesMouseOverHandler(event) {
+    const {onSeriesMouseOver} = this.props;
+    if (onSeriesMouseOver) {
+      onSeriesMouseOver({event});
+    }
+  }
+
+  /**
+   * Mouse out handler for the specific series' value.
    * @param {Object} d Value object
    * @param {Object} event Event.
-   * @private
+   * @protected
    */
-  _mouseOutHandler(useValue, d, event) {
+  _valueMouseOutHandler(d, event) {
     const {onValueMouseOut, onSeriesMouseOut} = this.props;
-    if (useValue && onValueMouseOut) {
+    if (onValueMouseOut) {
       onValueMouseOut(d, {event});
     }
     if (onSeriesMouseOut) {
@@ -131,22 +105,45 @@ class AbstractSeries extends PureRenderComponent {
   }
 
   /**
-   * Click handler for all series.
-   * @param {boolean} useValue Use value handler if true.
+   * Mouse out handler for the entire series.
+   * @param {Object} event Event.
+   * @protected
+   */
+  _seriesMouseOutHandler(event) {
+    const {onSeriesMouseOut} = this.props;
+    if (onSeriesMouseOut) {
+      onSeriesMouseOut({event});
+    }
+  }
+
+  /**
+   * Click handler for the specific series' value.
    * @param {Object} d Value object
    * @param {Object} event Event.
-   * @private
+   * @protected
    */
-  _clickHandler(useValue, d, event) {
+  _valueClickHandler(d, event) {
     const {onValueClick, onSeriesClick} = this.props;
-    if (useValue && onValueClick) {
+    if (onValueClick) {
       onValueClick(d, {event});
     }
     if (onSeriesClick) {
       onSeriesClick({event});
     }
   }
 
+  /**
+   * Click handler for the entire series.
+   * @param {Object} event Event.
+   * @protected
+   */
+  _seriesClickHandler(event) {
+    const {onSeriesClick} = this.props;
+    if (onSeriesClick) {
+      onSeriesClick({event});
+    }
+  }
+
   /**
    * Tells the rest of the world that it requires SVG to work.
    * @returns {boolean} Result.

diff --git a/src/lib/plot/series/area-series.js b/src/lib/plot/series/area-series.js
@@ -60,9 +60,9 @@ class AreaSeries extends AbstractSeries {
         d={d}
         className="rv-xy-plot__series rv-xy-plot__series--line"
         transform={`translate(${marginLeft},${marginTop})`}
-        onMouseOver={this._mouseOver}
-        onMouseOut={this._mouseOut}
-        onClick={this._click}
+        onMouseOver={this._seriesMouseOverHandler}
+        onMouseOut={this._seriesMouseOutHandler}
+        onClick={this._seriesClickHandler}
         style={{
           opacity,
           stroke,

diff --git a/src/lib/plot/series/bar-series.js b/src/lib/plot/series/bar-series.js
@@ -103,9 +103,9 @@ class BarSeries extends AbstractSeries {
             [lineSizeAttr]: itemSize * 2 / sameTypeTotal,
             [valuePosAttr]: Math.min(value0Functor(d), valueFunctor(d)),
             [valueSizeAttr]: Math.abs(-value0Functor(d) + valueFunctor(d)),
-            onClick: e => this._clickWithValue(d, e),
-            onMouseOver: e => this._mouseOverWithValue(d, e),
-            onMouseOut: e => this._mouseOutWithValue(d, e),
+            onClick: e => this._valueClickHandler(d, e),
+            onMouseOver: e => this._valueMouseOverHandler(d, e),
+            onMouseOut: e => this._valueMouseOutHandler(d, e),
             key: i
           };
           return (<rect {...attrs} />);

diff --git a/src/lib/plot/series/heatmap-series.js b/src/lib/plot/series/heatmap-series.js
@@ -68,9 +68,9 @@ class HeatmapSeries extends AbstractSeries {
             width: xDistance,
             height: yDistance,
             key: i,
-            onClick: e => this._clickWithValue(d, e),
-            onMouseOver: e => this._mouseOverWithValue(d, e),
-            onMouseOut: e => this._mouseOutWithValue(d, e)
+            onClick: e => this._valueClickHandler(d, e),
+            onMouseOver: e => this._valueMouseOverHandler(d, e),
+            onMouseOut: e => this._valueMouseOutHandler(d, e)
           };
           return (<rect {...attrs} />);
         })}

diff --git a/src/lib/plot/series/line-series.js b/src/lib/plot/series/line-series.js
@@ -72,9 +72,9 @@ class LineSeries extends AbstractSeries {
         d={d}
         className="rv-xy-plot__series rv-xy-plot__series--line"
         transform={`translate(${marginLeft},${marginTop})`}
-        onMouseOver={this._mouseOver}
-        onMouseOut={this._mouseOut}
-        onClick={this._click}
+        onMouseOver={this._seriesMouseOverHandler}
+        onMouseOut={this._seriesMouseOutHandler}
+        onClick={this._seriesClickHandler}
         style={{
           opacity,
           strokeDasharray: STROKE_STYLES[strokeStyle],

diff --git a/src/lib/plot/series/mark-series.js b/src/lib/plot/series/mark-series.js
@@ -63,9 +63,9 @@ class MarkSeries extends AbstractSeries {
               fill: fillFunctor && fillFunctor(d)
             },
             key: i,
-            onClick: e => this._clickWithValue(d, e),
-            onMouseOver: e => this._mouseOverWithValue(d, e),
-            onMouseOut: e => this._mouseOutWithValue(d, e)
+            onClick: e => this._valueClickHandler(d, e),
+            onMouseOver: e => this._valueMouseOverHandler(d, e),
+            onMouseOut: e => this._valueMouseOutHandler(d, e)
           };
           return <circle {...attrs} />;
         })}