Repository: spark Updated Branches: refs/heads/branch-1.4 42cf4a2a5 -> 10007fbe0
[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.   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 (cherry picked from commit bec938f777a2e18757c7d04504d86a5342e2b49e) Signed-off-by: Tathagata Das <[email protected]> Project: http://git-wip-us.apache.org/repos/asf/spark/repo Commit: http://git-wip-us.apache.org/repos/asf/spark/commit/10007fbe Tree: http://git-wip-us.apache.org/repos/asf/spark/tree/10007fbe Diff: http://git-wip-us.apache.org/repos/asf/spark/diff/10007fbe Branch: refs/heads/branch-1.4 Commit: 10007fbe0ba4f1d86645cc03ead3fb86dc96253b Parents: 42cf4a2 Author: zsxwing <[email protected]> Authored: Wed May 13 10:01:26 2015 -0700 Committer: Tathagata Das <[email protected]> Committed: Wed May 13 10:01:38 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/10007fbe/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/10007fbe/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('▼'); + 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/10007fbe/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]
