Skip to content

Commit

Permalink
Merge pull request #155 from crosbymichael/labels
Browse files Browse the repository at this point in the history
Labels and Image tags
  • Loading branch information
kevana committed Dec 6, 2015
2 parents 25a4607 + 1dd1ce2 commit d881d97
Show file tree
Hide file tree
Showing 9 changed files with 155 additions and 35 deletions.
35 changes: 31 additions & 4 deletions app/components/container/container.html
Original file line number Diff line number Diff line change
Expand Up @@ -54,15 +54,17 @@ <h4>
<tbody>
<tr>
<td>Created:</td>
<td>{{ container.Created }}</td>
<td>{{ container.Created | date: 'medium' }}</td>
</tr>
<tr>
<td>Path:</td>
<td>{{ container.Path }}</td>
</tr>
<tr>
<td>Args:</td>
<td>{{ container.Args }}</td>
<td>
<pre>{{ container.Args.join(' ') || 'None' }}</pre>
</td>
</tr>
<tr>
<td>Exposed Ports:</td>
Expand All @@ -80,6 +82,21 @@ <h4>
</ul>
</td>
</tr>
<tr>
<td>Labels:</td>
<td>
<table role="table" class="table">
<tr>
<th>Key</th>
<th>Value</th>
</tr>
<tr ng-repeat="(k, v) in container.Config.Labels">
<td>{{ k }}</td>
<td>{{ v }}</td>
</tr>
</table>
</td>
</tr>

<tr>
<td>Publish All:</td>
Expand Down Expand Up @@ -110,7 +127,9 @@ <h4>
</tr>
<tr>
<td>Entrypoint:</td>
<td>{{ container.Config.Entrypoint }}</td>
<td>
<pre>{{ container.Config.Entrypoint.join(' ') }}</pre>
</td>
</tr>
<tr>
<td>Volumes:</td>
Expand All @@ -127,7 +146,15 @@ <h4>
</tr>
<tr>
<td>State:</td>
<td><span class="label {{ container.State|getstatelabel }}">{{ container.State|getstatetext }}</span></td>
<td>
<accordion close-others="true">
<accordion-group heading="{{ container.State|getstatetext }}">
<ul>
<li ng-repeat="(key, val) in container.State">{{key}} : {{ val }}</li>
</ul>
</accordion-group>
</accordion>
</td>
</tr>
<tr>
<td>Logs:</td>
Expand Down
25 changes: 18 additions & 7 deletions app/components/image/image.html
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,10 @@

<div class="detail">

<h4>Image: {{ tag }}</h4>
<h4>Image: {{ id }}</h4>

<div class="btn-group detail">
<button class="btn btn-success" data-toggle="modal" data-target="#create-modal">Create</button>
<button class="btn btn-success" data-toggle="modal" data-target="#create-modal">Start Container</button>
</div>

<div>
Expand All @@ -22,9 +22,19 @@ <h4>Containers created:</h4>

<table class="table table-striped">
<tbody>
<tr>
<td>Tags:</td>
<td>
<ul>
<li ng-repeat="tag in RepoTags">{{ tag }}
<button ng-click="removeImage(tag)" class="btn btn-sm btn-danger">Remove tag</button>
</li>
</ul>
</td>
</tr>
<tr>
<td>Created:</td>
<td>{{ image.Created }}</td>
<td>{{ image.Created | date: 'medium'}}</td>
</tr>
<tr>
<td>Parent:</td>
Expand Down Expand Up @@ -89,21 +99,22 @@ <h4>Containers created:</h4>
<legend>Tag image</legend>
<div class="form-group">
<label>Tag:</label>
<input type="text" placeholder="repo..." ng-model="tag.repo" class="form-control">
<input type="text" placeholder="repo" ng-model="tagInfo.repo" class="form-control">
<input type="text" placeholder="version" ng-model="tagInfo.version" class="form-control">
</div>
<div class="form-group">
<label class="checkbox">
<input type="checkbox" ng-model="tag.force" class="form-control"/> Force?
<input type="checkbox" ng-model="tagInfo.force" class="form-control"/> Force?
</label>
</div>
<input type="button" ng-click="updateTag()" value="Tag" class="btn btn-primary"/>
<input type="button" ng-click="addTag()" value="Add Tag" class="btn btn-primary"/>
</fieldset>
</form>
</div>

<hr/>

<div class="btn-remove">
<button class="btn btn-large btn-block btn-primary btn-danger" ng-click="remove()">Remove Image</button>
<button class="btn btn-large btn-block btn-primary btn-danger" ng-click="removeImage(id)">Remove Image</button>
</div>
</div>
51 changes: 32 additions & 19 deletions app/components/image/imageController.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,22 @@ angular.module('image', [])
.controller('ImageController', ['$scope', '$q', '$routeParams', '$location', 'Image', 'Container', 'Messages', 'LineChart',
function ($scope, $q, $routeParams, $location, Image, Container, Messages, LineChart) {
$scope.history = [];
$scope.tag = {repo: '', force: false};
$scope.tagInfo = {repo: '', version: '', force: false};
$scope.id = '';
$scope.repoTags = [];

$scope.remove = function () {
Image.remove({id: $routeParams.id}, function (d) {
Messages.send("Image Removed", $routeParams.id);
$scope.removeImage = function (id) {
Image.remove({id: id}, function (d) {
d.forEach(function(msg){
var key = Object.keys(msg)[0];
Messages.send(key, msg[key]);
});
// If last message key is 'Deleted' then assume the image is gone and send to images page
if (d[d.length-1].Deleted) {
$location.path('/images');
} else {
$location.path('/images/' + $scope.id); // Refresh the current page.
}
}, function (e) {
$scope.error = e.data;
$('#error-message').show();
Expand All @@ -19,24 +30,30 @@ angular.module('image', [])
});
};

$scope.updateTag = function () {
var tag = $scope.tag;
Image.tag({id: $routeParams.id, repo: tag.repo, force: tag.force ? 1 : 0}, function (d) {
$scope.addTag = function () {
var tag = $scope.tagInfo;
Image.tag({
id: $routeParams.id,
repo: tag.repo,
tag: tag.version,
force: tag.force ? 1 : 0
}, function (d) {
Messages.send("Tag Added", $routeParams.id);
$location.path('/images/' + $scope.id);
}, function (e) {
$scope.error = e.data;
$('#error-message').show();
});
};

function getContainersFromImage($q, Container, tag) {
function getContainersFromImage($q, Container, imageId) {
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) {
if (c.ImageID === imageId) {
containers.push(new ContainerViewModel(c));
}
}
Expand All @@ -48,18 +65,14 @@ angular.module('image', [])

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);
$scope.id = d.Id;
$scope.RepoTags = d.RepoTags;

promise.then(function (containers) {
LineChart.build('#containers-started-chart', containers, function (c) {
return new Date(c.Created * 1000).toLocaleDateString();
});
getContainersFromImage($q, Container, $scope.id).then(function (containers) {
LineChart.build('#containers-started-chart', containers, function (c) {
return new Date(c.Created * 1000).toLocaleDateString();
});
}
});
}, function (e) {
if (e.status === 404) {
$('.detail').hide();
Expand Down
6 changes: 6 additions & 0 deletions app/components/startContainer/startContainerController.js
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ angular.module('startContainer', ['ui.bootstrap'])

$scope.config = {
Env: [],
Labels: [],
Volumes: [],
SecurityOpts: [],
HostConfig: {
Expand Down Expand Up @@ -66,6 +67,11 @@ angular.module('startContainer', ['ui.bootstrap'])
config.Env = config.Env.map(function (envar) {
return envar.name + '=' + envar.value;
});
var labels = {};
config.Labels = config.Labels.forEach(function(label) {
labels[label.key] = label.value;
});
config.Labels = labels;

config.Volumes = getNames(config.Volumes);
config.SecurityOpts = getNames(config.SecurityOpts);
Expand Down
26 changes: 26 additions & 0 deletions app/components/startContainer/startcontainer.html
Original file line number Diff line number Diff line change
Expand Up @@ -148,6 +148,32 @@ <h3>Create And Start Container From Image</h3>
variable
</button>
</div>
<div class="form-group">
<label>Labels:</label>

<div ng-repeat="label in config.Labels">
<div class="form-group form-inline">
<div class="form-group">
<label class="sr-only">Key:</label>
<input type="text" ng-model="label.key" class="form-control"
placeholder="key"/>
</div>
<div class="form-group">
<label class="sr-only">Value:</label>
<input type="text" ng-model="label.value" class="form-control"
placeholder="value"/>
</div>
<div class="form-group">
<button class="btn btn-danger btn-xs form-control"
ng-click="rmEntry(config.Labels, label)">Remove
</button>
</div>
</div>
</div>
<button type="button" class="btn btn-success btn-sm"
ng-click="addEntry(config.Labels, {key: '', value: ''})">Add Label
</button>
</div>
</fieldset>
</accordion-group>
<accordion-group heading="HostConfig options" is-open="menuStatus.hostConfigOpen">
Expand Down
4 changes: 2 additions & 2 deletions app/shared/filters.js
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ angular.module('dockerui.filters', [])
'use strict';
return function (state) {
if (state === undefined) {
return '';
return 'label-default';
}

if (state.Ghost && state.Running) {
Expand All @@ -60,7 +60,7 @@ angular.module('dockerui.filters', [])
if (state.Running) {
return 'label-success';
}
return '';
return 'label-default';
};
})
.filter('humansize', function () {
Expand Down
2 changes: 1 addition & 1 deletion app/shared/services.js
Original file line number Diff line number Diff line change
Expand Up @@ -91,7 +91,7 @@ angular.module('dockerui.services', ['ngResource'])
},
insert: {method: 'POST', params: {id: '@id', action: 'insert'}},
push: {method: 'POST', params: {id: '@id', action: 'push'}},
tag: {method: 'POST', params: {id: '@id', action: 'tag', force: 0, repo: '@repo'}},
tag: {method: 'POST', params: {id: '@id', action: 'tag', force: 0, repo: '@repo', tag: '@tag'}},
remove: {method: 'DELETE', params: {id: '@id'}, isArray: true}
});
}])
Expand Down
37 changes: 37 additions & 0 deletions test/unit/app/components/startContainerController.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -111,6 +111,43 @@ describe('startContainerController', function () {
});
});

describe('Create and start a container with labels', function () {
it('should issue a correct create request to the Docker remote API', function () {
var controller = createController();
var id = '6abd8bfba81cf8a05a76a4bdefcb36c4b66cd02265f4bfcd0e236468696ebc6c';
var expectedBody = {
'name': 'container-name',
'Labels': {
"org.foo.bar": "Baz",
"com.biz.baz": "Boo"
}
};

expectGetContainers();

$httpBackend.expectPOST('dockerapi/containers/create?name=container-name', expectedBody).respond({
'Id': id,
'Warnings': null
});
$httpBackend.expectPOST('dockerapi/containers/' + id + '/start').respond({
'id': id,
'Warnings': null
});

scope.config.name = 'container-name';
scope.config.Labels = [{
key: 'org.foo.bar',
value: 'Baz'
}, {
key: 'com.biz.baz',
value: 'Boo'
}];

scope.create();
$httpBackend.flush();
});
});

describe('Create and start a container with volumesFrom', function () {
it('should issue a correct create request to the Docker remote API', function () {
var controller = createController();
Expand Down
4 changes: 2 additions & 2 deletions test/unit/app/shared/filters.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -73,8 +73,8 @@ describe('filters', function () {
});

describe('getstatelabel', function () {
it('should return an empty string when state is undefined', inject(function (getstatelabelFilter) {
expect(getstatelabelFilter(undefined)).toBe('');
it('should return default when state is undefined', inject(function (getstatelabelFilter) {
expect(getstatelabelFilter(undefined)).toBe('label-default');
}));

it('should return label-important when a ghost state is detected', inject(function (getstatelabelFilter) {
Expand Down

0 comments on commit d881d97

Please sign in to comment.