Skip to content

Commit

Permalink
refactoring
Browse files Browse the repository at this point in the history
  • Loading branch information
@bahaaldine
bahaaldine committed Nov 30, 2016
1 parent bfcdbb4 commit ed70511
Show file tree
Hide file tree
Showing 14 changed files with 269 additions and 270 deletions.
1 change: 1 addition & 0 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,7 @@
"eslint-plugin-mocha": "1.1.0"
},
"dependencies": {
"boom": "^4.2.0",
"echarts": "^3.3.1",
"elasticsearch": "^12.1.0"
}
Expand Down
37 changes: 21 additions & 16 deletions public/common/Topology.js
View file
Original file line number Diff line number Diff line change
@@ -1,31 +1,36 @@
import uiModules from 'ui/modules';
import _ from 'lodash';
import { initChart, getDataHeatMap } from './chart_utils';


uiModules
.get('app/topology', [])
.factory('Topology', ['$http', '$q', 'chrome', function ($http, $q, chrome) {
.factory('Topology', ['$http', 'chrome', function ($http, chrome) {
class Topology {

constructor() {
}

getClusterTopology() {
return $http.get(chrome.addBasePath('/topology/cluster'));
}
constructor(container) {
$http.get(chrome.addBasePath('/topology/cluster_health'))
.then( (health) => {
this.description = health.data;
}.bind(this));

getIndicesColors( indices ) {
return _.map( indices, ( index ) => index.color );
this.chart = initChart(container);
}

getShardsColors( indices ) {
return _.map( indices, ( index ) => _.map( index.children , ( shard, key ) => shard.color ) );
getChart() {
return this.chart;
}
}
return Topology;

setClusterName ( clusterName ) {
this.clusterName = clusterName;
}
}])
.factory('DataHeatMap', ['Topology', '$http', 'chrome',function (Topology, $http, chrome) {
class DataHeatMap extends Topology {

constructor(container) {
super(container);
getDataHeatMap($http, chrome).then( (option) => this.chart.setOption( option ) );
}
}
return Topology;
return DataHeatMap;

}]);
117 changes: 117 additions & 0 deletions public/common/chart_utils.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,117 @@
import _ from 'lodash';
import echarts from 'plugins/topology/../node_modules/echarts/dist/echarts.min.js';

function getIndicesColors( indices ) {
return _.map( indices, ( index ) => index.color );
}

function getShardsColors( indices ) {
return _.map( indices, ( index ) => _.map( index.children , ( shard, key ) => shard.color ) );
}

function initChart(container) {
return echarts.init(container);
}

function getDataHeatMap($http, chrome) {
const formatUtil = echarts.format;

return $http.get(chrome.addBasePath('/topology/data_heat_map'))
.then( response => {
return {
tooltip: {
formatter: function (info) {
const value = info.value;
const docsCount = info.data['docs.count'];
const docsDeleted = info.data['docs.deleted'];
const treePathInfo = info.treePathInfo;
const treePath = [];

for (var i = 1; i < treePathInfo.length; i++) {
treePath.push(treePathInfo[i].name);
}

var scaleValue = function(value) {
if ( value >= 1024 ) {
return formatUtil.addCommas( value / 1000 ) + ' GB'
} else if ( value >= 1024*1024 ) {
return formatUtil.addCommas( value / (1024*1024) ) + ' TB';
}

return formatUtil.addCommas(value) + ' MB';
}

let docsStats = ['<div>Docs count: ' + formatUtil.addCommas(docsCount) + '</div>',
'<div>Docs deleted: ' + formatUtil.addCommas(docsDeleted) + '</div>'];
if ( typeof info.data.segments != 'undefined' ) {
docsStats = ['<div>Docs count: ' + formatUtil.addCommas(info.data['docs']) + '</div>']
}

return [
'<div class="tooltip-title">' + formatUtil.encodeHTML(treePath.join('/')) + '</div>',
'<div>Disk Usage: ' + scaleValue(value)+ '</div>'
].concat(docsStats).join('');
}
},
series: [{
name: 'Index topology',
type: 'treemap',
data: response.data.treemap,
visibleMin: null,
leafDepth: 1,
zoomToNodeRatio: 0.02*0.02,
breadcrumb: {
top: 1,
itemStyle: {
normal: {
color: '#607D8B',
borderWidth: 1,
borderColor: '#90A4AE',
textStyle: {
fontSize: 14
}
}
}
},
levels: [
{
color: getIndicesColors(response.data.treemap),
itemStyle: {
normal: {
borderColor: '#2f99c1',
borderWidth: 15,
gapWidth: 15
}
}
},
{
color: getShardsColors(response.data.treemap),

itemStyle: {
normal: {
borderColor: '#424242',
borderWidth: 10,
gapWidth: 10
}
}
},
{

itemStyle: {
normal: {
borderColor: '#212121',
borderWidth: 10,
gapWidth: 10
}
}
}
]
}]
}
});
}

export {
initChart,
getDataHeatMap
};
2 changes: 1 addition & 1 deletion public/views/index.html
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<div class="topology-container" flex layout="row" layout-align="center center">
<h1>{{topology.clusterName}}</h1>
<h1>{{topology.description.cluster}}</h1>
<div cluster-topology flex style="width: 100%; min-height: 250px; height: 650px" flex class="cluster-topology"></div>
</div>
112 changes: 7 additions & 105 deletions public/views/index.js
View file
Original file line number Diff line number Diff line change
@@ -1,119 +1,21 @@
import uiModules from 'ui/modules';
import _ from 'lodash';
import echarts from 'plugins/topology/../node_modules/echarts/dist/echarts.min.js';

uiModules
.get('app/topology', [])
.controller('indexController', [ '$scope', 'Topology', function ($scope, Topology) {
.controller('indexController', [ '$scope', function ($scope) {

}])
.directive('clusterTopology', [ 'Topology', '$window', '$timeout', function (Topology, $window, $timeout) {
.directive('clusterTopology', [ 'DataHeatMap', '$window', '$timeout', function (DataHeatMap, $window, $timeout) {
return {
link: function($scope, $element, attrs) {
const myChart = echarts.init($element[0]);
const formatUtil = echarts.format;
myChart.showLoading();

$scope.topology = new Topology();
$scope.topology.getClusterTopology().then( response => {
$scope.topology.setClusterName(response.data.cluster.cluster);
myChart.hideLoading();

myChart.setOption({
tooltip: {
formatter: function (info) {
const value = info.value;
const docsCount = info.data['docs.count'];
const docsDeleted = info.data['docs.deleted'];
const treePathInfo = info.treePathInfo;
const treePath = [];

for (var i = 1; i < treePathInfo.length; i++) {
treePath.push(treePathInfo[i].name);
}

var scaleValue = function(value) {
if ( value >= 1024 ) {
return formatUtil.addCommas( value / 1000 ) + ' GB'
} else if ( value >= 1024*1024 ) {
return formatUtil.addCommas( value / (1024*1024) ) + ' TB';
}

return formatUtil.addCommas(value) + ' MB';
}

let docsStats = ['<div>Docs count: ' + formatUtil.addCommas(docsCount) + '</div>',
'<div>Docs deleted: ' + formatUtil.addCommas(docsDeleted) + '</div>'];
if ( typeof info.data.segments != 'undefined' ) {
docsStats = ['<div>Docs count: ' + formatUtil.addCommas(info.data['docs']) + '</div>']
}

return [
'<div class="tooltip-title">' + formatUtil.encodeHTML(treePath.join('/')) + '</div>',
'<div>Disk Usage: ' + scaleValue(value)+ '</div>'
].concat(docsStats).join('');
}
},
series: [{
name: 'Index topology',
type: 'treemap',
data: response.data.treemap,
visibleMin: null,
leafDepth: 1,
zoomToNodeRatio: 0.02*0.02,
breadcrumb: {
top: 1,
itemStyle: {
normal: {
color: '#607D8B',
borderWidth: 1,
borderColor: '#90A4AE',
textStyle: {
fontSize: 14
}
}
}
},
levels: [
{
color: $scope.topology.getIndicesColors(response.data.treemap),
itemStyle: {
normal: {
borderColor: '#2f99c1',
borderWidth: 15,
gapWidth: 15
}
}
},
{
color: $scope.topology.getShardsColors(response.data.treemap),

itemStyle: {
normal: {
borderColor: '#424242',
borderWidth: 10,
gapWidth: 10
}
}
},
{

itemStyle: {
normal: {
borderColor: '#212121',
borderWidth: 10,
gapWidth: 10
}
}
}
]
}]
});
});

$scope.topology = new DataHeatMap($element[0]);

const resizeChart = function() {
if(myChart != null && typeof myChart != 'undefined') {
myChart.resize({
if($scope.topology.getChart() != null
&& typeof $scope.topology.getChart() != 'undefined') {
$scope.topology.getChart().resize({
width: angular.element('.topology-container')[0].offsetWidth,
height: angular.element('.topology-container')[0].offsetHeight - 100
});
Expand Down
2 changes: 1 addition & 1 deletion server/lib/init_topology_client_config.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -75,4 +75,4 @@ export default function initTopologyClientConfiguration(config) {
delete configObjects.ssl.verify;

return { ...configObjects };
}
}
12 changes: 4 additions & 8 deletions server/routes/api.js
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,7 @@
import cat_indices from './cat_indices'
import cat_shards from './cat_shards'
import cat_segments from './cat_segments'
import get_cluster_topology from './get_cluster_topology'
import get_cluster_health from './get_cluster_health'
import get_data_heat_map from './get_data_heat_map'

export default function (server) {
server = cat_indices(server);
server = cat_shards(server);
server = cat_segments(server);
server = get_cluster_topology(server);
server = get_cluster_health(server);
server = get_data_heat_map(server);
};
18 changes: 0 additions & 18 deletions server/routes/cat_indices.js
View file

This file was deleted.

18 changes: 0 additions & 18 deletions server/routes/cat_segments.js
View file

This file was deleted.

18 changes: 0 additions & 18 deletions server/routes/cat_shards.js
View file

This file was deleted.

Loading

0 comments on commit ed70511

Please sign in to comment.