Merge branch 'image-stats' into dev
Michael Crosby
commit
ef3ec09cad
|
|
@ -25,9 +25,8 @@ function DashboardController($scope, Container) {
|
|||
}
|
||||
}
|
||||
|
||||
var ctx = $("#containers-chart").get(0).getContext("2d");
|
||||
var c = new Chart(ctx);
|
||||
var data = [
|
||||
var c = getChart('#containers-chart');
|
||||
var data = [
|
||||
{
|
||||
value: running,
|
||||
color: '#5bb75b',
|
||||
|
|
@ -51,6 +50,11 @@ function DashboardController($scope, Container) {
|
|||
});
|
||||
}
|
||||
|
||||
function getChart(id) {
|
||||
var ctx = $(id).get(0).getContext("2d");
|
||||
return new Chart(ctx);
|
||||
}
|
||||
|
||||
function StatusBarController($scope, Settings) {
|
||||
$scope.template = 'partials/statusbar.html';
|
||||
|
||||
|
|
@ -265,7 +269,7 @@ function ImagesController($scope, Image, ViewSpinner, Messages) {
|
|||
}
|
||||
|
||||
// Controller for a single image and actions on that image
|
||||
function ImageController($scope, $routeParams, $location, Image, Messages) {
|
||||
function ImageController($scope, $q, $routeParams, $location, Image, Container, Messages) {
|
||||
$scope.history = [];
|
||||
$scope.tag = {repo: '', force: false};
|
||||
|
||||
|
|
@ -300,6 +304,58 @@ function ImageController($scope, $routeParams, $location, Image, Messages) {
|
|||
|
||||
Image.get({id: $routeParams.id}, function(d) {
|
||||
$scope.image = d;
|
||||
$scope.tag = d.id;
|
||||
var t = $routeParams.tag;
|
||||
if (t && t !== ":") {
|
||||
$scope.tag = t;
|
||||
var promise = getContainersFromImage($q, Container, t);
|
||||
|
||||
promise.then(function(containers) {
|
||||
var map = {};
|
||||
|
||||
for (var i = 0; i < containers.length; i++) {
|
||||
var c = containers[i];
|
||||
var date = new Date(c.Created * 1000).toLocaleDateString();
|
||||
|
||||
var count = map[date];
|
||||
if (count === undefined) {
|
||||
count = 0;
|
||||
}
|
||||
console.log(map);
|
||||
count += 1;
|
||||
map[date] = count;
|
||||
}
|
||||
|
||||
var labels = [];
|
||||
var data = [];
|
||||
var keys = Object.keys(map);
|
||||
|
||||
for (var i = keys.length - 1; i > -1; i--) {
|
||||
var k = keys[i];
|
||||
labels.push(k);
|
||||
data.push(map[k]);
|
||||
};
|
||||
var dataset = {
|
||||
fillColor : "rgba(151,187,205,0.5)",
|
||||
strokeColor : "rgba(151,187,205,1)",
|
||||
pointColor : "rgba(151,187,205,1)",
|
||||
pointStrokeColor : "#fff",
|
||||
data : data
|
||||
};
|
||||
console.log(labels, data);
|
||||
var c = getChart('#containers-started-chart');
|
||||
c.Line({
|
||||
labels: labels,
|
||||
datasets: [dataset]
|
||||
},
|
||||
{
|
||||
scaleStepWidth: 1,
|
||||
pointDotRadius:1,
|
||||
scaleOverride: true,
|
||||
scaleSteps: labels.length
|
||||
});
|
||||
});
|
||||
}
|
||||
}, function(e) {
|
||||
if (e.status === 404) {
|
||||
$('.detail').hide();
|
||||
|
|
@ -379,3 +435,21 @@ function BuilderController($scope, Dockerfile, Messages) {
|
|||
function failedRequestHandler(e, Messages) {
|
||||
Messages.send({class: 'text-error', data: e.data});
|
||||
}
|
||||
|
||||
// This gonna get messy but we don't have a good way to do this right now
|
||||
function getContainersFromImage($q, Container, tag) {
|
||||
var defer = $q.defer();
|
||||
|
||||
Container.query({all:1, notruc:1}, function(d) {
|
||||
var containers = [];
|
||||
for (var i = 0; i < d.length; i++) {
|
||||
var c = d[i];
|
||||
if (c.Image == tag) {
|
||||
containers.push(new ContainerViewModel(c));
|
||||
}
|
||||
}
|
||||
defer.resolve(containers);
|
||||
});
|
||||
|
||||
return defer.promise;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@
|
|||
<h3>Running Containers</h3>
|
||||
<ul>
|
||||
<li ng-repeat="container in containers|orderBy:predicate">
|
||||
<a href="/#/containers/{{ container.Id }}/">{{ container.Command }}</a>
|
||||
<a href="/#/containers/{{ container.Id }}/">{{ container.Image }}</a>
|
||||
<span class="label label-{{ container.Status|statusbadge }}">{{ container.Status }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
|
|
|
|||
|
|
@ -6,12 +6,18 @@
|
|||
|
||||
<div class="detail">
|
||||
|
||||
<h4>Image: {{ image.id }}</h4>
|
||||
<h4>Image: {{ tag }}</h4>
|
||||
|
||||
<div class="btn-group detail">
|
||||
<button class="btn btn-success" ng-click="create()">Create</button>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h4>Containers created:</h4>
|
||||
<canvas id="containers-started-chart" width="750">
|
||||
Get a better broswer... Your holding everyone back.
|
||||
</canvas>
|
||||
</div>
|
||||
|
||||
<table class="table table-striped">
|
||||
<tbody>
|
||||
|
|
@ -23,10 +29,6 @@
|
|||
<td>Parent:</td>
|
||||
<td><a href="/#/images/{{ image.parent }}/">{{ image.parent }}</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Container:</td>
|
||||
<td><a href="/#/containers/{{ image.container }}/">{{ image.container }}</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Size:</td>
|
||||
<td>{{ image.Size|humansize }}</td>
|
||||
|
|
@ -95,7 +97,6 @@
|
|||
|
||||
<hr />
|
||||
|
||||
|
||||
<div class="btn-remove">
|
||||
<button class="btn btn-large btn-block btn-primary btn-danger" ng-click="remove()">Remove Image</button>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -16,7 +16,6 @@
|
|||
<tr>
|
||||
<th><input type="checkbox" ng-model="toggle" ng-click="toggleSelectAll()" /> Action</th>
|
||||
<th>Id</th>
|
||||
<th>Tag</th>
|
||||
<th>Repository</th>
|
||||
<th>Created</th>
|
||||
</tr>
|
||||
|
|
@ -24,9 +23,8 @@
|
|||
<tbody>
|
||||
<tr ng-repeat="image in images | orderBy:predicate">
|
||||
<td><input type="checkbox" ng-model="image.Checked" /></td>
|
||||
<td><a href="/#/images/{{ image.Id }}/">{{ image.Id|truncate:20}}</a></td>
|
||||
<td>{{ image.Tag }}</td>
|
||||
<td>{{ image.Repository }}</td>
|
||||
<td><a href="/#/images/{{ image.Id }}/?tag={{ image.Repository }}:{{ image.Tag }}">{{ image.Id|truncate:20}}</a></td>
|
||||
<td>{{ image.Repository }}:{{ image.Tag }}</td>
|
||||
<td>{{ image.Created|getdate }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
|
|
|
|||
Loading…
Reference in New Issue