Merge pull request #8 from cizezsy/ui

[JENKINS-51609] Filter report to show only low coverage code
jenkinsci · Jun 2, 2018 · af3a329 · af3a329
2 parents 0a4f664 + 3b9626b
commit af3a329
Show file tree

Hide file tree

Showing 3 changed files with 73 additions and 20 deletions.
diff --git a/src/main/java/io/jenkins/plugins/coverage/targets/CoverageResult.java b/src/main/java/io/jenkins/plugins/coverage/targets/CoverageResult.java
@@ -41,7 +41,6 @@
 import java.io.IOException;
 import java.io.Serializable;
 import java.util.*;
-import java.util.function.Function;
 import java.util.stream.Collectors;
 
 /**

diff --git a/src/main/resources/io/jenkins/plugins/coverage/targets/CoverageResult/index.jelly b/src/main/resources/io/jenkins/plugins/coverage/targets/CoverageResult/index.jelly
@@ -1,6 +1,5 @@
 <?jelly escape-by-default='false'?>
-<j:jelly xmlns:j="jelly:core" xmlns:st="jelly:stapler" xmlns:d="jelly:define" xmlns:l="/lib/layout"
-         xmlns:t="/lib/hudson" xmlns:f="/lib/form">
+<j:jelly xmlns:j="jelly:core" xmlns:st="jelly:stapler" xmlns:l="/lib/layout">
     <l:layout css="/plugin/code-coverage-api/css/style.css" norefresh="true">
         <script src="${rootURL}/plugin/code-coverage-api/scripts/echarts.min.js">
         </script>

diff --git a/src/main/webapp/scripts/custom-chart.js b/src/main/webapp/scripts/custom-chart.js
@@ -176,21 +176,17 @@ var CoverageChartGenerator = function (instance) {
                 return;
             }
 
-            var metrics = [];
-            var children = [];
-
-            var data = [];
+            var defaultRange = [0, 75];
 
-            Object.keys(results).forEach(function (childName, childIndex) {
-                children.push(childName);
-                results[childName].forEach(function (coverage, metricIndex) {
-                    var ratio = coverage.ratio;
-
-                    metrics[metricIndex] = coverage.name;
 
-                    data.push([metricIndex, childIndex, parseFloat(ratio.percentageString)]);
-                })
-            });
+            var r = filterChildren(results, defaultRange);
+            if (r.children.length === 0) {
+                defaultRange = [0, 100];
+                r = filterChildren(results, defaultRange);
+            }
+            var metrics = r.metrics;
+            var children = r.children;
+            var data = r.data;
 
 
             var height = children.length * 32 + 100;
@@ -200,7 +196,6 @@ var CoverageChartGenerator = function (instance) {
             childSummaryChartDiv.style.height = height + "px";
             var childSummaryChart = echarts.init(childSummaryChartDiv);
 
-
             var childSummaryChartOption = {
                 title: {
                     text: 'Divided by ' + (metric ? metric + ' Name' : '')
@@ -265,17 +260,20 @@ var CoverageChartGenerator = function (instance) {
                     },
                     triggerEvent: true,
                     axisLabel: {
+                        interval: 0,
                         fontSize: 13
                     }
                 },
                 visualMap: {
                     min: 0,
                     max: 100,
+                    range: defaultRange,
                     calculable: true,
                     orient: 'horizontal',
-                    left: 'center',
+                    left: 'right',
+                    top: 'top',
                     inRange: {
-                        color: ['#d55e00', '#009e73'],
+                        color: ['#d55e00', '#009e73']
                     }
                 },
                 series: [{
@@ -306,6 +304,35 @@ var CoverageChartGenerator = function (instance) {
                 }
             });
 
+            childSummaryChart.on('datarangeselected', function (params) {
+
+
+                var r = filterChildren(results, params.selected);
+                var children = r.children;
+                var data = r.data;
+
+
+                if (children.length !== 0) {
+                    childSummaryChartOption.series[0].data = data;
+                } else {
+                    childSummaryChartOption.series[0].data = null;
+                }
+
+                childSummaryChartOption.visualMap.range = [params.selected[0], params.selected[1]];
+                childSummaryChartOption.yAxis.data = children;
+
+                var height = children.length * 32 + 100;
+                if (height < 150) {
+                    height = 150;
+                }
+                childSummaryChartDiv.style.height = height + "px";
+
+                var childSummaryChart = echarts.init(childSummaryChartDiv);
+
+                childSummaryChart.setOption(childSummaryChartOption);
+                childSummaryChart.resize();
+            });
+
             window.onresize = function () {
                 childSummaryChart.resize();
             }
@@ -393,6 +420,34 @@ var CoverageChartGenerator = function (instance) {
 
         })
     }
-};
 
+    function filterChildren(results, range) {
+        var metrics = [];
+        var children = [];
+
+        var data = [];
+
+        Object.keys(results).filter(function (childName, childIndex) {
+            return results[childName].find(function (element) {
+                var p = parseFloat(element.ratio.percentageString);
 
+                return p >= range[0] && p <= range[1];
+            });
+        }).forEach(function (childName, childIndex) {
+            children.push(childName);
+            results[childName].forEach(function (coverage, metricIndex) {
+                var ratio = coverage.ratio;
+
+                metrics[metricIndex] = coverage.name;
+
+                data.push([metricIndex, childIndex, parseFloat(ratio.percentageString)]);
+            })
+        });
+
+        return {
+            metrics: metrics,
+            children: children,
+            data: data
+        }
+    }
+};