From 5ff3e2872c5ef0633be7a3d84741a9edab554427 Mon Sep 17 00:00:00 2001
From: Michael Crosby <crosby.michael@gmail.com>
Date: Mon, 10 Jun 2013 16:56:14 -0900
Subject: [PATCH] Update home page with dashboard partials

---
 css/app.css             |  9 +++++++++
 index.html              | 11 ++++++-----
 js/app.js               |  2 +-
 js/controllers.js       | 10 ++++++++++
 partials/dashboard.html | 20 +++++++++++++-------
 partials/masthead.html  |  4 ++--
 partials/sidebar.html   | 11 +++++++++++
 7 files changed, 52 insertions(+), 15 deletions(-)
 create mode 100644 partials/sidebar.html

diff --git a/css/app.css b/css/app.css
index 62c986b38..af14914a9 100644
--- a/css/app.css
+++ b/css/app.css
@@ -75,6 +75,11 @@
     margin: 0 auto;
   }
 
+  .center {
+    width: 80%;
+    margin: 0 auto;
+  }
+
  .btn-remove {
     margin: 0 auto;
     max-width: 70%;
@@ -83,3 +88,7 @@
   .actions {
     margin: 0 auto;
   }
+
+  .container-bottom {
+      height: 50px;
+  }
diff --git a/index.html b/index.html
index 8b90de659..1c0f4b445 100644
--- a/index.html
+++ b/index.html
@@ -29,15 +29,16 @@
 
     <div class="container">
 
-    <div ng-include="template" ng-controller="MastheadController" ></div>
-    <div id="view" ng-view>
+        <div ng-include="template" ng-controller="MastheadController" ></div>
+        <div id="view" ng-view>
 
     </div>
-     <div class="footer">
-        <p>Created by:<a href="http://crosbymichael.com">Michael Crosby</a></p>
+    <div class="container-bottom"></div>
+     <div class="footer center well">
+        <p>Created by: <a href="http://crosbymichael.com">crosbymichael</a></p>
     </div>
 
-    </div> <!-- /container -->
+    </div> 
 
     <script src="../assets/js/jquery.js"></script>
     <script src="../assets/js/bootstrap-transition.js"></script>
diff --git a/js/app.js b/js/app.js
index 758716650..3d58e29f6 100644
--- a/js/app.js
+++ b/js/app.js
@@ -2,7 +2,7 @@
 
 angular.module('dockerui', ['dockerui.services', 'dockerui.filters'])
     .config(['$routeProvider', function ($routeProvider) {
-        $routeProvider.when('/', {templateUrl: 'partials/home.html', controller: 'DashboardController'});
+        $routeProvider.when('/', {templateUrl: 'partials/dashboard.html', controller: 'DashboardController'});
         $routeProvider.when('/containers/', {templateUrl: 'partials/containers.html', controller: 'ContainersController'});
         $routeProvider.when('/containers/:id/', {templateUrl: 'partials/container.html', controller: 'ContainerController'});
         $routeProvider.when('/images/', {templateUrl: 'partials/images.html', controller: 'ImagesController'});
diff --git a/js/controllers.js b/js/controllers.js
index c2ff40c05..b391b748e 100644
--- a/js/controllers.js
+++ b/js/controllers.js
@@ -37,6 +37,16 @@ function DashboardController($scope, Container) {
     
 }
 
+function SideBarController($scope, Container, Settings) {
+    $scope.template = 'partials/sidebar.html';
+    $scope.containers = [];
+    $scope.endpoint = Settings.endpoint;
+
+    Container.query({all: 0}, function(d) {
+        $scope.containers = d;    
+    }); 
+}
+
 function SettingsController($scope, Auth, System, Docker, Settings) {
     $scope.auth = {};
     $scope.info = {};
diff --git a/partials/dashboard.html b/partials/dashboard.html
index 2afb6f24e..637460e30 100644
--- a/partials/dashboard.html
+++ b/partials/dashboard.html
@@ -1,7 +1,13 @@
-  <div class="jumbotron">
-    <h1>DockerUI</h1>
-    <p class="lead">The Linux container engine</p>
-    <a class="btn btn-large btn-success" href="http://docker.io">Learn more.</a>
-  </div>
-
-  <hr>
+ 
+<div class="row-fluid">
+    <!--<div class="sidebar span4">
+        <div ng-include="template" ng-controller="SideBarController"></div>
+    </div>-->
+    <div class="span12">
+        <div class="jumbotron">
+            <h1>DockerUI</h1>
+            <p class="lead">The Linux container engine</p>
+                <a class="btn btn-large btn-success" href="http://docker.io">Learn more.</a>
+          </div>
+    </div>
+</div>
diff --git a/partials/masthead.html b/partials/masthead.html
index 39946d641..7835148d5 100644
--- a/partials/masthead.html
+++ b/partials/masthead.html
@@ -4,12 +4,12 @@
       <div class="navbar-inner">
         <div class="container">
           <ul class="nav">
-            <li class="{{ hclass }}" ng-click="linkChange('home')"><a href="#">Home</a></li>
+            <li class="{{ hclass }}" ng-click="linkChange('home')"><a href="#">Dashboard</a></li>
             <li class="{{ cclass }}" ng-click="linkChange('containers')"><a href="/#/containers/">Containers</a></li>
             <li class="{{ iclass }}" ng-click="linkChange('images')"><a href="/#/images/">Images</a></li>
             <li class="{{ sclass }}" ng-click="linkChange('settings')"><a href="/#/settings/">Settings</a></li>
           </ul>
         </div>
       </div>
-    </div><!-- /.navbar -->
+    </div>
   </div>
diff --git a/partials/sidebar.html b/partials/sidebar.html
new file mode 100644
index 000000000..1e4d3de0e
--- /dev/null
+++ b/partials/sidebar.html
@@ -0,0 +1,11 @@
+<div class="well">
+    <strong>Running containers:</strong>
+    <br />
+    <strong>Endpoint: </strong>{{ endpoint }}
+    <ul>
+        <li ng-repeat="container in containers">
+            <a href="/#/containers/{{ container.Id }}/">{{ container.Id|truncate:20 }}</a>
+            <span class="pull-right label label-{{ container.Status|statusbadge }}">{{ container.Status }}</span>   
+        </li>
+    </ul>
+</div>