You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@ambari.apache.org by at...@apache.org on 2018/07/20 08:51:52 UTC
[ambari] branch trunk updated: AMBARI-24314 UI Elements in
Incorrect layout at Customize Services Page
This is an automated email from the ASF dual-hosted git repository.
atkach pushed a commit to branch trunk
in repository https://gitbox.apache.org/repos/asf/ambari.git
The following commit(s) were added to refs/heads/trunk by this push:
new bd40ee0 AMBARI-24314 UI Elements in Incorrect layout at Customize Services Page
bd40ee0 is described below
commit bd40ee0af1b56555eae31bb24832725785f757d5
Author: Andrii Tkach <at...@apache.org>
AuthorDate: Thu Jul 19 18:16:34 2018 +0300
AMBARI-24314 UI Elements in Incorrect layout at Customize Services Page
---
ambari-web/app/styles/application.less | 4 ++++
.../app/templates/common/configs/services_config.hbs | 4 ++--
ambari-web/app/templates/wizard/step7/directories_tab.hbs | 4 ++--
ambari-web/app/views/common/configs/services_config.js | 15 +++++++++++++++
ambari-web/app/views/wizard/step7/directories_tab_view.js | 2 ++
5 files changed, 25 insertions(+), 4 deletions(-)
diff --git a/ambari-web/app/styles/application.less b/ambari-web/app/styles/application.less
index 2abc21c..86d5168 100644
--- a/ambari-web/app/styles/application.less
+++ b/ambari-web/app/styles/application.less
@@ -531,6 +531,10 @@ h1 {
visibility: hidden;
}
+.not-visible {
+ visibility: hidden;
+}
+
.show, .shown {
visibility: visible;
}
diff --git a/ambari-web/app/templates/common/configs/services_config.hbs b/ambari-web/app/templates/common/configs/services_config.hbs
index 8b9abf9..adea9df 100644
--- a/ambari-web/app/templates/common/configs/services_config.hbs
+++ b/ambari-web/app/templates/common/configs/services_config.hbs
@@ -17,7 +17,7 @@
}}
{{#if controller.isInstallWizard}}
<div class="row one-row-tabs-container">
- <div class="left-arrow">
+ <div {{bindAttr class=":left-arrow view.isNavArrowsHidden:not-visible"}}>
<a href="#"{{bindAttr class="view.isLeftArrowDisabled:disabled"}} {{action "scrollTabsLeft" target="view"}}> <i class="icon-angle-left"></i>
</a>
</div>
@@ -36,7 +36,7 @@
{{/each}}
</ul>
</div>
- <div class="right-arrow">
+ <div {{bindAttr class=":right-arrow view.isNavArrowsHidden:not-visible"}}>
<a href="#" {{bindAttr class="view.isRightArrowDisabled:disabled"}} {{action "scrollTabsRight" target="view"}}>
<i class="icon-angle-right"></i>
</a>
diff --git a/ambari-web/app/templates/wizard/step7/directories_tab.hbs b/ambari-web/app/templates/wizard/step7/directories_tab.hbs
index a58c741..d224a34 100644
--- a/ambari-web/app/templates/wizard/step7/directories_tab.hbs
+++ b/ambari-web/app/templates/wizard/step7/directories_tab.hbs
@@ -16,7 +16,7 @@
* limitations under the License.
}}
<div class="row one-row-tabs-container">
- <div class="left-arrow">
+ <div {{bindAttr class=":left-arrow view.isNavArrowsHidden:not-visible"}}>
<a href="#"{{bindAttr class="view.isLeftArrowDisabled:disabled"}} {{action "scrollTabsLeft" target="view"}}> <i class="icon-angle-left"></i>
</a>
</div>
@@ -35,7 +35,7 @@
{{/each}}
</ul>
</div>
- <div class="right-arrow">
+ <div {{bindAttr class=":right-arrow view.isNavArrowsHidden:not-visible"}}>
<a href="#" {{bindAttr class="view.isRightArrowDisabled:disabled"}} {{action "scrollTabsRight" target="view"}}>
<i class="icon-angle-right"></i>
</a>
diff --git a/ambari-web/app/views/common/configs/services_config.js b/ambari-web/app/views/common/configs/services_config.js
index 5d88a77..f25d249 100644
--- a/ambari-web/app/views/common/configs/services_config.js
+++ b/ambari-web/app/views/common/configs/services_config.js
@@ -31,8 +31,23 @@ App.ServicesConfigView = Em.View.extend({
this.get('controller').selectProperService();
this.set('controller.selectedService.isActive', true);
this.get('controller').selectedServiceObserver();
+ Em.run.next(this, function () {
+ this.enableRightArrow();
+ });
}
},
+
+ isLeftArrowDisabled: true,
+
+ isRightArrowDisabled: true,
+
+ isNavArrowsHidden: Em.computed.and('isLeftArrowDisabled', 'isRightArrowDisabled'),
+
+ enableRightArrow: function () {
+ var container = $(this.get('element')).find('.tabs-container');
+ var content = container.find('ul');
+ this.set('isRightArrowDisabled', container.width() >= content.width());
+ },
getScrollInterval: function () {
var INTERVAL = 300;
diff --git a/ambari-web/app/views/wizard/step7/directories_tab_view.js b/ambari-web/app/views/wizard/step7/directories_tab_view.js
index 7a0eee1..890ec29 100644
--- a/ambari-web/app/views/wizard/step7/directories_tab_view.js
+++ b/ambari-web/app/views/wizard/step7/directories_tab_view.js
@@ -82,6 +82,8 @@ App.DirectoriesTabOnStep7View = Em.View.extend({
isLeftArrowDisabled: true,
isRightArrowDisabled: true,
+
+ isNavArrowsHidden: Em.computed.and('isLeftArrowDisabled', 'isRightArrowDisabled'),
enableRightArrow: function () {
var container = $(this.get('element')).find('.tabs-container');