From 3d2ab80f3492c3827c17178376ab138a2910c716 Mon Sep 17 00:00:00 2001
From: Timothy Baldridge <tbaldridge@gmail.com>
Date: Sat, 28 Mar 2020 22:21:48 -0600
Subject: [PATCH] Pie chart of metrics

---
 Wabbajack.BuildServer/public/metrics.html | 63 ++++++++++++++++++++---
 1 file changed, 56 insertions(+), 7 deletions(-)
diff --git a/Wabbajack.BuildServer/public/metrics.html b/Wabbajack.BuildServer/public/metrics.html
index 261c1891..a949158e 100644
--- a/Wabbajack.BuildServer/public/metrics.html
+++ b/Wabbajack.BuildServer/public/metrics.html
@@ -10,6 +10,10 @@
 </head>
 <body>
 
+<h2>Finished Install Counts</h2>
+<canvas id="finished_install_count" width="800" height="600"></canvas>
+<hr/>
+
 <h2>Begin Download</h2>
 <canvas id="begin_download_chart" width="800" height="600"></canvas>
 <hr/>
@@ -24,6 +28,7 @@
 
 
 
+
 <script>
     var makeChart = function(ele, group) {
         var graph = graphql("/graphql",
@@ -45,14 +50,14 @@
 
         var result = metrics({type: group})
                 .then(function (data) {
-                    var data = _.filter(data.dailyUniqueMetrics, series => _.some(series.values, v => v > 2));
-                    var labels = _.last(_.uniq(_.flatten(_.map(data, series => series.labels))), 30);
-                    var datasets = _.last(_.map(data, series => {
+                    var data = _.filter(data.dailyUniqueMetrics, series => _.some(series.values, v => v > 1));
+                    var labels = _.uniq(_.flatten(_.map(data, series => series.labels)));
+                    var datasets = _.map(data, series => {
                         return {
                             label: series.seriesName,
                             fill: false,
-                            data: series.values
-                        }}), 30);
+                            data: _.last(series.values, 30)
+                        }});
                     var ctx = document.getElementById(ele).getContext('2d');
                     var chart = new Chart(ctx, {
                         // The type of chart we want to create
@@ -60,7 +65,7 @@
 
                         // The data for our dataset
                         data: {
-                            labels: labels,
+                            labels: _.last(labels, 30),
                             datasets: datasets},
 
                         // Configuration options go here
@@ -68,10 +73,54 @@
                     });
                 });
     };
+
+
+    var makePieChart = function(ele, group) {
+        var graph = graphql("/graphql",
+                {
+                    method: "POST",
+                    asJSON: true,
+                    headers: {
+                        "Content-Type": "application/json"
+                    }
+                });
+        var metrics = graph.query(`($type: MetricType) {
+  dailyUniqueMetrics(metric_type: $type)
+  {
+    seriesName,
+    labels,
+    values
+  }
+}`);
+
+        var result = metrics({type: group})
+                .then(function (data) {
+                    var data = _.filter(data.dailyUniqueMetrics, series => _.some(series.values, v => v > 2));
+                    var labels = _.map(data, series => series.seriesName);
+                    var datasets = {data : _.map(data, series => {
+                            return _.reduce(series.values, (x, y) => x + y, 0)})};
+                    console.log(datasets);
+                    console.log(labels);
+                    var ctx = document.getElementById(ele).getContext('2d');
+                    var chart = new Chart(ctx, {
+                        // The type of chart we want to create
+                        type: 'pie',
+
+                        // The data for our dataset
+                        data: {
+                            labels: labels,
+                            datasets: [datasets]},
+
+                        // Configuration options go here
+                        options: {}
+                    });
+                });
+    };
+
     makeChart("begin_download_chart", "BEGIN_DOWNLOAD");
     makeChart("begin_install_chart", "BEGIN_INSTALL");
     makeChart("finished_install_chart", "FINISHED_INSTALL");
-
+    makePieChart("finished_install_count", "FINISHED_INSTALL");
 </script>
 </body>
 </html>
\ No newline at end of file
