Skip to content

[AMBARI-22802] Styling for install wizard#134

Merged
jonathan-hurley merged 6 commits into
apache:branch-feature-AMBARI-14714-uifrom
jgolieb:AMBARI-22802
Jan 25, 2018
Merged

[AMBARI-22802] Styling for install wizard#134
jonathan-hurley merged 6 commits into
apache:branch-feature-AMBARI-14714-uifrom
jgolieb:AMBARI-22802

Conversation

@jgolieb
Copy link
Copy Markdown

@jgolieb jgolieb commented Jan 17, 2018

What changes were proposed in this pull request?

Styling for new and updated Install Wizard components. This includes:

  • Download config screen including fancy radio buttons
  • Mpack selection screen including mode selection behavior
  • Custom repo and download progress screens for mpacks and service repos
  • Updated left nav styling
  • Updated container styling and responsive behavior as needed
  • Tooltips

How was this patch tested?

All units tests passing:
20297 passing (25s)
125 pending

@asfgit
Copy link
Copy Markdown

asfgit commented Jan 17, 2018

Refer to this link for build results (access rights to CI server needed):
https://builds.apache.org/job/Ambari-Github-PullRequest-Builder/167/
Test PASSed.

@vivekratnavel vivekratnavel changed the title AMBARI-22802 Styling for install wizard [AMBARI-22802] Styling for install wizard Jan 17, 2018
@hapylestat hapylestat added the web client Ambari WebUI Client label Jan 17, 2018
Comment thread ambari-web/app/assets/index.html Outdated
$('[data-toggle="tooltip"]').tooltip();
//enables tooltips added later
const body = document.getElementsByTagName('body')[0];
const observer = new MutationObserver(() => {
Copy link
Copy Markdown
Contributor

@atkach atkach Jan 19, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's bad for performance to trigger tooltip on any DOM change, also it may add already removed tooltips(which should be hidden). Use MutationObserver locally with a particular element that needs tooltip.

Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Where exactly would you move this code? I already tried putting it in some API hook of the view and it would not work.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You can put tooltip initialization in didInsertElement of an appropriate view.

Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I tried that, but it did not work. I need something that is guaranteed to run after all dynamic items are added to the DOM. didInsertElement() only runs after the template is initially added. If you have, say, table rows that contain tooltips that get added after the initial render, they will not get activated. At least, that was my observation.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I meant to add MutationObserver in didInsertElement, and it will observe change only inside table or any other parent element.

Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

OK, that worked. Thanks.

disableSecondary: false,
disableThird: false,
primaryClass: 'btn-success',
secondaryClass: 'btn-default',
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

By design secondary button should have "btn-default" class

Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why? It seems like a secondary button should have the btn-secondary class. Otherwise, why is that part of the spec?

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, we have "btn-secondary" class, change is good.

@asfgit
Copy link
Copy Markdown

asfgit commented Jan 22, 2018

Refer to this link for build results (access rights to CI server needed):
https://builds.apache.org/job/Ambari-Github-PullRequest-Builder/233/
Test FAILed.
Test FAILured.

Jason Golieb added 2 commits January 23, 2018 11:29
# Conflicts:
#	ambari-web/app/styles/application.less
#	ambari-web/app/styles/wizard.less
#	ambari-web/app/templates/installer.hbs
@asfgit
Copy link
Copy Markdown

asfgit commented Jan 23, 2018

Refer to this link for build results (access rights to CI server needed):
https://builds.apache.org/job/Ambari-Github-PullRequest-Builder/247/
Test FAILed.
Test FAILured.

@asfgit
Copy link
Copy Markdown

asfgit commented Jan 23, 2018

Refer to this link for build results (access rights to CI server needed):
https://builds.apache.org/job/Ambari-Github-PullRequest-Builder/248/
Test FAILed.
Test FAILured.

@asfgit
Copy link
Copy Markdown

asfgit commented Jan 24, 2018

Refer to this link for build results (access rights to CI server needed):
https://builds.apache.org/job/Ambari-Github-PullRequest-Builder/260/
Test FAILed.
Test FAILured.

@vivekratnavel
Copy link
Copy Markdown
Contributor

retest this please

@asfgit
Copy link
Copy Markdown

asfgit commented Jan 24, 2018

Refer to this link for build results (access rights to CI server needed):
https://builds.apache.org/job/Ambari-Github-PullRequest-Builder/266/
Test FAILed.
Test FAILured.

@@ -149,8 +149,9 @@ App.WizardStep7Controller = App.WizardStepController.extend(App.ServerValidatorM
if (!this.get('stepConfigs.length')) return true;
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You can replace all "if"s by one expression joined by "or"

Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done.

@jonathan-hurley jonathan-hurley merged commit 52a447c into apache:branch-feature-AMBARI-14714-ui Jan 25, 2018
@jgolieb jgolieb deleted the AMBARI-22802 branch January 25, 2018 16:39
@asfgit
Copy link
Copy Markdown

asfgit commented Jan 25, 2018

Refer to this link for build results (access rights to CI server needed):
https://builds.apache.org/job/Ambari-Github-PullRequest-Builder/287/
Test FAILed.
Test FAILured.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

web client Ambari WebUI Client

Projects

None yet

Development

Successfully merging this pull request may close these issues.

6 participants