Repository: ambari Updated Branches: refs/heads/trunk 59630d6ab -> 8fa25781d
AMBARI-5416. Add 'Flume Agents Live' widget to Ambari dashboard. (akovalenko) Project: http://git-wip-us.apache.org/repos/asf/ambari/repo Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/8fa25781 Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/8fa25781 Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/8fa25781 Branch: refs/heads/trunk Commit: 8fa25781dbc2aff1314470722ec8b0457a951139 Parents: 59630d6 Author: Aleksandr Kovalenko <[email protected]> Authored: Thu Apr 10 13:56:22 2014 +0300 Committer: Aleksandr Kovalenko <[email protected]> Committed: Thu Apr 10 13:56:22 2014 +0300 ---------------------------------------------------------------------- ambari-web/app/messages.js | 1 + ambari-web/app/views.js | 1 + ambari-web/app/views/main/dashboard.js | 31 +++- .../main/dashboard/widgets/flume_agent_live.js | 177 +++++++++++++++++++ 4 files changed, 206 insertions(+), 4 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/ambari/blob/8fa25781/ambari-web/app/messages.js ---------------------------------------------------------------------- diff --git a/ambari-web/app/messages.js b/ambari-web/app/messages.js index 796358f..7f19802 100644 --- a/ambari-web/app/messages.js +++ b/ambari-web/app/messages.js @@ -1665,6 +1665,7 @@ Em.I18n.translations = { 'dashboard.widgets.DataNodeUp': 'DataNodes Live', 'dashboard.widgets.TaskTrackerUp': 'TaskTrackers Live', 'dashboard.widgets.SuperVisorUp': 'Supervisors Live', + 'dashboard.widgets.FlumeAgentUp': 'Flume Agents Live', 'dashboard.widgets.NameNodeRpc': 'NameNode RPC', 'dashboard.widgets.JobTrackerRpc': 'JobTracker RPC', 'dashboard.widgets.MapReduceSlots': 'MapReduce Slots', http://git-wip-us.apache.org/repos/asf/ambari/blob/8fa25781/ambari-web/app/views.js ---------------------------------------------------------------------- diff --git a/ambari-web/app/views.js b/ambari-web/app/views.js index 4ba0e2b..5376166 100644 --- a/ambari-web/app/views.js +++ b/ambari-web/app/views.js @@ -140,6 +140,7 @@ require('views/main/dashboard/widgets/resource_manager_uptime'); require('views/main/dashboard/widgets/node_managers_live'); require('views/main/dashboard/widgets/yarn_memory'); require('views/main/dashboard/widgets/supervisor_live'); +require('views/main/dashboard/widgets/flume_agent_live'); require('views/main/service'); http://git-wip-us.apache.org/repos/asf/ambari/blob/8fa25781/ambari-web/app/views/main/dashboard.js ---------------------------------------------------------------------- diff --git a/ambari-web/app/views/main/dashboard.js b/ambari-web/app/views/main/dashboard.js index 0d1e454..5004b3b 100644 --- a/ambari-web/app/views/main/dashboard.js +++ b/ambari-web/app/views/main/dashboard.js @@ -102,6 +102,9 @@ App.MainDashboardView = Em.View.extend(App.UserPref, App.LocalStorage, { case "STORM": self.set('storm_model', item); break; + case "FLUME": + self.set('flume_model', item); + break; } }, this); }, @@ -118,7 +121,8 @@ App.MainDashboardView = Em.View.extend(App.UserPref, App.LocalStorage, { '3', '7', '15', '16', '20', '19', '21', '23', '24', '25', '26', '27',// all yarn - '28' // storm + '28', // storm + '29' // flume ]; // all in order var hiddenFull = [['22','Region In Transition']]; if (this.get('hdfs_model') == null) { @@ -152,6 +156,12 @@ App.MainDashboardView = Em.View.extend(App.UserPref, App.LocalStorage, { visibleFull = visibleFull.without(item); }, this); } + if (this.get('flume_model') == null) { + var flume = ['29']; + flume.forEach(function(item) { + visibleFull = visibleFull.without(item); + }, this); + } var obj = this.get('initPrefObject'); obj.set('visible', visibleFull); obj.set('hidden', hiddenFull); @@ -169,6 +179,8 @@ App.MainDashboardView = Em.View.extend(App.UserPref, App.LocalStorage, { storm_model: null, + flume_model: null, + /** * List of visible widgets * @type {Ember.Enumerable} @@ -389,7 +401,6 @@ App.MainDashboardView = Em.View.extend(App.UserPref, App.LocalStorage, { if (this.get('storm_model') != null) { var storm = ['28']; var flag = self.containsWidget(toDelete, storm[0]); - var self = this; if (flag) { storm.forEach ( function (item) { toDelete = self.removeWidget(toDelete, item); @@ -398,6 +409,17 @@ App.MainDashboardView = Em.View.extend(App.UserPref, App.LocalStorage, { toAdd = toAdd.concat(storm); } } + if (this.get('flume_model') != null) { + var flume = ['29']; + var flag = self.containsWidget(toDelete, flume[0]); + if (flag) { + flume.forEach ( function (item) { + toDelete = self.removeWidget(toDelete, item); + }, this); + } else { + toAdd = toAdd.concat(flume); + } + } var value = currentPrefObject; if (toDelete.visible.length || toDelete.hidden.length) { toDelete.visible.forEach ( function (item) { @@ -452,7 +474,8 @@ App.MainDashboardView = Em.View.extend(App.UserPref, App.LocalStorage, { '25': App.ResourceManagerUptimeView, '26': App.NodeManagersLiveView, '27': App.YARNMemoryPieChartView, - '28': App.SuperVisorUpView + '28': App.SuperVisorUpView, + '29': App.FlumeAgentUpView }, id); }, @@ -470,7 +493,7 @@ App.MainDashboardView = Em.View.extend(App.UserPref, App.LocalStorage, { hidden: [], threshold: {1: [80, 90], 2: [85, 95], 3: [90, 95], 4: [80, 90], 5: [1000, 3000], 6: [70, 90], 7: [90, 95], 8: [50, 75], 9: [30000, 120000], 10: [], 11: [], 12: [], 13: [], 14: [], 15: [], 16: [], 17: [], 18: [], 19: [], 20: [70, 90], 21: [10, 19.2], 22: [3, 10], 23: [], - 24: [70, 90], 25: [], 26: [50, 75], 27: [50, 75], 28: [85, 95]} // id:[thresh1, thresh2] + 24: [70, 90], 25: [], 26: [50, 75], 27: [50, 75], 28: [85, 95], 29: [85, 95]} // id:[thresh1, thresh2] }), /** http://git-wip-us.apache.org/repos/asf/ambari/blob/8fa25781/ambari-web/app/views/main/dashboard/widgets/flume_agent_live.js ---------------------------------------------------------------------- diff --git a/ambari-web/app/views/main/dashboard/widgets/flume_agent_live.js b/ambari-web/app/views/main/dashboard/widgets/flume_agent_live.js new file mode 100644 index 0000000..8d086e4 --- /dev/null +++ b/ambari-web/app/views/main/dashboard/widgets/flume_agent_live.js @@ -0,0 +1,177 @@ +/** + * 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. + */ + +var App = require('app'); + +App.FlumeAgentUpView = App.TextDashboardWidgetView.extend({ + + title: Em.I18n.t('dashboard.widgets.FlumeAgentUp'), + id: '29', + + isPieChart: false, + isText: true, + isProgressBar: false, + model_type: 'flume', + + hiddenInfo: function () { + var result = []; + result.pushObject(this.get('flumeAgentsLive').length + ' ' + Em.I18n.t('dashboard.services.hdfs.nodes.live')); + result.pushObject(this.get('flumeAgentsDead').length + ' ' + Em.I18n.t('dashboard.services.hdfs.nodes.dead')); + return result; + }.property('flumeAgentsLive', 'flumeAgentsDead'), + hiddenInfoClass: "hidden-info-two-line", + + thresh1: 40, + thresh2: 70, + maxValue: 100, + + flumeAgentComponents: function() { + return this.get('model.hostComponents').filterProperty('componentName', 'FLUME_HANDLER'); + }.property('model.hostComponents.length'), + + flumeAgentsLive: function () { + return this.get('flumeAgentComponents').filterProperty("workStatus", "STARTED"); + }.property('[email protected]'), + + flumeAgentsDead: function () { + return this.get('flumeAgentComponents').filterProperty("workStatus", "INSTALLED"); + }.property('[email protected]'), + + + data: function () { + if ( !this.get('flumeAgentComponents.length')) { + return -1; + } else { + return ((this.get('flumeAgentsLive').length / this.get('model.hostComponents').filterProperty('componentName', 'FLUME_HANDLER').length).toFixed(2)) * 100; + } + }.property('model.hostComponents.length', 'flumeAgentsLive'), + + content: function () { + return this.get('flumeAgentsLive').length + "/" + this.get('flumeAgentComponents').length; + }.property('flumeAgentComponents.length', 'flumeAgentsLive'), + + editWidget: function (event) { + var parent = this; + var max_tmp = parseFloat(parent.get('maxValue')); + var configObj = Ember.Object.create({ + thresh1: parent.get('thresh1') + '', + thresh2: parent.get('thresh2') + '', + hintInfo: Em.I18n.t('dashboard.widgets.hintInfo.hint1').format(max_tmp), + isThresh1Error: false, + isThresh2Error: false, + errorMessage1: "", + errorMessage2: "", + maxValue: max_tmp, + observeNewThresholdValue: function () { + var thresh1 = this.get('thresh1'); + var thresh2 = this.get('thresh2'); + if (thresh1.trim() != "") { + if (isNaN(thresh1) || thresh1 > max_tmp || thresh1 < 0){ + this.set('isThresh1Error', true); + this.set('errorMessage1', 'Invalid! Enter a number between 0 - ' + max_tmp); + } else if ( this.get('isThresh2Error') === false && parseFloat(thresh2)<= parseFloat(thresh1)) { + this.set('isThresh1Error', true); + this.set('errorMessage1', 'Threshold 1 should be smaller than threshold 2 !'); + } else { + this.set('isThresh1Error', false); + this.set('errorMessage1', ''); + } + } else { + this.set('isThresh1Error', true); + this.set('errorMessage1', 'This is required'); + } + + if (thresh2.trim() != "") { + if (isNaN(thresh2) || thresh2 > max_tmp || thresh2 < 0) { + this.set('isThresh2Error', true); + this.set('errorMessage2', 'Invalid! Enter a number between 0 - ' + max_tmp); + } else { + this.set('isThresh2Error', false); + this.set('errorMessage2', ''); + } + } else { + this.set('isThresh2Error', true); + this.set('errorMessage2', 'This is required'); + } + + // update the slider handles and color + if (this.get('isThresh1Error') === false && this.get('isThresh2Error') === false) { + $("#slider-range").slider('values', 0 , parseFloat(thresh1)); + $("#slider-range").slider('values', 1 , parseFloat(thresh2)); + } + }.observes('thresh1', 'thresh2') + + }); + + var browserVerion = this.getInternetExplorerVersion(); + App.ModalPopup.show({ + header: Em.I18n.t('dashboard.widgets.popupHeader'), + classNames: [ 'sixty-percent-width-modal-edit-widget'], + bodyClass: Ember.View.extend({ + templateName: require('templates/main/dashboard/edit_widget_popup'), + configPropertyObj: configObj + }), + primary: Em.I18n.t('common.apply'), + onPrimary: function () { + configObj.observeNewThresholdValue(); + if (!configObj.isThresh1Error && !configObj.isThresh2Error) { + parent.set('thresh1', parseFloat(configObj.get('thresh1')) ); + parent.set('thresh2', parseFloat(configObj.get('thresh2')) ); + if (!App.testMode) { + var big_parent = parent.get('parentView'); + big_parent.getUserPref(big_parent.get('persistKey')); + var oldValue = big_parent.get('currentPrefObject'); + oldValue.threshold[parseInt(parent.id)] = [configObj.get('thresh1'), configObj.get('thresh2')]; + big_parent.postUserPref(big_parent.get('persistKey'),oldValue); + } + this.hide(); + } + }, + + didInsertElement: function () { + var handlers = [configObj.get('thresh1'), configObj.get('thresh2')]; + var colors = ['#B80000', '#FF8E00', '#95A800']; //color red, orange, green + + if (browserVerion == -1 || browserVerion > 9) { + configObj.set('isIE9', false); + configObj.set('isGreenOrangeRed', false); + $("#slider-range").slider({ + range: true, + min: 0, + max: max_tmp, + values: handlers, + create: function (event, ui) { + parent.updateColors(handlers, colors); + }, + slide: function (event, ui) { + parent.updateColors(ui.values, colors); + configObj.set('thresh1', ui.values[0] + ''); + configObj.set('thresh2', ui.values[1] + ''); + }, + change: function (event, ui) { + parent.updateColors(ui.values, colors); + } + }); + } else { + configObj.set('isIE9', true); + configObj.set('isGreenOrangeRed', false); + } + } + }); + } +});
