aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorPatrice Buriez <patrice.buriez@intel.com>2018-11-09 11:48:15 +0100
committerPatrice Buriez <patrice.buriez@intel.com>2018-12-21 19:07:59 +0100
commit6ab3d996abb23e4cd47dbaa8591577e019a84541 (patch)
tree7050838adc919c5741ab1d826c7971b9813935c3
parentf85bca25fd5a681215c210c51b703e0e957a91e5 (diff)
Only show metrics for selected nodes in data table
Together with timestamps, separately added into the table. Optimize the showcasing of graphs and table. JIRA: YARDSTICK-1367 Topic: report/html_table (11 of 12) Change-Id: I263960b059fd27409b36f825664da8c2804e0425 Signed-off-by: Shobhi Jain <shobhi.jain@intel.com> Signed-off-by: Patrice Buriez <patrice.buriez@intel.com>
-rw-r--r--yardstick/common/nsb_report.css17
-rw-r--r--yardstick/common/nsb_report.html.j29
-rw-r--r--yardstick/common/nsb_report.js25
3 files changed, 47 insertions, 4 deletions
diff --git a/yardstick/common/nsb_report.css b/yardstick/common/nsb_report.css
index 2beb91c53..235321441 100644
--- a/yardstick/common/nsb_report.css
+++ b/yardstick/common/nsb_report.css
@@ -16,6 +16,7 @@ table {
overflow-y: scroll;
height: 360px;
display: block;
+ width: 100%;
}
header {
@@ -24,6 +25,22 @@ header {
text-align: center;
}
+h1 {
+ font-size: 20pt;
+ font-weight: bold;
+ height: 20px;
+ margin: 0px 0px;
+}
+
+h4 {
+ font-size: 13pt;
+ height: 1px;
+ margin-bottom: 0px;
+}
+
.control-pane {
font-size: 10pt;
}
+
+.data-pane {
+}
diff --git a/yardstick/common/nsb_report.html.j2 b/yardstick/common/nsb_report.html.j2
index a3087d746..6523fd16f 100644
--- a/yardstick/common/nsb_report.html.j2
+++ b/yardstick/common/nsb_report.html.j2
@@ -29,7 +29,7 @@
</head>
<body>
- <div class="container" style="width:80%">
+ <div class="container-fluid">
<div class="row">
<header class="jumbotron">
<h1>Yardstick User Interface</h1>
@@ -58,12 +58,14 @@
jstree_data = {{jstree_nodes|safe}};
$(function() {
- create_table(arr);
+ create_table(arr, timestamps);
create_tree(jstree_data);
var objGraph = create_graph($('#cnvGraph'), timestamps);
$('#data_selector').on('check_node.jstree uncheck_node.jstree', function(e, data) {
var selected_datasets = [];
+ var new_arr = {};
+ deleteRows();
for (var i = 0; i < data.selected.length; i++) {
var node = data.instance.get_node(data.selected[i]);
if (node.children.length == 0) {
@@ -72,8 +74,11 @@
data: arr[node.id],
};
selected_datasets.push(dataset);
+ // Create new array for table to show only subset of metrics
+ new_arr[node.id] = arr[node.id];
}
}
+ create_table(new_arr, timestamps);
update_graph(objGraph, selected_datasets);
});
});
diff --git a/yardstick/common/nsb_report.js b/yardstick/common/nsb_report.js
index cc5e14ee7..4bff15b5a 100644
--- a/yardstick/common/nsb_report.js
+++ b/yardstick/common/nsb_report.js
@@ -29,13 +29,25 @@ function create_tree(jstree_data)
});
}
-// may need to pass timestamps too...
-function create_table(table_data)
+function create_table(table_data, timestamps)
{
var tab, tr, td, tn, tbody, keys, key, curr_data, val;
// create table
tab = document.getElementsByTagName('table')[0];
tbody = document.createElement('tbody');
+ // create table headings using timestamps
+ tr = document.createElement('tr');
+ td = document.createElement('td');
+ tn = document.createTextNode('Timestamps');
+ td.appendChild(tn);
+ tr.appendChild(td);
+ for (var k = 0; k < timestamps.length; k++) {
+ td = document.createElement('td');
+ tn = document.createTextNode(timestamps[k]);
+ td.appendChild(tn);
+ tr.appendChild(td);
+ }
+ tbody.appendChild(tr);
// for each metric
keys = Object.keys(table_data);
for (var i = 0; i < keys.length; i++) {
@@ -59,6 +71,15 @@ function create_table(table_data)
tab.appendChild(tbody);
}
+function deleteRows()
+{
+ // delete rows of the table
+ var tab = document.getElementsByTagName('table')[0];
+ for (var i = tab.rows.length - 1; i >= 0; i--) {
+ tab.deleteRow(i);
+ }
+}
+
function create_graph(cnvGraph, timestamps)
{
return new Chart(cnvGraph, {