diff options
Diffstat (limited to 'src/main/webapp/WEB-INF/jsp/show_coverage_overview.jsp')
-rw-r--r-- | src/main/webapp/WEB-INF/jsp/show_coverage_overview.jsp | 505 |
1 files changed, 0 insertions, 505 deletions
diff --git a/src/main/webapp/WEB-INF/jsp/show_coverage_overview.jsp b/src/main/webapp/WEB-INF/jsp/show_coverage_overview.jsp deleted file mode 100644 index 0516c9d..0000000 --- a/src/main/webapp/WEB-INF/jsp/show_coverage_overview.jsp +++ /dev/null @@ -1,505 +0,0 @@ -<%-- - ~ Copyright (c) 2017 Google Inc. All Rights Reserved. - ~ - ~ Licensed under the Apache License, Version 2.0 (the "License"); you - ~ may not use this file except in compliance with the License. You may - ~ obtain a copy of the License at - ~ - ~ http://www.apache.org/licenses/LICENSE-2.0 - ~ - ~ Unless required by applicable law or agreed to in writing, software - ~ distributed under the License is distributed on an "AS IS" BASIS, - ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or - ~ implied. See the License for the specific language governing - ~ permissions and limitations under the License. - --%> -<%@ page contentType='text/html;charset=UTF-8' language='java' %> -<%@ taglib prefix='fn' uri='http://java.sun.com/jsp/jstl/functions' %> -<%@ taglib prefix='c' uri='http://java.sun.com/jsp/jstl/core' %> -<%@ taglib prefix='fmt' uri='http://java.sun.com/jsp/jstl/fmt' %> - -<html> - <!-- <link rel='stylesheet' href='/css/dashboard_main.css'> --> - <%@ include file='header.jsp' %> - <link type='text/css' href='/css/show_test_runs_common.css' rel='stylesheet'> - <link type='text/css' href='/css/test_results.css' rel='stylesheet'> - <link rel='stylesheet' href='/css/search_header.css'> - <script type='text/javascript' src='https://www.gstatic.com/charts/loader.js'></script> - <script src='https://www.gstatic.com/external_hosted/moment/min/moment-with-locales.min.js'></script> - <script src='js/common.js'></script> - <script src='js/time.js'></script> - <script type='text/javascript'> - google.charts.load('current', {'packages':['table', 'corechart']}); - google.charts.setOnLoadCallback(drawStatsChart); - google.charts.setOnLoadCallback(drawCoverageCharts); - - $(document).ready(function() { - - $('select').material_select(); - - $(".search-icon-wrapper").click(function() { - $(".search-wrapper").toggle(); - }); - - var inputIdList = ["device", "branch"]; - - $("#schBtn").click(function (evt) { - if($(this).hasClass('disabled')) return; - var queryParam = "?"; - $.each(inputIdList, function( index, value ) { - var selectId = value.charAt(0).toUpperCase() + value.slice(1) - var result = $("#search" + selectId).val(); - if ( !$.isEmptyObject(result) ) { - queryParam += value + "=" + result.trim() + "&"; - } - }); - var link = '${pageContext.request.contextPath}' + '/show_coverage_overview' + queryParam; - window.open(link, '_self'); - }); - - var no_data_msg = "NO DATA"; - - $('#coverageModalGraph').modal({ - width: '75%', - dismissible: true, // Modal can be dismissed by clicking outside of the modal - opacity: .5, // Opacity of modal background - inDuration: 300, // Transition in duration - outDuration: 200, // Transition out duration - startingTop: '4%', // Starting top style attribute - endingTop: '10%', // Ending top style attribute - ready: function(modal, trigger) { // Callback for Modal open. Modal and trigger parameters available. - var testname = modal.data('testname'); - $('#coverageModalTitle').text("Code Coverage Chart : " + testname); - var query = new google.visualization.Query('show_coverage_overview?pageType=datatable&testName=' + testname); - // Send the query with a callback function. - query.send(handleQueryResponse); - }, - complete: function() { - $('#coverage_combo_chart_div').empty(); - $('#coverage_line_chart_div').empty(); - $('#coverage_table_chart_div').empty(); - - $("div.valign-wrapper > h2.center-align:contains('" + no_data_msg + "')").each(function(index){ - $(this).parent().remove(); - }); - $("span.indicator.badge.blue:contains('Graph')").each(function( index ) { - $(this).removeClass('blue'); - $(this).addClass('grey'); - }); - - $('#dataTableLoading').show("slow"); - } // Callback for Modal close - }); - - // Handle the query response. - function handleQueryResponse(response) { - $('#dataTableLoading').hide("slow"); - if (response.isError()) { - alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage()); - return; - } - // Draw the visualization. - var data = response.getDataTable(); - if (data.getNumberOfRows() == 0) { - var blankData = '<div class="valign-wrapper" style="height: 90%;">' - + '<h2 class="center-align" style="width: 100%;">' + no_data_msg + '</h2>' - + '</div>'; - $('#coverageModalTitle').after(blankData); - return; - } - data.sort([{column: 0}]); - - var date_formatter = new google.visualization.DateFormat({ pattern: "yyyy-MM-dd" }); - date_formatter.format(data, 0); - - var dataView = new google.visualization.DataView(data); - - // Disable coveredLine and totalLine - dataView.hideColumns([1,2]); - - var lineOptions = { - title: 'Source Code Line Coverage', - width: '100%', - height: 450, - curveType: 'function', - intervals: { 'color' : 'series-color' }, - interval: { - 'fill': { - 'style': 'area', - 'curveType': 'function', - 'fillOpacity': 0.2 - }, - 'bar': { - 'style': 'bars', - 'barWidth': 0, - 'lineWidth': 1, - 'pointSize': 3, - 'fillOpacity': 1 - }}, - legend: { position: 'bottom' }, - tooltip: { isHtml: true }, - fontName: 'Roboto', - titleTextStyle: { - color: '#757575', - fontSize: 16, - bold: false - }, - pointsVisible: true, - vAxis:{ - title: 'Code Coverage Ratio (%)', - titleTextStyle: { - color: '#424242', - fontSize: 12, - italic: false - }, - textStyle: { - fontSize: 12, - color: '#757575' - }, - }, - hAxis: { - title: 'Date', - format: 'yyyy-MM-dd', - minTextSpacing: 0, - showTextEvery: 1, - slantedText: true, - slantedTextAngle: 45, - textStyle: { - fontSize: 12, - color: '#757575' - }, - titleTextStyle: { - color: '#424242', - fontSize: 12, - italic: false - } - }, - }; - var lineChart = new google.visualization.LineChart(document.getElementById('coverage_line_chart_div')); - lineChart.draw(dataView, lineOptions); - - var tableOptions = { - title: 'Covered/Total Source Code Line Count (SLOC)', - width: '95%', - // height: 350, - is3D: true - }; - var tableChart = new google.visualization.Table(document.getElementById('coverage_table_chart_div')); - tableChart.draw(data, tableOptions); - } - - $('.collapsible').collapsible({ - accordion: false, - onOpen: function(el) { - var header = $( el[0].children[0] ); - var body = $( el[0].children[1] ); - var icon = header.children('.material-icons.expand-arrow'); - var testName = header.data('test'); - var timestamp = header.data('time'); - var url = '/api/test_run?test=' + testName + '×tamp=' + timestamp; - $.get(url).done(function(data) { - displayTestDetails(body, data, 16); - }).fail(function() { - icon.removeClass('rotate'); - }).always(function() { - header.removeClass('disabled'); - }); - }, // Callback for Collapsible open - onClose: function(el) { - console.log(el); - var body = $( el[0].children[1] ); - body.empty(); - } // Callback for Collapsible close - }); - - $( "span.indicator.badge:contains('Coverage')" ).click(function (evt) { - var header = $(evt.currentTarget.parentElement); - var testName = header.data('test'); - var startTime = header.data('time'); - var url = '/show_coverage?testName=' + testName + '&startTime=' + startTime; - window.location.href = url; - return false; - }); - - $( "span.indicator.badge:contains('Links')" ).click(function (evt) { - var header = $(evt.currentTarget.parentElement); - var logLinks = header.data('links'); - showLinks($('body'), logLinks); - return false; - }); - - $( "span.indicator.badge:contains('Graph')" ).click(function (evt) { - var header = $(evt.currentTarget.parentElement); - var testname = header.data('test'); - $('#coverageModalGraph').data("testname", testname); - $('#coverageModalGraph').modal('open'); - $(evt.target).removeClass("grey"); - $(evt.target).addClass("blue"); - return false; - }); - }); - - // draw test statistics chart - function drawStatsChart() { - var testStats = ${testStats}; - if (testStats.length < 1) { - return; - } - var resultNames = ${resultNamesJson}; - var rows = resultNames.map(function(res, i) { - nickname = res.replace('TEST_CASE_RESULT_', '').replace('_', ' ') - .trim().toLowerCase(); - return [nickname, parseInt(testStats[i])]; - }); - rows.unshift(['Result', 'Count']); - - // Get CSS color definitions (or default to white) - var colors = resultNames.map(function(res) { - return $('.' + res).css('background-color') || 'white'; - }); - - var data = google.visualization.arrayToDataTable(rows); - var options = { - is3D: false, - colors: colors, - fontName: 'Roboto', - fontSize: '14px', - legend: {position: 'labeled'}, - tooltip: {showColorCode: true, ignoreBounds: false}, - chartArea: {height: '80%', width: '90%'}, - pieHole: 0.4 - }; - - var chart = new google.visualization.PieChart(document.getElementById('pie-chart-stats')); - chart.draw(data, options); - } - - // draw the coverage pie charts - function drawCoverageCharts() { - var coveredLines = ${coveredLines}; - var uncoveredLines = ${uncoveredLines}; - var rows = [ - ["Result", "Count"], - ["Covered Lines", coveredLines], - ["Uncovered Lines", uncoveredLines] - ]; - - // Get CSS color definitions (or default to white) - var colors = [ - $('.TEST_CASE_RESULT_PASS').css('background-color') || 'white', - $('.TEST_CASE_RESULT_FAIL').css('background-color') || 'white' - ] - - var data = google.visualization.arrayToDataTable(rows); - - var optionsRaw = { - is3D: false, - colors: colors, - fontName: 'Roboto', - fontSize: '14px', - pieSliceText: 'value', - legend: {position: 'bottom'}, - chartArea: {height: '80%', width: '90%'}, - tooltip: {showColorCode: true, ignoreBounds: false, text: 'value'}, - pieHole: 0.4 - }; - - var optionsNormalized = { - is3D: false, - colors: colors, - fontName: 'Roboto', - fontSize: '14px', - legend: {position: 'bottom'}, - tooltip: {showColorCode: true, ignoreBounds: false, text: 'percentage'}, - chartArea: {height: '80%', width: '90%'}, - pieHole: 0.4 - }; - - var chart = new google.visualization.PieChart(document.getElementById('pie-chart-coverage-raw')); - chart.draw(data, optionsRaw); - - chart = new google.visualization.PieChart(document.getElementById('pie-chart-coverage-normalized')); - chart.draw(data, optionsNormalized); - } - - // refresh the page to see the runs matching the specified filter - function refresh() { - var link = '${pageContext.request.contextPath}' + - '/show_coverage_overview?' + search.args(); - if (${unfiltered}) { - link += '&unfiltered='; - } - window.open(link,'_self'); - } - - </script> - - <body> - <div class='wide container'> - <div id="filter-bar"> - <div class="row card search-bar expanded"> - <div class="header-wrapper"> - <h5 class="section-header"> - <b>Code Coverage</b> - </h5> - <div class="search-icon-wrapper"> - <i class="material-icons">search</i> - </div> - </div> - <div class="search-wrapper" ${empty branch and empty device ? 'style="display: none"' : ''}> - <div class="row"> - <div class="col s9"> - <div class="input-field col s4"> - <c:set var="branchVal" value='${fn:replace(branch, "\\\"", "")}'></c:set> - <select id="searchBranch"> - <option value="" <c:if test="${empty branch}">disabled selected</c:if> >Choose your branch</option> - <c:forEach items='${branchOptions}' var='branchOption'> - <option value="${branchOption}" ${branchVal == branchOption ? 'selected' : ''}>${branchOption}</option> - </c:forEach> - </select> - <label>Branch Select</label> - </div> - <div class="input-field col s4"> - <c:set var="deviceVal" value='${fn:replace(device, "\\\"", "")}'></c:set> - <select id="searchDevice"> - <option value="" <c:if test="${empty device}">disabled selected</c:if> >Choose your device</option> - <c:forEach items='${deviceOptions}' var='deviceOption'> - <option value="${deviceOption}" ${deviceVal == deviceOption ? 'selected' : ''}>${deviceOption}</option> - </c:forEach> - </select> - <label>Device Select</label> - </div> - <div class="col s4"></div> - </div> - <div class="refresh-wrapper col s3"> - <a id="schBtn" class="btn-floating btn-medium red waves-effect waves-light" style="margin-right: 30px;"> - <i class="medium material-icons">cached</i> - </a> - </div> - </div> - </div> - </div> - </div> - <div class='row'> - <div class='col s12'> - <div class='col s12 card center-align'> - <div id='legend-wrapper'> - <c:forEach items='${resultNames}' var='res'> - <div class='center-align legend-entry'> - <c:set var='trimmed' value='${fn:replace(res, "TEST_CASE_RESULT_", "")}'/> - <c:set var='nickname' value='${fn:replace(trimmed, "_", " ")}'/> - <label for='${res}'>${nickname}</label> - <div id='${res}' class='${res} legend-bubble'></div> - </div> - </c:forEach> - </div> - </div> - </div> - <div class='col s4 valign-wrapper'> - <!-- pie chart --> - <div class='pie-chart-wrapper col s12 valign center-align card'> - <h6 class='pie-chart-title'>Test Statistics</h6> - <div id='pie-chart-stats' class='pie-chart-div'></div> - </div> - </div> - <div class='col s4 valign-wrapper'> - <!-- pie chart --> - <div class='pie-chart-wrapper col s12 valign center-align card'> - <h6 class='pie-chart-title'>Line Coverage (Raw)</h6> - <div id='pie-chart-coverage-raw' class='pie-chart-div'></div> - </div> - </div> - <div class='col s4 valign-wrapper'> - <!-- pie chart --> - <div class='pie-chart-wrapper col s12 valign center-align card'> - <h6 class='pie-chart-title'>Line Coverage (Normalized)</h6> - <div id='pie-chart-coverage-normalized' class='pie-chart-div'></div> - </div> - </div> - </div> - <div class='col s12' id='test-results-container'> - <ul class="collapsible popout test-runs" data-collapsible="expandable"> - <c:forEach var="testRunEntity" items="${testRunEntityList}" varStatus="loop"> - <li class="test-run-container"> - <div data-test="<c:out value="${testRunEntity.testName}" />" data-time="<c:out value="${testRunEntity.startTimestamp}" />" data-links='${testRunEntity.jsonLogLinks}' class="collapsible-header test-run"> - <span class="test-run-metadata"> - <span class="test-run-label"> - <c:out value="${testRunEntity.testName}" /> - </span> - <br /> - <b>VTS Build: </b><c:out value="${testRunEntity.testBuildId}" /> - <br /> - <b>Host: </b><c:out value="${testRunEntity.hostName}" /> - <br /> - <c:out value="${testRunEntity.startDateTime}" /> - <c:out value="${testRunEntity.endDateTime}" />+0900 (<c:out value="${(testRunEntity.endTimestamp - testRunEntity.startTimestamp) / 1000}" />s) - </span> - <span class="indicator badge green" style="color: white;"> - <c:out value="${testRunEntity.passCount}" />/<c:out value="${testRunEntity.passCount + testRunEntity.passCount}" /> - </span> - - <c:set var="coveredLineCnt" value="${codeCoverageEntityMap[testRunEntity.id].coveredLineCount}" /> - <c:set var="totalLineCnt" value="${codeCoverageEntityMap[testRunEntity.id].totalLineCount}" /> - <c:set var="covPct" - value="${(coveredLineCnt / totalLineCnt * 1000) / 10}"/> - - <c:choose> - <c:when test = "${covPct <= 20}"> - <c:set var="badgeColor" value="red" /> - </c:when> - <c:when test = "${covPct >= 70}"> - <c:set var="badgeColor" value="green" /> - </c:when> - <c:otherwise> - <c:set var="badgeColor" value="orange" /> - </c:otherwise> - </c:choose> - - <span class="indicator badge padded hoverable waves-effect <c:out value="${badgeColor}" />" style="color: white; margin-left: 1px;"> - Coverage: <c:out value="${coveredLineCnt}" />/<c:out value="${totalLineCnt}" /> - (<fmt:formatNumber value="${(coveredLineCnt / totalLineCnt * 1000) / 10}" type="number" pattern="#.##"/>%) - </span> - <span class="indicator badge padded hoverable waves-effect grey lighten-1" style="color: white; margin-left: 1px;">Links</span> - <span class="indicator badge padded hoverable waves-effect grey lighten-1" style="color: white; margin-left: 1px;">Graph</span> - <i class="material-icons expand-arrow">expand_more</i> - </div> - <div class="collapsible-body test-results row"></div> - </li> - </c:forEach> - </ul> - - </div> - </div> - - <!-- Coverage Graph Modal Structure --> - <div id="coverageModalGraph" class="modal modal-fixed-footer" style="width: 75%;"> - <div class="modal-content"> - <h4 id="coverageModalTitle">Code Coverage Chart</h4> - - <div class="preloader-wrapper big active loaders"> - <div id="dataTableLoading" class="spinner-layer spinner-blue-only"> - <div class="circle-clipper left"> - <div class="circle"></div> - </div> - <div class="gap-patch"> - <div class="circle"></div> - </div> - <div class="circle-clipper right"> - <div class="circle"></div> - </div> - </div> - </div> - - <!--Div that will hold the visualization graph --> - <div id="coverage_line_chart_div"></div> - <p></p> - <p></p> - <div id="coverage_table_chart_div" class="center-align"></div> - </div> - <div class="modal-footer"> - <a href="#!" class="modal-action modal-close waves-effect waves-green btn-flat ">Close</a> - </div> - </div> - - <%@ include file="footer.jsp" %> - </body> -</html> |