You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@atlas.apache.org by sa...@apache.org on 2019/10/15 23:27:23 UTC

[atlas] branch branch-2.0 updated: ATLAS-3463 UI : Show JVM resources stats on statistics modal

This is an automated email from the ASF dual-hosted git repository.

sarath pushed a commit to branch branch-2.0
in repository https://gitbox.apache.org/repos/asf/atlas.git


The following commit(s) were added to refs/heads/branch-2.0 by this push:
     new 0b51871  ATLAS-3463 UI : Show JVM resources stats on statistics modal
0b51871 is described below

commit 0b51871daa1d147556da5331e63219f2f6172c0f
Author: sameer79 <fi...@yahoo.co.in>
AuthorDate: Mon Oct 14 18:38:13 2019 +0530

    ATLAS-3463 UI : Show JVM resources stats on statistics modal
    
    Signed-off-by: Sarath Subramanian <sa...@apache.org>
    (cherry picked from commit c3da6d5ff3519f3f39cd34d578b91341a417d402)
---
 dashboardv2/public/css/scss/common.scss            | 25 ++++++--
 .../public/js/templates/site/Statistics_tmpl.html  | 66 ++++++++++++++++++++--
 dashboardv2/public/js/views/site/Statistics.js     | 59 +++++++++++++++++--
 dashboardv3/public/css/scss/common.scss            | 24 ++++++--
 .../public/js/templates/site/Statistics_tmpl.html  | 65 +++++++++++++++++++--
 dashboardv3/public/js/views/site/Statistics.js     | 57 +++++++++++++++++--
 6 files changed, 269 insertions(+), 27 deletions(-)

diff --git a/dashboardv2/public/css/scss/common.scss b/dashboardv2/public/css/scss/common.scss
index 70fa5b8..84afbc8 100644
--- a/dashboardv2/public/css/scss/common.scss
+++ b/dashboardv2/public/css/scss/common.scss
@@ -189,6 +189,21 @@ pre {
         font-family: monospace;
     }
 }
+
+.panel-body .memory-details {
+    pre {
+        &.code-block {
+            &.shrink {
+                height: 144px;
+
+                code {
+                    height: 130px;
+                }
+            }
+        }
+    }
+}
+
 .footer-content {
     position: fixed;
     right: 0px;
@@ -225,18 +240,18 @@ pre {
         }
 
 
-        .custom-col-0{
+        .custom-col-0 {
             text-align: center;
             vertical-align: middle;
             line-height: 31px;
             width: 3%;
         }
 
-        .custom-col-1{
-            width: 38%;
+        .custom-col-1 {
+            width: 39%;
         }
 
-        .custom-col-2{
+        .custom-col-2 {
             text-align: center;
             width: 17%;
             margin-left: 1%;
@@ -256,4 +271,4 @@ pre {
     margin-bottom: 5px;
     margin-left: 5px;
     float: left;
-}
+}
\ No newline at end of file
diff --git a/dashboardv2/public/js/templates/site/Statistics_tmpl.html b/dashboardv2/public/js/templates/site/Statistics_tmpl.html
index f5c6c8b..62c1846 100644
--- a/dashboardv2/public/js/templates/site/Statistics_tmpl.html
+++ b/dashboardv2/public/js/templates/site/Statistics_tmpl.html
@@ -16,7 +16,7 @@
 -->
 <div class="panel-group server-stats-container statsContainer hide" id="accordion">
     <div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="entity">
-        <div class="panel-heading" data-toggle="collapse" href="#collapse1" aria-expanded="true">
+        <div class="panel-heading" data-toggle="collapse" href="#entityCountCollapse" aria-expanded="true">
             <h4 class="panel-title">
                 <a>Entities <span class="count">(0)</span></a>
             </h4>
@@ -24,7 +24,7 @@
                 <button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
             </div>
         </div>
-        <div id="collapse1" class="panel-collapse collapse in">
+        <div id="entityCountCollapse" class="panel-collapse collapse in">
             <div class="panel-body">
                 <table class="table stat-table entityTable" data-id="entity-card">
                     <tbody>
@@ -37,7 +37,7 @@
         </div>
     </div>
     <div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="stats">
-        <div class="panel-heading" data-toggle="collapse" href="#collapse3" aria-expanded="true">
+        <div class="panel-heading" data-toggle="collapse" href="#serverDetailcollapse" aria-expanded="true">
             <h4 class="panel-title">
                 <a>Server Statistics </a>
             </h4>
@@ -45,7 +45,7 @@
                 <button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
             </div>
         </div>
-        <div id="collapse3" class="panel-collapse collapse in">
+        <div id="serverDetailcollapse" class="panel-collapse collapse in">
             <div class="panel-body">
                 <div class="col-sm-12">
                     <div class="card-container panel panel-primary">
@@ -87,7 +87,63 @@
             </div>
         </div>
     </div>
+    <div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="systemDetails">
+        <div class="panel-heading" data-toggle="collapse" href="#systemDetailCollapse" aria-expanded="false">
+            <h4 class="panel-title">
+                <a>System Details</a>
+            </h4>
+            <div class="btn-group pull-left">
+                <button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
+            </div>
+        </div>
+        <div id="systemDetailCollapse" class="panel-collapse collapse ">
+            <div class="panel-body">
+                <div class="col-sm-6">
+                    <div class="card-container panel panel-primary">
+                        <div class="panel-heading">OS</div>
+                        <div class="panel-body">
+                            <table class="table stat-table">
+                                <tbody data-id="os-card">
+                                    <tr class="empty text-center">
+                                        <td colspan="2"><span>No records found!</span></td>
+                                    </tr>
+                                </tbody>
+                            </table>
+                        </div>
+                    </div>
+                </div>
+                <div class="col-sm-6">
+                    <div class="card-container panel panel-primary">
+                        <div class="panel-heading">Runtime</div>
+                        <div class="panel-body">
+                            <table class="table stat-table">
+                                <tbody data-id="runtime-card">
+                                    <tr class="empty text-center">
+                                        <td colspan="2"><span>No records found!</span></td>
+                                    </tr>
+                                </tbody>
+                            </table>
+                        </div>
+                    </div>
+                </div>
+                <div class="col-sm-12">
+                    <div class="card-container panel panel-primary">
+                        <div class="panel-heading">Memory</div>
+                        <div class="panel-body">
+                            <table class="table stat-table memory-details">
+                                <tbody data-id="memory-card">
+                                    <tr class="empty text-center">
+                                        <td colspan="2"><span>No records found!</span></td>
+                                    </tr>
+                                </tbody>
+                            </table>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
 </div>
 <div class="fontLoader-relative statsLoader show">
     <i class="fa fa-refresh fa-spin-custom"></i>
-</div>
+</div>
\ No newline at end of file
diff --git a/dashboardv2/public/js/views/site/Statistics.js b/dashboardv2/public/js/views/site/Statistics.js
index 7a66daf..a0a66c5 100644
--- a/dashboardv2/public/js/views/site/Statistics.js
+++ b/dashboardv2/public/js/views/site/Statistics.js
@@ -49,7 +49,13 @@ define(['require',
                 notificationCard: "[data-id='notification-card']",
                 statsNotificationTable: "[data-id='stats-notification-table']",
                 entityCard: "[data-id='entity-card']",
-                offsetCard: "[data-id='offset-card']"
+                offsetCard: "[data-id='offset-card']",
+                osCard: "[data-id='os-card']",
+                runtimeCard: "[data-id='runtime-card']",
+                memoryCard: "[data-id='memory-card']"
+
+
+
             },
             /** ui events hash */
             events: function() {},
@@ -92,6 +98,7 @@ define(['require',
                         var data = _.first(data.toJSON());
                         that.renderStats({ valueObject: data.general.stats, dataObject: data.general });
                         that.renderEntities({ data: data });
+                        that.renderSystemDeatils({ data: data });
                         that.$('.statsContainer,.statsNotificationContainer').removeClass('hide');
                         that.$('.statsLoader,.statsNotificationLoader').removeClass('show');
                         if (options && options.update) {
@@ -141,10 +148,10 @@ define(['require',
                             if (type === "active") {
                                 activeEntityCount += intVal;
                             }
-                            if(type === "deleted"){
+                            if (type === "deleted") {
                                 deletedEntityCount += intVal;
-                            } 
-                            if(type === "shell") {
+                            }
+                            if (type === "shell") {
                                 shellEntityCount += intVal
                             }
                             intVal = _.numberFormatWithComa(intVal)
@@ -277,6 +284,50 @@ define(['require',
                     );
                 }
             },
+            renderSystemDeatils: function(options) {
+                var that = this,
+                    data = options.data,
+                    systemData = data.system,
+                    systemOS = systemData.os || {},
+                    systemRuntimeData = systemData.runtime || {},
+                    systemMemoryData = systemData.memory || {},
+                    createSystemTable = function(obj) {
+                        var tableBody = '',
+                            data = obj.data;
+                        _.each(data, function(value, key, list) {
+                            tableBody += '<tr><td>' + key + '</td><td class="">' + that.getValue({
+                                "value": value
+                            }) + '</td></tr>';
+                        });
+                        return tableBody;
+                    };
+
+                if (!_.isEmpty(systemOS)) {
+                    that.ui.osCard.html(
+                        createSystemTable({
+                            "data": systemOS
+                        })
+                    );
+                }
+                if (!_.isEmpty(systemRuntimeData)) {
+                    _.each(systemRuntimeData, function(val, key) {
+                        var space
+                    })
+                    that.ui.runtimeCard.html(
+                        createSystemTable({
+                            "data": systemRuntimeData
+                        })
+                    );
+                }
+                if (!_.isEmpty(systemMemoryData)) {
+                    var memoryTable = CommonViewFunction.propertyTable({
+                        scope: this,
+                        valueObject: systemMemoryData
+                    });
+                    that.ui.memoryCard.html(
+                        memoryTable);
+                }
+            },
             getValue: function(options) {
                 var value = options.value,
                     type = options.type;
diff --git a/dashboardv3/public/css/scss/common.scss b/dashboardv3/public/css/scss/common.scss
index 32da183..00c67ea 100644
--- a/dashboardv3/public/css/scss/common.scss
+++ b/dashboardv3/public/css/scss/common.scss
@@ -188,6 +188,20 @@ pre {
     }
 }
 
+.panel-body .memory-details{
+    pre {
+        &.code-block {
+            &.shrink {
+                height: 144px;
+
+                code {
+                    height: 130px;
+                }
+            }
+        }
+    }
+}
+
 #accordion {
     .panel-default>.panel-heading {
         cursor: pointer;
@@ -224,18 +238,18 @@ pre {
         }
 
 
-        .custom-col-0{
+        .custom-col-0 {
             text-align: center;
             vertical-align: middle;
             line-height: 31px;
             width: 3%;
         }
 
-        .custom-col-1{
-            width: 38%;
+        .custom-col-1 {
+            width: 39%;
         }
 
-        .custom-col-2{
+        .custom-col-2 {
             text-align: center;
             width: 17%;
             margin-left: 1%;
@@ -255,4 +269,4 @@ pre {
     margin-bottom: 5px;
     margin-left: 5px;
     float: left;
-}
+}
\ No newline at end of file
diff --git a/dashboardv3/public/js/templates/site/Statistics_tmpl.html b/dashboardv3/public/js/templates/site/Statistics_tmpl.html
index f5c6c8b..4f0429d 100644
--- a/dashboardv3/public/js/templates/site/Statistics_tmpl.html
+++ b/dashboardv3/public/js/templates/site/Statistics_tmpl.html
@@ -16,7 +16,7 @@
 -->
 <div class="panel-group server-stats-container statsContainer hide" id="accordion">
     <div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="entity">
-        <div class="panel-heading" data-toggle="collapse" href="#collapse1" aria-expanded="true">
+        <div class="panel-heading" data-toggle="collapse" href="#entityCountCollapse" aria-expanded="true">
             <h4 class="panel-title">
                 <a>Entities <span class="count">(0)</span></a>
             </h4>
@@ -24,7 +24,7 @@
                 <button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
             </div>
         </div>
-        <div id="collapse1" class="panel-collapse collapse in">
+        <div id="entityCountCollapse" class="panel-collapse collapse in">
             <div class="panel-body">
                 <table class="table stat-table entityTable" data-id="entity-card">
                     <tbody>
@@ -37,7 +37,7 @@
         </div>
     </div>
     <div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="stats">
-        <div class="panel-heading" data-toggle="collapse" href="#collapse3" aria-expanded="true">
+        <div class="panel-heading" data-toggle="collapse" href="#serverDetailcollapse" aria-expanded="true">
             <h4 class="panel-title">
                 <a>Server Statistics </a>
             </h4>
@@ -45,7 +45,7 @@
                 <button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
             </div>
         </div>
-        <div id="collapse3" class="panel-collapse collapse in">
+        <div id="serverDetailcollapse" class="panel-collapse collapse in">
             <div class="panel-body">
                 <div class="col-sm-12">
                     <div class="card-container panel panel-primary">
@@ -87,6 +87,63 @@
             </div>
         </div>
     </div>
+
+     <div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="systemDetails">
+        <div class="panel-heading" data-toggle="collapse" href="#systemDetailCollapse" aria-expanded="false">
+            <h4 class="panel-title">
+                <a>System Details</a>
+            </h4>
+            <div class="btn-group pull-left">
+                <button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
+            </div>
+        </div>
+        <div id="systemDetailCollapse" class="panel-collapse collapse">
+            <div class="panel-body">
+                <div class="col-sm-6">
+                    <div class="card-container panel panel-primary">
+                        <div class="panel-heading">OS</div>
+                        <div class="panel-body">
+                            <table class="table stat-table">
+                                <tbody data-id="os-card">
+                                    <tr class="empty text-center">
+                                        <td colspan="2"><span>No records found!</span></td>
+                                    </tr>
+                                </tbody>
+                            </table>
+                        </div>
+                    </div>
+                </div>
+                <div class="col-sm-6">
+                    <div class="card-container panel panel-primary">
+                        <div class="panel-heading">Runtime</div>
+                        <div class="panel-body">
+                            <table class="table stat-table">
+                                <tbody data-id="runtime-card">
+                                    <tr class="empty text-center">
+                                        <td colspan="2"><span>No records found!</span></td>
+                                    </tr>
+                                </tbody>
+                            </table>
+                        </div>
+                    </div>
+                </div>
+                <div class="col-sm-12">
+                    <div class="card-container panel panel-primary">
+                        <div class="panel-heading">Memory</div>
+                        <div class="panel-body">
+                            <table class="table stat-table memory-details">
+                                <tbody data-id="memory-card">
+                                    <tr class="empty text-center">
+                                        <td colspan="2"><span>No records found!</span></td>
+                                    </tr>
+                                </tbody>
+                            </table>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
 </div>
 <div class="fontLoader-relative statsLoader show">
     <i class="fa fa-refresh fa-spin-custom"></i>
diff --git a/dashboardv3/public/js/views/site/Statistics.js b/dashboardv3/public/js/views/site/Statistics.js
index 64455b4..379aa32 100644
--- a/dashboardv3/public/js/views/site/Statistics.js
+++ b/dashboardv3/public/js/views/site/Statistics.js
@@ -49,7 +49,11 @@ define(['require',
                 notificationCard: "[data-id='notification-card']",
                 statsNotificationTable: "[data-id='stats-notification-table']",
                 entityCard: "[data-id='entity-card']",
-                offsetCard: "[data-id='offset-card']"
+                offsetCard: "[data-id='offset-card']",
+                osCard: "[data-id='os-card']",
+                runtimeCard: "[data-id='runtime-card']",
+                memoryCard: "[data-id='memory-card']",
+                memoryPoolUsage: "[data-id='memory-pool-usage-card']"
             },
             /** ui events hash */
             events: function() {},
@@ -92,6 +96,7 @@ define(['require',
                         var data = _.first(data.toJSON());
                         that.renderStats({ valueObject: data.general.stats, dataObject: data.general });
                         that.renderEntities({ data: data });
+                        that.renderSystemDeatils({ data: data });
                         that.$('.statsContainer,.statsNotificationContainer').removeClass('hide');
                         that.$('.statsLoader,.statsNotificationLoader').removeClass('show');
                         if (options && options.update) {
@@ -141,10 +146,10 @@ define(['require',
                             if (type == "active") {
                                 activeEntityCount += intVal;
                             }
-                            if(type == "deleted"){
+                            if (type == "deleted") {
                                 deletedEntityCount += intVal;
-                            } 
-                            if(type == "shell") {
+                            }
+                            if (type == "shell") {
                                 shellEntityCount += intVal
                             }
                             intVal = _.numberFormatWithComa(intVal)
@@ -277,6 +282,50 @@ define(['require',
                     );
                 }
             },
+            renderSystemDeatils: function(options) {
+                var that = this,
+                    data = options.data,
+                    systemData = data.system,
+                    systemOS = systemData.os || {},
+                    systemRuntimeData = systemData.runtime || {},
+                    systemMemoryData = systemData.memory || {},
+                    createSystemTable = function(obj) {
+                        var tableBody = '',
+                            data = obj.data;
+                        _.each(data, function(value, key, list) {
+                            tableBody += '<tr><td>' + key + '</td><td class="">' + that.getValue({
+                                "value": value
+                            }) + '</td></tr>';
+                        });
+                        return tableBody;
+                    };
+
+                if (!_.isEmpty(systemOS)) {
+                    that.ui.osCard.html(
+                        createSystemTable({
+                            "data": systemOS
+                        })
+                    );
+                }
+                if (!_.isEmpty(systemRuntimeData)) {
+                    _.each(systemRuntimeData, function(val, key) {
+                        var space
+                    })
+                    that.ui.runtimeCard.html(
+                        createSystemTable({
+                            "data": systemRuntimeData
+                        })
+                    );
+                }
+                if (!_.isEmpty(systemMemoryData)) {
+                    var memoryTable = CommonViewFunction.propertyTable({
+                        scope: this,
+                        valueObject: systemMemoryData
+                    });
+                    that.ui.memoryCard.html(
+                        memoryTable);
+                }
+            },
             getValue: function(options) {
                 var value = options.value,
                     type = options.type;