You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@mesos.apache.org by ss...@apache.org on 2013/07/26 19:29:45 UTC

git commit: Simplify left bar tables for all templates

Updated Branches:
  refs/heads/master 9b9d9e8e6 -> 4281336bd


Simplify left bar tables for all templates

* Un-bold text in the left bar that is not important to let other
  pieces of the UI be more prominent.
* Right-align number values to more easily see the difference in a
  column of numbers.
* Remove top/bottom padding from .well and .table to save vertical
  space.

Review: http://reviews.apache.org/r/12829


Project: http://git-wip-us.apache.org/repos/asf/mesos/repo
Commit: http://git-wip-us.apache.org/repos/asf/mesos/commit/4281336b
Tree: http://git-wip-us.apache.org/repos/asf/mesos/tree/4281336b
Diff: http://git-wip-us.apache.org/repos/asf/mesos/diff/4281336b

Branch: refs/heads/master
Commit: 4281336bd6fe5d281d1b7b48b22438b13746ab42
Parents: 9b9d9e8
Author: Ross Allen <re...@gmail.com>
Authored: Fri Jul 19 15:35:07 2013 -0700
Committer: Ross Allen <re...@gmail.com>
Committed: Fri Jul 26 10:28:44 2013 -0700

----------------------------------------------------------------------
 src/webui/master/static/css/mesos.css        | 13 +++++
 src/webui/master/static/home.html            | 68 +++++++++++------------
 src/webui/master/static/slave.html           | 44 ++++++++-------
 src/webui/master/static/slave_executor.html  | 39 ++++++++-----
 src/webui/master/static/slave_framework.html | 39 ++++++++-----
 5 files changed, 121 insertions(+), 82 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/mesos/blob/4281336b/src/webui/master/static/css/mesos.css
----------------------------------------------------------------------
diff --git a/src/webui/master/static/css/mesos.css b/src/webui/master/static/css/mesos.css
index 38b225b..26c5ee7 100644
--- a/src/webui/master/static/css/mesos.css
+++ b/src/webui/master/static/css/mesos.css
@@ -80,3 +80,16 @@ th.unselected:after {
 a.badge-type:hover {
   text-decoration: underline;
 }
+
+.table .text-right {
+  text-align: right;
+}
+
+.well .inline:first-child {
+  margin-top: 0;
+}
+
+.well .inline:last-child,
+.well .table:last-child {
+  margin-bottom: 0;
+}

http://git-wip-us.apache.org/repos/asf/mesos/blob/4281336b/src/webui/master/static/home.html
----------------------------------------------------------------------
diff --git a/src/webui/master/static/home.html b/src/webui/master/static/home.html
index 409b17d..4f9e2d9 100644
--- a/src/webui/master/static/home.html
+++ b/src/webui/master/static/home.html
@@ -50,80 +50,80 @@
 
       <p><a href="" ng-click="log($event)">LOG</a></p>
 
-      <h3>Slaves</h3>
+      <h4>Slaves</h4>
       <table class="table table-condensed">
         <tbody>
           <tr>
-            <th>Activated</th>
-            <td>{{activated_slaves | number}}</td>
+            <td>Activated</td>
+            <td class="text-right">{{activated_slaves | number}}</td>
           </tr>
           <tr>
-            <th>Deactivated</th>
-            <td>{{deactivated_slaves | number}}</td>
+            <td>Deactivated</td>
+            <td class="text-right">{{deactivated_slaves | number}}</td>
           </tr>
         </tbody>
       </table>
 
-      <h3>Tasks</h3>
+      <h4>Tasks</h4>
       <table class="table table-condensed">
 
         <tbody>
           <tr>
-            <th>Staged</th>
-            <td>{{staged_tasks | number}}</td>
+            <td>Staged</td>
+            <td class="text-right">{{staged_tasks | number}}</td>
           </tr>
           <tr>
-            <th>Started</th>
-            <td>{{started_tasks | number}}</td>
+            <td>Started</td>
+            <td class="text-right">{{started_tasks | number}}</td>
           </tr>
           <tr>
-            <th>Finished</th>
-            <td>{{finished_tasks | number}}</td>
+            <td>Finished</td>
+            <td class="text-right">{{finished_tasks | number}}</td>
           </tr>
           <tr>
-            <th>Killed</th>
-            <td>{{killed_tasks | number}}</td>
+            <td>Killed</td>
+            <td class="text-right">{{killed_tasks | number}}</td>
           </tr>
           <tr>
-            <th>Failed</th>
-            <td>{{failed_tasks | number}}</td>
+            <td>Failed</td>
+            <td class="text-right">{{failed_tasks | number}}</td>
           </tr>
           <tr>
-            <th>Lost</th>
-            <td>{{lost_tasks | number}}</td>
+            <td>Lost</td>
+            <td class="text-right">{{lost_tasks | number}}</td>
           </tr>
         </tbody>
       </table>
 
-      <h3>Resources</h3>
+      <h4>Resources</h4>
       <table class="table table-condensed">
         <thead>
           <tr>
-            <th></th>
-            <th>CPUs</th>
-            <th>Mem</th>
+            <td></td>
+            <td class="text-right">CPUs</td>
+            <td class="text-right">Mem</td>
           </tr>
         </thead>
         <tbody>
           <tr>
-            <th>Total</th>
-            <td>{{total_cpus | number}}</td>
-            <td>{{total_mem * (1024 * 1024) | dataSize}}</td>
+            <td>Total</td>
+            <td class="text-right">{{total_cpus | number}}</td>
+            <td class="text-right">{{total_mem * (1024 * 1024) | dataSize}}</td>
           </tr>
           <tr>
-            <th>Used</th>
-            <td>{{used_cpus | number}}</td>
-            <td>{{used_mem * (1024 * 1024) | dataSize}}</td>
+            <td>Used</td>
+            <td class="text-right">{{used_cpus | number}}</td>
+            <td class="text-right">{{used_mem * (1024 * 1024) | dataSize}}</td>
           </tr>
           <tr>
-            <th>Offered</th>
-            <td>{{offered_cpus | number}}</td>
-            <td>{{offered_mem * (1024 * 1024) | dataSize}}</td>
+            <td>Offered</td>
+            <td class="text-right">{{offered_cpus | number}}</td>
+            <td class="text-right">{{offered_mem * (1024 * 1024) | dataSize}}</td>
           </tr>
           <tr>
-            <th>Idle</th>
-            <td>{{idle_cpus | number}}</td>
-            <td>{{idle_mem * (1024 * 1024) | dataSize}}</td>
+            <td>Idle</td>
+            <td class="text-right">{{idle_cpus | number}}</td>
+            <td class="text-right">{{idle_mem * (1024 * 1024) | dataSize}}</td>
           </tr>
         </tbody>
       </table>

http://git-wip-us.apache.org/repos/asf/mesos/blob/4281336b/src/webui/master/static/slave.html
----------------------------------------------------------------------
diff --git a/src/webui/master/static/slave.html b/src/webui/master/static/slave.html
index 36645df..f0d30d7 100644
--- a/src/webui/master/static/slave.html
+++ b/src/webui/master/static/slave.html
@@ -62,50 +62,54 @@
       </dl>
       <p><a href="" ng-click="log($event)">LOG</a></p>
 
-      <h3>Tasks</h3>
+      <h4>Tasks</h4>
       <table class="table table-condensed">
         <tbody>
           <tr>
-            <th>Staged</th>
-            <td>{{state.staged_tasks | number}}</td>
+            <td>Staged</td>
+            <td class="text-right">{{state.staged_tasks | number}}</td>
           </tr>
           <tr>
-            <th>Started</th>
-            <td>{{state.started_tasks | number}}</td>
+            <td>Started</td>
+            <td class="text-right">{{state.started_tasks | number}}</td>
           </tr>
           <tr>
-            <th>Finished</th>
-            <td>{{state.finished_tasks | number}}</td>
+            <td>Finished</td>
+            <td class="text-right">{{state.finished_tasks | number}}</td>
           </tr>
           <tr>
-            <th>Killed</th>
-            <td>{{state.killed_tasks | number}}</td>
+            <td>Killed</td>
+            <td class="text-right">{{state.killed_tasks | number}}</td>
           </tr>
           <tr>
-            <th>Failed</th>
-            <td>{{state.failed_tasks | number}}</td>
+            <td>Failed</td>
+            <td class="text-right">{{state.failed_tasks | number}}</td>
           </tr>
           <tr>
-            <th>Lost</th>
-            <td>{{state.lost_tasks | number}}</td>
+            <td>Lost</td>
+            <td class="text-right">{{state.lost_tasks | number}}</td>
           </tr>
         </tbody>
       </table>
 
-      <h3>Resources</h3>
+      <h4>Resources</h4>
       <table class="table table-condensed">
         <tbody>
           <tr>
-            <th>CPUs</th>
-            <td>{{state.resources.cpus | number}}</td>
+            <td>CPUs</td>
+            <td class="text-right">{{state.resources.cpus | number}}</td>
           </tr>
           <tr>
-            <th>Memory</th>
-            <td>{{state.resources.mem * (1024 * 1024) | dataSize}}</td>
+            <td>Memory</td>
+            <td class="text-right">
+              {{state.resources.mem * (1024 * 1024) | dataSize}}
+            </td>
           </tr>
           <tr>
-            <th>Disk</th>
-            <td>{{state.resources.disk * (1024 * 1024) | dataSize}}</td>
+            <td>Disk</td>
+            <td class="text-right">
+              {{state.resources.disk * (1024 * 1024) | dataSize}}
+            </td>
           </tr>
         </tbody>
       </table>

http://git-wip-us.apache.org/repos/asf/mesos/blob/4281336b/src/webui/master/static/slave_executor.html
----------------------------------------------------------------------
diff --git a/src/webui/master/static/slave_executor.html b/src/webui/master/static/slave_executor.html
index c2c9528..1e43aff 100644
--- a/src/webui/master/static/slave_executor.html
+++ b/src/webui/master/static/slave_executor.html
@@ -54,27 +54,38 @@
         <dd>{{executor.tasks.length | number}}</dd>
       </dl>
 
-      <h3>Resources</h3>
+      <h4>Resources</h4>
       <table class="table table-condensed">
+        <thead>
+          <tr>
+            <td></td>
+            <td class="text-right">Used</td>
+            <td class="text-right">Allocated</td>
+          </tr>
+        </thead>
         <tbody>
-          <th>
-            <td>Used</td>
-            <td>Allocated</td>
-          </th>
           <tr>
-            <th>CPUs</th>
-            <td>{{monitor[framework.id][executor.id].resource_usage.cpu_usage | number}}</td>
-            <td>{{executor.resources.cpus | number}}</td>
+            <td>CPUs</td>
+            <td class="text-right">
+              {{monitor[framework.id][executor.id].resource_usage.cpu_usage | number}}
+            </td>
+            <td class="text-right">{{executor.resources.cpus | number}}</td>
           </tr>
           <tr>
-            <th>Mem</th>
-            <td>{{monitor[framework.id][executor.id].resource_usage.memory_rss | dataSize}}</td>
-            <td>{{executor.resources.mem * (1024 * 1024) | dataSize}}</td>
+            <td>Mem</td>
+            <td class="text-right">
+              {{monitor[framework.id][executor.id].resource_usage.memory_rss | dataSize}}
+            </td>
+            <td class="text-right">
+              {{executor.resources.mem * (1024 * 1024) | dataSize}}
+            </td>
           </tr>
           <tr>
-            <th>Disk</th>
-            <td></td>
-            <td>{{executor.resources.disk * (1024 * 1024) | dataSize}}</td>
+            <td>Disk</td>
+            <td class="text-right">-</td>
+            <td class="text-right">
+              {{(executor.resources.disk || 0) * (1024 * 1024) | dataSize}}
+            </td>
           </tr>
         </tbody>
       </table>

http://git-wip-us.apache.org/repos/asf/mesos/blob/4281336b/src/webui/master/static/slave_framework.html
----------------------------------------------------------------------
diff --git a/src/webui/master/static/slave_framework.html b/src/webui/master/static/slave_framework.html
index d97684e..0df5c04 100644
--- a/src/webui/master/static/slave_framework.html
+++ b/src/webui/master/static/slave_framework.html
@@ -32,27 +32,38 @@
         <dd>{{framework.num_tasks | number}}</dd>
       </dl>
 
-      <h3>Resources</h3>
+      <h4>Resources</h4>
       <table class="table table-condensed">
+        <thead>
+          <tr>
+            <td></td>
+            <td class="text-right">Used</td>
+            <td class="text-right">Allocated</td>
+          </tr>
+        </thead>
         <tbody>
-          <th>
-            <td>Used</td>
-            <td>Allocated</td>
-          </th>
           <tr>
-            <th>CPUs</th>
-            <td>{{framework.resource_usage.cpu_usage | number}}</td>
-            <td>{{framework.cpus | number}}</td>
+            <td>CPUs</td>
+            <td class="text-right">
+              {{framework.resource_usage.cpu_usage | number}}
+            </td>
+            <td class="text-right">{{framework.cpus | number}}</td>
           </tr>
           <tr>
-            <th>Memory</th>
-            <td>{{framework.resource_usage.memory_rss | dataSize}}</td>
-            <td>{{framework.mem * (1024 * 1024) | dataSize}}</td>
+            <td>Memory</td>
+            <td class="text-right">
+              {{framework.resource_usage.memory_rss | dataSize}}
+            </td>
+            <td class="text-right">
+              {{framework.mem * (1024 * 1024) | dataSize}}
+            </td>
           </tr>
           <tr>
-            <th>Disk</th>
-            <td></td>
-            <td>{{framework.disk * (1024 * 1024) | dataSize}}</td>
+            <td>Disk</td>
+            <td class="text-right">-</td>
+            <td class="text-right">
+              {{(framework.disk || 0) * (1024 * 1024) | dataSize}}
+            </td>
           </tr>
         </tbody>
       </table>