diff --git a/src/components/ContainerHome.react.js b/src/components/ContainerHome.react.js
index bcc2f07f25..4a9d7618ea 100644
--- a/src/components/ContainerHome.react.js
+++ b/src/components/ContainerHome.react.js
@@ -52,8 +52,7 @@ var ContainerHome = React.createClass({
);
} else if (this.props.container && this.props.container.State.Downloading) {
if (this.props.container.Progress !== undefined) {
-
- let fields = [];
+
let values = [];
let sum = 0.0;
@@ -65,15 +64,15 @@ var ContainerHome = React.createClass({
sum = sum / this.props.container.Progress.amount;
- fields.push(
-
Downloading Image
- {fields}
+
+
Downloading Image
+
{Math.round(sum*100)/100}%
+
+
- );
+
+ );
} else if (this.props.container.State.Waiting) {
body = (
diff --git a/src/components/ContainerProgress.react.js b/src/components/ContainerProgress.react.js
index 722f98b9d7..175fb4d72a 100644
--- a/src/components/ContainerProgress.react.js
+++ b/src/components/ContainerProgress.react.js
@@ -22,16 +22,16 @@ var ContainerProgress = React.createClass({
return (
);
diff --git a/src/utils/DockerUtil.js b/src/utils/DockerUtil.js
index f5315de6b9..f46b0be808 100644
--- a/src/utils/DockerUtil.js
+++ b/src/utils/DockerUtil.js
@@ -374,11 +374,11 @@ export default {
return r;
}, {});
-
+
let layersToLoad = _.keys(layerProgress).length;
- console.log("nbLayers:" + layersToLoad)
+ console.log("nbLayers:" + layersToLoad);
// Split the loading in a few columns for more feedback
let columns = {};
@@ -388,7 +388,7 @@ export default {
for (let i = 0; i < columns.amount; i++)
{
- let layerAmount = Math.ceil(layersToLoad / (columns.amount - i))
+ let layerAmount = Math.ceil(layersToLoad / (columns.amount - i));
layersToLoad -= layerAmount;
columns.progress[i] = { layerIDs:[], nbLayers:0 , maxLayers:layerAmount , value:0.0 };
}
@@ -397,7 +397,7 @@ export default {
// scheduled to inform about progression at given interval
let tick = null;
-
+
// data is associated with one layer only (can be identified with id)
stream.on('data', str => {
@@ -413,12 +413,14 @@ export default {
}
if (data.status === 'Already exists') {
-
+
+ console.log("Already exists.");
+
//layerProgress[data.id].current = 1;
//layerProgress[data.id].total = 1;
} else if (data.status === 'Downloading') {
-
+
// aduermael: How total could be <= 0 ?
// if (data.progressDetail.total <= 0) {
@@ -434,13 +436,13 @@ export default {
{
// test if we can still add layers to that column
if (columns.progress[columns.toFill].nbLayers == columns.progress[columns.toFill].maxLayers) columns.toFill++;
-
+
layerProgress[data.id].column = columns.toFill;
columns.progress[columns.toFill].layerIDs.push(data.id);
columns.progress[columns.toFill].nbLayers++;
}
-
+
//}
if (!tick) {
@@ -451,7 +453,7 @@ export default {
for (let i = 0; i < columns.amount; i++)
{
columns.progress[i].value = 0.0;
-
+
// Start only if the column has accurate values for all layers
if (columns.progress[i].nbLayers == columns.progress[i].maxLayers)
{
@@ -459,7 +461,7 @@ export default {
let totalSum = 0;
let currentSum = 0;
- for (let j = 0; j < columns.progress[i].nbLayers; j++)
+ for (let j = 0; j < columns.progress[i].nbLayers; j++)
{
layer = layerProgress[columns.progress[i].layerIDs[j]];
totalSum += layer.total;
diff --git a/styles/container-progress.less b/styles/container-progress.less
index a8bf96613a..a8e616b22d 100644
--- a/styles/container-progress.less
+++ b/styles/container-progress.less
@@ -1,4 +1,14 @@
+.container-progress-wrapper {
+ margin-left: 37%;
+}
+
.container-progress {
+ display: inline-block;
+ position: relative;
+ min-width: 100px;
+ max-width: 100px;
+ min-height: 100px;
+ max-height: 100px;
width: 100px;
height: 100px;
border: 4px solid @brand-primary;
diff --git a/styles/right-panel.less b/styles/right-panel.less
index a72f14a9d0..5472b925dc 100644
--- a/styles/right-panel.less
+++ b/styles/right-panel.less
@@ -126,10 +126,10 @@
}
.details-progress {
margin: 20% auto 0;
- text-align: center;
width: 400px;
h2 {
margin-bottom: 20px;
+ text-align: center;
}
}
.details-panel {