[DE] Matrix Spacing (add layout)

This commit is contained in:
Julia Svinareva 2019-08-29 17:15:35 +03:00
parent d957ff2f8e
commit 78ce4164a4

View file

@ -44,7 +44,7 @@ define([
DE.Views.MatrixSpacingDialog = Common.UI.Window.extend(_.extend({
options: {
width: 214,
width: 240,
header: true,
style: 'min-width: 214px;',
cls: 'modal-dlg'
@ -57,9 +57,40 @@ define([
this.template = [
'<div class="box">',
'<div class="inner-content">',
'<div style="padding-bottom: 16px;">',
'<div style="display: inline-block;">',
'<lable style="display: block; padding-bottom: 4px; font-weight: bold;">' + this.textRowSpacing + '</lable>',
'<lable style="display: block; padding-bottom: 4px;">' + this.textMinimumDistanceBetweenBaselines + '</lable>',
'<div>',
'<div style="display: inline-block; margin-right: 8px;" id="matrix-row-spacing-cmb"></div>',
'<div style="display: inline-block;" id="matrix-row-spacing-spn"></div>',
'</div>',
'</div>',
/*'<div style="display: inline-block;"></div>',*/
'</div>',
'<div style="padding-bottom: 16px;">',
'<div style="display: inline-block;">',
'<lable style="display: block; padding-bottom: 4px; font-weight: bold;">' + this.textColumnSpacingEdges + '</lable>',
'<lable style="display: block; padding-bottom: 4px;">' + this.textMinimumDistanceBetweenColumnEdges + '</lable>',
'<div id="matrix-column-spacing-edges"></div>',
'</div>',
/*'<div style="display: inline-block;"></div>',*/
'</div>',
'<div>',
'<div style="display: inline-block;">',
'<lable style="display: block; padding-bottom: 4px; font-weight: bold;">' + this.textColumnSpacing + '</lable>',
'<lable style="display: block; padding-bottom: 4px;">' + this.textMinimumDistanceBetweenColumns + '</lable>',
'<div>',
'<div style="display: inline-block; margin-right: 8px;" id="matrix-column-spacing-cmb"></div>',
'<div style="display: inline-block;" id="matrix-column-spacing-spn"></div>',
'</div>',
/*'<div style="display: inline-block;"></div>',*/
'</div>',
'</div>',
'<div class="footer center">',
'<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
'<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
'<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
'<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
'</div>'
].join('');
@ -71,6 +102,60 @@ define([
render: function() {
Common.UI.Window.prototype.render.call(this);
this.cmbRowSpacing = new Common.UI.ComboBox({
el: $('#matrix-row-spacing-cmb'),
cls: 'input-group-nr',
editable: false,
data: [],
style: 'width: 130px;',
menuStyle : 'min-width: 130px;'
});
this.cmbRowSpacing.setValue('');
this.cmbRowSpacing.on('selected', _.bind(this.onRowSpacingSelect, this));
this.numRowSpacing = new Common.UI.MetricSpinner({
el: $('#matrix-row-spacing-spn'),
step: .01,
width: 70,
value: '',
defaultUnit : "",
maxValue: 132,
minValue: 0.5
});
this.numRowSpacing.on('change', _.bind(this.onNumRowSpacingChange, this));
this.cmbColumnSpacing = new Common.UI.ComboBox({
el: $('#matrix-column-spacing-cmb'),
cls: 'input-group-nr',
editable: false,
data: [],
style: 'width: 130px;',
menuStyle : 'min-width: 130px;'
});
this.cmbColumnSpacing.setValue('');
this.cmbColumnSpacing.on('selected', _.bind(this.onColumnSpacingSelect, this));
this.numColumnSpacing = new Common.UI.MetricSpinner({
el: $('#matrix-column-spacing-spn'),
step: .01,
width: 70,
value: '',
defaultUnit : "",
maxValue: 132,
minValue: 0.5
});
this.numColumnSpacing.on('change', _.bind(this.onNumColumnSpacingChange, this));
this.numColumnSpacingEdges = new Common.UI.MetricSpinner({
el: $('#matrix-column-spacing-edges'),
step: .01,
width: 70,
value: '',
defaultUnit : "",
maxValue: 132,
minValue: 0.5
});
this.numColumnSpacingEdges.on('change', _.bind(this.onNumColumnSpacingEdgesChange, this));
var $window = this.getChild();
$window.find('.dlg-btn').on('click', _.bind(this.onBtnClick, this));
@ -96,9 +181,35 @@ define([
return false;
},
onRowSpacingSelect: function() {
},
onNumRowSpacingChange: function() {
},
onColumnSpacingSelect: function() {
},
onNumColumnSpacingChange: function() {
},
onNumColumnSpacingEdgesChange: function() {
},
textTitle: 'Matrix Spacing',
cancelButtonText: 'Cancel',
okButtonText: 'Ok',
textRowSpacing: 'RowSpacing',
textMinimumDistanceBetweenBaselines: 'Minimum distance between baselines',
textColumnSpacingEdges: 'Column Spacing Edges',
textMinimumDistanceBetweenColumnEdges: 'Minimum distance between column edges',
textColumnSpacing: 'Column Spacing',
textMinimumDistanceBetweenColumns: 'Minimum distance between columns'
}, DE.Views.MatrixSpacingDialog || {}))
});