Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

[DE] Add paragraph indents to right panel

Browse source
This commit is contained in:
Julia Radzhabova 2021-01-19 11:17:04 +03:00
parent 380a5cba92
commit 977b6c9d30
2 changed files with 192 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

33
apps/documenteditor/main/app/template/ParagraphSettings.template
View file

@ -32,6 +32,39 @@
<div id="paragraph-checkbox-add-interval"></div>
</td>
</tr>
<tr>
<td class="padding-small" colspan=2>
<div class="separator horizontal"></div>
</td>
</tr>
<tr>
<td colspan=2>
<label class="header"><%= scope.strIndent %></label>
</td>
</tr>
<tr>
<td class="padding-small" width="50%">
<label class="input-label"><%= scope.strIndentsLeftText %></label>
<div id="paragraph-spin-indent-left"></div>
</td>
<td class="padding-small" width="50%">
<label class="input-label"><%= scope.strIndentsRightText %></label>
<div id="paragraph-spin-indent-right"></div>
</td>
</tr>
<tr>
<td colspan=2>
<label class="input-label"><%= scope.strIndentsSpecial %></label>
</td>
</tr>
<tr>
<td class="padding-small" width="50%">
<div id="paragraph-combo-special" style="width: 85px;"></div>
</td>
<td class="padding-small" width="50%">
<div id="paragraph-spin-special-by"></div>
</td>
</tr>
<tr class="text-only">
<td class="padding-small" colspan=2>
<div class="separator horizontal"></div>

161
apps/documenteditor/main/app/view/ParagraphSettings.js
View file

@ -77,7 +77,11 @@ define([
AddInterval: false,
BackColor: '#000000',
DisabledControls: true,
HideTextOnlySettings: false
HideTextOnlySettings: false,
LeftIndent: null,
RightIndent: null,
FirstLine: null,
CurSpecial: undefined
};
this.spinners = [];
this.lockedControls = [];
@ -90,6 +94,12 @@ define([
{displayValue: this.textExact, defaultValue: 5, value: c_paragraphLinerule.LINERULE_EXACT, minValue: 0.03, step: 0.01, defaultUnit: 'cm'}
];
this._arrSpecial = [
{displayValue: this.textNoneSpecial, value: c_paragraphSpecial.NONE_SPECIAL, defaultValue: 0},
{displayValue: this.textFirstLine, value: c_paragraphSpecial.FIRST_LINE, defaultValue: 12.7},
{displayValue: this.textHanging, value: c_paragraphSpecial.HANGING, defaultValue: 12.7}
];
this.render();
},
@ -169,6 +179,56 @@ define([
});
this.lockedControls.push(this.btnColor);
this.numIndentsLeft = new Common.UI.MetricSpinner({
el: $markup.findById('#paragraph-spin-indent-left'),
step: .1,
width: 85,
defaultUnit : "cm",
defaultValue : 0,
value: '0 cm',
maxValue: 55.87,
minValue: -55.87
});
this.spinners.push(this.numIndentsLeft);
this.lockedControls.push(this.numIndentsLeft);
this.numIndentsRight = new Common.UI.MetricSpinner({
el: $markup.findById('#paragraph-spin-indent-right'),
step: .1,
width: 85,
defaultUnit : "cm",
defaultValue : 0,
value: '0 cm',
maxValue: 55.87,
minValue: -55.87
});
this.spinners.push(this.numIndentsRight);
this.lockedControls.push(this.numIndentsRight);
this.cmbSpecial = new Common.UI.ComboBox({
el: $markup.findById('#paragraph-combo-special'),
cls: 'input-group-nr',
editable: false,
data: this._arrSpecial,
style: 'width: 85px;',
menuStyle : 'min-width: 85px;'
});
this.cmbSpecial.setValue('');
this.lockedControls.push(this.cmbSpecial);
this.numSpecialBy = new Common.UI.MetricSpinner({
el: $markup.findById('#paragraph-spin-special-by'),
step: .1,
width: 85,
defaultUnit : "cm",
defaultValue : 0,
value: '0 cm',
maxValue: 55.87,
minValue: 0
});
this.spinners.push(this.numSpecialBy);
this.lockedControls.push(this.numSpecialBy);
this.numLineHeight.on('change', this.onNumLineHeightChange.bind(this));
this.numSpacingBefore.on('change', this.onNumSpacingBeforeChange.bind(this));
this.numSpacingAfter.on('change', this.onNumSpacingAfterChange.bind(this));
@ -179,6 +239,11 @@ define([
this.cmbLineRule.on('selected', this.onLineRuleSelect.bind(this));
this.cmbLineRule.on('hide:after', this.onHideMenus.bind(this));
this.btnColor.on('color:select', this.onColorPickerSelect.bind(this));
this.numIndentsLeft.on('change', this.onNumIndentsLeftChange.bind(this));
this.numIndentsRight.on('change', this.onNumIndentsRightChange.bind(this));
this.numSpecialBy.on('change', this.onFirstLineChange.bind(this));
this.cmbSpecial.on('selected', _.bind(this.onSpecialSelect, this));
this.linkAdvanced = $markup.findById('#paragraph-advanced-link');
this.linkAdvanced.toggleClass('disabled', this._locked);
@ -280,6 +345,61 @@ define([
this.fireEvent('editcomplete', this);
},
onSpecialSelect: function(combo, record) {
var special = record.value,
specialBy = (special === c_paragraphSpecial.NONE_SPECIAL) ? 0 : this.numSpecialBy.getNumberValue();
specialBy = Common.Utils.Metric.fnRecalcToMM(specialBy);
if (specialBy === 0) {
specialBy = this._arrSpecial[special].defaultValue;
}
if (special === c_paragraphSpecial.HANGING) {
specialBy = -specialBy;
}
var props = new Asc.asc_CParagraphProperty();
props.put_Ind(new Asc.asc_CParagraphInd());
props.get_Ind().put_FirstLine(specialBy);
if (this.api)
this.api.paraApply(props);
this.fireEvent('editcomplete', this);
},
onFirstLineChange: function(field, newValue, oldValue, eOpts){
var specialBy = Common.Utils.Metric.fnRecalcToMM(field.getNumberValue());
if (this._state.CurSpecial === c_paragraphSpecial.HANGING) {
specialBy = -specialBy;
}
var props = new Asc.asc_CParagraphProperty();
props.put_Ind(new Asc.asc_CParagraphInd());
props.get_Ind().put_FirstLine(specialBy);
if (this.api)
this.api.paraApply(props);
this.fireEvent('editcomplete', this);
},
onNumIndentsLeftChange: function(field, newValue, oldValue, eOpts){
var left = field.getNumberValue();
if (this._state.FirstLine<0) {
left = left-this._state.FirstLine;
}
var props = new Asc.asc_CParagraphProperty();
props.put_Ind(new Asc.asc_CParagraphInd());
props.get_Ind().put_Left(Common.Utils.Metric.fnRecalcToMM(left));
if (this.api)
this.api.paraApply(props);
this.fireEvent('editcomplete', this);
},
onNumIndentsRightChange: function(field, newValue, oldValue, eOpts){
var props = new Asc.asc_CParagraphProperty();
props.put_Ind(new Asc.asc_CParagraphInd());
props.get_Ind().put_Right(Common.Utils.Metric.fnRecalcToMM(field.getNumberValue()));
if (this.api)
this.api.paraApply(props);
this.fireEvent('editcomplete', this);
},
ChangeSettings: function(prop) {
if (this._initSettings)
this.createDelayedElements();
@ -340,6 +460,36 @@ define([
this._state.AddInterval=other.ContextualSpacing;
}
var indents = prop.get_Ind(),
first = (indents !== null) ? indents.get_FirstLine() : null,
left = (indents !== null) ? indents.get_Left() : null;
if (first<0 && left !== null)
left = left + first;
if ( Math.abs(this._state.LeftIndent-left)>0.001 ||
(this._state.LeftIndent===null || left===null)&&(this._state.LeftIndent!==left)) {
this.numIndentsLeft.setValue(left!==null ? Common.Utils.Metric.fnRecalcFromMM(left) : '', true);
this._state.LeftIndent=left;
}
if ( Math.abs(this._state.FirstLine-first)>0.001 ||
(this._state.FirstLine===null || first===null)&&(this._state.FirstLine!==first)) {
this.numSpecialBy.setValue(first!==null ? Math.abs(Common.Utils.Metric.fnRecalcFromMM(first)) : '', true);
this._state.FirstLine=first;
}
var value = (indents !== null) ? indents.get_Right() : null;
if ( Math.abs(this._state.RightIndent-value)>0.001 ||
(this._state.RightIndent===null || value===null)&&(this._state.RightIndent!==value)) {
this.numIndentsRight.setValue(value!==null ? Common.Utils.Metric.fnRecalcFromMM(value) : '', true);
this._state.RightIndent=value;
}
value = (first === 0) ? c_paragraphSpecial.NONE_SPECIAL : ((first > 0) ? c_paragraphSpecial.FIRST_LINE : c_paragraphSpecial.HANGING);
if ( this._state.CurSpecial!==value ) {
this.cmbSpecial.setValue(value);
this._state.CurSpecial=value;
}
var shd = prop.get_Shade();
if (shd!==null && shd!==undefined && shd.get_Value()===Asc.c_oAscShdClear) {
var color = shd.get_Color();
@ -485,6 +635,13 @@ define([
textAdvanced: 'Show advanced settings',
textAt: 'At',
txtAutoText: 'Auto',
textBackColor: 'Background color'
textBackColor: 'Background color',
strIndent: 'Indents',
strIndentsLeftText: 'Left',
strIndentsRightText: 'Right',
strIndentsSpecial: 'Special',
textNoneSpecial: '(none)',
textFirstLine: 'First line',
textHanging: 'Hanging'
}, DE.Views.ParagraphSettings || {}));
});