From a26ef466cfa3faf937e3fad53ce3952b25223fcd Mon Sep 17 00:00:00 2001
From: Sean Li <mail@shang.li>
Date: Wed, 4 Feb 2015 12:54:43 -0800
Subject: [PATCH] Fixed animation not syncing bug and added container icon.

---
 images/container-white.png     | Bin 128 -> 163 bytes
 images/container-white@2x.png  | Bin 193 -> 215 bytes
 images/container.png           | Bin 126 -> 158 bytes
 images/container@2x.png        | Bin 201 -> 228 bytes
 src/ContainerDetails.react.js  |   2 +-
 src/ContainerList.react.js     |   6 +++++-
 src/ContainerListItem.react.js |   5 +----
 src/NewContainer.react.js      |   2 +-
 styles/containers.less         |   2 +-
 9 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/images/container-white.png b/images/container-white.png
index 94fc0e6bad1efe20316fe6f079a47084c96519bf..e5b5b2149f1800dbf2575719cd31f69620790851 100644
GIT binary patch
delta 121
zcmV-<0EYj70iywsF>+l=L_t(I5$#ez3IHGo)9C+Su7;OIL6lwscT(Brl0*{T3uqhg
zny|ib6ILT7@M>sk({B?p0ZUFj2iY1j;kHi0+l#II@Eg{3hlmdF{M1ie{4pMQ>+mOg
b1AVCPb1X0Qu4O6M00000NkvXXu0mjfEVwk0

delta 86
zcmZ3?*uXf!(BI0_#WBP}FgZbjbxIq<<9dY!R|Hc2`katiwb5}M3*(GN0lCVWRl5tW
qI7Doj;NO41Kt?ID|Br=imlfk{bN%O2Eo_%D0D-5gpUXO@geCxanIK>Q

diff --git a/images/container-white@2x.png b/images/container-white@2x.png
index dc5fde9ef5ae0562e0705e5aa5aca4971d4afcd7..0b2c76efd550af9fd15090b89513abec74c41217 100644
GIT binary patch
delta 174
zcmV;f08#(J0oMVLF@KRsL_t(o3GJ6b3cw%?1WoDxzuekGE(=nlP!>A5gpg>rvmUfH
z0s;_#z`qH^)x#OV;VkaahQM8iA~(>p7(KH0MIL?M-r{qX&gc(w{cb<^(QHo;fofT`
zhG3PL&O=a%RBH%UiRnB9l}NRQV3nB8Pv2(V?uWa56_&NV#V5S#(yG;LZ?V0=Rr0KZ
c00dkJ+<KcFI;A5tt^fc407*qoM6N<$f(xutPXGV_

delta 152
zcmV;J0B8T#0l@)~F@JkWL_t(o3GLUh3cw%?gkj_Rzq8dLaCE#5J@C(BKu*G!E**nH
z009K<7O1r=nP4UlcV=V2uN$g<;QcMuuD(0xU-zt7x8U>$I%=9hP&J$$K}St92&#tD
zBj~7U20_(udITLc&BP1xSEuW8`uG*c59p|qK>&dyfd>qp91$u*5yY+l0000<MNUMn
GLSTY}(LvV$

diff --git a/images/container.png b/images/container.png
index b2ed8b5f9558c2663d2bcb6abf870d3ac732b1be..db6dc21e686cc628d2b9741d98b98aca6d9dd7d6 100644
GIT binary patch
delta 115
zcmV-(0F3{Bo&k_CZCFV}K~y*qV_+Bsl!gGK%8u9nDK!LHKNB*CYHW}zDRC*XeylD;
zRseD}AwIItuo{T0fK>LVfux2Qrh2M}Aq%D*3=DTXL>ZCA3GtED4w0;f?BwCk1^`Ny
VB@dOj<lO)O002ovPDHLkV1g3jE!+SA

delta 83
zcmbQoSU17Y*TU1qF~mYJIYEMTN*lxCQ+?O}Ynrk|+6x=CXXQ-Lo*3)JIscWOjOm0=
n6>^P<7A~9Qo)%h9@nK*Pzn~cJQZmJX0SG)@{an^LB{Ts5)yf>!

diff --git a/images/container@2x.png b/images/container@2x.png
index 82b02cb2c01e723e12f099fb296eaffea95e788a..0fbb4ac03b2f9c9ef0a99d053994e295669122e4 100644
GIT binary patch
delta 187
zcmV;s07U=E0ptOYF@K&(L_t(o3GJ7`34kyV1dZ5&9axMdTZ|o8gyQ3TEQnr$u;Ao#
z9Ct}Jvw0+4$AAC?An<PjWm>k~8A0zX?$n0BR)<O~pm%Yd$Ey}SU&g!r?JXYOQn@=}
z%x|s7IvVW>B2X>M<`B#h(|!mlk!%jZEHUkepc2XE5X=(O{xsLGnWy(*Yh8s!Zf`Na
py0EG?+FNWdu$DaYAOHau0tbL-9dPvL+^qlr002ovPDHLkV1n#LQ@{WK

delta 160
zcmV;R0AK&)0m%W7F@J+eL_t(o3GLUh4S+BZL(zmC*dW7XWQJh_h5)5-3QAMN5}(FJ
za_IC-Ln%B6Ab`NX1!_C4JDFfhUT*Bhf?pe|dcpf!Jo`S+#+_B?RIG;FM9`Jf9D<T?
z6G2x_a|lYpO$1#z%^@fWHxYE@G#4+(U!AIQGrr>Z1zmaO5E(!qMc@Ijy&1l%46>B~
O0000<MNUMnLSTZPz(ZmH

diff --git a/src/ContainerDetails.react.js b/src/ContainerDetails.react.js
index 182a96cff2..f20579462d 100644
--- a/src/ContainerDetails.react.js
+++ b/src/ContainerDetails.react.js
@@ -65,7 +65,7 @@ var ContainerDetails = React.createClass({
     this.setState({
       progress: ContainerStore.progress(this.getParams().name),
       env: ContainerUtil.env(container),
-      page: this.PAGE_LOGS
+      page: this.PAGE_HOME
     });
     var ports = ContainerUtil.ports(container);
     var webPorts = ['80', '8000', '8080', '3000', '5000', '2368'];
diff --git a/src/ContainerList.react.js b/src/ContainerList.react.js
index 3526d5a789..69f1be02c8 100644
--- a/src/ContainerList.react.js
+++ b/src/ContainerList.react.js
@@ -3,11 +3,15 @@ var ContainerListItem = require('./ContainerListItem.react');
 var ContainerListNewItem = require('./ContainerListNewItem.react');
 
 var ContainerList = React.createClass({
+  componentWillMount: function () {
+    this._start = Date.now();
+  },
   render: function () {
+    var self = this;
     var containers = this.props.containers.map(function (container) {
       console.log(container);
       return (
-        <ContainerListItem container={container} />
+        <ContainerListItem container={container} start={self._start}/>
       );
     });
     return (
diff --git a/src/ContainerListItem.react.js b/src/ContainerListItem.react.js
index d8b6348004..96baaa8b6e 100644
--- a/src/ContainerListItem.react.js
+++ b/src/ContainerListItem.react.js
@@ -7,9 +7,6 @@ var dialog = remote.require('dialog');
 var ContainerStore = require('./ContainerStore');
 
 var ContainerListItem = React.createClass({
-  componentWillMount: function () {
-    this._start = Date.now();
-  },
   handleItemMouseEnter: function () {
     var $action = $(this.getDOMNode()).find('.action');
     $action.show();
@@ -49,7 +46,7 @@ var ContainerListItem = React.createClass({
 
     // Synchronize all animations
     var style = {
-      WebkitAnimationDelay: (self._start - Date.now()) + 'ms'
+      WebkitAnimationDelay: (self.props.start - Date.now()) + 'ms'
     };
 
     var state;
diff --git a/src/NewContainer.react.js b/src/NewContainer.react.js
index 33e97d34a2..8f024f794d 100644
--- a/src/NewContainer.react.js
+++ b/src/NewContainer.react.js
@@ -98,7 +98,7 @@ var NewContainer = React.createClass({
   render: function () {
     var self = this;
     var title = this.state.query ? 'Results' : 'Recommended';
-    var data = this.state.results.slice(0, 7);
+    var data = this.state.results.slice(0, 6);
 
     var results;
     if (data.length) {
diff --git a/styles/containers.less b/styles/containers.less
index 57fcd49f6b..082a252e9c 100644
--- a/styles/containers.less
+++ b/styles/containers.less
@@ -121,7 +121,7 @@
 .new-container {
   padding: 35px 20px 32px 25px;
   .new-container-header {
-    margin-bottom: 20px;
+    margin-bottom: 28px;
     display: flex;
     flex: 1;
     .text {