From 389a082fbc28d1ac9f3966bf42c736f5803097c5 Mon Sep 17 00:00:00 2001 From: cp6 Date: Tue, 2 Feb 2021 15:53:27 +1100 Subject: [PATCH] Added comapre servers section Ability to compare metrics between two servers --- assets/css/style.css | 28 ++++- assets/js/scripts.min.js | 29 +++++ calls.php | 3 + class.php | 239 ++++++++++++++++++++++++++++++++++++++- 4 files changed, 292 insertions(+), 7 deletions(-) diff --git a/assets/css/style.css b/assets/css/style.css index 5691985..fea7246 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -51,6 +51,9 @@ body { .container { max-width: 720px } + .nav-link { + padding: .5rem 0.45rem; + } } @media (min-width: 992px) { @@ -1184,10 +1187,27 @@ button.close { background: #00ff340f; } -.objects-table th:first-child, .objects-table td:first-child { +.objects-table th:first-child, .objects-table td:first-child, .compare-table th:first-child, .compare-table td:first-child { position: sticky; left: 0; background-color: #f6f6f6; + text-align: left; +} + +.compare-table td, .compare-table th { + text-align: center; +} + +.plus-td { + background: #71ed7136; +} + +.neg-td { + background: #ed827136; +} + +.equal-td { + background: #6189ff26; } .table-btn { @@ -1540,4 +1560,10 @@ input:checked + .slider:before { .modal-lg { max-width: 800px; } +} + +@media (max-width: 700px) { + .nav-link { + padding: 0.5rem 0.45rem; + } } \ No newline at end of file diff --git a/assets/js/scripts.min.js b/assets/js/scripts.min.js index cca35f3..99ab497 100644 --- a/assets/js/scripts.min.js +++ b/assets/js/scripts.min.js @@ -183,8 +183,37 @@ $(document).ready(function () { } else if ($("#tableViewDiv").hasClass("active")){ loadTable(); } + + //Compare section + $("#compare_s1").change(function () { + var server1_id = $("#compare_s1 option:selected").val(); + var server2_id = $("#compare_s2 option:selected").val(); + if (server2_id.length !== 0) { + compareTableCall(server1_id, server2_id); + } + }); + $("#compare_s2").change(function () { + var server2_id = $("#compare_s2 option:selected").val(); + var server1_id = $("#compare_s1 option:selected").val(); + if (server1_id.length !== 0) { + compareTableCall(server1_id, server2_id); + } + }); + }); +function compareTableCall(id1, id2) { + $("#compareTableDiv").empty(); + $.ajax({ + type: "GET", + url: "calls.php", + data: {"type": "compare_table", "server1": id1, "server2": id2}, + success: function (result) { + $("#compareTableDiv").append(result); + } + }); +} + function loadCards(){ $.ajax({ type: "GET", diff --git a/calls.php b/calls.php index 3b66572..b615b98 100644 --- a/calls.php +++ b/calls.php @@ -46,6 +46,9 @@ if ($_SERVER['REQUEST_METHOD'] === 'GET') { } elseif ($_GET['type'] == 'object_tables') { header('Content-Type: text/html; charset=utf-8'); echo $idle->objectTables(); + } elseif ($_GET['type'] == 'compare_table') { + header('Content-Type: text/html; charset=utf-8'); + echo $idle->compareTable($_GET['server1'], $_GET['server2']); } } } elseif ($_SERVER['REQUEST_METHOD'] === 'POST') { diff --git a/class.php b/class.php index b459e10..020b023 100644 --- a/class.php +++ b/class.php @@ -612,7 +612,7 @@ class idlers extends helperFunctions protected function pageContents() { - $this->navTabs(array('Services', 'Add', 'Order', 'Info', 'Search'), array('#services', '#add_server', '#order', '#info', '#search')); + $this->navTabs(array('Services', 'Add', 'Order', 'Info', 'Search', 'Compare'), array('#services', '#add_server', '#order', '#info', '#search', '#compare')); $this->outputString('
'); $this->outputString('
'); $this->viewSwitcherIcon(); @@ -665,6 +665,10 @@ class idlers extends helperFunctions $this->outputString('