Added module for container logs.

pull/2/head
Kevan Ahlquist 10 years ago
parent ca9355f617
commit b70b3f3100

@ -1,10 +1,11 @@
'use strict';
angular.module('dockerui', ['ngRoute', 'dockerui.services', 'dockerui.filters', 'masthead', 'footer', 'dashboard', 'container', 'containers', 'images', 'image', 'startContainer', 'sidebar', 'settings', 'builder'])
angular.module('dockerui', ['ngRoute', 'dockerui.services', 'dockerui.filters', 'masthead', 'footer', 'dashboard', 'container', 'containers', 'images', 'image', 'startContainer', 'sidebar', 'settings', 'builder', 'containerLogs'])
.config(['$routeProvider', function ($routeProvider) {
$routeProvider.when('/', {templateUrl: 'app/components/dashboard/dashboard.html', controller: 'DashboardController'});
$routeProvider.when('/containers/', {templateUrl: 'app/components/containers/containers.html', controller: 'ContainersController'});
$routeProvider.when('/containers/:id/', {templateUrl: 'app/components/container/container.html', controller: 'ContainerController'});
$routeProvider.when('/containers/:id/logs/', {templateUrl: 'app/components/containerLogs/containerlogs.html', controller: 'ContainerLogsController'});
$routeProvider.when('/images/', {templateUrl: 'app/components/images/images.html', controller: 'ImagesController'});
$routeProvider.when('/images/:id/', {templateUrl: 'app/components/image/image.html', controller: 'ImageController'});
$routeProvider.when('/settings', {templateUrl: 'app/components/settings/settings.html', controller: 'SettingsController'});

@ -99,6 +99,10 @@
<td>State:</td>
<td><span class="label {{ container.State|getstatelabel }}">{{ container.State|getstatetext }}</span></td>
</tr>
<tr>
<td>Logs:</td>
<td><a href="#/containers/{{ container.Id }}/logs">stdout/stderr</a></td>
</tr>
</tbody>
</table>

@ -4,6 +4,7 @@ function($scope, $routeParams, $location, Container, Messages, ViewSpinner) {
$scope.changes = [];
var update = function() {
ViewSpinner.spin();
Container.get({id: $routeParams.id}, function(d) {
$scope.container = d;
ViewSpinner.stop();

@ -0,0 +1,48 @@
angular.module('containerLogs', [])
.controller('ContainerLogsController', ['$scope', '$routeParams', '$location', '$anchorScroll', 'ContainerLogs', 'Container', 'ViewSpinner',
function($scope, $routeParams, $location, $anchorScroll, ContainerLogs, Container, ViewSpinner) {
$scope.stdout = '';
$scope.stderr = '';
$scope.showTimestamps = false;
ViewSpinner.spin();
Container.get({id: $routeParams.id}, function(d) {
$scope.container = d;
ViewSpinner.stop();
}, function(e) {
if (e.status === 404) {
Messages.error("Not found", "Container not found.");
} else {
Messages.error("Failure", e.data);
}
ViewSpinner.stop();
});
function getLogs() {
ContainerLogs.get($routeParams.id, {stdout: 1, stderr: 0, timestamps: $scope.showTimestamps}, function(data, status, headers, config) {
// Replace carriage returns twith newlines to clean up output
$scope.stdout = data.replace(/[\r]/g, '\n');
});
ContainerLogs.get($routeParams.id, {stdout: 0, stderr: 1}, function(data, status, headers, config) {
$scope.stderr = data.replace(/[\r]/g, '\n');
});
}
// initial call
getLogs();
var logIntervalId = window.setInterval(getLogs, 5000);
$scope.$on("$destroy", function(){
// clearing interval when view changes
clearInterval(logIntervalId);
});
$scope.scrollTo = function(id) {
$location.hash(id);
$anchorScroll();
}
$scope.toggleTimestamps = function() {
getLogs();
}
}]);

@ -0,0 +1,34 @@
<div class="row logs">
<div class="col-xs-12">
<h4>Logs for container: <a href="#/containers/{{ container.Id }}/">{{ container.Name }}</a></td></h4>
<div class="btn-group detail">
<button class="btn btn-info" ng-click="scrollTo('stdout')">stdout</button>
<button class="btn btn-warning" ng-click="scrollTo('stderr')">stderr</button>
</div>
<div class="pull-right">
<input id="timestampToggle" type="checkbox" ng-model="showTimestamps"
ng-change="toggleTimestamps()"/> <label for="timestampToggle">Display Timestamps</label>
</div>
</div>
<div class="col-xs-12">
<div class="panel panel-default">
<div class="panel-heading">
<h3 id="stdout" class="panel-title">STDOUT</h3>
</div>
<div class="panel-body">
<pre id="stdoutLog" class="pre-scrollable pre-x-scrollable">{{stdout}}</pre>
</div>
</div>
</div>
<div class="col-xs-12">
<div class="panel panel-default">
<div class="panel-heading">
<h3 id="stderr" class="panel-title">STDERR</h3>
</div>
<div class="panel-body">
<pre id="stderrLog" class="pre-scrollable pre-x-scrollable">{{stderr}}</pre>
</div>
</div>
</div>
</div>

@ -20,6 +20,19 @@ angular.module('dockerui.services', ['ngResource'])
remove: {method: 'DELETE', params: {id: '@id', v:0}}
});
})
.factory('ContainerLogs', function($resource, $http, Settings) {
return {
get: function(id, params, callback) {
$http({
method: 'GET',
url: Settings.url + '/containers/'+id+'/logs',
params: {'stdout': params.stdout || 0, 'stderr': params.stderr || 0, 'timestamps': params.timestamps || 0, 'tail': params.tail || 'all'}
}).success(callback).error(function(data, status, headers, config) {
console.log(error, data);
});
}
}
})
.factory('Image', function($resource, Settings) {
// Resource for docker images
// http://docs.docker.io/en/latest/api/docker_remote_api.html#images

@ -36,6 +36,7 @@ body {
.masthead .nav {
margin: 0;
margin: 0 0 2em 0;
width: 100%;
}
@ -120,3 +121,9 @@ body {
border-width: 0 0 0 1em;
padding: 0 0.3em;
}
pre.pre-x-scrollable {
max-height: 700px;
word-wrap: normal;
white-space: pre;
}

@ -41,6 +41,7 @@
<script src="app/components/dashboard/dashboardController.js"></script>
<script src="app/components/container/containerController.js"></script>
<script src="app/components/containers/containersController.js"></script>
<script src="app/components/containerLogs/containerLogsController.js"></script>
<script src="app/components/startContainer/startContainerController.js"></script>
<script src="app/components/image/imageController.js"></script>
<script src="app/components/images/imagesController.js"></script>

Loading…
Cancel
Save