Repository: incubator-eagle Updated Branches: refs/heads/master f5f07402d -> 87feb883c
[EAGLE-836] Add JMX start up page Add JMX UI application for web app usage. Author: zombieJ <smith3...@gmail.com> Closes #736 from zombieJ/EAGLE-836. Project: http://git-wip-us.apache.org/repos/asf/incubator-eagle/repo Commit: http://git-wip-us.apache.org/repos/asf/incubator-eagle/commit/87feb883 Tree: http://git-wip-us.apache.org/repos/asf/incubator-eagle/tree/87feb883 Diff: http://git-wip-us.apache.org/repos/asf/incubator-eagle/diff/87feb883 Branch: refs/heads/master Commit: 87feb883c68a9251a3e9d09222e49ea223da169d Parents: f5f0740 Author: zombieJ <smith3...@gmail.com> Authored: Tue Dec 13 18:57:22 2016 +0800 Committer: Hao Chen <h...@apache.org> Committed: Tue Dec 13 18:57:22 2016 +0800 ---------------------------------------------------------------------- .../webapp/app/apps/hadoop_metric/.editorconfig | 27 +++++ .../webapp/app/apps/hadoop_metric/ctrls/hdfs.js | 28 +++++ .../app/apps/hadoop_metric/ctrls/overview.js | 72 +++++++++++++ .../main/webapp/app/apps/hadoop_metric/index.js | 47 +++++++- .../apps/hadoop_metric/partials/hdfs/index.html | 19 ++++ .../apps/hadoop_metric/partials/overview.html | 49 +++++++++ .../app/apps/hadoop_metric/style/index.css | 61 +++++++++++ .../hadoop_metric/widgets/availabilityChart.js | 107 +++++++++++++++++++ eagle-server/src/main/webapp/app/package.json | 2 +- 9 files changed, 410 insertions(+), 2 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/incubator-eagle/blob/87feb883/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/.editorconfig ---------------------------------------------------------------------- diff --git a/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/.editorconfig b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/.editorconfig new file mode 100644 index 0000000..42a9b69 --- /dev/null +++ b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/.editorconfig @@ -0,0 +1,27 @@ +# 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. + +root = true + +[*] +end_of_line = lf +charset = utf-8 +trim_trailing_whitespace = true +insert_final_newline = true +indent_style = tab +indent_size = 4 + +[*.md] +trim_trailing_whitespace = false http://git-wip-us.apache.org/repos/asf/incubator-eagle/blob/87feb883/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/ctrls/hdfs.js ---------------------------------------------------------------------- diff --git a/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/ctrls/hdfs.js b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/ctrls/hdfs.js new file mode 100644 index 0000000..74bb7bf --- /dev/null +++ b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/ctrls/hdfs.js @@ -0,0 +1,28 @@ +/* + * 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("hdfsCtrl", function ($scope, PageConfig) { + PageConfig.title = 'HDFS'; + }); + }); +})(); \ No newline at end of file http://git-wip-us.apache.org/repos/asf/incubator-eagle/blob/87feb883/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 new file mode 100644 index 0000000..a02bed3 --- /dev/null +++ b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/ctrls/overview.js @@ -0,0 +1,72 @@ +/* + * 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("overviewCtrl", function ($scope, PageConfig) { + PageConfig.title = 'Overview'; + + $scope.commonOption = {}; + + // Mock series data + function mockMetric(name, option, count) { + count = count || 1; + var now = +new Date(); + + var series = []; + for (var i = 0 ; i < count ; i += 1) { + var data = []; + + for(var j = 0 ; j < 30 ; j += 1) { + data.push({x: now + j * 1000 * 60, y: Math.random() * 100}); + } + + series.push($.extend({ + name: name + '_' + i, + type: 'line', + data: data, + showSymbol: false, + }, option)); + } + + return { + title: name, + series: series + }; + } + + $scope.metricList = [ + mockMetric('name1', {}), + mockMetric('name2', {smooth:true}), + mockMetric('name3', {areaStyle: {normal: {}}}), + mockMetric('name4', {type: 'bar'}), + mockMetric('name1', {}, 2), + mockMetric('name2', {smooth:true}, 2), + mockMetric('name3', {areaStyle: {normal: {}}, stack: 'one'}, 2), + mockMetric('name4', {type: 'bar', stack: 'one'}, 2), + mockMetric('name1', {}, 3), + mockMetric('name2', {smooth:true}, 3), + mockMetric('name3', {areaStyle: {normal: {}}, stack: 'one'}, 3), + mockMetric('name4', {type: 'bar', stack: 'one'}, 3), + ]; + }); + }); +})(); http://git-wip-us.apache.org/repos/asf/incubator-eagle/blob/87feb883/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 6da3888..954cd6d 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 @@ -1 +1,46 @@ -console.log("Loading HADOOP_METRIC_MONITOR: /apps/hadoop_metric"); \ No newline at end of file +/* + * 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` is global function that for application to set up 'controller', 'service', 'directive', 'route' in Eagle + */ + var hadoopMetricApp = register(['ngRoute', 'ngAnimate', 'ui.router', 'eagle.service']); + + hadoopMetricApp.route("HadoopMetric", { + url: "/hadoopMetric/", + site: true, + templateUrl: "partials/overview.html", + controller: "overviewCtrl", + }).route("HadoopMetric_HDFS", { + url: "/hadoopMetric/hdfs", + site: true, + templateUrl: "partials/hdfs/index.html", + controller: "hdfsCtrl", + }); + + hadoopMetricApp.portal({name: "Services", icon: "heartbeat", list: [ + {name: "Overview", path: "hadoopMetric/"}, + {name: "HDFS", path: "hadoopMetric/hdfs"}, + ]}, true); + + hadoopMetricApp.requireCSS("style/index.css"); + hadoopMetricApp.require("widgets/availabilityChart.js"); + hadoopMetricApp.require("ctrls/overview.js"); + hadoopMetricApp.require("ctrls/hdfs.js"); +})(); http://git-wip-us.apache.org/repos/asf/incubator-eagle/blob/87feb883/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/partials/hdfs/index.html ---------------------------------------------------------------------- diff --git a/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/partials/hdfs/index.html b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/partials/hdfs/index.html new file mode 100644 index 0000000..cf5960a --- /dev/null +++ b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/partials/hdfs/index.html @@ -0,0 +1,19 @@ +<!-- + 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. + --> + +HDFS Page \ No newline at end of file http://git-wip-us.apache.org/repos/asf/incubator-eagle/blob/87feb883/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 new file mode 100644 index 0000000..cb4d01c --- /dev/null +++ b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/partials/overview.html @@ -0,0 +1,49 @@ +<!-- + 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"> + <span class="fa fa-television"></span> + <h3 class="box-title"> + Summary + </h3> + </div> + <div class="box-body"> + TODO: Your summary + </div> +</div> + +<div class="box box-primary"> + <div class="box-header with-border"> + <span class="fa fa-line-chart"></span> + <h3 class="box-title"> + Metrics + </h3> + </div> + <div class="box-body no-padding"> + <div class="row border-split"> + <div class="col-sm-6 col-md-4 col-lg-3" ng-repeat="metric in metricList track by $index"> + <div class="hadoopMetric-chart"> + <h3>{{metric.title}}</h3> + <div chart class="hadoopMetric-chart-container" series="metric.series" option="commonOption"></div> + </div> + </div> + </div> + </div> + </div> +</div> http://git-wip-us.apache.org/repos/asf/incubator-eagle/blob/87feb883/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 new file mode 100644 index 0000000..947120b --- /dev/null +++ b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/style/index.css @@ -0,0 +1,61 @@ +@CHARSET "UTF-8"; +/* + * 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. + */ + +.hadoopMetric-chart { + position: relative; + margin-bottom: 15px; +} + +.hadoopMetric-chart h3 { + font-size: 20px; + margin: 10px 0 0 0; +} + +.hadoopMetric-chart .hadoopMetric-chart-container { + height: 200px; + position: relative; +} + +.with-border .hadoopMetric-chart { + padding-bottom: 15px; + margin-bottom: 15px; + border-bottom: 1px solid #f4f4f4; +} + +.with-border .hadoopMetric-chart:last-child { + padding-bottom: 0; + margin-bottom: 0; + border-bottom: 0; +} + +.hadoopMetric-widget { + width: 100%; + box-shadow: 0 1px 1px rgba(0,0,0,0.1); + border-radius: 2px; + padding: 10px; +} + +.hadoopMetric-widget h3 { + margin: 0; + padding: 0; +} + +.hadoopMetric-widget .hadoopMetric-chart-container { + height: 100px; +} http://git-wip-us.apache.org/repos/asf/incubator-eagle/blob/87feb883/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 new file mode 100644 index 0000000..fddcb88 --- /dev/null +++ b/eagle-hadoop-metric/src/main/webapp/app/apps/hadoop_metric/widgets/availabilityChart.js @@ -0,0 +1,107 @@ +/* + * 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) { + var COLOR_MAPPING = { + HDFS: 'orange', + HBase: 'yellow', + 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) { + // Get site + var site = $scope.site; + + // 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}); + } + $scope.series = [{ + name: '', + type: 'line', + data: data, + showSymbol: false, + }]; + + // Ref: jpm widget if need keep refresh the widget + }, + template: + '<div class="hadoopMetric-widget bg-{{bgColor}}">' + + '<h3>{{type}}</h3>' + + '<div chart class="hadoopMetric-chart-container" series="series" option="chartOption"></div>' + + '</div>', + replace: true + }; + }); + + function withType(serviceType) { + /** + * Customize the widget content. Return false will prevent auto compile. + * @param {{}} $element + * @param {function} $element.append + */ + return function registerWidget($element) { + $element.append( + $("<div hadoop-metric-widget data-type='" + serviceType + "'>") + ); + } + } + + hadoopMetricApp.widget("availabilityHDFSChart", withType('HDFS'), true); + hadoopMetricApp.widget("availabilityHBaseChart", withType('HBase'), true); + hadoopMetricApp.widget("availabilityYarnChart", withType('Yarn'), true); + }); +})(); http://git-wip-us.apache.org/repos/asf/incubator-eagle/blob/87feb883/eagle-server/src/main/webapp/app/package.json ---------------------------------------------------------------------- diff --git a/eagle-server/src/main/webapp/app/package.json b/eagle-server/src/main/webapp/app/package.json index 6df70d8..c1c652e 100644 --- a/eagle-server/src/main/webapp/app/package.json +++ b/eagle-server/src/main/webapp/app/package.json @@ -24,7 +24,7 @@ "bootstrap": "3.3.6", "d3": "3.5.16", "echarts": "^3.2.3", - "font-awesome": "4.6.3", + "font-awesome": "4.7.0", "jquery": "2.2.4", "jquery-slimscroll": "1.3.6", "jsdom": "^9.5.0",