/**
* 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 () {
"use strict";
var isIgnoredJmxKeys = function (key) {
return key == 'name' || key == 'modelerType' || key == "$$hashKey" ||
key.match(/tag.*/);
};
angular.module('ozone', ['nvd3', 'ngRoute']);
angular.module('ozone').config(function ($routeProvider) {
$routeProvider
.when("/", {
templateUrl: "main.html"
})
.when("/metrics/rpc", {
template: ""
})
.when("/config", {
template: ""
})
});
angular.module('ozone').component('overview', {
templateUrl: 'static/templates/overview.html',
transclude: true,
controller: function ($http) {
var ctrl = this;
$http.get("jmx?qry=Hadoop:service=*,name=*,component=ServerRuntime")
.then(function (result) {
ctrl.jmx = result.data.beans[0]
})
}
});
angular.module('ozone').component('jvmParameters', {
templateUrl: 'static/templates/jvm.html',
controller: function ($http) {
var ctrl = this;
$http.get("jmx?qry=java.lang:type=Runtime")
.then(function (result) {
ctrl.jmx = result.data.beans[0];
//convert array to a map
var systemProperties = {};
for (var idx in ctrl.jmx.SystemProperties) {
var item = ctrl.jmx.SystemProperties[idx];
systemProperties[item.key.replace(/\./g, "_")] = item.value;
}
ctrl.jmx.SystemProperties = systemProperties;
})
}
});
angular.module('ozone').component('rpcMetrics', {
template: '
Rpc metrics
' +
'' +
'' +
'',
controller: function ($http) {
var ctrl = this;
$http.get("jmx?qry=Hadoop:service=*,name=RpcActivityForPort*")
.then(function (result) {
ctrl.metrics = result.data.beans;
})
}
});
angular.module('ozone').component('rpcMetric', {
bindings: {
jmxdata: '<'
},
templateUrl: 'static/templates/rpc-metrics.html',
controller: function () {
var ctrl = this;
ctrl.percentileGraphOptions = {
chart: {
type: 'discreteBarChart',
height: 450,
margin: {
top: 20,
right: 20,
bottom: 50,
left: 55
},
x: function (d) {
return d.label;
},
y: function (d) {
return d.value;
},
showValues: true,
valueFormat: function (d) {
return d3.format(',.1f')(d);
},
duration: 500,
xAxis: {
axisLabel: 'Percentage'
},
yAxis: {
axisLabel: 'Latency (ms)',
axisLabelDistance: -10
}
}
};
ctrl.$onChanges = function (data) {
var groupedMetrics = {}
var createPercentageMetrics = function (metricName, window) {
groupedMetrics.percentiles = groupedMetrics['percentiles'] || {}
groupedMetrics.percentiles[window] = groupedMetrics.percentiles[window] || {};
groupedMetrics.percentiles[window][metricName] = groupedMetrics.percentiles[window][metricName] || {
graphdata: [{
key: window,
values: []
}], numOps: 0
};
};
var metrics = ctrl.jmxdata;
for (var key in metrics) {
var percentile = key.match(/(.*Time)(\d+s)(\d+th)PercentileLatency/);
var percentileNumOps = key.match(/(.*Time)(\d+s)NumOps/);
var successFailures = key.match(/(.*)(Success|Failures)/);
var numAverages = key.match(/(.*Time)(NumOps|AvgTime)/);
if (percentile) {
var metricName = percentile[1];
var window = percentile[2];
var percentage = percentile[3]
createPercentageMetrics(metricName, window);
groupedMetrics.percentiles[window][metricName].graphdata[0]
.values.push({
label: percentage,
value: metrics[key]
})
} else if (successFailures) {
var metricName = successFailures[1];
groupedMetrics.successfailures = groupedMetrics['successfailures'] || {}
groupedMetrics.successfailures[metricName] = groupedMetrics.successfailures[metricName] || {
success: 0,
failures: 0
};
if (successFailures[2] == 'Success') {
groupedMetrics.successfailures[metricName].success = metrics[key];
} else {
groupedMetrics.successfailures[metricName].failures = metrics[key];
}
} else if (numAverages) {
var metricName = numAverages[1];
groupedMetrics.numavgs = groupedMetrics['numavgs'] || {}
groupedMetrics.numavgs[metricName] = groupedMetrics.numavgs[metricName] || {
numOps: 0,
avgTime: 0
};
if (numAverages[2] == 'NumOps') {
groupedMetrics.numavgs[metricName].numOps = metrics[key];
} else {
groupedMetrics.numavgs[metricName].avgTime = metrics[key];
}
} else if (percentileNumOps) {
var metricName = percentileNumOps[1];
var window = percentileNumOps[2];
createPercentageMetrics(metricName, window);
groupedMetrics.percentiles[window][metricName].numOps = metrics[key];
} else if (isIgnoredJmxKeys(key)) {
//ignore
} else {
groupedMetrics.others = groupedMetrics.others || [];
groupedMetrics.others.push({
'key': key,
'value': metrics[key]
});
}
}
ctrl.metrics = groupedMetrics;
};
}
});
angular.module('ozone')
.component('tabs', {
transclude: true,
controller: function ($scope) {
var ctrl = this;
var panes = this.panes = [];
this.select = function (pane) {
angular.forEach(panes, function (pane) {
pane.selected = false;
});
pane.selected = true;
};
this.addPane = function (pane) {
if (panes.length === 0) {
this.select(pane);
}
panes.push(pane);
};
this.click = function(pane) {
ctrl.select(pane);
}
},
template: ''
})
.component('pane', {
transclude: true,
require: {
tabsCtrl: '^tabs'
},
bindings: {
title: '@'
},
controller: function () {
this.$onInit = function () {
this.tabsCtrl.addPane(this);
};
},
template: ''
});
angular.module('ozone').component('navmenu', {
bindings: {
metrics: '<'
},
templateUrl: 'static/templates/menu.html',
controller: function ($http) {
var ctrl = this;
ctrl.docs = false;
$http.head("docs/index.html")
.then(function (result) {
ctrl.docs = true;
},function(){
ctrl.docs = false;
});
}
});
angular.module('ozone').component('config', {
templateUrl: 'static/templates/config.html',
controller: function ($scope, $http) {
var ctrl = this;
ctrl.selectedTags = [];
$http.get("conf?cmd=getOzoneTags&group=ozone")
.then(function (response) {
ctrl.tags = response.data;
var excludedTags = ['CBLOCK', 'KSM', 'SCM'];
for (var i = 0; i < excludedTags.length; i++) {
var idx = ctrl.tags.indexOf(excludedTags[i]);
// Remove CBLOCK related properties
if (idx > -1) {
ctrl.tags.splice(idx, 1);
}
}
ctrl.loadAll();
});
ctrl.loadAll = function () {
console.log("Displaying all configs");
$http.get("conf?cmd=getPropertyByTag&tags=" + ctrl.tags + "&group=ozone").then(function (response) {
ctrl.configs = response.data;
console.log(ctrl.configs)
for (var idx in ctrl.configs) {
var tags = []
var parsedTags = ctrl.configs[idx].tag.split(",");
for (var t in parsedTags) {
tags.push(parsedTags[t].trim())
}
ctrl.configs[idx].tag = tags;
};
ctrl.sortBy('name');
});
};
ctrl.tagFilter = function (value, index, array) {
if (!ctrl.selectedTags) {
return true;
}
var selected = true;
for (var idx in ctrl.selectedTags) {
selected = selected && (value.tag.indexOf(ctrl.selectedTags[idx]) > -1);
}
return selected;
};
ctrl.configFilter = function (config) {
return false;
};
ctrl.selected = function (tag) {
return ctrl.selectedTags.includes(tag);
};
ctrl.allSelected = function () {
return ctrl.selectedTags.indexOf('SCM') == -1
&& ctrl.selectedTags.indexOf('KSM') == -1
};
ctrl.switchto = function (tag) {
var tags = ctrl.selectedTags.filter(function (item) {
return item != 'KSM' && item != 'SCM';
});
if (tag) {
tags.push(tag);
}
ctrl.selectedTags = tags;
};
ctrl.select = function (tag) {
var tagIdx = ctrl.selectedTags.indexOf(tag);
if (tagIdx > -1) {
ctrl.selectedTags = ctrl.selectedTags.filter(function (item) {
return item != tag;
});
} else {
ctrl.selectedTags.push(tag);
}
console.log("Tags selected:" + ctrl.selectedTags);
};
ctrl.sortBy = function (propertyName) {
ctrl.reverse = (ctrl.propertyName === propertyName) ? !ctrl.reverse : false;
ctrl.propertyName = propertyName;
};
}
});
})();