Add subscribing to events

Author: AmeenAhmed

demos/demosources/ex7/index.html

@@ -3,6 +3,6 @@
     fc-height="400"
     fc-type="column2d",
     fc-datasource="{{dataSource}}"
-    fc-dataplot-click="onMyChartClick"
+    fc-events="events"
     ></div>
 <p>The value that you have selected is: {{ selectedValue }}</p>

demos/demosources/ex7/index.js

@@ -39,9 +39,14 @@
             }]
         };
         $scope.selectedValue = "nothing";
-        $scope.onMyChartClick = function (event, props) {
-            $scope.selectedValue = props.displayValue;
-        };
+
+        $scope.events = {
+            dataplotclick: function (ev, props) {
+                $scope.$apply(function () {
+                    $scope.selectedValue = props.displayValue;
+                });
+            }
+        }
     });
 
 }());

demos/demosources/ex7/src.ejs

@@ -28,16 +28,21 @@ $scope.dataSource = {
     }]
 };
 $scope.selectedValue = "nothing";
-$scope.onMyChartClick = function (event, props) {
-    $scope.selectedValue = props.displayValue;
-};
+
+$scope.events = {
+    dataplotclick: function (ev, props) {
+        $scope.$apply(function () {
+            $scope.selectedValue = props.displayValue;
+        });
+    }
+}
 <% } else if(src==="html") { %>
 <div fc-chart
     fc-width="600" 
     fc-height="400"
     fc-type="column2d",
     fc-datasource="{{dataSource}}"
-    fc-dataplot-click="onMyChartClick"
+    fc-events="events"
     ></div>
 <p>The value that you have selected is: {{ selectedValue }}</p>
 <% } %>

demos/js/demos/ex7.js

@@ -39,9 +39,14 @@
             }]
         };
         $scope.selectedValue = "nothing";
-        $scope.onMyChartClick = function (event, props) {
-            $scope.selectedValue = props.displayValue;
-        };
+
+        $scope.events = {
+            dataplotclick: function (ev, props) {
+                $scope.$apply(function () {
+                    $scope.selectedValue = props.displayValue;
+                });
+            }
+        }
     });
 
 }());

demos/views/ex7.html

@@ -3,7 +3,7 @@
     fc-height="400"
     fc-type="column2d",
     fc-datasource="{{dataSource}}"
-    fc-dataplot-click="onMyChartClick"
+    fc-events="events"
     ></div>
 <p>The value that you have selected is: {{ selectedValue }}</p><tabset>
     <tab heading="HTML"><ng-prism class="language-markup">{{ html }}</ng-prism></tab>

dist/angular-fusioncharts.min.js

@@ -31,28 +31,36 @@
                 fcHeight: '@',
                 fcDataset: '@',
                 fcCategories: '@',
-                fcChartAttrs: '@',
-                fcDataplotClick: '@',
-                fcChartClick: '@'
+                fcChartAttrs: '@'
             },
             link: function (scope, element, attrs) {
-                var chart = null,
+                var eventsObj = {},
+                    attribs = Object.keys(attrs),
+                    chart = null,
                     events = {
-                        dataplotClick: function (ev, props) {
-                            if(attrs.fcDataplotClick) {
-                                scope.$apply (function () {
-                                    scope.$parent[attrs.fcDataplotClick](ev, props);    
-                                });
-                            }
-                        },
-                        chartClick: function (ev, props) {
-                            if(attrs.fcChartClick) {
-                                scope.$apply (function () {
-                                    scope.$parent[attrs.fcChartClick](ev, props);
-                                });
-                            }
+                        '*': function (ev, props) {
+                            if(eventsObj.hasOwnProperty(ev.eventType)) {
+                                eventsObj[ev.eventType](ev, props);
+                          }
                         }
                     };
+                if(attrs.fcEvents) {
+                    if(scope.$parent[attrs.fcEvents]) {
+                        var _eobj = scope.$parent[attrs.fcEvents];
+                        for(var key in _eobj) {
+                            if(_eobj.hasOwnProperty(key)) {
+                                eventsObj[key.toLowerCase()] = _eobj[key];
+                            }
+                        }
+                    }
+                }
+                for(var i=0; i<attribs.length; i++) {
+                    var attr = attribs[i];
+                    if(attr.match(/^on/i)) {
+                        var key = attr.slice(2).toLowerCase ();
+                        eventsObj[key] = scope.$parent[attrs[attr]];
+                    }
+                }
                 if(attrs.fcConfig) {
                     chart = new FusionCharts(scope[attrs.fcConfig]);
                     scope[attrs.fcChartObject] = chart;