diff --git a/js/app.js b/js/app.js index 3af297767..6dc3ce96b 100644 --- a/js/app.js +++ b/js/app.js @@ -14,5 +14,5 @@ angular.module('dockerui', ['dockerui.services', 'dockerui.filters']) // You need to set this to the api endpoint without the port i.e. http://192.168.1.9 .constant('DOCKER_ENDPOINT', '/dockerapi') .constant('DOCKER_PORT', '') // Docker port, leave as an empty string if no port is requred. If you have a port, prefix it with a ':' i.e. :4243 - .constant('UI_VERSION', 'v0.2.5') + .constant('UI_VERSION', 'v0.3') .constant('DOCKER_API_VERSION', 'v1.4'); diff --git a/js/controllers.js b/js/controllers.js index 2ef0bd4d1..7d9db5a52 100644 --- a/js/controllers.js +++ b/js/controllers.js @@ -3,16 +3,74 @@ function MastheadController($scope) { $scope.template = 'partials/masthead.html'; } -function DashboardController($scope, Container, Settings) { +function newLineChart(id, data, getkey) { + var chart = getChart(id); + var map = {}; + + for (var i = 0; i < data.length; i++) { + var c = data[i]; + var key = getkey(c); + + var count = map[key]; + if (count === undefined) { + count = 0; + } + count += 1; + map[key] = 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 + }; + chart.Line({ + labels: labels, + datasets: [dataset] + }, + { + scaleStepWidth: 1, + pointDotRadius:1, + scaleOverride: true, + scaleSteps: labels.length + }); +} + +function DashboardController($scope, Container, Image, Settings) { $scope.predicate = '-Created'; $scope.containers = []; + + var getStarted = function(data) { + $scope.totalContainers = data.length; + newLineChart('#containers-started-chart', data, function(c) { return new Date(c.Created * 1000).toLocaleDateString(); }); + var s = $scope; + Image.query({}, function(d) { + s.totalImages = d.length; + newLineChart('#images-created-chart', d, function(c) { return new Date(c.Created * 1000).toLocaleDateString(); }); + }); + }; + var opts = {animation:false}; if (Settings.firstLoad) { + $('#stats').hide(); opts.animation = true; Settings.firstLoad = false; $('#masthead').show(); + setTimeout(function() { $('#masthead').slideUp('slow'); + $('#stats').slideDown('slow'); }, 5000); } @@ -34,6 +92,8 @@ function DashboardController($scope, Container, Settings) { } } + getStarted(d); + var c = getChart('#containers-chart'); var data = [ { @@ -320,49 +380,7 @@ function ImageController($scope, $q, $routeParams, $location, Image, Container, 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 - }); + newLineChart('#containers-started-chart', containers, function(c) { return new Date(c.Created * 1000).toLocaleDateString(); }); }); } }, function(e) { diff --git a/partials/dashboard.html b/partials/dashboard.html index 18ae5a509..63602e608 100644 --- a/partials/dashboard.html +++ b/partials/dashboard.html @@ -10,7 +10,7 @@ Learn more. - +

Running Containers

@@ -22,10 +22,27 @@
+

Status

Get a better broswer... Your holding everyone back.
+ + +
+
+

Containers created

+ + Get a better broswer... Your holding everyone back. + +

{{ totalContainers }}

+
+

Images created

+ + Get a better broswer... Your holding everyone back. + +

{{ totalImages }}

+