Implemented issue Mikhus#105 - added possibility to configure event l…

…isteners via constructor
aurkus · Mar 20, 2017 · a770b74 · a770b74
1 parent ddbf78d
commit a770b74
Show file tree

Hide file tree

Showing 6 changed files with 30 additions and 14 deletions.
diff --git a/examples/value-event.html b/examples/value-event.html
@@ -68,7 +68,12 @@
         borderShadowWidth: 0,
         value: 1010,
         animateOnInit: true,
-        animatedValue: true
+        animatedValue: true,
+        listeners: {
+            value: function(value) {
+                this.update({ units: parseInt(value, 10) + ' hPa' });
+            }
+        }
 
     }).draw();
 
@@ -83,14 +88,6 @@
             }, gauge.animation.duration + 50));
         });
     }
-
-    window.addEventListener('load', function() {
-        document.gauges.forEach(function(gauge) {
-            gauge.on('value', function(value) {
-                gauge.update({ units: parseInt(value, 10) + ' hPa' });
-            });
-        });
-    });
 </script>
 </body>
 </html>
diff --git a/gauge.min.js b/gauge.min.js
diff --git a/gauge.min.js.map b/gauge.min.js.map
diff --git a/lib/BaseGauge.js b/lib/BaseGauge.js
@@ -104,6 +104,12 @@ export default class BaseGauge extends EventEmitter {
      * @event BaseGauge#animationEnd
      */
 
+    /**
+     * @event BaseGauge#value
+     * @type {number} newValue
+     * @type {number} oldValue
+     */
+
     /**
      * @constructor
      * @abstract
@@ -120,6 +126,17 @@ export default class BaseGauge extends EventEmitter {
 
         gauges.push(this);
 
+        if (options.listeners) {
+            Object.keys(options.listeners).forEach(event => {
+                let handlers = options.listeners[event] instanceof Array ?
+                    options.listeners[event] : [options.listeners[event]];
+
+                handlers.forEach(handler => {
+                    this.on(event, handler);
+                });
+            });
+        }
+
         //noinspection JSUnresolvedVariable
         /**
          * Gauges version string

diff --git a/lib/GenericOptions.js b/lib/GenericOptions.js
@@ -40,7 +40,7 @@
 /**
  * Shared generic gauges options
  *
- * @type {{renderTo: RenderTarget, width: number, height: number, minValue: number, maxValue: number, value: number, units: string|boolean, majorTicks: number[]|string[], exactTicks: boolean, minorTicks: number, strokeTicks: boolean, animatedValue: boolean, animateOnInit: boolean, title: string|boolean, borders: boolean, valueInt: number, valueDec: number, majorTicksInt: number, majorTicksDec: number, animation: boolean, animationDuration: number, animationRule: string|AnimationRule, colorPlate: string, colorPlateEnd: string, colorMajorTicks: string, colorMinorTicks: string, colorStrokeTicks: string, colorTitle: string, colorUnits: string, colorNumbers: string, colorNeedle: string, colorNeedleEnd: string, colorValueText: string, colorValueTextShadow: string, colorBorderShadow: string, colorBorderOuter: string, colorBorderOuterEnd: string, colorBorderMiddle: string, colorBorderMiddleEnd: string, colorBorderInner: string, colorBorderInnerEnd: string, colorValueBoxRect: string, colorValueBoxRectEnd: string, colorValueBoxBackground: string, colorValueBoxShadow: string, colorNeedleShadowUp: string, colorNeedleShadowDown: string, needle: boolean, needleShadow: boolean, needleType: string, needleStart: number, needleEnd: number, needleWidth: number, borderOuterWidth: number, borderMiddleWidth: number, borderInnerWidth: number, borderShadowWidth: number, valueBox: boolean, valueBoxWidth: number, valueBoxStroke: number, valueText: string, valueTextShadow: boolean, valueBoxBorderRadius: number, highlights: Highlight[], highlightsWidth: number, fontNumbers: string, fontTitle: string, fontUnits: string, fontValue: string, fontTitleSize: number, fontValueSize: number, fontUnitsSize: number, fontNumbersSize: number, fontNumbersStyle: string, fontTitleStyle: string, fontUnitsStyle: string, fontValueStyle: string, fontNumbersWeight: string, fontTitleWeight: string, fontUnitsWeight: string, fontValueWeight: string, barWidth: number, barStrokeWidth: number, barProgress: boolean, colorBar: string, colorBarStroke: string, colorBarProgress: string, colorBarShadow: string, barShadow: number}} GenericOptions
+ * @type {{renderTo: RenderTarget, width: number, height: number, minValue: number, maxValue: number, value: number, units: string|boolean, majorTicks: number[]|string[], exactTicks: boolean, minorTicks: number, strokeTicks: boolean, animatedValue: boolean, animateOnInit: boolean, title: string|boolean, borders: boolean, valueInt: number, valueDec: number, majorTicksInt: number, majorTicksDec: number, animation: boolean, animationDuration: number, animationRule: string|AnimationRule, colorPlate: string, colorPlateEnd: string, colorMajorTicks: string, colorMinorTicks: string, colorStrokeTicks: string, colorTitle: string, colorUnits: string, colorNumbers: string, colorNeedle: string, colorNeedleEnd: string, colorValueText: string, colorValueTextShadow: string, colorBorderShadow: string, colorBorderOuter: string, colorBorderOuterEnd: string, colorBorderMiddle: string, colorBorderMiddleEnd: string, colorBorderInner: string, colorBorderInnerEnd: string, colorValueBoxRect: string, colorValueBoxRectEnd: string, colorValueBoxBackground: string, colorValueBoxShadow: string, colorNeedleShadowUp: string, colorNeedleShadowDown: string, needle: boolean, needleShadow: boolean, needleType: string, needleStart: number, needleEnd: number, needleWidth: number, borderOuterWidth: number, borderMiddleWidth: number, borderInnerWidth: number, borderShadowWidth: number, valueBox: boolean, valueBoxWidth: number, valueBoxStroke: number, valueText: string, valueTextShadow: boolean, valueBoxBorderRadius: number, highlights: Highlight[], highlightsWidth: number, fontNumbers: string, fontTitle: string, fontUnits: string, fontValue: string, fontTitleSize: number, fontValueSize: number, fontUnitsSize: number, fontNumbersSize: number, fontNumbersStyle: string, fontTitleStyle: string, fontUnitsStyle: string, fontValueStyle: string, fontNumbersWeight: string, fontTitleWeight: string, fontUnitsWeight: string, fontValueWeight: string, barWidth: number, barStrokeWidth: number, barProgress: boolean, colorBar: string, colorBarStroke: string, colorBarProgress: string, colorBarShadow: string, barShadow: number, listeners: object}} GenericOptions
  */
 const GenericOptions = {
     // basic options
@@ -61,6 +61,8 @@ const GenericOptions = {
     borders: true,
     numbersMargin: 1,
 
+    listeners: null,
+
     // number formats
     valueInt: 3,
     valueDec: 2,

diff --git a/test-coverage.svg b/test-coverage.svg