asfgit closed pull request #23: IGNITE-9541 Add row highlight for 'failed', add title for columns, re…
URL: https://github.com/apache/ignite-teamcity-bot/pull/23 This is a PR merged from a forked repository. As GitHub hides the original diff on merge, it is displayed below for the sake of provenance: As this is a foreign pull request (from a fork), the diff is supplied below (as it won't show otherwise due to GitHub magic): diff --git a/ignite-tc-helper-web/src/main/webapp/comparison.html b/ignite-tc-helper-web/src/main/webapp/comparison.html index 5efe4e3..7868f64 100644 --- a/ignite-tc-helper-web/src/main/webapp/comparison.html +++ b/ignite-tc-helper-web/src/main/webapp/comparison.html @@ -29,11 +29,11 @@ <td style="text-align: center;" id="info1"></td> <td style="text-align: center;" id="info2"></td> </tr> - <tr><td class="section">TESTS</td><td></td><td></td></tr> + <tr><td class="section">TESTS</td><td></td><td class="title1"></td><td class="title2"></td></tr> <tr><td class="field">COUNT</td> <td><img id="clickGraphCount" src='/img/browser.png'></td> - <td class="data1" id="Count1" title="min - median - max"></td> - <td class="data2" id="Count2" title="min - median - max"></td> + <td class="data1" id="Count1" title="min - median - max" data-allow-highlight="false"></td> + <td class="data2" id="Count2" title="min - median - max" data-allow-highlight="false"></td> </tr> <tr id="showGraphCount" style="display: none;"><td></td> <td></td> @@ -42,8 +42,8 @@ </tr> <tr><td class="field">PASSED</td> <td><img id="clickGraphPassed" src='/img/browser.png'></td> - <td class="data1" id="Passed1" title="min - median - max"></td> - <td class="data2" id="Passed2" title="min - median - max"></td> + <td class="data1" id="Passed1" title="min - median - max" data-allow-highlight="false"></td> + <td class="data2" id="Passed2" title="min - median - max" data-allow-highlight="false"></td> </tr> <tr id="showGraphPassed" style="display: none;"><td></td> <td></td> @@ -52,8 +52,8 @@ </tr> <tr><td class="field">FAILED</td> <td><img id="clickGraphFailed" src='/img/browser.png'></td> - <td class="data1" id="Failed1" title="min - median - max"></td> - <td class="data2" id="Failed2" title="min - median - max"></td> + <td class="data1" id="Failed1" title="min - median - max" data-allow-highlight="true"></td> + <td class="data2" id="Failed2" title="min - median - max" data-allow-highlight="true"></td> </tr> <tr id="showGraphFailed" style="display: none;"><td></td> <td></td> @@ -62,8 +62,8 @@ </tr> <tr><td class="field">IGNORED</td> <td><img id="clickGraphIgnored" src='/img/browser.png'></td> - <td class="data1" id="Ignored1" title="min - median - max"></td> - <td class="data2" id="Ignored2" title="min - median - max"></td> + <td class="data1" id="Ignored1" title="min - median - max" data-allow-highlight="false"></td> + <td class="data2" id="Ignored2" title="min - median - max" data-allow-highlight="false"></td> </tr> <tr id="showGraphIgnored" style="display: none;"><td></td> <td></td> @@ -72,19 +72,19 @@ </tr> <tr><td class="field">MUTED</td> <td><img id="clickGraphMuted" src='/img/browser.png'></td> - <td class="data1" id="Muted1" title="min - median - max"></td> - <td class="data2" id="Muted2" title="min - median - max"></td></tr> + <td class="data1" id="Muted1" title="min - median - max" data-allow-highlight="false"></td> + <td class="data2" id="Muted2" title="min - median - max" data-allow-highlight="false"></td></tr> <tr id="showGraphMuted" style="display: none;"><td></td> <td></td> <td style="text-align: center;"><svg id="graphMuted1" width="500" height="200"></svg></td> <td style="text-align: center;"><svg id="graphMuted2" width="500" height="200"></svg></td> </tr> - <tr><td class="section">PROBLEMS</td><td></td><td></td></tr> + <tr><td class="section">PROBLEMS</td><td></td><td class="title1"></td><td class="title2"></td></tr> <tr style="display: none;"><td></td><td></td><td></td></tr> <tr><td class="field">TOTAL</td> <td><img id="clickGraphTT" src='/img/browser.png'></td> - <td class="data1" id="TT1" title="min - median - max"></td> - <td class="data2" id="TT2" title="min - median - max"></td></tr> + <td class="data1" id="TT1" title="min - median - max" data-allow-highlight="true"></td> + <td class="data2" id="TT2" title="min - median - max" data-allow-highlight="true"></td></tr> <tr id="showGraphTT" style="display: none;"><td></td> <td></td> <td style="text-align: center;"><svg id="graphTT1" width="500" height="200"></svg></td> @@ -92,8 +92,8 @@ </tr> <tr><td class="field">EXECUTION TIMEOUT</td> <td><img id="clickGraphET" src='/img/browser.png'></td> - <td class="data1" id="ET1" title="min - median - max"></td> - <td class="data2" id="ET2" title="min - median - max"></td> + <td class="data1" id="ET1" title="min - median - max" data-allow-highlight="true"></td> + <td class="data2" id="ET2" title="min - median - max" data-allow-highlight="true"></td> </tr> <tr id="showGraphET" style="display: none;"><td></td> <td></td> @@ -102,8 +102,8 @@ </tr> <tr><td class="field">JVM CRASH</td> <td><img id="clickGraphJC" src='/img/browser.png'></td> - <td class="data1" id="JC1" title="min - median - max"></td> - <td class="data2" id="JC2" title="min - median - max"></td> + <td class="data1" id="JC1" title="min - median - max" data-allow-highlight="true"></td> + <td class="data2" id="JC2" title="min - median - max" data-allow-highlight="true"></td> </tr> <tr id="showGraphJC" style="display: none;"><td></td> <td></td> @@ -112,8 +112,8 @@ </tr> <tr><td class="field">OOME</td> <td><img id="clickGraphOO" src='/img/browser.png'></td> - <td class="data1" id="OO1" title="min - median - max"></td> - <td class="data2" id="OO2" title="min - median - max"></td> + <td class="data1" id="OO1" title="min - median - max" data-allow-highlight="true"></td> + <td class="data2" id="OO2" title="min - median - max" data-allow-highlight="true"></td> </tr> <tr id="showGraphOO" style="display: none;"><td></td> <td></td> @@ -122,8 +122,8 @@ </tr> <tr><td class="field">EXIT CODE</td> <td><img id="clickGraphEC" src='/img/browser.png'></td> - <td class="data1" id="EC1" title="min - median - max"></td> - <td class="data2" id="EC2" title="min - median - max"></td> + <td class="data1" id="EC1" title="min - median - max" data-allow-highlight="true"></td> + <td class="data2" id="EC2" title="min - median - max" data-allow-highlight="true"></td> </tr> <tr id="showGraphEC" style="display: none;"><td></td> <td></td> @@ -200,6 +200,7 @@ if (dates.length === 0) { printImportantMessage(num, "#ff0000", "No data for the selected period"); fillAllDataCells(num, ""); + $('.title' + num).html(""); return; } else { @@ -211,37 +212,47 @@ (firstDate === lastDate ? firstDate : ("the period from " + firstDate + " to " + lastDate)) + ""); } else { $("#info" + num).html(""); - if (document.getElementById("info" + anotherNum).innerHTML === "") { - document.getElementById("showInfo").style.display = "none"; + if ($('#info' + anotherNum).text() === ''){ + $('#showInfo').css('display', 'none') } } } - let anotherMedian; - let result = {}; + $('.title' + num).html('min - median - max'); for (let i = 0; i < prOcc.length; i++) { - result = getMinMaxMedian(statistics[prOcc[i]]); - anotherMedian = parseMedian(document.getElementById(prOcc[i] + anotherNum).innerHTML); - - $('#' + prOcc[i] + num).html(result.min + " - " + result.median + " - " + result.max); - - if (!isNaN(anotherMedian)){ - if (result.median > anotherMedian){ - document.getElementById(prOcc[i] + num).style.backgroundColor = "#ffeee9"; - document.getElementById(prOcc[i] + anotherNum).style.backgroundColor = "#e5ffe8"; - } else if (result.median < anotherMedian){ - document.getElementById(prOcc[i] + anotherNum).style.backgroundColor = "#ffeee9"; - document.getElementById(prOcc[i] + num).style.backgroundColor = "#e5ffe8"; - } - } + fillCellWithStatistics(prOcc[i], num, statistics, dates); + fillCellWithStatistics(tOcc[i], num, statistics, dates); + } + } + + function fillCellWithStatistics(prefix, num, statistics, dates) { + let result = getMinMaxMedian(statistics[prefix]); - result = getMinMaxMedian(statistics[tOcc[i]]); + $('#' + prefix + num).html(result.min + " - " + result.median + " - " + result.max); - $('#' + tOcc[i] + num).html(result.min + " - " + result.median + " - " + result.max); + compareAndHighlight(prefix, num, result.median); + + drawGraph(prefix, num, dates, statistics[prefix], prefix); + } - drawGraph(prOcc[i], num, dates, statistics[prOcc[i]], prOcc[i]); - drawGraph(tOcc[i], num, dates, statistics[tOcc[i]], tOcc[i]); + function compareAndHighlight(prefix, thisNum, thisMedian){ + let anotherNum = (thisNum === 1) ? 2 : 1; + + let thisElement = $('#' + prefix + thisNum); + let anotherElement = $('#' + prefix + anotherNum); + + if (thisElement.data('allowHighlight').toString() === "true") { + let anotherMedian = parseMedian(anotherElement.text()); + if (!isNaN(anotherMedian)) { + if (thisMedian > anotherMedian) { + thisElement.css('background-color', '#ffeee9'); + anotherElement.css('background-color', '#e5ffe8'); + } else if (thisMedian < anotherMedian) { + anotherElement.css('background-color', '#ffeee9'); + thisElement.css('background-color', '#e5ffe8'); + } + } } } @@ -269,9 +280,7 @@ } function clearBackgroundFromAllDataCells(num){ - document.querySelectorAll(".data" + (num == null ? "1, .data2" : num)).forEach(function (el) { - el.style.background = null; - }); + $('.data' + (num == null ? '1, .data2' : num)).css('background', ''); } function fillAllDataCells(num, message) { @@ -294,7 +303,7 @@ function printImportantMessage(num, color, message) { $('#info' + num).html("<span style='background:" + color + "; color:white; font-weight:bold;'>" + " ! </span> " + message); - document.getElementById("showInfo").style.display = null; + $('#showInfo').css('display', ''); } function loadData(num, sinceDate, untilDate) { @@ -326,16 +335,14 @@ }); for (let i = 0; i < prOcc.length; i++) { - $("#clickGraph" + prOcc[i]).click(function() { - document.getElementById("showGraph" + prOcc[i]).style.display === 'none' ? - document.getElementById("showGraph" + prOcc[i]).style.display = null : - document.getElementById("showGraph" + prOcc[i]).style.display = 'none'; - }); - - $("#clickGraph" + tOcc[i]).click(function() { - document.getElementById("showGraph" + tOcc[i]).style.display === 'none' ? - document.getElementById("showGraph" + tOcc[i]).style.display = null : - document.getElementById("showGraph" + tOcc[i]).style.display = 'none'; + graphSpoiler(prOcc[i]); + graphSpoiler(tOcc[i]); + } + + function graphSpoiler(prefix) { + $("#clickGraph" + prefix).click(function() { + let element = $('#showGraph' + prefix); + element.css('display') === 'none' ? element.css('display', '') : element.css('display', 'none'); }); } diff --git a/ignite-tc-helper-web/src/main/webapp/css/style-1.5.css b/ignite-tc-helper-web/src/main/webapp/css/style-1.5.css index 8673a44..7e3f91f 100644 --- a/ignite-tc-helper-web/src/main/webapp/css/style-1.5.css +++ b/ignite-tc-helper-web/src/main/webapp/css/style-1.5.css @@ -166,6 +166,12 @@ form li:after color: #000000; } +.compare .title1, .compare .title2 { + text-align: center; + font-size: 10px; + color: gray; +} + .compare tr:nth-child(4n-1) { background-color: #fafaff; } ---------------------------------------------------------------- This is an automated message from the Apache Git Service. To respond to the message, please log on GitHub and use the URL above to go to the specific comment. For queries about this service, please contact Infrastructure at: [hidden email] With regards, Apache Git Services |
Free forum by Nabble | Edit this page |