[임대현] [NOBTS] 리펙토링

git-svn-id: http://svn.bds.nhncorp.com/pe/hippo-web/trunk@2533 84d0f5b1-2673-498c-a247-62c4ff18d310
This commit is contained in:
Denny Lim
2013-10-16 08:01:33 +00:00
parent fb2db0026d
commit 6d49f8a94f
4 changed files with 201 additions and 215 deletions
@@ -49,7 +49,7 @@ pinpointApp
]);
// jQuery.ajax({
// type: 'GET',
// url: cfg.agentListUrl,
// url: cfg.agentGroupUrl,
// cache: false,
// dataType: 'json',
// data: {
@@ -7,10 +7,16 @@ pinpointApp.directive('callStacks', [ function () {
templateUrl: 'views/callStacks.html',
link: function postLink(scope, element, attrs) {
// define private variables of methods
var initialize;
// initialize scope variables
scope.transactionDetail = null;
/**
* initialize
* @param transactionDetail
*/
initialize = function (transactionDetail) {
scope.transactionDetail = transactionDetail;
scope.key = transactionDetail.callStackIndex;
@@ -22,6 +28,9 @@ pinpointApp.directive('callStacks', [ function () {
});
};
/**
* scope event on callStacks.initialize
*/
scope.$on('callStacks.initialize', function (event, transactionDetail) {
initialize(transactionDetail);
});
@@ -1,22 +0,0 @@
'use strict';
pinpointApp
.directive('divider', ['$rootScope', function ($rootScope) {
return {
restrict: 'EA',
replace: true,
templateUrl: 'views/divider.html',
link: function postLink(scope, element, attrs) {
scope.onoff = 'divider-open';
scope.toggle = function(){
if(scope.onoff === 'divider-open'){
scope.onoff = 'divider-closed';
$rootScope.$broadcast('dividerClosed');
}else{
scope.onoff = 'divider-open';
$rootScope.$broadcast('dividerOpen');
}
};
}
};
}]);
@@ -2,219 +2,218 @@
pinpointApp.constant('linkInfoDetailsConfig', {
linkStatisticsUrl: '/linkStatistics.pinpoint',
myColors : ["#008000", "#4B72E3", "#A74EA7", "#BB5004", "#FF0000"]
myColors: ["#008000", "#4B72E3", "#A74EA7", "#BB5004", "#FF0000"]
});
pinpointApp
.directive('linkInfoDetails', [ 'linkInfoDetailsConfig', function (config) {
return {
restrict: 'EA',
replace: true,
templateUrl: 'views/linkInfoDetails.html',
link: function postLink(scope, element, attrs) {
pinpointApp.directive('linkInfoDetails', [ 'linkInfoDetailsConfig', function (config) {
return {
restrict: 'EA',
replace: true,
templateUrl: 'views/linkInfoDetails.html',
link: function postLink(scope, element, attrs) {
// define private variables
var htQuery;
// define private variables
var htQuery;
// define private variables of methods;
var reset, showDetailInformation, getLinkStatisticsData, renderStatisticsTimeseriesHistogram, renderStatisticsSummary, showApplicationStatistics;
// define private variables of methods;
var reset, showDetailInformation, getLinkStatisticsData, renderStatisticsTimeseriesHistogram, renderStatisticsSummary, showApplicationStatistics;
/**
* reset
*/
reset = function () {
scope.linkCategory = null;
scope.rawdata = null;
scope.query = null;
scope.targetinfo = null;
scope.sourceinfo = null;
scope.showLinkInfoChart = false;
scope.showLinkInfoBarChart = false;
scope.$digest();
};
/**
* reset
*/
reset = function () {
scope.linkCategory = null;
scope.rawdata = null;
scope.query = null;
scope.targetinfo = null;
scope.sourceinfo = null;
scope.showLinkInfoChart = false;
scope.showLinkInfoBarChart = false;
scope.$digest();
};
/**
* show detail information of scope
* @param applicationName
*/
scope.showDetailInformation = function (applicationName) {
showDetailInformation(scope.rawdata[applicationName]);
};
/**
* show detail information of scope
* @param applicationName
*/
scope.showDetailInformation = function (applicationName) {
showDetailInformation(scope.rawdata[applicationName]);
};
/**
* show detail information
* @param query
* @param data
*/
showDetailInformation = function (data) {
console.log('showDetailInformation', data);
if (data.rawdata) {
scope.linkCategory = 'UnknownLinkInfoBox';
} else {
scope.linkCategory = 'LinkInfoBox';
showApplicationStatistics(
htQuery.from,
htQuery.to,
data.sourceinfo.serviceTypeCode,
data.sourceinfo.applicationName,
data.targetinfo.serviceTypeCode,
data.targetinfo.applicationName
);
/**
* show detail information
* @param query
* @param data
*/
showDetailInformation = function (data) {
console.log('showDetailInformation', data);
if (data.rawdata) {
scope.linkCategory = 'UnknownLinkInfoBox';
} else {
scope.linkCategory = 'LinkInfoBox';
showApplicationStatistics(
htQuery.from,
htQuery.to,
data.sourceinfo.serviceTypeCode,
data.sourceinfo.applicationName,
data.targetinfo.serviceTypeCode,
data.targetinfo.applicationName
);
}
scope.rawdata = data.rawdata;
scope.query = data.query;
scope.targetinfo = data.targetinfo;
scope.sourceinfo = data.sourceinfo;
scope.$digest();
};
/**
* get link statistics data
* @param query
* @param callback
*/
getLinkStatisticsData = function (query, callback) {
jQuery.ajax({
type: 'GET',
url: config.linkStatisticsUrl,
cache: false,
dataType: 'json',
data: {
from: query.from,
to: query.to,
srcServiceType: query.srcServiceType,
srcApplicationName: query.srcApplicationName,
destServiceType: query.destServiceType,
destApplicationName: query.destApplicationName
},
success: function (result) {
callback(query, result);
},
error: function (xhr, status, error) {
console.log("ERROR", status, error);
}
});
};
scope.rawdata = data.rawdata;
scope.query = data.query;
scope.targetinfo = data.targetinfo;
scope.sourceinfo = data.sourceinfo;
scope.$digest();
};
/**
* get link statistics data
* @param query
* @param callback
*/
getLinkStatisticsData = function (query, callback) {
jQuery.ajax({
type : 'GET',
url : config.linkStatisticsUrl,
cache : false,
dataType: 'json',
data : {
from : query.from,
to : query.to,
srcServiceType : query.srcServiceType,
srcApplicationName : query.srcApplicationName,
destServiceType : query.destServiceType,
destApplicationName : query.destApplicationName
},
success : function (result) {
callback(query, result);
},
error : function (xhr, status, error) {
console.log("ERROR", status, error);
}
});
};
/**
* render statistics timseries histogram
* @param data
*/
renderStatisticsTimeseriesHistogram = function (data) {
nv.addGraph(function() {
var chart = nv.models.multiBarChart().x(function (d) {
return d[0];
}).y(function(d) {
/**
* render statistics timseries histogram
* @param data
*/
renderStatisticsTimeseriesHistogram = function (data) {
nv.addGraph(function () {
var chart = nv.models.multiBarChart().x(function (d) {
return d[0];
}).y(function (d) {
return d[1];
}).clipEdge(true).showControls(false);
chart.stacked(true);
chart.stacked(true);
chart.xAxis.tickFormat(function (d) {
return d3.time.format('%H:%M')(new Date(d));
});
chart.yAxis.tickFormat(function (d) {
return d;
});
chart.color(config.myColors);
d3.select('.linkInfoDetails .infoChart svg')
.datum(data)
.transition()
.duration(0)
.call(chart);
nv.utils.windowResize(chart.update);
return chart;
chart.xAxis.tickFormat(function (d) {
return d3.time.format('%H:%M')(new Date(d));
});
};
/**
* render statics summary
* @param data
*/
renderStatisticsSummary = function (data) {
nv.addGraph(function() {
var chart = nv.models.discreteBarChart().x(function (d) {
return d.label;
}).y(function (d) {
chart.yAxis.tickFormat(function (d) {
return d;
});
chart.color(config.myColors);
d3.select('.linkInfoDetails .infoChart svg')
.datum(data)
.transition()
.duration(0)
.call(chart);
nv.utils.windowResize(chart.update);
return chart;
});
};
/**
* render statics summary
* @param data
*/
renderStatisticsSummary = function (data) {
nv.addGraph(function () {
var chart = nv.models.discreteBarChart().x(function (d) {
return d.label;
}).y(function (d) {
return d.value;
}).staggerLabels(false).tooltips(false).showValues(true);
chart.xAxis.tickFormat(function (d) {
if(angular.isNumber(d)) {
return (d >= 1000) ? d / 1000 + "s" : d + "ms";
}
return d;
});
chart.yAxis.tickFormat(function (d) {
return d;
});
chart.valueFormat(function (d) {
return d;
});
chart.color(config.myColors);
d3.select('.linkInfoDetails .infoBarChart svg')
.datum(data)
.transition()
.duration(0)
.call(chart);
nv.utils.windowResize(chart.update);
return chart;
chart.xAxis.tickFormat(function (d) {
if (angular.isNumber(d)) {
return (d >= 1000) ? d / 1000 + "s" : d + "ms";
}
return d;
});
chart.yAxis.tickFormat(function (d) {
return d;
});
chart.valueFormat(function (d) {
return d;
});
chart.color(config.myColors);
d3.select('.linkInfoDetails .infoBarChart svg')
.datum(data)
.transition()
.duration(0)
.call(chart);
nv.utils.windowResize(chart.update);
return chart;
});
};
/**
* show application statistics
* @param begin
* @param end
* @param srcServiceType
* @param srcApplicationName
* @param destServiceType
* @param destApplicationName
*/
showApplicationStatistics = function (begin, end, srcServiceType, srcApplicationName, destServiceType, destApplicationName) {
var params = {
"from": begin,
"to": end,
"srcServiceType": srcServiceType,
"srcApplicationName": srcApplicationName,
"destServiceType": destServiceType,
"destApplicationName": destApplicationName
};
/**
* show application statistics
* @param begin
* @param end
* @param srcServiceType
* @param srcApplicationName
* @param destServiceType
* @param destApplicationName
*/
showApplicationStatistics = function (begin, end, srcServiceType, srcApplicationName, destServiceType, destApplicationName) {
var params = {
"from" : begin,
"to" : end,
"srcServiceType" : srcServiceType,
"srcApplicationName" : srcApplicationName,
"destServiceType" : destServiceType,
"destApplicationName" : destApplicationName
};
getLinkStatisticsData(params, function(query, result) {
scope.showLinkInfoChart = true;
scope.showLinkInfoBarChart = true;
scope.$digest();
renderStatisticsTimeseriesHistogram(result.timeseriesHistogram);
renderStatisticsSummary(result.histogramSummary);
});
};
// define scope events on
scope.$on('servermap.nodeClicked', function (event, e, query, data) {
reset();
getLinkStatisticsData(params, function (query, result) {
scope.showLinkInfoChart = true;
scope.showLinkInfoBarChart = true;
scope.$digest();
renderStatisticsTimeseriesHistogram(result.timeseriesHistogram);
renderStatisticsSummary(result.histogramSummary);
});
scope.$on('servermap.linkClicked', function (event, e, query, data) {
reset();
htQuery = query;
showDetailInformation(data);
});
scope.$on('servermap.linkContextClicked', function (event, e, query, data) {
};
// define scope events on
scope.$on('servermap.nodeClicked', function (event, e, query, data) {
reset();
});
scope.$on('servermap.linkClicked', function (event, e, query, data) {
reset();
htQuery = query;
showDetailInformation(data);
});
scope.$on('servermap.linkContextClicked', function (event, e, query, data) {
// alert('linkContextClicked');
});
});
}
};
} ]);
}
};
} ]);