[PE] Refactoring advanced settings and document info: apply button is always visible
This commit is contained in:
Julia Radzhabova
parent
9d0fda6105
commit
08b5e32261
|
|
@ -180,7 +180,8 @@ define([
|
|||
menu: undefined,
|
||||
|
||||
template: _.template([
|
||||
'<table><tbody>',
|
||||
'<div id="fms-flex-settings">',
|
||||
'<table style="margin: 30px 0 0;"><tbody>',
|
||||
'<tr class="edit">',
|
||||
'<td class="left"><label><%= scope.txtSpellCheck %></label></td>',
|
||||
'<td class="right"><div id="fms-chb-spell-check"></div></td>',
|
||||
|
|
@ -235,11 +236,16 @@ define([
|
|||
'<div><div id="fms-cmb-macros" style="display: inline-block; margin-right: 15px;vertical-align: middle;"></div>',
|
||||
'<label id="fms-lbl-macros" style="vertical-align: middle;"><%= scope.txtWarnMacrosDesc %></label></div></td>',
|
||||
'</tr>','<tr class="divider macros"></tr>',
|
||||
'</tbody></table>',
|
||||
'</div>',
|
||||
'<div>',
|
||||
'<table style="margin: 10px 0;"><tbody>',
|
||||
'<tr>',
|
||||
'<td class="left"></td>',
|
||||
'<td class="right"><button id="fms-btn-apply" class="btn normal dlg-btn primary"><%= scope.okButtonText %></button></td>',
|
||||
'</tr>',
|
||||
'</tbody></table>'
|
||||
'</tbody></table>',
|
||||
'</div>'
|
||||
].join('')),
|
||||
|
||||
initialize: function(options) {
|
||||
|
|
@ -267,7 +273,7 @@ define([
|
|||
style : 'width: 160px;',
|
||||
editable : false,
|
||||
cls : 'input-group-nr',
|
||||
menuStyle : 'max-height: 210px;',
|
||||
menuStyle : 'max-height: 157px;',
|
||||
data : [
|
||||
{ value: -1, displayValue: this.txtFitSlide },
|
||||
{ value: -2, displayValue: this.txtFitWidth },
|
||||
|
|
@ -389,16 +395,24 @@ define([
|
|||
|
||||
this.btnApply.on('click', _.bind(this.applySettings, this));
|
||||
|
||||
this.pnlSettings = $markup.findById('#fms-flex-settings');
|
||||
|
||||
this.$el = $(node).html($markup);
|
||||
|
||||
if (_.isUndefined(this.scroller)) {
|
||||
this.scroller = new Common.UI.Scroller({
|
||||
el: this.$el,
|
||||
el: this.pnlSettings,
|
||||
suppressScrollX: true,
|
||||
alwaysVisibleY: true
|
||||
});
|
||||
}
|
||||
|
||||
Common.NotificationCenter.on({
|
||||
'window:resize': function() {
|
||||
me.isVisible() && me.updateScroller();
|
||||
}
|
||||
});
|
||||
|
||||
return this;
|
||||
},
|
||||
|
||||
|
|
@ -406,7 +420,14 @@ define([
|
|||
Common.UI.BaseView.prototype.show.call(this,arguments);
|
||||
|
||||
this.updateSettings();
|
||||
this.scroller && this.scroller.update();
|
||||
this.updateScroller();
|
||||
},
|
||||
|
||||
updateScroller: function() {
|
||||
if (this.scroller) {
|
||||
this.scroller.update();
|
||||
this.pnlSettings.toggleClass('bordered', this.scroller.isVisible());
|
||||
}
|
||||
},
|
||||
|
||||
setMode: function(mode) {
|
||||
|
|
@ -731,7 +752,8 @@ define([
|
|||
this.rendered = false;
|
||||
|
||||
this.template = _.template([
|
||||
'<table class="main">',
|
||||
'<div id="fms-flex-info">',
|
||||
'<table class="main" style="margin: 30px 0 0;">',
|
||||
'<tr>',
|
||||
'<td class="left"><label>' + this.txtPlacement + '</label></td>',
|
||||
'<td class="right"><label id="id-info-placement">-</label></td>',
|
||||
|
|
@ -792,12 +814,17 @@ define([
|
|||
'</table>',
|
||||
'</div></td>',
|
||||
'</tr>',
|
||||
'<tr class="divider"></tr>',
|
||||
'<tr style="height: 5px;"></tr>',
|
||||
'</table>',
|
||||
'</div>',
|
||||
'<div id="fms-flex-apply">',
|
||||
'<table class="main" style="margin: 10px 0;">',
|
||||
'<tr>',
|
||||
'<td class="left"></td>',
|
||||
'<td class="right"><button id="fminfo-btn-apply" class="btn normal dlg-btn primary"><%= scope.okButtonText %></button></td>',
|
||||
'</tr>',
|
||||
'</table>'
|
||||
'</table>',
|
||||
'</div>'
|
||||
].join(''));
|
||||
|
||||
this.menu = options.menu;
|
||||
|
|
@ -864,6 +891,7 @@ define([
|
|||
idx = me.tblAuthor.find('tr').index(el);
|
||||
el.remove();
|
||||
me.authors.splice(idx, 1);
|
||||
me.updateScroller(true);
|
||||
}
|
||||
});
|
||||
|
||||
|
|
@ -885,6 +913,7 @@ define([
|
|||
if (!isFromApply) {
|
||||
var div = $(Common.Utils.String.format(me.authorTpl, Common.Utils.String.htmlEncode(str)));
|
||||
me.trAuthor.before(div);
|
||||
me.updateScroller();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
@ -897,6 +926,9 @@ define([
|
|||
});
|
||||
this.btnApply.on('click', _.bind(this.applySettings, this));
|
||||
|
||||
this.pnlInfo = $markup.findById('#fms-flex-info');
|
||||
this.pnlApply = $markup.findById('#fms-flex-apply');
|
||||
|
||||
this.rendered = true;
|
||||
|
||||
this.updateInfo(this.doc);
|
||||
|
|
@ -904,12 +936,18 @@ define([
|
|||
this.$el = $(node).html($markup);
|
||||
if (_.isUndefined(this.scroller)) {
|
||||
this.scroller = new Common.UI.Scroller({
|
||||
el: this.$el,
|
||||
el: this.pnlInfo,
|
||||
suppressScrollX: true,
|
||||
alwaysVisibleY: true
|
||||
});
|
||||
}
|
||||
|
||||
Common.NotificationCenter.on({
|
||||
'window:resize': function() {
|
||||
me.isVisible() && me.updateScroller();
|
||||
}
|
||||
});
|
||||
|
||||
return this;
|
||||
},
|
||||
|
||||
|
|
@ -917,13 +955,24 @@ define([
|
|||
Common.UI.BaseView.prototype.show.call(this,arguments);
|
||||
|
||||
this.updateFileInfo();
|
||||
this.scroller && this.scroller.update();
|
||||
this.scroller && this.scroller.scrollTop(0);
|
||||
this.updateScroller();
|
||||
},
|
||||
|
||||
hide: function() {
|
||||
Common.UI.BaseView.prototype.hide.call(this,arguments);
|
||||
},
|
||||
|
||||
updateScroller: function(destroy) {
|
||||
if (this.scroller) {
|
||||
this.scroller.update(destroy ? {
|
||||
suppressScrollX: true,
|
||||
alwaysVisibleY: true
|
||||
} : undefined);
|
||||
this.pnlInfo.toggleClass('bordered', this.scroller.isVisible());
|
||||
}
|
||||
},
|
||||
|
||||
updateInfo: function(doc) {
|
||||
if (!this.doc && doc && doc.info) {
|
||||
doc.info.author && console.log("Obsolete: The 'author' parameter of the document 'info' section is deprecated. Please use 'owner' instead.");
|
||||
|
|
@ -1034,7 +1083,7 @@ define([
|
|||
setMode: function(mode) {
|
||||
this.mode = mode;
|
||||
this.inputAuthor.setVisible(mode.isEdit);
|
||||
this.btnApply.setVisible(mode.isEdit);
|
||||
this.pnlApply.toggleClass('hidden', !mode.isEdit);
|
||||
this.tblAuthor.find('.close').toggleClass('hidden', !mode.isEdit);
|
||||
if (!mode.isEdit) {
|
||||
this.inputTitle._input.attr('placeholder', '');
|
||||
|
|
@ -1107,7 +1156,7 @@ define([
|
|||
this.rendered = false;
|
||||
|
||||
this.template = _.template([
|
||||
'<table class="main">',
|
||||
'<table class="main" style="margin: 30px 0;">',
|
||||
'<tr class="rights">',
|
||||
'<td class="left" style="vertical-align: top;"><label>' + this.txtRights + '</label></td>',
|
||||
'<td class="right"><div id="id-info-rights"></div></td>',
|
||||
|
|
|
|||
|
|
@ -190,9 +190,19 @@
|
|||
}
|
||||
|
||||
#panel-settings {
|
||||
padding: 0 30px;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
#fms-flex-settings {
|
||||
&.bordered {
|
||||
border-bottom: 1px solid @gray;
|
||||
}
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
table {
|
||||
margin: 30px 0;
|
||||
width: 100%;
|
||||
|
||||
tr {
|
||||
|
|
@ -375,9 +385,27 @@
|
|||
}
|
||||
}
|
||||
|
||||
#panel-info,
|
||||
#panel-info {
|
||||
padding: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
#fms-flex-info {
|
||||
&.bordered {
|
||||
border-bottom: 1px solid @gray;
|
||||
}
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
#panel-rights {
|
||||
padding: 0 30px;
|
||||
}
|
||||
|
||||
#panel-info,
|
||||
#panel-rights {
|
||||
table {
|
||||
tr {
|
||||
td {
|
||||
|
|
@ -406,7 +434,6 @@
|
|||
|
||||
&.main {
|
||||
width: 100%;
|
||||
margin: 30px 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue