This is an automated email from the ASF dual-hosted git repository.
domgarguilo 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 19e420da39 Convert deadTServers and badTServers tables to DataTables
(#2685)
19e420da39 is described below
commit 19e420da392c3905dbe9f3b020a4a60d03615d55
Author: Dom G <dominic.gargu...@gmail.com>
AuthorDate: Wed May 11 14:32:24 2022 -0400
Convert deadTServers and badTServers tables to DataTables (#2685)
* replace tables with DataTables
* format code via jslint standards
---
.../accumulo/monitor/resources/js/tservers.js | 376 ++++++++++++---------
.../apache/accumulo/monitor/templates/tservers.ftl | 10 +-
2 files changed, 230 insertions(+), 156 deletions(-)
diff --git
a/server/monitor/src/main/resources/org/apache/accumulo/monitor/resources/js/tservers.js
b/server/monitor/src/main/resources/org/apache/accumulo/monitor/resources/js/tservers.js
index 223f768d16..47d2bb7d66 100644
---
a/server/monitor/src/main/resources/org/apache/accumulo/monitor/resources/js/tservers.js
+++
b/server/monitor/src/main/resources/org/apache/accumulo/monitor/resources/js/tservers.js
@@ -16,165 +16,116 @@
* specific language governing permissions and limitations
* under the License.
*/
+/* JSLint global definitions */
+/*global
+ $, document, sessionStorage, getTServers, clearDeadServers, refreshNavBar,
+ getRecoveryList, bigNumberForQuantity, timeDuration, dateFormat
+*/
"use strict";
-var tserversTable;
+var tserversTable, deadTServersTable, badTServersTable;
var recoveryList = [];
/**
- * Creates tservers initial table
+ * Checks if the given server is in the global recoveryList variable
+ *
+ * @param {JSON} server json server object
+ * @returns true if the server is in the recoveryList, else false
*/
-$(document).ready(function() {
-
- refreshRecoveryList();
-
- // Create a table for tserver list
- tserversTable = $('#tservers').DataTable({
- "ajax": {
- "url": '/rest/tservers',
- "dataSrc": "servers"
- },
- "stateSave": true,
- "columnDefs": [
- { "targets": "big-num",
- "render": function ( data, type, row ) {
- if(type === 'display') data = bigNumberForQuantity(data);
- return data;
- }
- },
- { "targets": "duration",
- "render": function ( data, type, row ) {
- if(type === 'display') data = timeDuration(data);
- return data;
- }
- },
- { "targets": "percent",
- "render": function ( data, type, row ) {
- if(type === 'display') data = Math.round(data * 100) + '%';
- return data;
- }
- }
- ],
- "columns": [
- { "data": "hostname",
- "type": "html",
- "render": function ( data, type, row, meta ) {
- if(type === 'display') data = '<a href="/tservers?s=' + row.id +
'">' + row.hostname + '</a>';
- return data;
- }
- },
- { "data": "tablets" },
- { "data": "lastContact" },
- { "data": "responseTime" },
- { "data": "entries" },
- { "data": "ingest" },
- { "data": "query" },
- { "data": "holdtime" },
- { "data": "scansCombo" },
- { "data": "minorCombo" },
- { "data": "majorCombo" },
- { "data": "indexCacheHitRate" },
- { "data": "dataCacheHitRate" },
- { "data": "osload" }
- ],
- "rowCallback": function (row, data, index) {
- // reset background of each row
- $(row).css('background-color', '');
-
- // return if the current row's tserver is not recovering
- if (!recoveryList.includes(data.hostname))
- return;
-
- // only show the caption if we know there are rows in the tservers
table
- $('#recovery-caption').show();
-
- // highlight current row
- console.log('Highlighting row index:' + index + ' tserver:' +
data.hostname);
- $(row).css('background-color', 'gold');
- }
- });
- refreshTServers();
-});
+function serverIsInRecoveryList(server) {
+ return recoveryList.includes(server.hostname);
+}
/**
- * Makes the REST calls, generates the tables with the new information
+ * Refreshes the list of recovering tservers and shows/hides the recovery
caption
*/
-function refreshTServers() {
- getTServers().then(function() {
- refreshBadTServersTable();
- refreshDeadTServersTable();
- refreshRecoveryList();
- refreshTServersTable();
- });
+function refreshRecoveryList() {
+ getRecoveryList().then(function () {
+ var sessionStorageRecoveryList, sessionStorageTserversList;
+
+ // get list of recovering servers and online servers from
sessionStorage
+ sessionStorageRecoveryList = sessionStorage.recoveryList === undefined
?
+ [] : JSON.parse(sessionStorage.recoveryList).recoveryList;
+ sessionStorageTserversList = sessionStorage.tservers === undefined ?
+ [] : JSON.parse(sessionStorage.tservers).servers;
+
+ // update global recovery list variable
+ recoveryList = sessionStorageRecoveryList.map(function (entry) {
+ return entry.server;
+ });
+
+ // show the recovery caption if any online servers are in the recovery
list
+ if (sessionStorageTserversList.some(serverIsInRecoveryList)) {
+ $('#recovery-caption').show();
+ } else {
+ $('#recovery-caption').hide();
+ }
+ });
}
/**
- * Used to redraw the page
+ * Performs an ajax reload for the given Datatable
+ *
+ * @param {DataTable} table DataTable to perform an ajax reload on
*/
-function refresh() {
- refreshTServers();
+function ajaxReloadTable(table) {
+ if (table) {
+ table.ajax.reload(null, false); // user paging is not reset on reload
+ }
}
/**
- * Generates the tservers rows
+ * Refreshes data in the tserver table
*/
-function refreshBadTServersTable() {
- $('#badtservers').hide(); // Hide table on each refresh
-
- var data = sessionStorage.tservers === undefined ?
- [] : JSON.parse(sessionStorage.tservers);
-
- clearTableBody('badtservers');
-
- // return if the table is empty
- if (data.length === 0 || data.badServers.length === 0)
- return;
-
- $('#badtservers').show();
- $.each(data.badServers, function (key, val) {
- var items = [];
- items.push(createFirstCell(val.id, val.id));
- items.push(createRightCell(val.status, val.status));
-
- $('<tr/>', {
- html: items.join('')
- }).appendTo('#badtservers tbody');
- });
+function refreshTServersTable() {
+ refreshRecoveryList();
+ ajaxReloadTable(tserversTable);
}
-
/**
- * Generates the deadtservers rows
+ * Refreshes data in the deadtservers table
*/
function refreshDeadTServersTable() {
- $('#deadtservers').hide(); // Hide table on each refresh
-
- var data = sessionStorage.tservers === undefined ?
- [] : JSON.parse(sessionStorage.tservers);
-
- clearTableBody('deadtservers');
+ ajaxReloadTable(deadTServersTable);
- // return if the table is empty
- if (data.length === 0 || data.deadServers.length === 0)
- return;
+ // Only show the table if there are non-empty rows
+ if ($('#deadtservers tbody .dataTables_empty').length) {
+ $('#deadtservers_wrapper').hide();
+ } else {
+ $('#deadtservers_wrapper').show();
+ }
+}
- $('#deadtservers').show();
- $.each(data.deadServers, function (key, val) {
- var items = [];
- items.push(createFirstCell(val.server, val.server));
+/**
+ * Refreshes data in the badtservers table
+ */
+function refreshBadTServersTable() {
+ ajaxReloadTable(badTServersTable);
- var date = new Date(val.lastStatus);
- date = date.toLocaleString().split(' ').join(' ');
- items.push(createRightCell(val.lastStatus, date));
- items.push(createRightCell(val.status, val.status));
- items.push(createRightCell('', '<a href="javascript:clearDeadTServers(\'' +
- val.server + '\');">clear</a>'));
+ // Only show the table if there are non-empty rows
+ if ($('#badtservers tbody .dataTables_empty').length) {
+ $('#badtservers_wrapper').hide();
+ } else {
+ $('#badtservers_wrapper').show();
+ }
+}
- $('<tr/>', {
- html: items.join('')
- }).appendTo('#deadtservers tbody');
- });
+/**
+ * Makes the REST calls, generates the tables with the new information
+ */
+function refreshTServers() {
+ getTServers().then(function () {
+ refreshBadTServersTable();
+ refreshDeadTServersTable();
+ refreshTServersTable();
+ });
+}
+/**
+ * Used to redraw the page
+ */
+function refresh() {
+ refreshTServers();
}
/**
@@ -183,29 +134,150 @@ function refreshDeadTServersTable() {
* @param {string} server Dead TServer to clear
*/
function clearDeadTServers(server) {
- clearDeadServers(server);
- refreshTServers();
- refreshNavBar();
+ clearDeadServers(server);
+ refreshTServers();
+ refreshNavBar();
}
/**
- * Generates the tserver table
+ * Creates initial tables
*/
-function refreshTServersTable() {
- if (tserversTable) tserversTable.ajax.reload(null, false); // user paging is
not reset on reload
-}
+$(document).ready(function () {
-/**
- * Refreshes the list of recovering tservers used to highlight rows
- */
-function refreshRecoveryList() {
- $('#recovery-caption').hide(); // Hide the caption about highlighted rows on
each refresh
- getRecoveryList().then(function () {
- recoveryList = []
- var data = sessionStorage.recoveryList === undefined ?
- [] : JSON.parse(sessionStorage.recoveryList);
- data.recoveryList.forEach(entry => {
- recoveryList.push(entry.server);
+ refreshRecoveryList();
+
+ // Create a table for tserver list
+ tserversTable = $('#tservers').DataTable({
+ "ajax": {
+ "url": '/rest/tservers',
+ "dataSrc": "servers"
+ },
+ "stateSave": true,
+ "columnDefs": [
+ {
+ "targets": "big-num",
+ "render": function (data, type) {
+ if (type === 'display') {
+ data = bigNumberForQuantity(data);
+ }
+ return data;
+ }
+ },
+ {
+ "targets": "duration",
+ "render": function (data, type) {
+ if (type === 'display') {
+ data = timeDuration(data);
+ }
+ return data;
+ }
+ },
+ {
+ "targets": "percent",
+ "render": function (data, type) {
+ if (type === 'display') {
+ data = Math.round(data * 100) + '%';
+ }
+ return data;
+ }
+ }
+ ],
+ "columns": [
+ {
+ "data": "hostname",
+ "type": "html",
+ "render": function (data, type, row) {
+ if (type === 'display') {
+ data = '<a href="/tservers?s=' + row.id + '">' +
row.hostname + '</a>';
+ }
+ return data;
+ }
+ },
+ { "data": "tablets" },
+ { "data": "lastContact" },
+ { "data": "responseTime" },
+ { "data": "entries" },
+ { "data": "ingest" },
+ { "data": "query" },
+ { "data": "holdtime" },
+ { "data": "scansCombo" },
+ { "data": "minorCombo" },
+ { "data": "majorCombo" },
+ { "data": "indexCacheHitRate" },
+ { "data": "dataCacheHitRate" },
+ { "data": "osload" }
+ ],
+ "rowCallback": function (row, data, index) {
+ // reset background of each row
+ $(row).css('background-color', '');
+
+ // if the curent hostname is in the reovery list
+ if (serverIsInRecoveryList(data)) {
+ // highlight the current row
+ console.log('Highlighting row index:' + index + ' tserver:' +
data.hostname);
+ $(row).css('background-color', 'gold');
+ }
+ }
});
- });
-}
\ No newline at end of file
+
+ // Create a table for deadServers list
+ deadTServersTable = $('#deadtservers').DataTable({
+ "ajax": {
+ "url": '/rest/tservers',
+ "dataSrc": "deadServers"
+ },
+ "stateSave": true,
+ "columnDefs": [
+ {
+ "targets": "date",
+ "render": function (data, type) {
+ if (type === 'display' && data > 0) {
+ data = dateFormat(data);
+ }
+ return data;
+ }
+ }
+ ],
+ "columns": [
+ { "data": "server" },
+ { "data": "lastStatus" },
+ { "data": "status" },
+ {
+ "data": "server",
+ "type": "html",
+ "render": function (data, type) {
+ if (type === 'display') {
+ data = '<a href="javascript:clearDeadTServers(\'' +
data + '\');">clear</a>';
+ }
+ return data;
+ }
+ }
+ ]
+ });
+
+ // Create a table for badServers list
+ badTServersTable = $('#badtservers').DataTable({
+ "ajax": {
+ "url": '/rest/tservers',
+ "dataSrc": "badServers"
+ },
+ "stateSave": true,
+ "columnDefs": [
+ {
+ "targets": "date",
+ "render": function (data, type) {
+ if (type === 'display' && data > 0) {
+ data = dateFormat(data);
+ }
+ return data;
+ }
+ }
+ ],
+ "columns": [
+ { "data": "id" },
+ { "data": "status" }
+ ]
+ });
+
+ refreshTServers();
+});
\ No newline at end of file
diff --git
a/server/monitor/src/main/resources/org/apache/accumulo/monitor/templates/tservers.ftl
b/server/monitor/src/main/resources/org/apache/accumulo/monitor/templates/tservers.ftl
index 879f6e5a5c..cbe6db959c 100644
---
a/server/monitor/src/main/resources/org/apache/accumulo/monitor/templates/tservers.ftl
+++
b/server/monitor/src/main/resources/org/apache/accumulo/monitor/templates/tservers.ftl
@@ -25,9 +25,9 @@
</div>
<div class="row">
<div class="col-xs-12">
- <table id="badtservers" class="table table-bordered table-striped
table-condensed" style="display: none;">
+ <table id="badtservers" class="table table-bordered table-striped
table-condensed">
<caption><span class="table-caption">Non-Functioning Tablet
Servers</span><br/>
- <span class="table-subcaption">The following tablet servers
reported a status other than Online</span></caption>
+ <span class="table-subcaption">The following tablet servers
reported a status other than Online.</span><br/></caption>
<thead>
<tr>
<th>Server</th>
@@ -36,13 +36,13 @@
</thead>
<tbody></tbody>
</table>
- <table id="deadtservers" class="table table-bordered table-striped
table-condensed" style="display: none;">
+ <table id="deadtservers" class="table table-bordered table-striped
table-condensed">
<caption><span class="table-caption">Dead Tablet
Servers</span><br/>
<span class="table-subcaption">The following tablet servers are
no longer reachable.</span><br/></caption>
<thead>
<tr>
<th>Server</th>
- <th class="duration">Last Updated</th>
+ <th class="date">Last Updated</th>
<th>Event</th>
<th>Clear</th>
</tr>
@@ -51,6 +51,8 @@
</table>
<span id="recovery-caption" style="background-color: gold; display:
none;">Highlighted rows correspond to tservers in recovery mode.</span>
<table id="tservers" class="table table-bordered table-striped
table-condensed">
+ <caption><span class="table-caption">Online Tablet
Servers</span><br/>
+ <span class="table-subcaption">The following tablet servers
reported a status of Online.</span><br/></caption>
<thead>
<tr>
<th class="firstcell">Server </th>
