Repository: spark
Updated Branches:
  refs/heads/master 0da254fb2 -> bec938f77


[SPARK-7589] [STREAMING] [WEBUI] Make "Input Rate" in the Streaming page 
consistent with other pages

This PR makes "Input Rate" in the Streaming page consistent with Job and Stage 
pages.

![screen shot 2015-05-12 at 5 03 35 
pm](https://cloud.githubusercontent.com/assets/1000778/7601444/f943f8ac-f8ca-11e4-8280-a715d814f434.png)
![screen shot 2015-05-12 at 5 07 25 
pm](https://cloud.githubusercontent.com/assets/1000778/7601445/f9571c0c-f8ca-11e4-9b12-9317cb55c002.png)

Author: zsxwing <[email protected]>

Closes #6102 from zsxwing/SPARK-7589 and squashes the following commits:

2745225 [zsxwing] Make "Input Rate" in the Streaming page consistent with other 
pages


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

Branch: refs/heads/master
Commit: bec938f777a2e18757c7d04504d86a5342e2b49e
Parents: 0da254f
Author: zsxwing <[email protected]>
Authored: Wed May 13 10:01:26 2015 -0700
Committer: Tathagata Das <[email protected]>
Committed: Wed May 13 10:01:26 2015 -0700

----------------------------------------------------------------------
 .../apache/spark/ui/static/streaming-page.css   |  4 +++
 .../apache/spark/ui/static/streaming-page.js    | 18 ++++++++++---
 .../spark/streaming/ui/StreamingPage.scala      | 27 +++++++++-----------
 3 files changed, 30 insertions(+), 19 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/spark/blob/bec938f7/core/src/main/resources/org/apache/spark/ui/static/streaming-page.css
----------------------------------------------------------------------
diff --git 
a/core/src/main/resources/org/apache/spark/ui/static/streaming-page.css 
b/core/src/main/resources/org/apache/spark/ui/static/streaming-page.css
index 5da9d63..19abe88 100644
--- a/core/src/main/resources/org/apache/spark/ui/static/streaming-page.css
+++ b/core/src/main/resources/org/apache/spark/ui/static/streaming-page.css
@@ -56,3 +56,7 @@
 .histogram {
   width: auto;
 }
+
+span.expand-input-rate {
+  cursor: pointer;
+}

http://git-wip-us.apache.org/repos/asf/spark/blob/bec938f7/core/src/main/resources/org/apache/spark/ui/static/streaming-page.js
----------------------------------------------------------------------
diff --git 
a/core/src/main/resources/org/apache/spark/ui/static/streaming-page.js 
b/core/src/main/resources/org/apache/spark/ui/static/streaming-page.js
index a4e03b1..22b1868 100644
--- a/core/src/main/resources/org/apache/spark/ui/static/streaming-page.js
+++ b/core/src/main/resources/org/apache/spark/ui/static/streaming-page.js
@@ -266,9 +266,19 @@ $(function() {
         }
     }
 
-    if (getParameterFromURL("show-streams-detail") == "true") {
-        // Show the details for all InputDStream
-        $('#inputs-table').toggle('collapsed');
-        $('#triangle').html('&#9660;');
+    var status = getParameterFromURL("show-streams-detail") == "true";
+
+    $("span.expand-input-rate").click(function() {
+        status = !status;
+        $("#inputs-table").toggle('collapsed');
+        // Toggle the class of the arrow between open and closed
+        
$(this).find('.expand-input-rate-arrow').toggleClass('arrow-open').toggleClass('arrow-closed');
+        window.history.pushState('', document.title, window.location.pathname 
+ '?show-streams-detail=' + status);
+    });
+
+    if (status) {
+        $("#inputs-table").toggle('collapsed');
+        // Toggle the class of the arrow between open and closed
+        
$(this).find('.expand-input-rate-arrow').toggleClass('arrow-open').toggleClass('arrow-closed');
     }
 });

http://git-wip-us.apache.org/repos/asf/spark/blob/bec938f7/streaming/src/main/scala/org/apache/spark/streaming/ui/StreamingPage.scala
----------------------------------------------------------------------
diff --git 
a/streaming/src/main/scala/org/apache/spark/streaming/ui/StreamingPage.scala 
b/streaming/src/main/scala/org/apache/spark/streaming/ui/StreamingPage.scala
index ff0f2b1..efce8c5 100644
--- a/streaming/src/main/scala/org/apache/spark/streaming/ui/StreamingPage.scala
+++ b/streaming/src/main/scala/org/apache/spark/streaming/ui/StreamingPage.scala
@@ -244,17 +244,6 @@ private[ui] class StreamingPage(parent: StreamingTab)
     val maxEventRate = 
eventRateForAllStreams.max.map(_.ceil.toLong).getOrElse(0L)
     val minEventRate = 0L
 
-    // JavaScript to show/hide the InputDStreams sub table.
-    val triangleJs =
-      s"""$$('#inputs-table').toggle('collapsed');
-         |var status = false;
-         |if ($$(this).html() == '$BLACK_RIGHT_TRIANGLE_HTML') {
-         |$$(this).html('$BLACK_DOWN_TRIANGLE_HTML');status = true;}
-         |else {$$(this).html('$BLACK_RIGHT_TRIANGLE_HTML');status  = false;}
-         |window.history.pushState('',
-         |    document.title, window.location.pathname + 
'?show-streams-detail=' + status);"""
-        .stripMargin.replaceAll("\\n", "") // it must be only one single line
-
     val batchInterval = UIUtils.convertToTimeUnit(listener.batchDuration, 
normalizedUnit)
 
     val jsCollector = new JsCollector
@@ -326,10 +315,18 @@ private[ui] class StreamingPage(parent: StreamingTab)
           <td style="vertical-align: middle;">
             <div style="width: 160px;">
               <div>
-              {if (hasStream) {
-                <span id="triangle" 
onclick={Unparsed(triangleJs)}>{Unparsed(BLACK_RIGHT_TRIANGLE_HTML)}</span>
-              }}
-                <strong>Input Rate</strong>
+              {
+                if (hasStream) {
+                  <span class="expand-input-rate">
+                    <span class="expand-input-rate-arrow arrow-closed"></span>
+                    <a data-toggle="tooltip" title="Show/hide details of each 
receiver" data-placement="right">
+                      <strong>Input Rate</strong>
+                    </a>
+                  </span>
+                } else {
+                  <strong>Input Rate</strong>
+                }
+              }
               </div>
               <div>Avg: {eventRateForAllStreams.formattedAvg} events/sec</div>
             </div>


---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]

Reply via email to