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 2017/09/22 11:48:59 UTC
ambari git commit: AMBARI-22023 Upgrade dialog style issues.(atkach)
Repository: ambari
Updated Branches:
refs/heads/trunk 40f705a66 -> eead09beb
AMBARI-22023 Upgrade dialog style issues.(atkach)
Project: http://git-wip-us.apache.org/repos/asf/ambari/repo
Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/eead09be
Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/eead09be
Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/eead09be
Branch: refs/heads/trunk
Commit: eead09bebb0c1887c8dd8fe90aa8a6d50009e897
Parents: 40f705a
Author: Andrii Tkach <at...@apache.org>
Authored: Fri Sep 22 13:11:03 2017 +0300
Committer: Andrii Tkach <at...@apache.org>
Committed: Fri Sep 22 14:48:47 2017 +0300
----------------------------------------------------------------------
.../main/admin/stack_and_upgrade_controller.js | 2 +-
ambari-web/app/messages.js | 2 +
ambari-web/app/routes/stack_upgrade_routes.js | 11 +-
ambari-web/app/styles/stack_versions.less | 77 ++++++---
.../stack_upgrade/stack_upgrade_wizard.hbs | 170 +++++++++++--------
.../main/admin/stack_upgrade/upgrade_group.hbs | 18 +-
.../views/common/helpers/status_icon_view.js | 1 +
.../admin/stack_upgrade/upgrade_wizard_view.js | 3 +
.../admin/stack_and_upgrade_controller_test.js | 2 +-
.../stack_upgrade/upgrade_wizard_view_test.js | 2 +-
10 files changed, 186 insertions(+), 102 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/ambari/blob/eead09be/ambari-web/app/controllers/main/admin/stack_and_upgrade_controller.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/controllers/main/admin/stack_and_upgrade_controller.js b/ambari-web/app/controllers/main/admin/stack_and_upgrade_controller.js
index fba6ad6..6d7560b 100644
--- a/ambari-web/app/controllers/main/admin/stack_and_upgrade_controller.js
+++ b/ambari-web/app/controllers/main/admin/stack_and_upgrade_controller.js
@@ -391,7 +391,7 @@ App.MainAdminStackAndUpgradeController = Em.Controller.extend(App.LocalStorage,
} else if (this.get('upgradeData.Upgrade')){
return this.get('upgradeData.Upgrade.request_status');
} else {
- return '';
+ return 'INIT';
}
}.property('upgradeData.Upgrade.request_status', 'App.upgradeSuspended'),
http://git-wip-us.apache.org/repos/asf/ambari/blob/eead09be/ambari-web/app/messages.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/messages.js b/ambari-web/app/messages.js
index 113fb8f..db25104 100644
--- a/ambari-web/app/messages.js
+++ b/ambari-web/app/messages.js
@@ -1884,6 +1884,8 @@ Em.I18n.translations = {
'admin.stackUpgrade.state.aborted': "Upgrade Aborted",
'admin.stackUpgrade.state.completed': "Upgrade Finished",
'admin.stackUpgrade.state.inProgress.downgrade': "Downgrade in Progress",
+ 'admin.stackUpgrade.state.init': "Upgrade Initializing",
+ 'admin.stackUpgrade.state.init.downgrade': "Downgrade Initializing",
'admin.stackUpgrade.state.paused.downgrade': "Downgrade Paused",
'admin.stackUpgrade.state.aborted.downgrade': "Downgrade Aborted",
'admin.stackUpgrade.state.completed.downgrade': "Downgrade Finished",
http://git-wip-us.apache.org/repos/asf/ambari/blob/eead09be/ambari-web/app/routes/stack_upgrade_routes.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/routes/stack_upgrade_routes.js b/ambari-web/app/routes/stack_upgrade_routes.js
index 24fa5e8..d36253a 100644
--- a/ambari-web/app/routes/stack_upgrade_routes.js
+++ b/ambari-web/app/routes/stack_upgrade_routes.js
@@ -40,7 +40,16 @@ module.exports = App.WizardRoute.extend({
return App.ModalPopup.show({
classNames: ['upgrade-wizard-modal'],
modalDialogClasses: ['modal-xlg'],
- header: Em.computed.alias('App.router.mainAdminStackAndUpgradeController.wizardModalTitle'),
+ headerClass: Em.View.extend({
+ header: Em.computed.alias('controller.wizardModalTitle'),
+ controllerBinding: 'App.router.mainAdminStackAndUpgradeController',
+ template: Ember.Handlebars.compile(
+ '{{view.header}}' +
+ '<div {{bindAttr class=":upgrade-options-link controller.isDowngrade:disabled" disabled="controller.isDowngrade"}} {{action openUpgradeOptions target="controller"}}>' +
+ '<i class="icon-cogs"></i><a>{{t admin.stackVersions.version.upgrade.upgradeOptions.header}}</a>' +
+ '</div>'
+ )
+ }),
bodyClass: App.upgradeWizardView,
primary: Em.I18n.t('common.dismiss'),
secondary: null,
http://git-wip-us.apache.org/repos/asf/ambari/blob/eead09be/ambari-web/app/styles/stack_versions.less
----------------------------------------------------------------------
diff --git a/ambari-web/app/styles/stack_versions.less b/ambari-web/app/styles/stack_versions.less
index 2e4faff..0221311 100644
--- a/ambari-web/app/styles/stack_versions.less
+++ b/ambari-web/app/styles/stack_versions.less
@@ -418,7 +418,6 @@
}
.details-box {
padding: 5px;
- margin-right: 95px;
.button-row {
text-align: right;
padding: 5px;
@@ -439,6 +438,7 @@
}
}
.task-list {
+ width: 100%;
overflow-x: hidden;
.progress {
margin-bottom: 0;
@@ -448,35 +448,70 @@
margin-right: 5px;
}
}
+ .active-task-label {
+ padding: 8px 15px;
+ display: inline-block;
+ }
+ .col-md-2.task-list-main-wrap {
+ padding-left: 0;
+ }
+ .upgrade-groups {
+ padding-left: 0;
+ .progress {
+ width: 85%;
+ display: inline-block;
+ }
+ .percent {
+ display: inline-block;
+ vertical-align: top;
+ }
+ }
.task-list-main-wrap i {
font-size: 16px;
+ color: #0088cc;
+ margin-right: 3px;
}
ul.failed-info-list {
max-height: 500px;
margin-top: 5px;
}
- .upgrade-options-link {
- position: absolute;
- cursor: pointer;
- right: 10%;
- top: 22px;
- width: 100px;
- a {
- font-size: 13px;
- }
- .glyphicon-cogs {
- color: #0088cc;
- margin-right: 3px;
+ .pause-button {
+ margin-top: -5px;
+ padding-right: 0;
+ i {
+ padding-right: 4px;
+ font-size: 15px;
}
}
- .upgrade-options-link.disabled {
- cursor: not-allowed;
- a, .glyphicon-cogs {
- color: #808080;
- }
- a:hover {
- text-decoration: none;
- }
+ .button-row {
+ text-align: right;
+ padding: 5px;
+ }
+}
+
+.upgrade-options-link {
+ padding-left: 50px;
+ display: inline-block;
+ cursor: pointer;
+ width: 150px;
+ vertical-align: bottom;
+ a {
+ font-size: 14px;
+ font-weight: normal;
+ }
+ .icon-cogs {
+ font-size: 16px;
+ color: #0088cc;
+ margin-right: 3px;
+ }
+}
+.upgrade-options-link.disabled {
+ cursor: not-allowed;
+ a, .icon-cogs {
+ color: #808080;
+ }
+ a:hover {
+ text-decoration: none;
}
}
http://git-wip-us.apache.org/repos/asf/ambari/blob/eead09be/ambari-web/app/templates/main/admin/stack_upgrade/stack_upgrade_wizard.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/main/admin/stack_upgrade/stack_upgrade_wizard.hbs b/ambari-web/app/templates/main/admin/stack_upgrade/stack_upgrade_wizard.hbs
index cfbbb7a..7ab43b4 100644
--- a/ambari-web/app/templates/main/admin/stack_upgrade/stack_upgrade_wizard.hbs
+++ b/ambari-web/app/templates/main/admin/stack_upgrade/stack_upgrade_wizard.hbs
@@ -17,14 +17,11 @@
}}
<div id="stack-upgrade-dialog">
- <div {{bindAttr class=":upgrade-options-link controller.isDowngrade:disabled"}} {{action openUpgradeOptions target="controller"}}>
- <i class="icon-cogs"></i><a>{{t common.options}}</a>
- </div>
<div {{bindAttr class="view.isLoaded::hidden :row"}}>
- <div class="col-md-3 task-list-main-wrap">{{statusIcon controller.requestStatus}}
+ <div class="col-md-2 task-list-main-wrap">{{statusIcon controller.requestStatus}}
{{view.upgradeStatusLabel}}</div>
- <div class="col-md-8">
+ <div class="col-md-7">
{{view App.ProgressBarView
progressBinding="view.overallProgress"
statusBinding="controller.requestStatus"
@@ -33,73 +30,110 @@
<div class="col-md-1">
{{view.overallProgress}}%
</div>
- </div>
-
- <div class="task-list scrollable-block task-list-main-wrap">
- {{#if view.isLoaded}}
- <div>
- <div class="row">
- {{#if showPauseButton}}
- {{#if isDowngrade}}
- <button
- class="btn btn-default" {{action confirmPauseDowngrade target="view"}}>{{t admin.stackUpgrade.pauseDowngrade}}</button>
- {{else}}
- <button
- class="btn btn-default" {{action confirmPauseUpgrade target="view"}}>{{t admin.stackUpgrade.pauseUpgrade}}</button>
- {{/if}}
- {{/if}}
- </div>
- {{#if view.runningItem}}
- <div class="panel panel-default details-box row">
- <div class="row col-md-12">
- <div class="pull-left col-md-6">{{t admin.stackUpgrade.dialog.inProgress}} {{view.runningItem.text}}</div>
- {{#if view.isDetailsOpened}}
- <div class="pull-right col-md-6"><a href="#" class="pull-right" {{action toggleDetails target="view"}}>{{t admin.stackUpgrade.dialog.details.hide}}</a></div>
- {{#if view.runningItem.isTasksLoaded}}
- <div class="clear col-md-12">
- {{view App.upgradeTaskView contentBinding="view.taskDetails" outsideViewBinding="view.outsideView"}}
- </div>
+ <div class="col-md-2 pause-button pull-right">
+ {{#if view.isLoaded}}
+ {{#if showPauseButton}}
+ {{#if isDowngrade}}
+ <button
+ class="btn btn-default pull-right" {{action confirmPauseDowngrade target="view"}}>{{t admin.stackUpgrade.pauseDowngrade}}</button>
{{else}}
- {{view App.SpinnerView classNames="clear"}}
+ <button
+ class="btn btn-default pull-right" {{action confirmPauseUpgrade target="view"}}>{{t admin.stackUpgrade.pauseUpgrade}}</button>
{{/if}}
- {{else}}
- <div class="pull-right col-md-6"><a href="#" class="pull-right" {{action toggleDetails target="view"}}>{{t admin.stackUpgrade.dialog.details.open}}</a></div>
- {{/if}}
- </div>
- </div>
+ {{/if}}
{{/if}}
- {{#if view.failedItem}}
- {{#unless view.isSlaveComponentFailuresItem}}
- <div class="panel panel-default details-box row">
- <div class="row col-md-12">
- <div class="pull-left col-md-6">{{t admin.stackUpgrade.dialog.failed}} {{view.failedItem.text}}</div>
- {{#if view.isDetailsOpened}}
- <div class="pull-right col-md-6"><a href="#" class="pull-right" {{action toggleDetails target="view"}}>{{t admin.stackUpgrade.dialog.details.hide}}</a></div>
- {{#if view.failedItem.isTasksLoaded}}
- <div class="clear col-md-12">
- {{view App.upgradeTaskView contentBinding="view.taskDetails" outsideViewBinding="view.outsideView"}}
- </div>
- {{else}}
- {{view App.SpinnerView classNames="clear"}}
- {{/if}}
- {{else}}
- <div class="pull-right col-md-6"><a href="#" class="pull-right" {{action toggleDetails target="view"}}>{{t admin.stackUpgrade.dialog.details.open}}</a></div>
- {{/if}}
- </div>
- {{#if view.isHoldingState}}
- <div class="button-row">
- {{#if view.isDowngradeAvailable}}
- <button class="btn btn-danger" {{bindAttr disabled="controller.requestInProgress"}} {{action confirmDowngrade view.failedItem target="controller"}}>{{t common.downgrade}}</button>
- {{/if}}
- {{#if view.failedItem.skippable}}
- <button class="btn btn-warning" {{bindAttr disabled="controller.requestInProgress"}} {{action continue view.failedItem target="view"}}>{{t admin.stackUpgrade.dialog.continue}}</button>
- {{/if}}
- <button class="btn btn-default" {{bindAttr disabled="controller.requestInProgress"}} {{action retry view.failedItem target="view"}}>{{t common.retry}}</button>
+ </div>
+ </div>
+
+ <div class="task-list scrollable-block task-list-main-wrap upgrade-groups">
+ {{#if view.isLoaded}}
+ <div class="panel-group">
+ {{#if view.runningItem}}
+ <div class="panel panel-default details-box row">
+ <div class="panel-heading row">
+ <div class="pull-left col-md-6">
+ {{t admin.stackUpgrade.dialog.inProgress}} {{view.runningItem.text}}
+ </div>
+ {{#if view.isDetailsOpened}}
+ <div class="pull-right col-md-6">
+ <a href="#collapseBox" class="pull-right" {{action toggleDetails target="view"}}
+ data-toggle="collapse">
+ {{t admin.stackUpgrade.dialog.details.hide}}
+ </a>
+ </div>
+ {{else}}
+ <div class="pull-right col-md-6">
+ <a href="#collapseBox" class="pull-right" {{action toggleDetails target="view"}}
+ data-toggle="collapse">
+ {{t admin.stackUpgrade.dialog.details.open}}
+ </a>
+ </div>
+ {{/if}}
</div>
- {{/if}}
- </div>
- {{/unless}}
- {{/if}}
+ <div id="collapseBox" class="panel-collapse collapse">
+ <div class="panel-body">
+ {{#if view.runningItem.isTasksLoaded}}
+ <div class="clear col-md-12">
+ {{view App.upgradeTaskView contentBinding="view.taskDetails" outsideViewBinding="view.outsideView"}}
+ </div>
+ {{else}}
+ {{view App.SpinnerView classNames="clear"}}
+ {{/if}}
+ </div>
+ </div>
+ </div>
+ {{/if}}
+ {{#if view.failedItem}}
+ {{#unless view.isSlaveComponentFailuresItem}}
+ <div class="panel panel-default details-box row">
+ <div class="panel-heading row">
+ <div class="pull-left col-md-6">
+ {{t admin.stackUpgrade.dialog.failed}} {{view.failedItem.text}}
+ </div>
+ {{#if view.isDetailsOpened}}
+ <div class="pull-right col-md-6">
+ <a href="#collapseBox" class="pull-right" {{action toggleDetails target="view"}}
+ data-toggle="collapse">
+ {{t admin.stackUpgrade.dialog.details.hide}}
+ </a>
+ </div>
+ {{else}}
+ <div class="pull-right col-md-6">
+ <a href="#collapseBox" class="pull-right" {{action toggleDetails target="view"}}
+ data-toggle="collapse">
+ {{t admin.stackUpgrade.dialog.details.open}}
+ </a>
+ </div>
+ {{/if}}
+ </div>
+ <div id="collapseBox" class="panel-collapse collapse">
+ <div class="panel-body">
+ {{#if view.failedItem.isTasksLoaded}}
+ <div class="clear col-md-12">
+ {{view App.upgradeTaskView contentBinding="view.taskDetails" outsideViewBinding="view.outsideView"}}
+ </div>
+ {{else}}
+ {{view App.SpinnerView classNames="clear"}}
+ {{/if}}
+ </div>
+ </div>
+ {{#if view.isHoldingState}}
+ <div class="button-row">
+ {{#if view.isDowngradeAvailable}}
+ <button
+ class="btn btn-danger" {{bindAttr disabled="controller.requestInProgress"}} {{action confirmDowngrade view.failedItem target="controller"}}>{{t common.downgrade}}</button>
+ {{/if}}
+ {{#if view.failedItem.skippable}}
+ <button
+ class="btn btn-warning" {{bindAttr disabled="controller.requestInProgress"}} {{action continue view.failedItem target="view"}}>{{t admin.stackUpgrade.dialog.continue}}</button>
+ {{/if}}
+ <button
+ class="btn btn-default" {{bindAttr disabled="controller.requestInProgress"}} {{action retry view.failedItem target="view"}}>{{t common.retry}}</button>
+ </div>
+ {{/if}}
+ </div>
+ {{/unless}}
+ {{/if}}
{{#if view.plainManualItem}}
<div class="panel panel-default details-box">
<p class="manual-steps-title"><strong>{{t admin.stackUpgrade.dialog.manual}}</strong></p>
http://git-wip-us.apache.org/repos/asf/ambari/blob/eead09be/ambari-web/app/templates/main/admin/stack_upgrade/upgrade_group.hbs
----------------------------------------------------------------------
diff --git a/ambari-web/app/templates/main/admin/stack_upgrade/upgrade_group.hbs b/ambari-web/app/templates/main/admin/stack_upgrade/upgrade_group.hbs
index 1a829fb..00cde9f 100644
--- a/ambari-web/app/templates/main/admin/stack_upgrade/upgrade_group.hbs
+++ b/ambari-web/app/templates/main/admin/stack_upgrade/upgrade_group.hbs
@@ -23,16 +23,16 @@
<a href="#" {{action toggleExpanded view.content controller.upgradeData.upgradeGroups target="view"}}>{{view.content.title}}</a>
</div>
{{#if view.content.isRunning}}
- <div class="col-md-3">
+ <div class="col-md-4 pull-right">
{{view view.progressBarView
progressBinding="view.content.progress"
statusBinding="view.content.status"
totalTasksBinding="view.content.total_task_count"
completedTasksBinding="view.content.completed_task_count"
}}
- </div>
- <div class="col-md-1">
- <div>{{view.content.progress}}%</div>
+ <div class="percent pull-right">
+ <span>{{view.content.progress}}%</span>
+ </div>
</div>
{{/if}}
</div>
@@ -48,14 +48,14 @@
<a href="#" {{action toggleExpanded item view.content.upgradeItems target="view"}}>{{item.context}}</a>
</div>
{{#if item.isRunning}}
- <div class="col-md-3">
+ <div class="col-md-4 pull-right">
{{view App.ProgressBarView
progressBinding="item.progress"
statusBinding="item.status"
- }}
- </div>
- <div class="col-md-1">
- <div>{{item.progress}}%</div>
+ }}
+ <div class="percent pull-right">
+ <span>{{item.progress}}%</span>
+ </div
</div>
{{/if}}
</div>
http://git-wip-us.apache.org/repos/asf/ambari/blob/eead09be/ambari-web/app/views/common/helpers/status_icon_view.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/views/common/helpers/status_icon_view.js b/ambari-web/app/views/common/helpers/status_icon_view.js
index fbd8e3a..b807976 100644
--- a/ambari-web/app/views/common/helpers/status_icon_view.js
+++ b/ambari-web/app/views/common/helpers/status_icon_view.js
@@ -26,6 +26,7 @@ App.StatusIconView = Em.View.extend({
* @type {object}
*/
statusIconMap: {
+ 'INIT': 'icon-cogs in_progress',
'COMPLETED': 'glyphicon glyphicon-ok completed',
'WARNING': 'glyphicon glyphicon-warning-sign',
'FAILED': 'glyphicon glyphicon-exclamation-sign failed',
http://git-wip-us.apache.org/repos/asf/ambari/blob/eead09be/ambari-web/app/views/main/admin/stack_upgrade/upgrade_wizard_view.js
----------------------------------------------------------------------
diff --git a/ambari-web/app/views/main/admin/stack_upgrade/upgrade_wizard_view.js b/ambari-web/app/views/main/admin/stack_upgrade/upgrade_wizard_view.js
index a5e7730..415d87d 100644
--- a/ambari-web/app/views/main/admin/stack_upgrade/upgrade_wizard_view.js
+++ b/ambari-web/app/views/main/admin/stack_upgrade/upgrade_wizard_view.js
@@ -250,6 +250,9 @@ App.upgradeWizardView = Em.View.extend({
case 'HOLDING':
labelKey = 'admin.stackUpgrade.state.paused';
break;
+ default:
+ labelKey = 'admin.stackUpgrade.state.init';
+ break;
}
if (labelKey) {
labelKey += (this.get('controller.isDowngrade')) ? '.downgrade' : "";
http://git-wip-us.apache.org/repos/asf/ambari/blob/eead09be/ambari-web/test/controllers/main/admin/stack_and_upgrade_controller_test.js
----------------------------------------------------------------------
diff --git a/ambari-web/test/controllers/main/admin/stack_and_upgrade_controller_test.js b/ambari-web/test/controllers/main/admin/stack_and_upgrade_controller_test.js
index 2f14e50..d0671f9 100644
--- a/ambari-web/test/controllers/main/admin/stack_and_upgrade_controller_test.js
+++ b/ambari-web/test/controllers/main/admin/stack_and_upgrade_controller_test.js
@@ -107,7 +107,7 @@ describe('App.MainAdminStackAndUpgradeController', function() {
this.mock.returns(false);
controller.set('upgradeData', null);
controller.propertyDidChange('requestStatus');
- expect(controller.get('requestStatus')).to.be.empty;
+ expect(controller.get('requestStatus')).to.equal('INIT');
});
});
http://git-wip-us.apache.org/repos/asf/ambari/blob/eead09be/ambari-web/test/views/main/admin/stack_upgrade/upgrade_wizard_view_test.js
----------------------------------------------------------------------
diff --git a/ambari-web/test/views/main/admin/stack_upgrade/upgrade_wizard_view_test.js b/ambari-web/test/views/main/admin/stack_upgrade/upgrade_wizard_view_test.js
index 8ad711e..a303e60 100644
--- a/ambari-web/test/views/main/admin/stack_upgrade/upgrade_wizard_view_test.js
+++ b/ambari-web/test/views/main/admin/stack_upgrade/upgrade_wizard_view_test.js
@@ -544,7 +544,7 @@ describe('App.upgradeWizardView', function () {
status: '',
isDowngrade: false
},
- result: ''
+ result: Em.I18n.t('admin.stackUpgrade.state.init')
},
{
data: {