Portainer
/
portainer
mirror of https://github.com/portainer/portainer.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

refactor(services): Refactor chartService and pluginService (#1340)

pull/1468/head
1138-4EB 2017-12-05 09:49:04 +01:00 committed by Anthony Lapenna
parent d8f6b14726
commit 75b3a78e2b
3 changed files with 56 additions and 164 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

166
app/services/chartService.js
View File

@ -7,14 +7,42 @@ angular.module('portainer.services')
var service = {};
service.CreateCPUChart = function(context) {
function defaultChartOptions(pos, tooltipCallback, scalesCallback) {
return {
animation: { duration: 0 },
responsiveAnimationDuration: 0,
responsive: true,
tooltips: {
mode: 'index',
intersect: false,
position: pos,
callbacks: {
label: function(tooltipItem, data) {
var datasetLabel = data.datasets[tooltipItem.datasetIndex].label;
return tooltipCallback(datasetLabel, tooltipItem.yLabel);
}
}
},
hover: { animationDuration: 0 },
scales: {
yAxes: [{
ticks: {
beginAtZero: true,
callback: scalesCallback
}
}]
}
};
}
function CreateChart (context, label, tooltipCallback, scalesCallback) {
return new Chart(context, {
type: 'line',
data: {
labels: [],
datasets: [
{
label: 'CPU',
label: label,
data: [],
fill: true,
backgroundColor: 'rgba(151,187,205,0.4)',
@ -26,91 +54,16 @@ angular.module('portainer.services')
}
]
},
options: {
animation: {
duration: 0
},
responsiveAnimationDuration: 0,
responsive: true,
tooltips: {
mode: 'index',
intersect: false,
position: 'nearest',
callbacks: {
label: function(tooltipItem, data) {
var datasetLabel = data.datasets[tooltipItem.datasetIndex].label;
return percentageBasedTooltipLabel(datasetLabel, tooltipItem.yLabel);
}
}
},
hover: {
animationDuration: 0
},
scales: {
yAxes: [
{
ticks: {
beginAtZero: true,
callback: percentageBasedAxisLabel
}
}
]
}
}
options: defaultChartOptions('nearest', tooltipCallback, scalesCallback)
});
}
service.CreateCPUChart = function(context) {
return CreateChart(context, 'CPU', percentageBasedTooltipLabel, percentageBasedAxisLabel);
};
service.CreateMemoryChart = function(context) {
return new Chart(context, {
type: 'line',
data: {
labels: [],
datasets: [
{
label: 'Memory',
data: [],
fill: true,
backgroundColor: 'rgba(151,187,205,0.4)',
borderColor: 'rgba(151,187,205,0.6)',
pointBackgroundColor: 'rgba(151,187,205,1)',
pointBorderColor: 'rgba(151,187,205,1)',
pointRadius: 2,
borderWidth: 2
}
]
},
options: {
animation: {
duration: 0
},
responsiveAnimationDuration: 0,
responsive: true,
tooltips: {
mode: 'index',
intersect: false,
position: 'nearest',
callbacks: {
label: function(tooltipItem, data) {
var datasetLabel = data.datasets[tooltipItem.datasetIndex].label;
return byteBasedTooltipLabel(datasetLabel, tooltipItem.yLabel);
}
}
},
hover: {
animationDuration: 0
},
scales: {
yAxes: [
{
ticks: {
beginAtZero: true,
callback: byteBasedAxisLabel
}
}
]
}
}
});
return CreateChart(context, 'Memory', byteBasedTooltipLabel, byteBasedAxisLabel);
};
service.CreateNetworkChart = function(context) {
@ -143,39 +96,11 @@ angular.module('portainer.services')
}
]
},
options: {
animation: {
duration: 0
},
responsiveAnimationDuration: 0,
responsive: true,
tooltips: {
mode: 'index',
intersect: false,
position: 'average',
callbacks: {
label: function(tooltipItem, data) {
var datasetLabel = data.datasets[tooltipItem.datasetIndex].label;
return byteBasedTooltipLabel(datasetLabel, tooltipItem.yLabel);
}
}
},
hover: {
animationDuration: 0
},
scales: {
yAxes: [{
ticks: {
beginAtZero: true,
callback: byteBasedAxisLabel
}
}]
}
}
options: defaultChartOptions('average', byteBasedTooltipLabel, byteBasedAxisLabel)
});
};
service.UpdateMemoryChart = function(label, value, chart) {
function UpdateChart(label, value, chart) {
chart.data.labels.push(label);
chart.data.datasets[0].data.push(value);
@ -185,19 +110,10 @@ angular.module('portainer.services')
}
chart.update(0);
};
}
service.UpdateCPUChart = function(label, value, chart) {
chart.data.labels.push(label);
chart.data.datasets[0].data.push(value);
if (chart.data.datasets[0].data.length > CHART_LIMIT) {
chart.data.labels.pop();
chart.data.datasets[0].data.pop();
}
chart.update(0);
};
service.UpdateMemoryChart = UpdateChart;
service.UpdateCPUChart = UpdateChart;
service.UpdateNetworkChart = function(label, rx, tx, chart) {
chart.data.labels.push(label);

48
app/services/docker/pluginService.js
View File

@ -20,7 +20,7 @@ angular.module('portainer.services')
return deferred.promise;
};
service.volumePlugins = function(systemOnly) {
function servicePlugins(systemOnly, pluginType, pluginVersion) {
var deferred = $q.defer();
$q.all({
@ -28,60 +28,36 @@ angular.module('portainer.services')
plugins: systemOnly ? [] : service.plugins()
})
.then(function success(data) {
var volumePlugins = [];
var aggregatedPlugins = [];
var systemPlugins = data.system;
var plugins = data.plugins;
if (systemPlugins.Volume) {
volumePlugins = volumePlugins.concat(systemPlugins.Volume);
if (systemPlugins[pluginType]) {
aggregatedPlugins = aggregatedPlugins.concat(systemPlugins[pluginType]);
}
for (var i = 0; i < plugins.length; i++) {
var plugin = plugins[i];
if (plugin.Enabled && _.includes(plugin.Config.Interface.Types, 'docker.volumedriver/1.0')) {
volumePlugins.push(plugin.Name);
if (plugin.Enabled && _.includes(plugin.Config.Interface.Types, pluginVersion)) {
aggregatedPlugins.push(plugin.Name);
}
}
deferred.resolve(volumePlugins);
deferred.resolve(aggregatedPlugins);
})
.catch(function error(err) {
deferred.reject({ msg: err.msg, err: err });
});
return deferred.promise;
}
service.volumePlugins = function(systemOnly) {
return servicePlugins(systemOnly, 'Volume', 'docker.volumedriver/1.0');
};
service.networkPlugins = function(systemOnly) {
var deferred = $q.defer();
$q.all({
system: SystemService.plugins(),
plugins: systemOnly ? [] : service.plugins()
})
.then(function success(data) {
var networkPlugins = [];
var systemPlugins = data.system;
var plugins = data.plugins;
if (systemPlugins.Network) {
networkPlugins = networkPlugins.concat(systemPlugins.Network);
}
for (var i = 0; i < plugins.length; i++) {
var plugin = plugins[i];
if (plugin.Enabled && _.includes(plugin.Config.Interface.Types, 'docker.networkdriver/1.0')) {
networkPlugins.push(plugin.Name);
}
}
deferred.resolve(networkPlugins);
})
.catch(function error(err) {
deferred.reject({ msg: err.msg, err: err });
});
return deferred.promise;
return servicePlugins(systemOnly, 'Network', 'docker.networkdriver/1.0');
};
return service;

6
assets/css/app.css
View File

@ -26,11 +26,8 @@ html, body, #page-wrapper, #content-wrapper, .page-content, #view {
.logo {
display: inline;
width: 100%;
max-width: 155px;
height: 100%;
max-height: 55px;
margin-bottom: 5px;
}
.containerNameInput {
@ -490,6 +487,8 @@ ul.sidebar .sidebar-list .sidebar-sublist a.active {
padding-right: 24px;
transition: all ease 0.2s;
-webkit-transition: all ease 0.2s;
-moz-transition: all ease 0.2s;
-o-transition: all ease 0.2s;
border-radius: 24px;
box-shadow: inset 0 0 1px 1px rgba(0,0,0,.5);
}
@ -508,6 +507,7 @@ ul.sidebar .sidebar-list .sidebar-sublist a.active {
padding-right: 0;
padding-left: 24px;
-webkit-box-shadow: inset 0 0 1px rgba(0,0,0,.5), inset 0 0 40px #337ab7;
-moz-box-shadow: inset 0 0 1px rgba(0,0,0,.5), inset 0 0 40px #337ab7;
box-shadow: inset 0 0 1px rgba(0,0,0,.5), inset 0 0 40px #337ab7;
}