[SPARK-4984][CORE][WEBUI] Adding a pop-up containing the full job description when it is very long #3819

scwf · 2014-12-29T06:37:39Z

In some case the job description will be very long, such as a long sql. refer to #3718
This PR add a pop-up for job description when it is long.

SparkQA · 2014-12-29T06:42:29Z

Test build #24853 has started for PR 3819 at commit 4909bb4.

This patch merges cleanly.

SparkQA · 2014-12-29T06:43:23Z

Test build #24853 has finished for PR 3819 at commit 4909bb4.

This patch fails Scala style tests.
This patch merges cleanly.
This patch adds no public classes.

AmplabJenkins · 2014-12-29T06:43:24Z

Test FAILed.
Refer to this link for build results (access rights to CI server needed):
https://amplab.cs.berkeley.edu/jenkins//job/SparkPullRequestBuilder/24853/
Test FAILed.

SparkQA · 2014-12-29T06:52:33Z

Test build #24854 has started for PR 3819 at commit 8fe74b0.

This patch merges cleanly.

SparkQA · 2014-12-29T08:17:42Z

Test build #24854 has finished for PR 3819 at commit 8fe74b0.

This patch passes all tests.
This patch merges cleanly.
This patch adds no public classes.

AmplabJenkins · 2014-12-29T08:17:46Z

Test PASSed.
Refer to this link for build results (access rights to CI server needed):
https://amplab.cs.berkeley.edu/jenkins//job/SparkPullRequestBuilder/24854/
Test PASSed.

srowen · 2014-12-29T09:19:04Z

This can be turned into a simple mouseover with much less work, no CSS or Javascript. Just display the shortened version, and make the long description the title attribute of an enclosing tag like span or div. I think that might even be more intuitive?

scwf · 2014-12-29T09:37:15Z

Hi @srowen, I am not a expert of css/javascript, my question here if do like your suggest(mouseover), can we copy the full sql statement in ui? sometime we want to copy it.

srowen · 2014-12-29T09:43:40Z

A mouseover can have whatever you like, whatever you can put in a title attribute. The browser will lay it out. You could try and see if it's an effective view.

scwf · 2014-12-29T09:45:33Z

thanks, i will try with it:)

scwf · 2014-12-29T10:56:49Z

hi @srowen, i tried like this

<div title="full sql: ....">shortened sql</div>

but i can not copy the "full sql", or i missed something?

srowen · 2014-12-29T10:59:21Z

@scwf You should be able to put whatever you want in there as the title. What's the issue?

scwf · 2014-12-29T11:15:43Z

Sorry, did not get you. Do you mean i put others here( to implement an attribute similar with title) instead of title?

srowen · 2014-12-29T11:27:41Z

I'm suggesting something like replacing

<div><em>{lastStageDescription}</em></div>

with

<div title="{lastStageDescription}"><em>{shortLastStageDescription}</em></div>

... when the description is long. This should cause the short description to pop up the full description in a mouseover. Maybe I'm missing something as to why that won't work, but it is a lot simpler at least.

scwf · 2014-12-29T12:51:31Z

Hi @srowen, this and <div title="full sql: ....">shortened sql</div> both work for me. Why i do not use this solution is that we maybe want to copy(ctrl + c) the full description from UI sometimes, if using title we can not copy the full description

But this is really much simpler and if you think it's very low probability for user to copy the full desc, i will change it to this simple solution:)

scwf · 2015-01-12T06:42:17Z

/cc @JoshRosen, can you have a look at this?

scwf · 2015-01-14T06:43:30Z

Ping @JoshRosen, any comment here?

JoshRosen · 2015-01-15T20:37:24Z

What do you think about using a styled read-only text form field? Using CSS, we could probably limit the size of what's displayed while still allowing users to double-click to copy the entire field.

SparkQA · 2015-01-16T09:12:42Z

Test build #25649 has started for PR 3819 at commit 0bca96d.

This patch merges cleanly.

scwf · 2015-01-16T09:13:41Z

@JoshRosen Using a read-only text form, the screenshot is like this, also support to copy the description.

SparkQA · 2015-01-16T10:20:45Z

Test build #25649 has finished for PR 3819 at commit 0bca96d.

This patch passes all tests.
This patch merges cleanly.
This patch adds no public classes.

AmplabJenkins · 2015-01-16T10:20:49Z

Test PASSed.
Refer to this link for build results (access rights to CI server needed):
https://amplab.cs.berkeley.edu/jenkins//job/SparkPullRequestBuilder/25649/
Test PASSed.

scwf · 2015-01-19T01:46:59Z

Hmm, agree with you, but have not found a easy way to spot truncated description.
if we add ... for truncated decs, we will consider the case of window scaling and different screen which make this more complex

scwf · 2015-01-20T12:59:53Z

Updated @JoshRosen, now use ... to spot it's been truncated

SparkQA · 2015-01-20T13:02:41Z

Test build #25818 has started for PR 3819 at commit a7c5e7b.

This patch merges cleanly.

SparkQA · 2015-01-20T14:11:35Z

Test build #25818 has finished for PR 3819 at commit a7c5e7b.

This patch passes all tests.
This patch merges cleanly.
This patch adds no public classes.

AmplabJenkins · 2015-01-20T14:11:39Z

Test PASSed.
Refer to this link for build results (access rights to CI server needed):
https://amplab.cs.berkeley.edu/jenkins//job/SparkPullRequestBuilder/25818/
Test PASSed.

JoshRosen · 2015-01-20T18:36:48Z

Ooh, very nice! I didn't know about text-overflow: ellipsis. Looks like it has good browser support, too: http://caniuse.com/#feat=text-overflow

JoshRosen · 2015-01-20T18:58:26Z

I just tried this out in Firefox and it turns out that it won't let you select text from a disabled input element. Apparently this has been a longstanding issue; this bug has been open for 11+ years: https://bugzilla.mozilla.org/show_bug.cgi?id=195361

JoshRosen · 2015-01-20T19:02:38Z

I think I found a solution that works in Firefox: replace the input element with a span where you've set it to display: block and white-space: nowrap. If we do that, I think we can drop the border, margin, padding, and cursor, and box shadow attributes.

pwendell · 2015-01-20T20:45:43Z

core/src/main/resources/org/apache/spark/ui/static/webui.css

Why do these all need "!important"? Are there other rules that will take precedence here?

yes, in my debug there is other style will take precedence here. anyway, new version i do not use input and remove "!important"

SparkQA · 2015-01-21T03:07:49Z

Test build #25868 has started for PR 3819 at commit c5c4822.

This patch merges cleanly.

SparkQA · 2015-01-21T03:08:42Z

Test build #25868 has finished for PR 3819 at commit c5c4822.

This patch fails Scala style tests.
This patch merges cleanly.
This patch adds no public classes.

AmplabJenkins · 2015-01-21T03:08:43Z

Test FAILed.
Refer to this link for build results (access rights to CI server needed):
https://amplab.cs.berkeley.edu/jenkins//job/SparkPullRequestBuilder/25868/
Test FAILed.

SparkQA · 2015-01-21T03:12:46Z

Test build #25869 has started for PR 3819 at commit ba02b83.

This patch merges cleanly.

scwf · 2015-01-21T03:12:48Z

@JoshRosen, yeah, get it, updated.

SparkQA · 2015-01-21T04:20:51Z

Test build #25869 has finished for PR 3819 at commit ba02b83.

This patch passes all tests.
This patch merges cleanly.
This patch adds no public classes.

AmplabJenkins · 2015-01-21T04:20:55Z

Test PASSed.
Refer to this link for build results (access rights to CI server needed):
https://amplab.cs.berkeley.edu/jenkins//job/SparkPullRequestBuilder/25869/
Test PASSed.

scwf · 2015-01-21T22:36:44Z

Ping @JoshRosen is this ok？

JoshRosen · 2015-01-21T22:50:48Z

Yep, looks good to me. Mind updating the screenshot in the PR description? Do that, ping me, and I'll merge it right away. Thanks!

scwf · 2015-01-21T23:26:02Z

Ping @JoshRosen updated done

JoshRosen · 2015-01-21T23:27:03Z

Awesome, thanks! I'm merging this into master (1.3.0).

…cription when it is very long In some case the job description will be very long, such as a long sql. refer to apache#3718 This PR add a pop-up for job description when it is long. ![image](https://cloud.githubusercontent.com/assets/7018048/5847400/c757cbbc-a207-11e4-891f-528821c2e68d.png) ![image](https://cloud.githubusercontent.com/assets/7018048/5847409/d434b2b4-a207-11e4-8813-03a74b43d766.png) Author: wangfei <[email protected]> Closes apache#3819 from scwf/popup-descrip-ui and squashes the following commits: ba02b83 [wangfei] address comments a7c5e7b [wangfei] spot that it's been truncated fbf6162 [wangfei] Merge branch 'master' into popup-descrip-ui 0bca96d [wangfei] remove no use val 4b55c3b [wangfei] fix style issue 353c6f4 [wangfei] pop up the description of job with a styled read-only text form field

JoshRosen · 2015-07-06T20:22:42Z

I think that this feature may no longer be working in recent versions of Spark. Have you tested this recently?

scwf · 2015-07-07T03:33:04Z

i tested it locally today, seems it is ok.

scwf mentioned this pull request Dec 29, 2014

[SPARK-4871][SQL] Show sql statement in spark ui when run sql with spark-sql #3718

Closed

scwf changed the title ~~[SPARK-4984][Core][UI] Adding a pop-up containing the full for job description when it is very long~~ [SPARK-4984][CORE][UI] Adding a pop-up containing the full for job description when it is very long Dec 29, 2014

scwf changed the title ~~[SPARK-4984][CORE][UI] Adding a pop-up containing the full for job description when it is very long~~ [SPARK-4984][CORE][UI] Adding a pop-up containing the full job description when it is very long Dec 29, 2014

scwf added 2 commits January 16, 2015 16:55

pop up the description of job with a styled read-only text form field

353c6f4

fix style issue

4b55c3b

scwf force-pushed the popup-descrip-ui branch from 8fe74b0 to 4b55c3b Compare January 16, 2015 09:08

remove no use val

0bca96d

Merge branch 'master' into popup-descrip-ui

fbf6162

spot that it's been truncated

a7c5e7b

pwendell reviewed Jan 20, 2015
View reviewed changes

address comments

ba02b83

scwf force-pushed the popup-descrip-ui branch from c5c4822 to ba02b83 Compare January 21, 2015 03:11

asfgit closed this in 3be2a88 Jan 21, 2015

scwf deleted the popup-descrip-ui branch January 21, 2015 23:29

[SPARK-4984][CORE][WEBUI] Adding a pop-up containing the full job description when it is very long #3819

[SPARK-4984][CORE][WEBUI] Adding a pop-up containing the full job description when it is very long #3819

Uh oh!

Conversation

scwf commented Dec 29, 2014

Uh oh!

SparkQA commented Dec 29, 2014

Uh oh!

SparkQA commented Dec 29, 2014

Uh oh!

AmplabJenkins commented Dec 29, 2014

Uh oh!

SparkQA commented Dec 29, 2014

Uh oh!

SparkQA commented Dec 29, 2014

Uh oh!

AmplabJenkins commented Dec 29, 2014

Uh oh!

srowen commented Dec 29, 2014

Uh oh!

scwf commented Dec 29, 2014

Uh oh!

srowen commented Dec 29, 2014

Uh oh!

scwf commented Dec 29, 2014

Uh oh!

scwf commented Dec 29, 2014

Uh oh!

srowen commented Dec 29, 2014

Uh oh!

scwf commented Dec 29, 2014

Uh oh!

srowen commented Dec 29, 2014

Uh oh!

scwf commented Dec 29, 2014

Uh oh!

scwf commented Jan 12, 2015

Uh oh!

scwf commented Jan 14, 2015

Uh oh!

JoshRosen commented Jan 15, 2015

Uh oh!

SparkQA commented Jan 16, 2015

Uh oh!

scwf commented Jan 16, 2015

Uh oh!

SparkQA commented Jan 16, 2015

Uh oh!

AmplabJenkins commented Jan 16, 2015

Uh oh!

scwf commented Jan 19, 2015

Uh oh!

scwf commented Jan 20, 2015

Uh oh!

SparkQA commented Jan 20, 2015

Uh oh!

SparkQA commented Jan 20, 2015

Uh oh!

AmplabJenkins commented Jan 20, 2015

Uh oh!

JoshRosen commented Jan 20, 2015

Uh oh!

JoshRosen commented Jan 20, 2015

Uh oh!

JoshRosen commented Jan 20, 2015

Uh oh!

pwendell Jan 20, 2015

Choose a reason for hiding this comment

Uh oh!

scwf Jan 21, 2015

Choose a reason for hiding this comment

Uh oh!

SparkQA commented Jan 21, 2015

Uh oh!

SparkQA commented Jan 21, 2015

Uh oh!

AmplabJenkins commented Jan 21, 2015

Uh oh!

SparkQA commented Jan 21, 2015

Uh oh!