You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@eagle.apache.org by ha...@apache.org on 2017/01/17 08:10:13 UTC
eagle git commit: [EAGLE-863] Refactor Topology Monitoring Widgets
Repository: eagle
Updated Branches:
refs/heads/master 2534a34c5 -> 1550c8954
[EAGLE-863] Refactor Topology Monitoring Widgets
[EAGLE-863] Refactor Topology Monitoring Widgets
- Define master,regionservers information in HBase widget.
https://issues.apache.org/jira/browse/EAGLE-845
[IMPROVEMENT] Refactor HBase summary information
- Add backup master page
- Add some metric.
Author: chitin <ch...@gmail.com>
Closes #780 from chitin/widgetandsummary.
Project: http://git-wip-us.apache.org/repos/asf/eagle/repo
Commit: http://git-wip-us.apache.org/repos/asf/eagle/commit/1550c895
Tree: http://git-wip-us.apache.org/repos/asf/eagle/tree/1550c895
Diff: http://git-wip-us.apache.org/repos/asf/eagle/diff/1550c895
Branch: refs/heads/master
Commit: 1550c8954b23b443ac41f6d13a7caa02d2a6af6a
Parents: 2534a34
Author: chitin <ch...@gmail.com>
Authored: Tue Jan 17 16:09:59 2017 +0800
Committer: Hao Chen <ha...@apache.org>
Committed: Tue Jan 17 16:09:59 2017 +0800
----------------------------------------------------------------------
.../hadoop_metric/ctrls/backupMasterListCtrl.js | 33 +++++
.../app/apps/hadoop_metric/ctrls/overview.js | 60 +++++++---
.../main/webapp/app/apps/hadoop_metric/index.js | 23 +++-
.../partials/backupMasterList.html | 52 ++++++++
.../apps/hadoop_metric/partials/overview.html | 45 ++++---
.../app/apps/hadoop_metric/style/index.css | 14 +++
.../hadoop_metric/widgets/availabilityChart.js | 119 ++++++++++++-------
7 files changed, 264 insertions(+), 82 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/eagle/blob/1550c895/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/ctrls/backupMasterListCtrl.js
----------------------------------------------------------------------
diff --git a/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/ctrls/backupMasterListCtrl.js b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/ctrls/backupMasterListCtrl.js
new file mode 100644
index 0000000..d7cdc45
--- /dev/null
+++ b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/ctrls/backupMasterListCtrl.js
@@ -0,0 +1,33 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+(function () {
+ /**
+ * `register` without params will load the module which using require
+ */
+ register(function (hadoopMetricApp) {
+
+ hadoopMetricApp.controller("backupMasterListCtrl", function ($wrapState, $scope, PageConfig, METRIC) {
+
+ // Initialization
+ PageConfig.title = "HBASE BackupMasters";
+ $scope.site = $wrapState.param.siteId;
+ $scope.backupMasterList = METRIC.hbaseMaster($scope.site, "standby", 1000);
+ });
+ });
+})();
http://git-wip-us.apache.org/repos/asf/eagle/blob/1550c895/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/ctrls/overview.js
----------------------------------------------------------------------
diff --git a/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/ctrls/overview.js b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/ctrls/overview.js
index 4cf3e97..1efd47b 100644
--- a/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/ctrls/overview.js
+++ b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/ctrls/overview.js
@@ -24,7 +24,7 @@
hadoopMetricApp.controller("overviewCtrl", function ($q, $wrapState, $scope, PageConfig, METRIC, Time) {
var cache = {};
$scope.site = $wrapState.param.siteId;
- var activeMasterInfo = METRIC.hbaseActiveMaster($scope.site);
+ var activeMasterInfo = METRIC.hbaseMaster($scope.site, "active", 1);
PageConfig.title = 'HBase';
var storageOption = {
@@ -132,34 +132,66 @@
});
});
+ METRIC.regionserverStatus($scope.hostname, $scope.site)._promise.then(function (res) {
+ $scope.regionstatus = res;
+ });
+
hbaseservers._promise.then(function (res) {
- var regionhealtynum = 0;
- var regiontotal = 0;
- var hmasteractive;
- var hmasterstandby;
+ var regionserverhealtynum = 0;
+ var regionservertotal = 0;
+ var hmasterstandbynum = 0;
+ var hmasteractivenum = 0;
+ var regionsnum = 0;
+ var regionArray = [];
$.each(res, function (i, server) {
var role = server.tags.role;
var status = server.status;
if (role === "regionserver") {
- regiontotal++;
+ regionservertotal++;
if (status === "live") {
- regionhealtynum++;
+ regionserverhealtynum++;
}
+ regionArray.push(METRIC.regionserverStatus(server.tags.hostname, $scope.site)._promise.then(function (res) {
+ return res[0].numRegions;
+ }));
}
else if (role === "hmaster") {
if (status === "active") {
- hmasteractive = server;
+ hmasteractivenum++;
} else {
- hmasterstandby = server;
+ hmasterstandbynum++;
}
}
});
- $scope.regionhealtynum = regionhealtynum;
- $scope.regiontotal = regiontotal;
- $scope.hmasteractive = hmasteractive;
- $scope.hmasterstandby = hmasterstandby;
- })
+
+ $q.all(regionArray).then(function (res) {
+
+ for(var i=0; i<regionArray.length; i++) {
+ regionsnum+=res[i];
+ }
+ $scope.regionsnum = regionsnum;
+ });
+
+ $scope.regionserverhealtynum = regionserverhealtynum;
+ $scope.regionservertotal = regionservertotal;
+ $scope.hmasterstandbynum = hmasterstandbynum;
+ $scope.hmasteractivenum = hmasteractivenum;
+ });
+
+ activeMasterInfo._promise.then(function (res) {
+ var hostname = cache[hostname] = cache[hostname] || res[0].tags.hostname;
+ $scope.defaultHostname = $wrapState.param.hostname || hostname;
+ var jobCond = {
+ site: $scope.site,
+ component: "hbasemaster",
+ host: $scope.defaultHostname
+ };
+ METRIC.hbaseMomentMetric(jobCond,"hadoop.hbase.master.server.averageload", 1).then(function (res) {
+ $scope.hmasteraverageload = res.data.obj[0].value[0];
+ });
+ });
+
};
http://git-wip-us.apache.org/repos/asf/eagle/blob/1550c895/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/index.js
----------------------------------------------------------------------
diff --git a/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/index.js b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/index.js
index d76428f..f0b6e13 100644
--- a/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/index.js
+++ b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/index.js
@@ -45,6 +45,11 @@
site: true,
templateUrl: "partials/region/regionList.html",
controller: "regionListCtrl"
+ }).route("backupMasterList", {
+ url: "/hadoopMetric/backupMasterList",
+ site: true,
+ templateUrl: "partials/backupMasterList.html",
+ controller: "backupMasterListCtrl"
}).route("masterDetail", {
url: "/hadoopMetric/:hostname?startTime&endTime",
site: true,
@@ -168,6 +173,17 @@
return wrapList(METRIC.get(metrics_url));
};
+ METRIC.hbaseMomentMetric = function (condition, metric, limit) {
+ var config = {
+ condition: METRIC.condition(condition),
+ metric: metric,
+ limit: limit || 10000
+ };
+
+ var metrics_url = common.template(getQuery("HBASE_METRICS"), config);
+ return METRIC.get(metrics_url);
+ };
+
METRIC.hbaseMetricsAggregation = function (condition, metric, groups, field, intervalMin, startTime, endTime, top, limit) {
var fields = field.split(/\s*,\s*/);
var orderId = -1;
@@ -251,13 +267,13 @@
return wrapList(METRIC.get(metrics_url));
};
- METRIC.hbaseActiveMaster = function (siteId) {
+ METRIC.hbaseMaster = function (siteId, status, limit) {
var condition = {
site: siteId,
role: "hmaster",
- status: "active"
+ status: status
};
- return METRIC.hbasehostStatus(condition, 1);
+ return METRIC.hbasehostStatus(condition, limit);
};
METRIC.regionserverStatus = function (hostname, siteid) {
@@ -297,4 +313,5 @@
hadoopMetricApp.require("ctrls/hdfs.js");
hadoopMetricApp.require("ctrls/regionDetailCtrl.js");
hadoopMetricApp.require("ctrls/regionListCtrl.js");
+ hadoopMetricApp.require("ctrls/backupMasterListCtrl.js");
})();
http://git-wip-us.apache.org/repos/asf/eagle/blob/1550c895/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/partials/backupMasterList.html
----------------------------------------------------------------------
diff --git a/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/partials/backupMasterList.html b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/partials/backupMasterList.html
new file mode 100644
index 0000000..960a33c
--- /dev/null
+++ b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/partials/backupMasterList.html
@@ -0,0 +1,52 @@
+<!--
+ Licensed to the Apache Software Foundation (ASF) under one
+ or more contributor license agreements. See the NOTICE file
+ distributed with this work for additional information
+ regarding copyright ownership. The ASF licenses this file
+ to you under the Apache License, Version 2.0 (the
+ "License"); you may not use this file except in compliance
+ with the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ -->
+<div class="box box-primary">
+ <div class="box-header with-border">
+ <h3 class="box-title">
+ <span ng-show="!regionserverList._done || isSorting" class="fa fa-refresh fa-spin no-animate"></span>
+ </h3>
+ </div>
+ <div class="box-body">
+ <div id="backupMasterList" sort-table="backupMasterList" is-sorting="isSorting"
+ search-path-list="searchPathList"
+ scope="tableScope">
+ <table class="table table-bordered">
+ <thead>
+ <tr>
+ <th sortpath="tags.hostname">Master</th>
+ <th sortpath="tags.rack">Rack</th>
+ <th sortpath="tags.site">SiteId</th>
+ <th sortpath="status">Status</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr ng-repeat="item in backupMasterList">
+ <td>
+ <a ui-sref="masterDetail({siteId: site, hostname: item.tags.hostname})" target="_blank">{{item.tags.hostname}}</a>
+ </td>
+ <td>{{item.tags.rack}}</td>
+ <td>{{item.tags.site}}</td>
+ <td>
+ <span>{{item.status}}</span>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div>
+</div>
http://git-wip-us.apache.org/repos/asf/eagle/blob/1550c895/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/partials/overview.html
----------------------------------------------------------------------
diff --git a/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/partials/overview.html b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/partials/overview.html
index 13caebf..f58ab21 100644
--- a/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/partials/overview.html
+++ b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/partials/overview.html
@@ -20,36 +20,33 @@
<div class="box-header with-border">
<span class="fa fa-television"></span>
<h3 class="box-title">
- Service Summary Information
+ HBase Service Summary Information
</h3>
</div>
<div class="box-body">
-
- <table class="table table-striped">
- <tbody>
- <tr ng-if="regiontotal > 0">
- <th>RegionServer Status</th>
- <td class="text-break">
- <a ui-sref="regionList({siteId: site})" target="_blank">{{regiontotal}} RegionServers</a>
- <span class="label label-success">{{regionhealtynum}} Healthy</span>
- <span class="label label-danger">{{regiontotal - regionhealtynum}} UnHealthy</span>
- </td>
+ <table class="table table-striped hadoopMetric-table">
+ <tr>
+ <td width="5%">{{hmasteractivenum}}</td>
+ <th width="45%">Active HBase Master</th>
+ <td width="5%">{{regionsnum}}</td>
+ <th width="45%">Regions
+ </th>
</tr>
- <tr ng-if="hmasteractive">
- <th>Active Hmaster Status</th>
- <td class="text-break">
- <span ng-if="defaultHostname !== hmasteractive.tags.hostname" class="label label-success">(<a class="hadoopMetric-summary-a" ui-sref="masterDetail({siteId: site, hostname: hmasteractive.tags.hostname})">{{hmasteractive.tags.hostname}}</a>) Healthy</span>
- <span ng-if="defaultHostname === hmasteractive.tags.hostname" class="label label-success">({{hmasteractive.tags.hostname}}) Healthy</span>
- </td>
+ <tr>
+ <td><a ui-sref="backupMasterList({siteId: site})" target="_blank">{{hmasterstandbynum}}</a></td>
+ <th>Backup HBase Master</th>
+ <td>{{hmasteraverageload}}</td>
+ <th>Average Load</th>
</tr>
- <tr ng-if="hmasterstandby">
- <th>Standby Hmaster Status</th>
- <td class="text-break">
- <span ng-if="defaultHostname !== hmasterstandby.tags.hostname" class="label label-success">(<a class="hadoopMetric-summary-a" ui-sref="masterDetail({siteId: site, hostname: hmasterstandby.tags.hostname})">{{hmasterstandby.tags.hostname}}</a>) Healthy</span>
- <span ng-if="defaultHostname === hmasterstandby.tags.hostname" class="label label-success">({{hmasterstandby.tags.hostname}}) Healthy</span>
- </td>
+ <tr>
+ <td><a ui-sref="regionList({siteId: site})">{{regionservertotal}}</a></td>
+ <th>RegionServers: <a ui-sref="regionList({siteId: site})">{{regionserverhealtynum}}</a> <span
+ class="label label-success">Good Health</span> / <a ui-sref="regionList({siteId: site})">{{regionservertotal-regionserverhealtynum}}</a>
+ <span class="label label-danger">Bad Health</span>
+ </th>
+ <td></td>
+ <th></th>
</tr>
- </tbody>
</table>
</div>
</div>
http://git-wip-us.apache.org/repos/asf/eagle/blob/1550c895/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/style/index.css
----------------------------------------------------------------------
diff --git a/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/style/index.css b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/style/index.css
index 6ae1ea1..4f2298c 100644
--- a/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/style/index.css
+++ b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/style/index.css
@@ -64,3 +64,17 @@
color: #fff;
}
+.small-box.hadoopMetric-widget {
+ margin: 0;
+ height: 100%;
+ min-height: 110px;
+}
+
+.hadoopMetric-widget-detail {
+ margin-left: 12px;
+ margin-top: 10px;
+}
+
+.hadoopMetric-table {
+ text-align: right;
+}
http://git-wip-us.apache.org/repos/asf/eagle/blob/1550c895/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/widgets/availabilityChart.js
----------------------------------------------------------------------
diff --git a/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/widgets/availabilityChart.js b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/widgets/availabilityChart.js
index 75e6835..48a139a 100644
--- a/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/widgets/availabilityChart.js
+++ b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/widgets/availabilityChart.js
@@ -27,61 +27,100 @@
Yarn: 'green',
};
- var widgetChartOption = {
- color: ['#FFFFFF'],
- grid: {
- top: 0,
- right: 0,
- bottom: 0,
- left: 0,
- containLabel: false,
- },
- xAxis: {
- axisLine: {show: false},
- axisLabel: {show: false},
- },
- yAxis: [{
- axisLine: {show: false},
- axisLabel: {show: false},
- axisTick: {show: false},
- splitLine: {show: false},
- }],
- };
-
hadoopMetricApp.directive("hadoopMetricWidget", function () {
return {
restrict: 'AE',
- controller: function($scope, $attrs) {
+ controller: function ($scope, $attrs, METRIC, Application, $interval, Site, $wrapState) {
// Get site
var site = $scope.site;
+ var refreshInterval;
+ if(!site) {
+ $scope.list = $.map(Application.find("HADOOP_METRIC_MONITOR"), function (app) {
+ return {
+ siteId: app.site.siteId,
+ siteName: app.site.siteName || app.site.siteId,
+ count: -1
+ };
+ });
+ } else {
+ $scope.list = [{
+ siteId: site.siteId,
+ siteName: site.siteName || site.siteId,
+ count: -1
+ }];
+ }
// Get type
$scope.type = $attrs.type;
// Customize chart color
$scope.bgColor = COLOR_MAPPING[$scope.type];
- $scope.chartOption = widgetChartOption;
- // Mock fetch data
- var now = +new Date();
- var data = [];
- for(var j = 0 ; j < 30 ; j += 1) {
- data.push({x: now + j * 1000 * 60, y: Math.random() * 100});
+ // Ref: jpm widget if need keep refresh the widget
+
+ function refresh() {
+ $.each($scope.list, function (i, site) {
+ var hbaseservers = METRIC.hbasehostStatus({site: site.siteName});
+ hbaseservers._promise.then(function (res) {
+ var hmasternum = 0;
+ var hmasteractivenum = 0;
+ var regionserverHealthynum = 0;
+ var regionservertotal = 0;
+ $.each(res, function (i, server) {
+ var role = server.tags.role;
+ var status = server.status;
+ if (role === "hmaster") {
+ hmasternum++;
+ if (status === "active") {
+ hmasteractivenum++;
+ }
+ } else if (role === "regionserver") {
+ regionservertotal++;
+ if (status === "live") {
+ regionserverHealthynum++;
+ }
+ }
+ });
+ $scope.hbaseinfo = {
+ hmasternum: hmasternum,
+ hmasteractivenum: hmasteractivenum,
+ regionserverHealthynum: regionserverHealthynum,
+ regionservertotal: regionservertotal
+ };
+ });
+ });
}
- $scope.series = [{
- name: '',
- type: 'line',
- data: data,
- showSymbol: false,
- }];
- // Ref: jpm widget if need keep refresh the widget
+ refresh();
+ refreshInterval = $interval(refresh, 30 * 1000);
+
+ $scope.$on('$destroy', function () {
+ $interval.cancel(refreshInterval);
+ });
},
template:
- '<div class="hadoopMetric-widget bg-{{bgColor}}">' +
- '<h3>{{type}}</h3>' +
- '<div chart class="hadoopMetric-chart-container" series="series" option="chartOption"></div>' +
+ '<div class="small-box hadoopMetric-widget bg-{{bgColor}}">' +
+ '<div class="inner">' +
+ '<h3>{{type}}</h3>' +
+ '<div class="hadoopMetric-widget-detail">' +
+ '<a ui-sref="HadoopMetric({siteId: site.siteName})">' +
+ '<span>{{hbaseinfo.hmasternum}}</span> Masters (' +
+ '<span>{{hbaseinfo.hmasteractivenum}}</span> Active / ' +
+ '<span>{{hbaseinfo.hmasternum - hbaseinfo.hmasteractivenum}}</span> Standby)' +
+ '</a>' +
+ '</div>' +
+ '<div class="hadoopMetric-widget-detail">' +
+ '<a ui-sref="regionList({siteId: site.siteName})">' +
+ '<span>{{hbaseinfo.regionservertotal}}</span> RegionServers (' +
+ '<span>{{hbaseinfo.regionserverHealthynum}}</span> Healthy / ' +
+ '<span>{{hbaseinfo.regionservertotal - hbaseinfo.regionserverHealthynum}}</span> Unhealthy)' +
+ '</a>' +
+ '</div>' +
+ '</div>' +
+ '<div class="icon">' +
+ '<i class="fa fa-taxi"></i>' +
+ '</div>' +
'</div>',
replace: true
};
@@ -99,9 +138,7 @@
);
};
}
-
- hadoopMetricApp.widget("availabilityHDFSChart", withType('HDFS'), true);
hadoopMetricApp.widget("availabilityHBaseChart", withType('HBase'), true);
- hadoopMetricApp.widget("availabilityYarnChart", withType('Yarn'), true);
});
})();
+//# sourceURL=availabilityChart.js