This is an automated email from the ASF dual-hosted git repository.
mmiller pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/accumulo.git
The following commit(s) were added to refs/heads/main by this push:
new 874ea84a07 Replace more js with jquery in server.js (#2652)
874ea84a07 is described below
commit 874ea84a07203077d69018688b8a7cb0a58a4d60
Author: Mike Miller <mmil...@apache.org>
AuthorDate: Thu Apr 28 10:46:01 2022 -0400
Replace more js with jquery in server.js (#2652)
* Replace javascript code with more readable and clearer jquery
* Add static rows and table cells to tserver tables instead of dynamically
creating the rows
* Create clearAllTableCells() js function to be reused
Co-authored-by: Christopher Tubbs <ctubb...@apache.org>
---
.../accumulo/monitor/resources/js/functions.js | 10 ++
.../apache/accumulo/monitor/resources/js/server.js | 126 +++++++--------------
.../apache/accumulo/monitor/templates/server.ftl | 15 ++-
3 files changed, 64 insertions(+), 87 deletions(-)
diff --git
a/server/monitor/src/main/resources/org/apache/accumulo/monitor/resources/js/functions.js
b/server/monitor/src/main/resources/org/apache/accumulo/monitor/resources/js/functions.js
index 80c90ec665..9363db104e 100644
---
a/server/monitor/src/main/resources/org/apache/accumulo/monitor/resources/js/functions.js
+++
b/server/monitor/src/main/resources/org/apache/accumulo/monitor/resources/js/functions.js
@@ -616,3 +616,13 @@ function getStatus() {
sessionStorage.status = JSON.stringify(data);
});
}
+
+/*
+ * Jquery call to clear all data from cells of a table
+ */
+function clearAllTableCells(tableId) {
+ console.log("Clearing all table cell data for " + tableId);
+ $("#" + tableId + " > tbody > tr > td").each(function () {
+ $(this).text("");
+ });
+}
diff --git
a/server/monitor/src/main/resources/org/apache/accumulo/monitor/resources/js/server.js
b/server/monitor/src/main/resources/org/apache/accumulo/monitor/resources/js/server.js
index 84784055da..0135f33655 100644
---
a/server/monitor/src/main/resources/org/apache/accumulo/monitor/resources/js/server.js
+++
b/server/monitor/src/main/resources/org/apache/accumulo/monitor/resources/js/server.js
@@ -17,6 +17,7 @@
* under the License.
*/
+var dashCell = "<td>—</td>";
var serv;
var tabletResults;
/**
@@ -45,9 +46,7 @@ function refreshDetailTable() {
var data = sessionStorage.server === undefined ?
[] : JSON.parse(sessionStorage.server);
if (data.length === 0 || data.details === undefined) {
- $("#tServerDetail > tbody > tr > td").each(function () {
- $(this).text(0);
- });
+ clearAllTableCells("tServerDetail");
} else {
$("#hostedTablets").text(bigNumberForQuantity(data.details.hostedTablets));
$("#entries").text(bigNumberForQuantity(data.details.entries));
@@ -58,23 +57,14 @@ function refreshDetailTable() {
}
/**
- * Generates the server history table
+ * Populates the All Time Tablet Operations table
*/
function refreshHistoryTable() {
-
- clearTableBody('opHistoryDetails');
-
var data = sessionStorage.server === undefined ?
[] : JSON.parse(sessionStorage.server);
if (data.length === 0 || data.allTimeTabletResults === undefined) {
- var row = [];
-
- row.push(createEmptyRow(8, 'Empty'));
-
- $('<tr/>', {
- html: row.join('')
- }).appendTo('#opHistoryDetails tbody');
+ clearAllTableCells("opHistoryDetails");
} else {
var totalTimeSpent = 0;
$.each(data.allTimeTabletResults, function(key, val) {
@@ -82,91 +72,46 @@ function refreshHistoryTable() {
});
$.each(data.allTimeTabletResults, function(key, val) {
- var row = [];
-
- row.push(createFirstCell(val.operation, val.operation));
-
- row.push(createRightCell(val.success,
bigNumberForQuantity(val.success)));
-
- row.push(createRightCell(val.failure,
- bigNumberForQuantity(val.failure)));
-
- row.push(createRightCell((val.avgQueueTime == null ?
- '-' : val.avgQueueTime * 1000.0),
- (val.avgQueueTime == null ?
- '—' : timeDuration(val.avgQueueTime * 1000.0))));
-
- row.push(createRightCell((val.queueStdDev == null ?
- '-' : val.queueStdDev * 1000.0),
- (val.queueStdDev == null ?
- '—' : timeDuration(val.queueStdDev * 1000.0))));
-
- row.push(createRightCell((val.avgTime == null ?
- '-' : val.avgTime * 1000.0),
- (val.avgTime == null ?
- '—' : timeDuration(val.avgTime * 1000.0))));
-
- row.push(createRightCell((val.stdDev == null ?
- '-' : val.stdDev * 1000.0),
- (val.stdDev == null ?
- '—' : timeDuration(val.stdDev * 1000.0))));
-
- row.push(createRightCell(((val.timeSpent / totalTimeSpent) * 100),
- '<div class="progress"><div class="progress-bar"' +
- ' role="progressbar" style="min-width: 2em; width:' +
- Math.floor((val.timeSpent / totalTimeSpent) * 100) +
- '%;">' + Math.floor((val.timeSpent / totalTimeSpent) * 100) +
- '%</div></div>'));
-
- $('<tr/>', {
- html: row.join('')
- }).appendTo('#opHistoryDetails tbody');
-
+ // use the first 5 characters of the operation for the jquery selector
+ var rowId = "#" + val.operation.slice(0, 5) + "Row";
+ console.log("Populating rowId " + rowId + " with " + val.operation + "
data");
+
+ $(rowId).append("<td>" + val.operation + "</td>");
+ $(rowId).append("<td>" + bigNumberForQuantity(val.success) + "</td>");
+ $(rowId).append("<td>" + bigNumberForQuantity(val.failure) + "</td>");
+
+ appendDurationToRow(rowId, val.avgQueueTime);
+ appendDurationToRow(rowId, val.queueStdDev);
+ appendDurationToRow(rowId, val.avgTime);
+ appendDurationToRow(rowId, val.stdDev);
+
+ var percent = Math.floor((val.timeSpent / totalTimeSpent) * 100);
+ var progressBarCell = '<td><div class="progress"><div
class="progress-bar"' +
+ ' role="progressbar" style="min-width: 2em; width:' + percent +
'%;">' +
+ percent + '%</div></div></td>';
+ console.log("Time spent percent = " + val.timeSpent + "/" +
totalTimeSpent + " " + percent);
+
+ $(rowId).append(progressBarCell);
});
}
}
/**
- * Generates the current server table
+ * Populates the current tablet operations results table
*/
function refreshCurrentTable() {
-
- clearTableBody('currentTabletOps');
-
var data = sessionStorage.server === undefined ?
[] : JSON.parse(sessionStorage.server);
- var items = [];
if (data.length === 0 || data.currentTabletOperationResults === undefined) {
- items.push(createEmptyRow(4, 'Empty'));
+ clearAllTableCells("currentTabletOps");
} else {
var current = data.currentTabletOperationResults;
-
- items.push(createFirstCell((current.currentMinorAvg == null ?
- '-' : current.currentMinorAvg * 1000.0),
- (current.currentMinorAvg == null ?
- '—' : timeDuration(current.currentMinorAvg * 1000.0))));
-
- items.push(createRightCell((current.currentMinorStdDev == null ?
- '-' : current.currentMinorStdDev * 1000.0),
- (current.currentMinorStdDev == null ?
- '—' : timeDuration(current.currentMinorStdDev * 1000.0))));
-
- items.push(createRightCell((current.currentMajorAvg == null ?
- '-' : current.currentMajorAvg * 1000.0),
- (current.currentMajorAvg == null ?
- '—' : timeDuration(current.currentMajorAvg * 1000.0))));
-
- items.push(createRightCell((current.currentMajorStdDev == null ?
- '-' : current.currentMajorStdDev * 1000.0),
- (current.currentMajorStdDev == null ?
- '—' : timeDuration(current.currentMajorStdDev * 1000.0))));
+ $("#currentMinorAvg").html(timeDuration(current.currentMinorAvg * 1000.0));
+ $("#currentMinorStdDev").html(timeDuration(current.currentMinorStdDev *
1000.0));
+ $("#currentMajorAvg").html(timeDuration(current.currentMajorAvg * 1000.0));
+ $("#currentMajorStdDev").html(timeDuration(current.currentMajorStdDev *
1000.0));
}
-
- $('<tr/>', {
- html: items.join('')
- }).appendTo('#currentTabletOps tbody');
-
}
/**
@@ -175,3 +120,14 @@ function refreshCurrentTable() {
function refreshResultsTable() {
tabletResults.ajax.reload(null, false ); // user paging is not reset on
reload
}
+
+/*
+ * Appends a table cell containing value to the rowId, if value is not null
+ */
+function appendDurationToRow(rowId, value) {
+ let v = dashCell;
+ if (value != null) {
+ v = "<td>" + timeDuration(value * 1000.0) + "</td>";
+ }
+ $(rowId).append(v);
+}
diff --git
a/server/monitor/src/main/resources/org/apache/accumulo/monitor/templates/server.ftl
b/server/monitor/src/main/resources/org/apache/accumulo/monitor/templates/server.ftl
index 0c29b8ac9c..fc16786ee6 100644
---
a/server/monitor/src/main/resources/org/apache/accumulo/monitor/templates/server.ftl
+++
b/server/monitor/src/main/resources/org/apache/accumulo/monitor/templates/server.ftl
@@ -125,7 +125,11 @@
<th>Percentage Time Spent </th>
</tr>
</thead>
- <tbody></tbody>
+ <tbody>
+ <tr id="MinorRow"></tr>
+ <tr id="MajorRow"></tr>
+ <tr id="SplitRow"></tr>
+ </tbody>
</table>
</div>
</div>
@@ -141,7 +145,14 @@
<th>Major Std Dev </th>
</tr>
</thead>
- <tbody></tbody>
+ <tbody>
+ <tr>
+ <td id="currentMinorAvg"></td>
+ <td id="currentMinorStdDev"></td>
+ <td id="currentMajorAvg"></td>
+ <td id="currentMajorStdDev"></td>
+ </tr>
+ </tbody>
</table>
</div>
</div>
