metrics: implement a general refresh metrics framework

Signed-off-by: Rohit Yadav <rohit.yadav@shapeblue.com>

ui/css/cloudstack3.css

@@ -12428,6 +12428,14 @@ div.ui-dialog div.autoscaler div.field-group div.form-container form div.form-it
   background-position: -40px -32px;
 }
 
+.refreshMetrics .icon {
+  background-position: 0px -62px;
+}
+
+.refreshMetrics:hover .icon {
+  background-position: 0px -62px;
+}
+
 .attach .icon,
 .attachISO .icon,
 .attachDisk .icon,

ui/scripts/metrics.js

@@ -24,6 +24,9 @@
                     label: 'metrics'
                 }
             },
+            refreshMetrics: function() {
+                console.log("Refreshing metrics");
+            },
             hideSearchBar: true
         }
     };
@@ -68,19 +71,8 @@
             dataProvider: function(args) {
                 console.log(args);
             },
-            actions: {
-                refreshMetric: {
-                    label: 'label.refresh',
-                    isHeader: true,
-                    addRow: true,
-                    action: {
-                        custom: function (args) {
-                            return function() {
-                                return console.log("Cluster Refresh metrics");
-                            };
-                        }
-                    }
-                }
+            refreshMetrics: function() {
+                console.log("Refreshing Cluster metrics");
             },
             hideSearchBar: true,
             needsRefresh: true

ui/scripts/ui-custom/metricsView.js

@@ -29,6 +29,20 @@
             } else if (args.resource == 'volumes') {
             }
 
+            metricsListView.actions = {
+                refreshMetrics: {
+                    label: 'label.refresh',
+                    isHeader: true,
+                    addRow: true,
+                    action: {
+                        custom: function (args) {
+                            return function() {
+                            };
+                        }
+                    }
+                }
+            };
+
             var $browser = $('#browser .container');
             return $browser.cloudBrowser('addPanel', {
                   title: 'Metrics',
@@ -41,6 +55,8 @@
                       });
                       // Make metrics tables horizontally scrollable
                       $('.panel::has(.data-table)::not(.reduced)').css({overflow: 'auto'});
+                      // Refresh metrics when refresh button is clicked
+                      $('.refreshMetrics').click(metricsListView.refreshMetrics);
                   }
             });
         };