storm-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From kishorvpa...@apache.org
Subject [01/10] storm git commit: Switched to more compact table layout, fixed issue with ff layout, and fixed tooltips.
Date Thu, 19 Mar 2015 20:18:04 GMT
Repository: storm
Updated Branches:
  refs/heads/master bb8d48da2 -> 645504dfa


Switched to more compact table layout, fixed issue with ff layout, and fixed tooltips.


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

Branch: refs/heads/master
Commit: b54b3b41e97b36dfea0d5cb3b887f23bbc29725e
Parents: 4271360
Author: Robert (Bobby) Evans <evans@yahoo-inc.com>
Authored: Wed Nov 26 12:27:15 2014 -0600
Committer: Robert (Bobby) Evans <evans@yahoo-inc.com>
Committed: Tue Feb 3 07:36:57 2015 -0600

----------------------------------------------------------------------
 storm-core/src/ui/public/component.html         |   7 +
 storm-core/src/ui/public/index.html             |   5 +
 storm-core/src/ui/public/js/script.js           |  11 +-
 .../templates/component-page-template.html      | 128 +++++++++----------
 .../public/templates/index-page-template.html   |  52 ++++----
 .../templates/topology-page-template.html       |  80 ++++++------
 .../src/ui/public/templates/user-template.html  |   2 +-
 storm-core/src/ui/public/topology.html          |   8 ++
 8 files changed, 153 insertions(+), 140 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/storm/blob/b54b3b41/storm-core/src/ui/public/component.html
----------------------------------------------------------------------
diff --git a/storm-core/src/ui/public/component.html b/storm-core/src/ui/public/component.html
index 8f8b774..a42c1a7 100644
--- a/storm-core/src/ui/public/component.html
+++ b/storm-core/src/ui/public/component.html
@@ -108,6 +108,7 @@ $(document).ready(function() {
         var uiUser = $("#ui-user");
         $.get("/templates/user-template.html", function(template) {
             uiUser.append(Mustache.render($(template).filter("#user-template").html(),response));
+            $('#ui-user [data-toggle="tooltip"]').tooltip()
         });
 
         var componentSummary = $("#component-summary");
@@ -195,6 +196,12 @@ $(document).ready(function() {
                 errorCells[i].style.borderBottomColor = "#9d261d";
               }
             }
+            $('#component-summary [data-toggle="tooltip"]').tooltip();
+            $('#component-stats-detail [data-toggle="tooltip"]').tooltip();
+            $('#component-input-stats [data-toggle="tooltip"]').tooltip();
+            $('#component-output-stats [data-toggle="tooltip"]').tooltip();
+            $('#component-executor-stats [data-toggle="tooltip"]').tooltip();
+            $('#component-errors [data-toggle="tooltip"]').tooltip();
         });
     });
 });

http://git-wip-us.apache.org/repos/asf/storm/blob/b54b3b41/storm-core/src/ui/public/index.html
----------------------------------------------------------------------
diff --git a/storm-core/src/ui/public/index.html b/storm-core/src/ui/public/index.html
index aa432ab..f991555 100644
--- a/storm-core/src/ui/public/index.html
+++ b/storm-core/src/ui/public/index.html
@@ -100,10 +100,12 @@ $(document).ready(function() {
     $.getJSON("/api/v1/cluster/summary",function(response,status,jqXHR) {
         $.get("/templates/user-template.html", function(template) {
             uiUser.append(Mustache.render($(template).filter("#user-template").html(),response));
+            $('#ui-user [data-toggle="tooltip"]').tooltip()
         });
 
         $.get("/templates/index-page-template.html", function(template) {
             clusterSummary.append(Mustache.render($(template).filter("#cluster-summary-template").html(),response));
+            $('#cluster-summary [data-toggle="tooltip"]').tooltip();
         });
     });
     $.getJSON("/api/v1/topology/summary",function(response,status,jqXHR) {
@@ -116,6 +118,7 @@ $(document).ready(function() {
               {type: "time-str", targets: [4]}
             ]
           });
+          $('#topology-summary [data-toggle="tooltip"]').tooltip();
       });
     });
     $.getJSON("/api/v1/supervisor/summary",function(response,status,jqXHR) {
@@ -128,6 +131,7 @@ $(document).ready(function() {
               {type: "time-str", targets: [2]}
             ]
           });
+          $('#supervisor-summary [data-toggle="tooltip"]').tooltip();
       });
     });
     $.getJSON("/api/v1/cluster/configuration",function(response,status,jqXHR) {
@@ -136,6 +140,7 @@ $(document).ready(function() {
         config.append(Mustache.render($(template).filter("#configuration-template").html(),formattedResponse));
         //key, value
         dtAutoPage("#nimbus-configuration-table", {});
+        $('#nimbus-configuration [data-toggle="tooltip"]').tooltip();
       });
     });
   });

http://git-wip-us.apache.org/repos/asf/storm/blob/b54b3b41/storm-core/src/ui/public/js/script.js
----------------------------------------------------------------------
diff --git a/storm-core/src/ui/public/js/script.js b/storm-core/src/ui/public/js/script.js
index c1cfdcd..25822f5 100644
--- a/storm-core/src/ui/public/js/script.js
+++ b/storm-core/src/ui/public/js/script.js
@@ -112,15 +112,8 @@ function confirmAction(id, name, action, wait, defaultWait) {
 }
 
 $(function () {
-    var placements = ['above', 'below', 'left', 'right'];
-    for (var i in placements) {
-      $('.tip.'+placements[i]).tooltip({
-          live: true,
-          placement: placements[i],
-          delayIn: 1000
-      });
-    }
-});
+  $('[data-toggle="tooltip"]').tooltip()
+})
 
 function formatConfigData(data) {
     var mustacheFormattedData = {'config':[]};

http://git-wip-us.apache.org/repos/asf/storm/blob/b54b3b41/storm-core/src/ui/public/templates/component-page-template.html
----------------------------------------------------------------------
diff --git a/storm-core/src/ui/public/templates/component-page-template.html b/storm-core/src/ui/public/templates/component-page-template.html
index 6ad4bc9..c27d95b 100644
--- a/storm-core/src/ui/public/templates/component-page-template.html
+++ b/storm-core/src/ui/public/templates/component-page-template.html
@@ -16,26 +16,26 @@
 -->
 <script id="component-summary-template" type="text/html">
   <h2>Component summary</h2>
-  <table class="table col-md-12">
+  <table class="table compact">
     <thead>
       <tr>
         <th>
-          <span class="tip right" title="The ID assigned to a the Component by the Topology.">
+          <span data-toggle="tooltip" data-placement="right" title="The ID assigned to a the Component by the Topology.">
             Id
           </span>
         </th>
         <th>
-          <span class="tip above" title="The name given to the topology by when it was submitted. Click the name to view the Topology's information.">
+          <span data-toggle="tooltip" data-placement="above" title="The name given to the topology by when it was submitted. Click the name to view the Topology's information.">
             Topology
           </span>
         </th>
         <th>
-          <span class="tip above" title="Executors are threads in a Worker process.">
+          <span data-toggle="tooltip" data-placement="above" title="Executors are threads in a Worker process.">
             Executors
           </span>
         </th>
         <th>
-          <span class="tip above" title="A Task is an instance of a Bolt or Spout. The number of Tasks is almost always equal to the number of Executors.">
+          <span data-toggle="tooltip" data-placement="above" title="A Task is an instance of a Bolt or Spout. The number of Tasks is almost always equal to the number of Executors.">
             Tasks
           </span>
         </th>
@@ -52,36 +52,36 @@
 </script>
 <script id="spout-stats-detail-template" type="text/html">
   <h2>Spout stats</h2>
-  <table class="table table-striped col-md-12" id="spout-stats-table">
+  <table class="table table-striped compact" id="spout-stats-table">
     <thead>
       <tr>
         <th class="header headerSortDown">
-          <span class="tip right" title="The past period of time for which the statistics apply. Click on a value to set the window for this page.">
+          <span data-toggle="tooltip" data-placement="right" title="The past period of time for which the statistics apply. Click on a value to set the window for this page.">
             Window
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of Tuples emitted.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Tuples emitted.">
             Emitted
           </span>
         </th>
         <th class="header">
-          <span data-original-title="The number of Tuples emitted that sent to one or more bolts." class="tip above">
+          <span data-original-title="The number of Tuples emitted that sent to one or more bolts." data-toggle="tooltip" data-placement="above">
             Transferred
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The average time a Tuple &quot;tree&quot; takes to be completely processed by the Topology. A value of 0 is expected if no acking is done.">
+          <span data-toggle="tooltip" data-placement="above" title="The average time a Tuple &quot;tree&quot; takes to be completely processed by the Topology. A value of 0 is expected if no acking is done.">
             Complete latency (ms)
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of Tuple &quot;trees&quot; successfully processed. A value of 0 is expected if no acking is done.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Tuple &quot;trees&quot; successfully processed. A value of 0 is expected if no acking is done.">
             Acked
           </span>
         </th>
         <th class="header">
-          <span data-original-title="The number of Tuple &quot;trees&quot; that were explicitly failed or timed out before acking was completed. A value of 0 is expected if no acking is done." class="tip left">
+          <span data-original-title="The number of Tuple &quot;trees&quot; that were explicitly failed or timed out before acking was completed. A value of 0 is expected if no acking is done." data-toggle="tooltip" data-placement="left">
             Failed
           </span>
         </th>
@@ -103,36 +103,36 @@
 </script>
 <script id="output-stats-template" type="text/html">
   <h2>Output stats ({{windowHint}})</h2>
-  <table class="table table-striped col-md-12" id="output-stats-table">
+  <table class="table table-striped compact" id="output-stats-table">
     <thead>
       <tr>
         <th class="header headerSortDown">
-          <span data-original-title="The name of the Tuple stream given in the Topolgy, or &quot;default&quot; if none was given." class="tip right">
+          <span data-original-title="The name of the Tuple stream given in the Topolgy, or &quot;default&quot; if none was given." data-toggle="tooltip" data-placement="right">
             Stream
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of Tuples emitted.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Tuples emitted.">
             Emitted
           </span>
         </th>
         <th class="header">
-          <span data-original-title="The number of Tuples emitted that sent to one or more bolts." class="tip above">
+          <span data-original-title="The number of Tuples emitted that sent to one or more bolts." data-toggle="tooltip" data-placement="above">
             Transferred
           </span>
         </th>
         <th class="header">
-          <span data-original-title="The average time a Tuple &quot;tree&quot; takes to be completely processed by the Topology. A value of 0 is expected if no acking is done." class="tip above">
+          <span data-original-title="The average time a Tuple &quot;tree&quot; takes to be completely processed by the Topology. A value of 0 is expected if no acking is done." data-toggle="tooltip" data-placement="above">
             Complete latency (ms)
           </span>
         </th>
         <th class="header">
-          <span data-original-title="The number of Tuple &quot;trees&quot; successfully processed. A value of 0 is expected if no acking is done." class="tip above">
+          <span data-original-title="The number of Tuple &quot;trees&quot; successfully processed. A value of 0 is expected if no acking is done." data-toggle="tooltip" data-placement="above">
             Acked
           </span>
         </th>
         <th class="header">
-          <span data-original-title="The number of Tuple &quot;trees&quot; that were explicitly failed or timed out before acking was completed. A value of 0 is expected if no acking is done." class="tip left">
+          <span data-original-title="The number of Tuple &quot;trees&quot; that were explicitly failed or timed out before acking was completed. A value of 0 is expected if no acking is done." data-toggle="tooltip" data-placement="left">
             Failed
           </span>
         </th>
@@ -154,51 +154,51 @@
 </script>
 <script id="executor-stats-template" type="text/html">
   <h2>Executors ({{windowHint}})</h2>
-  <table class="table table-striped col-md-12" id="executor-stats-table">
+  <table class="table table-striped compact" id="executor-stats-table">
     <thead>
       <tr>
         <th class="header headerSortDown">
-          <span class="tip right" title="The unique executor ID.">
+          <span data-toggle="tooltip" data-placement="right" title="The unique executor ID.">
             Id
           </span>
         </th>
         <th class="header">
-          <span class="tip right" title="The length of time an Executor (thread) has been alive.">
+          <span data-toggle="tooltip" data-placement="right" title="The length of time an Executor (thread) has been alive.">
             Uptime
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The hostname reported by the remote host. (Note that this hostname is not the result of a reverse lookup at the Nimbus node.)">
+          <span data-toggle="tooltip" data-placement="above" title="The hostname reported by the remote host. (Note that this hostname is not the result of a reverse lookup at the Nimbus node.)">
             Host
           </span>
         </th>
         <th class="header">
-          <span data-original-title="The port number used by the Worker to which an Executor is assigned. Click on the port number to open the logviewer page for this Worker." class="tip above">
+          <span data-original-title="The port number used by the Worker to which an Executor is assigned. Click on the port number to open the logviewer page for this Worker." data-toggle="tooltip" data-placement="above">
             Port
           </span>
         </th>
         <th class="header">
-          <span data-original-title="The number of Tuples emitted." class="tip above">
+          <span data-original-title="The number of Tuples emitted." data-toggle="tooltip" data-placement="above">
             Emitted
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of Tuples emitted that sent to one or more bolts.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Tuples emitted that sent to one or more bolts.">
             Transferred
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The average time a Tuple &quot;tree&quot; takes to be completely processed by the Topology. A value of 0 is expected if no acking is done.">
+          <span data-toggle="tooltip" data-placement="above" title="The average time a Tuple &quot;tree&quot; takes to be completely processed by the Topology. A value of 0 is expected if no acking is done.">
             Complete latency (ms)
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of Tuple &quot;trees&quot; successfully processed. A value of 0 is expected if no acking is done.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Tuple &quot;trees&quot; successfully processed. A value of 0 is expected if no acking is done.">
             Acked
           </span>
         </th>
         <th class="header">
-          <span data-original-title="The number of Tuple &quot;trees&quot; that were explicitly failed or timed out before acking was completed. A value of 0 is expected if no acking is done." class="tip left">
+          <span data-original-title="The number of Tuple &quot;trees&quot; that were explicitly failed or timed out before acking was completed. A value of 0 is expected if no acking is done." data-toggle="tooltip" data-placement="left">
             Failed
           </span>
         </th>
@@ -223,46 +223,46 @@
 </script>
 <script id="bolt-stats-template" type="text/html">
   <h2>Bolt stats</h2>
-  <table class="table table-striped col-md-12" id="bolt-stats-table">
+  <table class="table table-striped compact" id="bolt-stats-table">
     <thead>
       <tr>
         <th class="header headerSortDown">
-          <span class="tip right" title="The past period of time for which the statistics apply. Click on a value to set the window for this page.">
+          <span data-toggle="tooltip" data-placement="right" title="The past period of time for which the statistics apply. Click on a value to set the window for this page.">
             Window
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of Tuples emitted.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Tuples emitted.">
             Emitted
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of Tuples emitted that sent to one or more bolts.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Tuples emitted that sent to one or more bolts.">
             Transferred
           </span>
         </th>
         <th class="header">
-          <span data-original-title="The average time a Tuple spends in the execute method. The execute method may complete without sending an Ack for the tuple." class="tip above">
+          <span data-original-title="The average time a Tuple spends in the execute method. The execute method may complete without sending an Ack for the tuple." data-toggle="tooltip" data-placement="above">
             Execute latency (ms)
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of incoming Tuples processed.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of incoming Tuples processed.">
             Executed
           </span>
         </th>
         <th class="header">
-          <span data-original-title="The average time it takes to Ack a Tuple after it is first received.  Bolts that join, aggregate or batch may not Ack a tuple until a number of other Tuples have been received." class="tip above">
+          <span data-original-title="The average time it takes to Ack a Tuple after it is first received.  Bolts that join, aggregate or batch may not Ack a tuple until a number of other Tuples have been received." data-toggle="tooltip" data-placement="above">
             Process latency (ms)
           </span>
         </th>
         <th class="header">
-          <span data-original-title="The number of Tuples acknowledged by this Bolt." class="tip above">
+          <span data-original-title="The number of Tuples acknowledged by this Bolt." data-toggle="tooltip" data-placement="above">
             Acked
           </span>
         </th>
         <th class="header">
-          <span data-original-title="The number of tuples Failed by this Bolt." class="tip left">
+          <span data-original-title="The number of tuples Failed by this Bolt." data-toggle="tooltip" data-placement="left">
             Failed
           </span>
         </th>
@@ -286,41 +286,41 @@
 </script>
 <script id="bolt-input-stats-template" type="text/html">
   <h2>Input stats ({{windowHint}})</h2>
-  <table class="table table-striped col-md-12" id="bolt-input-stats-table">
+  <table class="table table-striped compact" id="bolt-input-stats-table">
     <thead>
       <tr>
         <th class="header headerSortDown">
-          <span class="tip right" title="The ID assigned to a the Component by the Topology.">
+          <span data-toggle="tooltip" data-placement="right" title="The ID assigned to a the Component by the Topology.">
             Component
           </span>
         </th>
         <th class="header">
-          <span class="tip right" title="The name of the Tuple stream given in the Topolgy, or &quot;default&quot; if none was given.">
+          <span data-toggle="tooltip" data-placement="right" title="The name of the Tuple stream given in the Topolgy, or &quot;default&quot; if none was given.">
             Stream
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The average time a Tuple spends in the execute method. The execute method may complete without sending an Ack for the tuple.">
+          <span data-toggle="tooltip" data-placement="above" title="The average time a Tuple spends in the execute method. The execute method may complete without sending an Ack for the tuple.">
             Execute latency (ms)
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of incoming Tuples processed.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of incoming Tuples processed.">
             Executed
           </span>
         </th>
         <th class="header">
-          <span data-original-title="The average time it takes to Ack a Tuple after it is first received.  Bolts that join, aggregate or batch may not Ack a tuple until a number of other Tuples have been received." class="tip above">
+          <span data-original-title="The average time it takes to Ack a Tuple after it is first received.  Bolts that join, aggregate or batch may not Ack a tuple until a number of other Tuples have been received." data-toggle="tooltip" data-placement="above">
             Process latency (ms)
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of Tuples acknowledged by this Bolt.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Tuples acknowledged by this Bolt.">
             Acked
           </span>
         </th>
         <th class="header">
-          <span data-original-title="The number of tuples Failed by this Bolt." class="tip left">
+          <span data-original-title="The number of tuples Failed by this Bolt." data-toggle="tooltip" data-placement="left">
             Failed
           </span>
         </th>
@@ -343,21 +343,21 @@
 </script>
 <script id="bolt-output-stats-template" type="text/html">
   <h2>Output stats ({{windowHint}})</h2>
-  <table class="table table-striped col-md-12" id="bolt-output-stats-table">
+  <table class="table table-striped compact" id="bolt-output-stats-table">
     <thead>
       <tr>
         <th class="header headerSortDown">
-          <span class="tip right" title="The name of the Tuple stream given in the Topolgy, or &quot;default&quot; if none was given.">
+          <span data-toggle="tooltip" data-placement="right" title="The name of the Tuple stream given in the Topolgy, or &quot;default&quot; if none was given.">
             Stream
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of Tuples emitted.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Tuples emitted.">
             Emitted
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of Tuples emitted that sent to one or more bolts.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Tuples emitted that sent to one or more bolts.">
             Transferred
           </span>
         </th>
@@ -376,66 +376,66 @@
 </script>
 <script id="bolt-executor-template" type="text/html">
   <h2>Executors</h2>
-  <table class="table table-striped col-md-12" id="bolt-executor-table">
+  <table class="table table-striped compact" id="bolt-executor-table">
     <thead>
       <tr>
         <th class="header headerSortDown">
-          <span class="tip right" title="The unique executor ID.">
+          <span data-toggle="tooltip" data-placement="right" title="The unique executor ID.">
             Id
           </span>
         </th>
         <th class="header">
-          <span data-original-title="The length of time an Executor (thread) has been alive." class="tip right">
+          <span data-original-title="The length of time an Executor (thread) has been alive." data-toggle="tooltip" data-placement="right">
             Uptime
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The hostname reported by the remote host. (Note that this hostname is not the result of a reverse lookup at the Nimbus node.)">
+          <span data-toggle="tooltip" data-placement="above" title="The hostname reported by the remote host. (Note that this hostname is not the result of a reverse lookup at the Nimbus node.)">
             Host
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The port number used by the Worker to which an Executor is assigned. Click on the port number to open the logviewer page for this Worker.">
+          <span data-toggle="tooltip" data-placement="above" title="The port number used by the Worker to which an Executor is assigned. Click on the port number to open the logviewer page for this Worker.">
             Port
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of Tuples emitted.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Tuples emitted.">
             Emitted
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of Tuples emitted that sent to one or more bolts.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Tuples emitted that sent to one or more bolts.">
             Transferred
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="If this is around 1.0, the corresponding Bolt is running as fast as it can, so you may want to increase the Bolt's parallelism. This is (number executed * average execute latency) / measurement time.">
+          <span data-toggle="tooltip" data-placement="above" title="If this is around 1.0, the corresponding Bolt is running as fast as it can, so you may want to increase the Bolt's parallelism. This is (number executed * average execute latency) / measurement time.">
             Capacity (last 10m)
           </span>
         </th>
         <th class="header">
-          <span data-original-title="The average time a Tuple spends in the execute method. The execute method may complete without sending an Ack for the tuple." class="tip above">
+          <span data-original-title="The average time a Tuple spends in the execute method. The execute method may complete without sending an Ack for the tuple." data-toggle="tooltip" data-placement="above">
             Execute latency (ms)
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of incoming Tuples processed.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of incoming Tuples processed.">
             Executed
           </span>
         </th>
         <th class="header">
-          <span data-original-title="The average time it takes to Ack a Tuple after it is first received.  Bolts that join, aggregate or batch may not Ack a tuple until a number of other Tuples have been received." class="tip above">
+          <span data-original-title="The average time it takes to Ack a Tuple after it is first received.  Bolts that join, aggregate or batch may not Ack a tuple until a number of other Tuples have been received." data-toggle="tooltip" data-placement="above">
             Process latency (ms)
           </span>
         </th>
         <th class="header">
-          <span data-original-title="The number of Tuples acknowledged by this Bolt." class="tip above">
+          <span data-original-title="The number of Tuples acknowledged by this Bolt." data-toggle="tooltip" data-placement="above">
             Acked
           </span>
         </th>
         <th class="header">
-          <span data-original-title="The number of tuples Failed by this Bolt." class="tip left">
+          <span data-original-title="The number of tuples Failed by this Bolt." data-toggle="tooltip" data-placement="left">
             Failed
           </span>
         </th>
@@ -463,7 +463,7 @@
 </script>
 <script id="component-errors-template" type="text/html">
   <h2>Errors</h2>
-  <table class="table table-striped col-md-12" id="component-errors-table">
+  <table class="table table-striped compact" id="component-errors-table">
     <thead>
       <tr>
         <th>Time</th>

http://git-wip-us.apache.org/repos/asf/storm/blob/b54b3b41/storm-core/src/ui/public/templates/index-page-template.html
----------------------------------------------------------------------
diff --git a/storm-core/src/ui/public/templates/index-page-template.html b/storm-core/src/ui/public/templates/index-page-template.html
index df3088e..298dfff 100644
--- a/storm-core/src/ui/public/templates/index-page-template.html
+++ b/storm-core/src/ui/public/templates/index-page-template.html
@@ -15,46 +15,46 @@
  limitations under the License.
 -->
 <script id="cluster-summary-template" type="text/html">
-<table id="cluster-summary-table" class="table col-md-12">
+<table id="cluster-summary-table" class="table compact">
   <thead>
     <tr>
       <th>
-        <span class="tip right" title="The version of storm installed on the UI node. (Hopefully, this is the same on all storm nodes!)">
+        <span data-toggle="tooltip" data-placement="right" title="The version of storm installed on the UI node. (Hopefully, this is the same on all storm nodes!)">
           Version
         </span>
       </th>
       <th>
-        <span class="tip right" title="The duration the current Nimbus instance has been running. (Note that the storm cluster may have been deployed and available for a much longer period than the current Nimbus process has been running.)">
+        <span data-toggle="tooltip" data-placement="right" title="The duration the current Nimbus instance has been running. (Note that the storm cluster may have been deployed and available for a much longer period than the current Nimbus process has been running.)">
           Nimbus uptime
         </span>
       </th>
       <th>
-        <span class="tip above" title="The number of nodes in the cluster currently.">
+        <span data-toggle="tooltip" data-placement="above" title="The number of nodes in the cluster currently.">
           Supervisors
       </span>
       </th>
       <th>
-        <span class="tip above" title="Slots are Workers (processes).">
+        <span data-toggle="tooltip" data-placement="above" title="Slots are Workers (processes).">
           Used slots
       </span>
       </th>
       <th>
-        <span class="tip above" title="Slots are Workers (processes).">
+        <span data-toggle="tooltip" data-placement="above" title="Slots are Workers (processes).">
           Free slots
       </span>
       </th>
       <th>
-        <span class="tip above" title="Slots are Workers (processes).">
+        <span data-toggle="tooltip" data-placement="above" title="Slots are Workers (processes).">
           Total slots
       </span>
       </th>
       <th>
-        <span class="tip above" title="Executors are threads in a Worker process.">
+        <span data-toggle="tooltip" data-placement="above" title="Executors are threads in a Worker process.">
           Executors
       </span>
       </th>
       <th>
-        <span class="tip left" title="A Task is an instance of a Bolt or Spout. The number of Tasks is almost always equal to the number of Executors.">
+        <span data-toggle="tooltip" data-placement="left" title="A Task is an instance of a Bolt or Spout. The number of Tasks is almost always equal to the number of Executors.">
           Tasks
         </span>
       </th>
@@ -75,51 +75,51 @@
 </table>
 </script>
 <script id="topology-summary-template" type="text/html">
-  <table class="table table-striped col-md-12" id="topology-summary-table">
+  <table class="table table-striped compact" id="topology-summary-table">
     <thead>
       <tr>
         <th>
-          <span class="tip right" title="The name given to the topology by when it was submitted. Click the name to view the Topology's information.">
+          <span data-toggle="tooltip" data-placement="right" title="The name given to the topology by when it was submitted. Click the name to view the Topology's information.">
             Name
           </span>
         </th>
         <th>
-          <span class="tip right" title="The unique ID given to a Topology each time it is launched.">
+          <span data-toggle="tooltip" data-placement="right" title="The unique ID given to a Topology each time it is launched.">
             Id
           </span>
         </th>
         <th>
-          <span class="tip above" title="The user that submitted the Topology, if authentication is enabled.">
+          <span data-toggle="tooltip" data-placement="above" title="The user that submitted the Topology, if authentication is enabled.">
             Owner
           </span>
         </th>
         <th>
-          <span class="tip above" title="The status can be one of ACTIVE, INACTIVE, KILLED, or REBALANCING.">
+          <span data-toggle="tooltip" data-placement="above" title="The status can be one of ACTIVE, INACTIVE, KILLED, or REBALANCING.">
             Status
           </span>
         </th>
         <th>
-          <span class="tip above" title="The time since the Topology was submitted.">
+          <span data-toggle="tooltip" data-placement="above" title="The time since the Topology was submitted.">
             Uptime
           </span>
         </th>
         <th>
-          <span class="tip above" title="The number of Workers (processes).">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Workers (processes).">
             Num workers
           </span>
         </th>
         <th>
-          <span class="tip above" title="Executors are threads in a Worker process.">
+          <span data-toggle="tooltip" data-placement="above" title="Executors are threads in a Worker process.">
             Num executors
           </span>
         </th>
         <th>
-          <span class="tip above" title="A Task is an instance of a Bolt or Spout. The number of Tasks is almost always equal to the number of Executors.">
+          <span data-toggle="tooltip" data-placement="above" title="A Task is an instance of a Bolt or Spout. The number of Tasks is almost always equal to the number of Executors.">
             Num tasks
           </span>
         </th>
         <th>
-          <span class="tip left" title="This shows information from the scheduler about the latest attempt to schedule the Topology on the cluster.">
+          <span data-toggle="tooltip" data-placement="left" title="This shows information from the scheduler about the latest attempt to schedule the Topology on the cluster.">
             Scheduler Info
           </span>
         </th>
@@ -143,31 +143,31 @@
   </table>
 </script>
 <script id="supervisor-summary-template" type="text/html">
-<table class="table table-striped col-md-12" id="supervisor-summary-table">
+<table class="table table-striped compact" id="supervisor-summary-table">
   <thead>
     <tr>
       <th>
-        <span class="tip right" title="A unique identifier given to a Supervisor when it joins the cluster.">
+        <span data-toggle="tooltip" data-placement="right" title="A unique identifier given to a Supervisor when it joins the cluster.">
           Id
         </span>
       </th>
       <th>
-        <span class="tip above" title="The hostname reported by the remote host. (Note that this hostname is not the result of a reverse lookup at the Nimbus node.)">
+        <span data-toggle="tooltip" data-placement="above" title="The hostname reported by the remote host. (Note that this hostname is not the result of a reverse lookup at the Nimbus node.)">
           Host
         </span>
       </th>
       <th>
-        <span class="tip above" title="The length of time a Supervisor has been registered to the cluster.">
+        <span data-toggle="tooltip" data-placement="above" title="The length of time a Supervisor has been registered to the cluster.">
           Uptime
         </span>
       </th>
       <th>
-        <span class="tip above" title="Slots are Workers (processes).">
+        <span data-toggle="tooltip" data-placement="above" title="Slots are Workers (processes).">
           Slots
         </span>
       </th>
       <th>
-        <span class="tip left" title="Slots are Workers (processes).">
+        <span data-toggle="tooltip" data-placement="left" title="Slots are Workers (processes).">
           Used slots
         </span>
       </th>
@@ -188,7 +188,7 @@
 </script>
 
 <script id="configuration-template" type="text/html">
-  <table class="table table-striped col-md-12" id="nimbus-configuration-table">
+  <table class="table table-striped compact" id="nimbus-configuration-table">
     <thead>
       <tr>
         <th>Key</th>

http://git-wip-us.apache.org/repos/asf/storm/blob/b54b3b41/storm-core/src/ui/public/templates/topology-page-template.html
----------------------------------------------------------------------
diff --git a/storm-core/src/ui/public/templates/topology-page-template.html b/storm-core/src/ui/public/templates/topology-page-template.html
index cb5caa0..ddf89b7 100644
--- a/storm-core/src/ui/public/templates/topology-page-template.html
+++ b/storm-core/src/ui/public/templates/topology-page-template.html
@@ -15,51 +15,51 @@
  limitations under the License.
 -->
 <script id="topology-summary-template" type="text/html">
-  <table id="topology-summary-table" class="table col-md-12">
+  <table id="topology-summary-table" class="table compact">
     <thead>
       <tr>
         <th>
-          <span class="tip right" title="The name given to the topology by when it was submitted.">
+          <span data-toggle="tooltip" data-placement="right" title="The name given to the topology by when it was submitted.">
             Name
           </span>
         </th>
         <th>
-          <span class="tip right" title="The unique ID given to a Topology each time it is launched.">
+          <span data-toggle="tooltip" data-placement="right" title="The unique ID given to a Topology each time it is launched.">
             Id
           </span>
         </th>
         <th>
-          <span class="tip above" title="The user that submitted the Topology, if authentication is enabled.">
+          <span data-toggle="tooltip" data-placement="above" title="The user that submitted the Topology, if authentication is enabled.">
             Owner
           </span>
         </th>
         <th>
-          <span class="tip above" title="The status can be one of ACTIVE, INACTIVE, KILLED, or REBALANCING.">
+          <span data-toggle="tooltip" data-placement="above" title="The status can be one of ACTIVE, INACTIVE, KILLED, or REBALANCING.">
             Status
           </span>
         </th>
         <th>
-          <span class="tip above" title="The time since the Topology was submitted.">
+          <span data-toggle="tooltip" data-placement="above" title="The time since the Topology was submitted.">
             Uptime
           </span>
         </th>
         <th>
-          <span class="tip above" title="The number of Workers (processes).">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Workers (processes).">
             Num workers
           </span>
         </th>
         <th>
-          <span class="tip above" title="Executors are threads in a Worker process.">
+          <span data-toggle="tooltip" data-placement="above" title="Executors are threads in a Worker process.">
             Num executors
           </span>
         </th>
         <th>
-          <span class="tip above" title="A Task is an instance of a Bolt or Spout. The number of Tasks is almost always equal to the number of Executors.">
+          <span data-toggle="tooltip" data-placement="above" title="A Task is an instance of a Bolt or Spout. The number of Tasks is almost always equal to the number of Executors.">
             Num tasks
           </span>
         </th>
         <th>
-          <span class="tip left" title="This shows information from the scheduler about the latest attempt to schedule the Topology on the cluster.">
+          <span data-toggle="tooltip" data-placement="left" title="This shows information from the scheduler about the latest attempt to schedule the Topology on the cluster.">
             Scheduler Info
           </span>
         </th>
@@ -82,36 +82,36 @@
 </script>
 <script id="topology-stats-template" type="text/html">
   <h2>Topology stats</h2>
-  <table class="table table-striped col-md-12" id="topology-stats-table">
+  <table class="table table-striped compact" id="topology-stats-table">
     <thead>
       <tr>
         <th>
-          <span class="tip right" title="The past period of time for which the statistics apply. Click on a value to set the window for this page.">
+          <span data-toggle="tooltip" data-placement="right" title="The past period of time for which the statistics apply. Click on a value to set the window for this page.">
             Window
           </span>
         </th>
         <th>
-          <span class="tip above" title="The number of Tuples emitted.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Tuples emitted.">
             Emitted
           </span>
         </th>
         <th>
-          <span class="tip above" title="The number of Tuples emitted that sent to one or more bolts.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Tuples emitted that sent to one or more bolts.">
             Transferred
           </span>
         </th>
         <th>
-          <span class="tip above" title="The average time a Tuple &quot;tree&quot; takes to be completely processed by the Topology. A value of 0 is expected if no acking is done.">
+          <span data-toggle="tooltip" data-placement="above" title="The average time a Tuple &quot;tree&quot; takes to be completely processed by the Topology. A value of 0 is expected if no acking is done.">
             Complete latency (ms)
           </span>
         </th>
         <th>
-          <span class="tip above" title="The number of Tuple &quot;trees&quot; successfully processed. A value of 0 is expected if no acking is done.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Tuple &quot;trees&quot; successfully processed. A value of 0 is expected if no acking is done.">
             Acked
           </span>
         </th>
         <th>
-          <span class="tip left" title="The number of Tuple &quot;trees&quot; that were explicitly failed or timed out before acking was completed. A value of 0 is expected if no acking is done.">
+          <span data-toggle="tooltip" data-placement="left" title="The number of Tuple &quot;trees&quot; that were explicitly failed or timed out before acking was completed. A value of 0 is expected if no acking is done.">
             Failed
           </span>
         </th>
@@ -137,7 +137,7 @@
   <p>
     <div id="visualization-container" style="display:none;">
       <p>
-        <table class="table table-striped">
+        <table class="table table-striped compact">
           <thead>
             <tr>
               <th class="header" colspan=4>
@@ -164,7 +164,7 @@
 
 <script id="topology-configuration-template" type="text/html">
   <h2>Topology Configuration</h2>
-  <table class="table table-striped col-md-12" id="topology-configuration-table"><thead><tr><th>Key</th><th>Value</th></tr></thead>
+  <table class="table table-striped compact" id="topology-configuration-table"><thead><tr><th>Key</th><th>Value</th></tr></thead>
     <tbody>
       {{#config}}
       <tr>
@@ -177,46 +177,46 @@
 </script>
 <script id="spout-stats-template" type="text/html">
   <h2>Spouts ({{windowHint}})</h2>
-  <table class="table table-striped col-md-12" id="spout-stats-table">
+  <table class="table table-striped compact" id="spout-stats-table">
     <thead>
       <tr>
         <th class="header headerSortDown">
-          <span data-original-title="The ID assigned to a the Component by the Topology. Click on the name to view the Component's page." class="tip right">
+          <span data-original-title="The ID assigned to a the Component by the Topology. Click on the name to view the Component's page." data-toggle="tooltip" data-placement="right">
             Id
           </span>
         </th>
         <th class="header">
-          <span data-original-title="Executors are threads in a Worker process." class="tip right">
+          <span data-original-title="Executors are threads in a Worker process." data-toggle="tooltip" data-placement="right">
             Executors
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="A Task is an instance of a Bolt or Spout. The number of Tasks is almost always equal to the number of Executors.">
+          <span data-toggle="tooltip" data-placement="above" title="A Task is an instance of a Bolt or Spout. The number of Tasks is almost always equal to the number of Executors.">
             Tasks
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of Tuples emitted.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Tuples emitted.">
             Emitted
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of Tuples emitted that sent to one or more bolts.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Tuples emitted that sent to one or more bolts.">
             Transferred
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The average time a Tuple &quot;tree&quot; takes to be completely processed by the Topology. A value of 0 is expected if no acking is done.">
+          <span data-toggle="tooltip" data-placement="above" title="The average time a Tuple &quot;tree&quot; takes to be completely processed by the Topology. A value of 0 is expected if no acking is done.">
             Complete latency (ms)
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of Tuple &quot;trees&quot; successfully processed. A value of 0 is expected if no acking is done.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Tuple &quot;trees&quot; successfully processed. A value of 0 is expected if no acking is done.">
             Acked
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of Tuple &quot;trees&quot; that were explicitly failed or timed out before acking was completed. A value of 0 is expected if no acking is done.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Tuple &quot;trees&quot; that were explicitly failed or timed out before acking was completed. A value of 0 is expected if no acking is done.">
             Failed
           </span>
         </th>
@@ -250,60 +250,60 @@
 </script>
 <script id="bolt-stats-template" type="text/html">
   <h2>Bolts ({{windowHint}})</h2>
-  <table class="table table-striped col-md-12" id="bolt-stats-table"><thead>
+  <table class="table table-striped compact" id="bolt-stats-table"><thead>
       <tr>
         <th class="header headerSortDown">
-          <span class="tip right" title="The ID assigned to a the Component by the Topology. Click on the name to view the Component's page.">
+          <span data-toggle="tooltip" data-placement="right" title="The ID assigned to a the Component by the Topology. Click on the name to view the Component's page.">
             Id
           </span>
         </th>
         <th class="header">
-          <span data-original-title="Executors are threads in a Worker process." class="tip right">
+          <span data-original-title="Executors are threads in a Worker process." data-toggle="tooltip" data-placement="right">
             Executors
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="A Task is an instance of a Bolt or Spout. The number of Tasks is almost always equal to the number of Executors.">
+          <span data-toggle="tooltip" data-placement="above" title="A Task is an instance of a Bolt or Spout. The number of Tasks is almost always equal to the number of Executors.">
             Tasks
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of Tuples emitted.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Tuples emitted.">
             Emitted
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of Tuples emitted that sent to one or more bolts.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Tuples emitted that sent to one or more bolts.">
             Transferred
           </span>
         </th>
         <th class="header">
-          <span data-original-title="If this is around 1.0, the corresponding Bolt is running as fast as it can, so you may want to increase the Bolt's parallelism. This is (number executed * average execute latency) / measurement time." class="tip above">
+          <span data-original-title="If this is around 1.0, the corresponding Bolt is running as fast as it can, so you may want to increase the Bolt's parallelism. This is (number executed * average execute latency) / measurement time." data-toggle="tooltip" data-placement="above">
             Capacity (last 10m)
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The average time a Tuple spends in the execute method. The execute method may complete without sending an Ack for the tuple.">
+          <span data-toggle="tooltip" data-placement="above" title="The average time a Tuple spends in the execute method. The execute method may complete without sending an Ack for the tuple.">
             Execute latency (ms)
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of incoming Tuples processed.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of incoming Tuples processed.">
             Executed
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The average time it takes to Ack a Tuple after it is first received.  Bolts that join, aggregate or batch may not Ack a tuple until a number of other Tuples have been received.">
+          <span data-toggle="tooltip" data-placement="above" title="The average time it takes to Ack a Tuple after it is first received.  Bolts that join, aggregate or batch may not Ack a tuple until a number of other Tuples have been received.">
             Process latency (ms)
           </span>
         </th>
         <th class="header">
-          <span class="tip above" title="The number of Tuples acknowledged by this Bolt.">
+          <span data-toggle="tooltip" data-placement="above" title="The number of Tuples acknowledged by this Bolt.">
             Acked
           </span>
         </th>
         <th class="header">
-          <span class="tip left" title="The number of tuples Failed by this Bolt.">
+          <span data-toggle="tooltip" data-placement="left" title="The number of tuples Failed by this Bolt.">
             Failed
           </span>
         </th>

http://git-wip-us.apache.org/repos/asf/storm/blob/b54b3b41/storm-core/src/ui/public/templates/user-template.html
----------------------------------------------------------------------
diff --git a/storm-core/src/ui/public/templates/user-template.html b/storm-core/src/ui/public/templates/user-template.html
index 9c0c5d8..4fa1338 100644
--- a/storm-core/src/ui/public/templates/user-template.html
+++ b/storm-core/src/ui/public/templates/user-template.html
@@ -17,7 +17,7 @@
 <script id="user-template" type="text/html">
  {{#user}}
   <div class="ui-user"><p>
-    <span class="tip below" data-original-title="This should be you.">
+    <span data-toggle="tooltip" data-placement="below" data-original-title="This should be you.">
             User: {{user}}
     </span>
   </p></div>

http://git-wip-us.apache.org/repos/asf/storm/blob/b54b3b41/storm-core/src/ui/public/topology.html
----------------------------------------------------------------------
diff --git a/storm-core/src/ui/public/topology.html b/storm-core/src/ui/public/topology.html
index ca12deb..315862c 100644
--- a/storm-core/src/ui/public/topology.html
+++ b/storm-core/src/ui/public/topology.html
@@ -122,6 +122,7 @@ $(document).ready(function() {
         var uiUser = $("#ui-user");
         $.get("/templates/user-template.html", function(template) {
             uiUser.append(Mustache.render($(template).filter("#user-template").html(),response));
+            $('#ui-user [data-toggle="tooltip"]').tooltip();
         });
 
         var antiForgeryToken = $("#anti-forgery-token");
@@ -185,6 +186,13 @@ $(document).ready(function() {
                 errorCells[i].style.borderBottomColor = "#9d261d";
               }
             }
+            $('#topology-summary [data-toggle="tooltip"]').tooltip();
+            $('#topology-stats [data-toggle="tooltip"]').tooltip();
+            $('#spout-stats [data-toggle="tooltip"]').tooltip();
+            $('#bolt-stats [data-toggle="tooltip"]').tooltip();
+            $('#topology-configuration [data-toggle="tooltip"]').tooltip();
+            $('#topology-actions [data-toggle="tooltip"]').tooltip();
+            $('#topology-visualization [data-toggle="tooltip"]').tooltip();
         });
     });
  });


Mime
View raw message