This is an automated email from the ASF dual-hosted git repository.
akovalenko pushed a commit to branch branch-feature-AMBARI-14714-ui
in repository https://gitbox.apache.org/repos/asf/ambari.git
The following commit(s) were added to refs/heads/branch-feature-AMBARI-14714-ui
by this push:
new 1384106 AMBARI-23007. Create Upgrade Plan menu item and popup
1384106 is described below
commit 13841066d06c79c22c8386380285d6d3403f0543
Author: Jason Golieb <[email protected]>
AuthorDate: Thu Feb 22 08:47:06 2018 -0500
AMBARI-23007. Create Upgrade Plan menu item and popup
---
ambari-web/app/messages.js | 11 ++++
ambari-web/app/styles/application.less | 69 ++++++++++++++++++++++
ambari-web/app/styles/modal_popups.less | 12 ++++
ambari-web/app/templates/common/modal_popup.hbs | 2 +-
.../app/templates/main/admin/serviceGroups.hbs | 2 +-
.../main/admin/serviceGroups/startUpgradePlan.hbs | 42 +++++++++++++
ambari-web/app/views/common/modal_popup.js | 37 ++++++++++++
.../app/views/main/admin/serviceGroups_view.js | 20 ++++++-
ambari-web/test/utils/date/date_test.js | 13 +++-
9 files changed, 202 insertions(+), 6 deletions(-)
diff --git a/ambari-web/app/messages.js b/ambari-web/app/messages.js
index 6ec70b2..057d9ba 100644
--- a/ambari-web/app/messages.js
+++ b/ambari-web/app/messages.js
@@ -1975,6 +1975,17 @@ Em.I18n.translations = {
'admin.serviceGroups.createUpgradePlan': "Create Upgrade Plan",
'admin.serviceGroups.addServiceGroup': "Add Management Pack",
'admin.serviceGroups.removeOldVersions': "Remove Old Versions",
+ 'admin.serviceGroups.startUpgradePlan.title': "Upgrade Process",
+ 'admin.serviceGroups.startUpgradePlan.description': "Lorem ipsum dolor sit
amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
ullamco laboris.",
+ 'admin.serviceGroups.startUpgradePlan.step1Title': "Upgrade Plan",
+ 'admin.serviceGroups.startUpgradePlan.step1Description': "Lorem ipsum dolor
sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.",
+ 'admin.serviceGroups.startUpgradePlan.step2Title': "Prerequisites",
+ 'admin.serviceGroups.startUpgradePlan.step2Description': "Lorem ipsum dolor
sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.",
+ 'admin.serviceGroups.startUpgradePlan.step3Title': "Install",
+ 'admin.serviceGroups.startUpgradePlan.step3Description': "Lorem ipsum dolor
sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.",
+ 'admin.serviceGroups.startUpgradePlan.step4Title': "Upgrade",
+ 'admin.serviceGroups.startUpgradePlan.step4Description': "Lorem ipsum dolor
sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.",
+ 'admin.serviceGroups.startUpgradePlan.buttonLabel': 'Create Upgrade Plan',
'admin.stackUpgrade.downgrade.proceed': "Proceed with Downgrade",
'admin.stackUpgrade.downgrade.body': "Are you sure you wish to abort the
upgrade process and downgrade to <b>{0}</b>?",
diff --git a/ambari-web/app/styles/application.less
b/ambari-web/app/styles/application.less
index 83d515e..5239708 100644
--- a/ambari-web/app/styles/application.less
+++ b/ambari-web/app/styles/application.less
@@ -2894,4 +2894,73 @@ td .no-data {
#notifications-dropdown.dropdown-menu .notifications-header
.notifications-title {
line-height: 30px;
+}
+
+#start-upgrade-plan {
+ text-align: center;
+ padding: 30px 0;
+ max-width: 1000px;
+
+ h3 {
+ margin-top: 0;
+ color: #333;
+ }
+
+ #description {
+ width: 60%;
+ margin-left: auto;
+ margin-right: auto;
+ color: #999;
+ }
+
+ ol {
+ display: flex;
+ justify-content: space-around;
+ margin: 40px auto;
+ counter-reset: items;
+
+ li {
+ list-style-type: none;
+ width: 225px;
+ margin: 20px 15px;
+ margin-bottom: 0;
+ color: #999;
+
+ h4 {
+ color: #333;
+ }
+
+ &:before {
+ display: block;
+ position: relative;
+ left: 50%;
+ transform: translateX(-50%);
+ bottom: 20px;
+ height: 30px;
+ width: 30px;
+ counter-increment: items;
+ content: counter(items);
+ border: #999 1px solid;
+ border-radius: 100%;
+ font-size: 20px;
+ line-height: 28px;
+ }
+
+ &:not(:last-child):after {
+ width: ~"calc(100% + 1px)";
+ height: 1px;
+ background-color: #999;
+ content: "";
+ position: relative;
+ display: block;
+ bottom: 138px;
+ left: 123px;
+ }
+ }
+ }
+}
+
+.btn-lg {
+ text-transform: uppercase;
+ outline: none;
}
\ No newline at end of file
diff --git a/ambari-web/app/styles/modal_popups.less
b/ambari-web/app/styles/modal_popups.less
index b26bf1a..a02abca 100644
--- a/ambari-web/app/styles/modal_popups.less
+++ b/ambari-web/app/styles/modal_popups.less
@@ -99,6 +99,18 @@
}
}
}
+
+ &.wide-modal {
+ right: initial;
+ left: 50%;
+ transform: translateX(-50%);
+ }
+
+ &.no-header {
+ .modal-header {
+ display: none;
+ }
+ }
}
.modal-body {
max-height: 600px;
diff --git a/ambari-web/app/templates/common/modal_popup.hbs
b/ambari-web/app/templates/common/modal_popup.hbs
index afc5d9f..715e416 100644
--- a/ambari-web/app/templates/common/modal_popup.hbs
+++ b/ambari-web/app/templates/common/modal_popup.hbs
@@ -18,7 +18,7 @@
<div class="modal-backdrop in"></div>
-<div {{bindAttr class=":modal view.showFooter:with-footer:no-footer"}}
id="modal" tabindex="-1" role="dialog" aria-labelledby="modal-label"
aria-hidden="true" {{QAAttr "modal"}}>
+<div {{bindAttr class=":modal view.modalWrapperClassesStr
view.showFooter:with-footer:no-footer view.showHeader::no-header"}} id="modal"
tabindex="-1" role="dialog" aria-labelledby="modal-label" aria-hidden="true"
{{QAAttr "modal"}}>
<div {{bindAttr class="view.modalDialogClassesStr :modal-dialog"}}>
<div class="modal-content">
{{! Modal header }}
diff --git a/ambari-web/app/templates/main/admin/serviceGroups.hbs
b/ambari-web/app/templates/main/admin/serviceGroups.hbs
index 81f27b7..911a472 100644
--- a/ambari-web/app/templates/main/admin/serviceGroups.hbs
+++ b/ambari-web/app/templates/main/admin/serviceGroups.hbs
@@ -32,7 +32,7 @@
<div class="dropdown pull-right">
<button class="btn btn-primary dropdown-toggle" type="button"
id="actions-menu" data-toggle="dropdown" aria-haspopup="true"
aria-expanded="true">Actions <span class="caret"></span></button>
<ul class="dropdown-menu" aria-labelledby="actions-menu">
- <li><a href="#"><i class="icon-arrow-up"></i> {{t
admin.serviceGroups.createUpgradePlan}}</a></li>
+ <li><a href="#" {{action handleCreateUpgradePlan target="view"}}><i
class="icon-arrow-up"></i> {{t
admin.serviceGroups.createUpgradePlan}}</a></li>
<li><a href="#"><i class="icon-plus"></i> {{t
admin.serviceGroups.addServiceGroup}}</a></li>
<li><a href="#"><i class="icon-trash"></i> {{t
admin.serviceGroups.removeOldVersions}}</a></li>
<li><a href="#"><i class="icon-book"></i> {{t
common.documentation}}</a></li>
diff --git
a/ambari-web/app/templates/main/admin/serviceGroups/startUpgradePlan.hbs
b/ambari-web/app/templates/main/admin/serviceGroups/startUpgradePlan.hbs
new file mode 100644
index 0000000..3ccdf1e
--- /dev/null
+++ b/ambari-web/app/templates/main/admin/serviceGroups/startUpgradePlan.hbs
@@ -0,0 +1,42 @@
+{{!
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements. See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership. The ASF licenses this file
+* to you under the Apache License, Version 2.0 (the
+* "License"); you may not use this file except in compliance
+* with the License. You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+}}
+
+<a class="close" {{action close target="view"}}>×</a>
+<div id="start-upgrade-plan">
+ <h3>{{t admin.serviceGroups.startUpgradePlan.title}}</h3>
+ <p id="description">{{t
admin.serviceGroups.startUpgradePlan.description}}</p>
+ <ol>
+ <li>
+ <h4>{{t admin.serviceGroups.startUpgradePlan.step1Title}}</h4>
+ <p>{{t admin.serviceGroups.startUpgradePlan.step1Description}}</p>
+ </li>
+ <li>
+ <h4>{{t admin.serviceGroups.startUpgradePlan.step2Title}}</h4>
+ <p>{{t admin.serviceGroups.startUpgradePlan.step2Description}}</p>
+ </li>
+ <li>
+ <h4>{{t admin.serviceGroups.startUpgradePlan.step3Title}}</h4>
+ <p>{{t admin.serviceGroups.startUpgradePlan.step3Description}}</p>
+ </li>
+ <li>
+ <h4>{{t admin.serviceGroups.startUpgradePlan.step4Title}}</h4>
+ <p>{{t admin.serviceGroups.startUpgradePlan.step4Description}}</p>
+ </li>
+ </ol>
+ <button type="button" class="btn-lg btn-primary" {{action createUpgradePlan
target="view"}}>{{t admin.serviceGroups.startUpgradePlan.buttonLabel}}</button>
+</div>
\ No newline at end of file
diff --git a/ambari-web/app/views/common/modal_popup.js
b/ambari-web/app/views/common/modal_popup.js
index 33e9534..238ca5f 100644
--- a/ambari-web/app/views/common/modal_popup.js
+++ b/ambari-web/app/views/common/modal_popup.js
@@ -21,7 +21,9 @@ var App = require('app');
App.ModalPopup = Ember.View.extend({
viewName: 'modalPopup',
+ modalWrapperClasses: [],
modalDialogClasses: [],
+ modalId: "modal",
templateName: require('templates/common/modal_popup'),
header: ' ',
body: ' ',
@@ -31,6 +33,7 @@ App.ModalPopup = Ember.View.extend({
secondary: Em.I18n.t('common.cancel'),
third: null,
autoHeight: true,
+ autoWidth: true,
marginBottom: 300,
disablePrimary: false,
disableSecondary: false,
@@ -38,6 +41,13 @@ App.ModalPopup = Ember.View.extend({
primaryClass: 'btn-success',
secondaryClass: 'btn-secondary',
thirdClass: 'btn-default',
+ modalWrapperClassesStr: function () {
+ var modalWrapperClasses = this.get('modalWrapperClasses');
+ if (!Em.isArray(modalWrapperClasses)) {
+ return '';
+ }
+ return modalWrapperClasses.join(' ');
+ }.property('modalWrapperClasses.[]'),
modalDialogClassesStr: function () {
var modalDialogClasses = this.get('modalDialogClasses');
if (!Em.isArray(modalDialogClasses)) {
@@ -72,6 +82,8 @@ App.ModalPopup = Ember.View.extend({
this.destroy();
},
+ showHeader: true,
+
showFooter: true,
/**
@@ -109,6 +121,11 @@ App.ModalPopup = Ember.View.extend({
this.fitHeight();
$(window).on('resize', this.fitHeight.bind(this));
}
+
+ if (this.get('autoWidth') && !$.mocho) {
+ this.fitWidth();
+ $(window).on('resize', this.fitWidth.bind(this));
+ }
},
willDestroyElement: function() {
@@ -116,6 +133,9 @@ App.ModalPopup = Ember.View.extend({
if (this.get('autoHeight') && !$.mocho) {
$(window).off('resize', this.fitHeight);
}
+ if (this.get('autoWidth') && !$.mocho) {
+ $(window).off('resize', this.fitWidth);
+ }
},
escapeKeyPressed: function (event) {
@@ -176,6 +196,23 @@ App.ModalPopup = Ember.View.extend({
newMaxHeight = Math.max(newMaxHeight, 500);
block.css('max-height', newMaxHeight);
+ },
+
+ fitWidth: function () {
+ if (this.get('state') === 'destroyed') return;
+ var popup = this.$().find('#modal'),
+ wrapper = $(popup).find('.modal-dialog'),
+ //block = $(popup).find('.modal-body'),
+ ww = $(window).width(),
+ margin = ww * 0.05,
+ newMaxWidth = ww - margin * 2;
+
+ newMaxWidth = Math.min(newMaxWidth, 1400);
+ wrapper.css({
+ 'max-width': newMaxWidth,
+ 'min-width': 600,
+ 'width': 'auto'
+ });
}
});
diff --git a/ambari-web/app/views/main/admin/serviceGroups_view.js
b/ambari-web/app/views/main/admin/serviceGroups_view.js
index 89ff8e6..a2a06b7 100644
--- a/ambari-web/app/views/main/admin/serviceGroups_view.js
+++ b/ambari-web/app/views/main/admin/serviceGroups_view.js
@@ -19,5 +19,23 @@
var App = require('app');
App.MainAdminServiceGroupsView = App.DashRow.extend({
- templateName: require('templates/main/admin/serviceGroups')
+ templateName: require('templates/main/admin/serviceGroups'),
+
+ handleCreateUpgradePlan: function () {
+ App.ModalPopup.show({
+ modalWrapperClasses: [ "wide-modal" ],
+ showHeader: false,
+ showFooter: false,
+ bodyClass: Ember.View.extend({
+ templateName:
require('templates/main/admin/serviceGroups/startUpgradePlan'),
+ close: function () {
+ this.get('parentView').hide();
+ },
+ createUpgradePlan: function () {
+ this.get('parentView').hide();
+ App.router.transitionTo();
+ }
+ })
+ });
+ }
});
\ No newline at end of file
diff --git a/ambari-web/test/utils/date/date_test.js
b/ambari-web/test/utils/date/date_test.js
index 5613eaf..241739a 100644
--- a/ambari-web/test/utils/date/date_test.js
+++ b/ambari-web/test/utils/date/date_test.js
@@ -33,9 +33,16 @@ describe('date', function () {
describe('#dateFormat', function () {
it('Should format dates passed as timestamp integers', function () {
- var input = 0;//.toUTCString();
- var expected = "Wed, Dec 31, 1969 19:00";
- var actual = date.dateFormat(input);
+ //This test may seem circular, but we have to test this way because
+ //dateFormat() uses "new Date(timestamp)" to convert the timestamp
integer
+ //into a Date object.The Date constructor automatically uses the
timezone
+ //of the local system to produce a date representation from the
timestamp,
+ //and this cannot be changed. Therefore, to test the formatted string
output,
+ //we parse it back into a timestamp and check that it equals the
original integer.
+
+ var expected = 0;
+ var dateString = date.dateFormat(expected);
+ var actual = Date.parse(dateString);
expect(actual).to.equal(expected);
});
--
To stop receiving notification emails like this one, please contact
[email protected].
