Merge pull request #4 from ONLYOFFICE/feature/de-shape-size
Feature/de shape size
This commit is contained in:
commit
9d422d19f3
|
@ -20,6 +20,76 @@
|
|||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div id="id-adv-shape-size" class="settings-panel active">
|
||||
<div class="inner-content">
|
||||
<table cols="3">
|
||||
<tr>
|
||||
<td colspan="3">
|
||||
<label class="header"><%= scope.textWidth %></label>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="vertical-align: bottom; padding-bottom: 12px;">
|
||||
<div id="shape-radio-hsize"></div>
|
||||
</td>
|
||||
<td class="padding-small">
|
||||
<label class="input-label"><%= scope.textAbsoluteWH %></label>
|
||||
<div id="shape-advanced-spin-width"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="vertical-align: bottom; padding-bottom: 19px;">
|
||||
<div id="shape-radio-hsizepc"></div>
|
||||
</td>
|
||||
<td class="padding-large" style="padding-right: 15px;">
|
||||
<label class="input-label"><%= scope.textRelativeWH %></label>
|
||||
<div id="shape-advanced-spin-width-rel"></div>
|
||||
</td>
|
||||
<td class="padding-large">
|
||||
<label class="input-label"><%= scope.textRelative %></label>
|
||||
<div id="shape-combo-width-rel" style="width: 115px;"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="3">
|
||||
<label class="header"><%= scope.textHeight %></label>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="vertical-align: bottom; padding-bottom: 12px;">
|
||||
<div id="shape-radio-vsize"></div>
|
||||
</td>
|
||||
<td class="padding-small">
|
||||
<label class="input-label"><%= scope.textAbsoluteWH %></label>
|
||||
<div id="shape-advanced-spin-height"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="vertical-align: bottom; padding-bottom: 19px;">
|
||||
<div id="shape-radio-vsizepc"></div>
|
||||
</td>
|
||||
<td class="padding-large" style="padding-right: 15px;">
|
||||
<label class="input-label"><%= scope.textRelativeWH %></label>
|
||||
<div id="shape-advanced-spin-height-rel"></div>
|
||||
</td>
|
||||
<td class="padding-large">
|
||||
<label class="input-label"><%= scope.textRelative %></label>
|
||||
<div id="shape-combo-height-rel" style="width: 115px;"></div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<div class="separator horizontal padding-large"></div>
|
||||
<div class="inner-content">
|
||||
<table cols="1" style="width: 100%;">
|
||||
<tr>
|
||||
<td>
|
||||
<div id="shape-checkbox-ratio"></div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div id="id-adv-image-wrap" class="settings-panel">
|
||||
<div class="inner-content padding-large">
|
||||
<label class="header padding-small"><%= scope.textWrap %></label>
|
||||
|
|
|
@ -62,6 +62,7 @@ define([ 'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
|
|||
title: this.textTitle,
|
||||
items: [
|
||||
{panelId: 'id-adv-image-width', panelCaption: this.textSize},
|
||||
{panelId: 'id-adv-shape-size', panelCaption: this.textSize},
|
||||
{panelId: 'id-adv-image-wrap', panelCaption: this.textBtnWrap},
|
||||
{panelId: 'id-adv-image-position', panelCaption: this.textPosition},
|
||||
{panelId: 'id-adv-image-shape', panelCaption: this.textShape},
|
||||
|
@ -80,10 +81,12 @@ define([ 'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
|
|||
HAlignFrom: Asc.c_oAscRelativeFromH.Character,
|
||||
HPositionFrom: Asc.c_oAscRelativeFromH.Character,
|
||||
HPositionPcFrom: Asc.c_oAscRelativeFromH.Page,
|
||||
ShapeWidthPcFrom: Asc.c_oAscRelativeFromH.Margin,
|
||||
VAlignType: Asc.c_oAscAlignV.Top,
|
||||
VAlignFrom: Asc.c_oAscRelativeFromV.Line,
|
||||
VPositionFrom: Asc.c_oAscRelativeFromV.Line,
|
||||
VPositionPcFrom: Asc.c_oAscRelativeFromV.Page,
|
||||
ShapeHeightPcFrom: Asc.c_oAscRelativeFromV.Margin,
|
||||
spnXChanged: false,
|
||||
spnYChanged: false,
|
||||
spnXPcChanged: false,
|
||||
|
@ -105,6 +108,7 @@ define([ 'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
|
|||
|
||||
var me = this;
|
||||
|
||||
// Image & Chart Size
|
||||
this.spnWidth = new Common.UI.MetricSpinner({
|
||||
el: $('#image-advanced-spin-width'),
|
||||
step: .1,
|
||||
|
@ -186,6 +190,177 @@ define([ 'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
|
|||
}
|
||||
}, this));
|
||||
|
||||
// Shape Size
|
||||
this.radioHSize = new Common.UI.RadioBox({
|
||||
el: $('#shape-radio-hsize'),
|
||||
name: 'asc-radio-width',
|
||||
checked: true
|
||||
});
|
||||
this.radioHSize.on('change', _.bind(this.onRadioHSizeChange, this));
|
||||
|
||||
this.radioHSizePc = new Common.UI.RadioBox({
|
||||
el: $('#shape-radio-hsizepc'),
|
||||
name: 'asc-radio-width'
|
||||
});
|
||||
this.radioHSizePc.on('change', _.bind(this.onRadioHSizePcChange, this));
|
||||
|
||||
this.radioVSize = new Common.UI.RadioBox({
|
||||
el: $('#shape-radio-vsize'),
|
||||
name: 'asc-radio-height',
|
||||
checked: true
|
||||
});
|
||||
this.radioVSize.on('change', _.bind(this.onRadioVSizeChange, this));
|
||||
|
||||
this.radioVSizePc = new Common.UI.RadioBox({
|
||||
el: $('#shape-radio-vsizepc'),
|
||||
name: 'asc-radio-height'
|
||||
});
|
||||
this.radioVSizePc.on('change', _.bind(this.onRadioVSizePcChange, this));
|
||||
|
||||
this.chRatio = new Common.UI.CheckBox({
|
||||
el: $('#shape-checkbox-ratio'),
|
||||
labelText: this.textAspectRatio
|
||||
});
|
||||
this.chRatio.on('change', _.bind(function(field, newValue, oldValue, eOpts){
|
||||
if ((field.getValue()=='checked') && this.spnShapeHeight.getNumberValue()>0) {
|
||||
this._nRatio = this.spnShapeWidth.getNumberValue()/this.spnShapeHeight.getNumberValue();
|
||||
}
|
||||
}, this));
|
||||
|
||||
this.spnShapeWidth = new Common.UI.MetricSpinner({
|
||||
el: $('#shape-advanced-spin-width'),
|
||||
step: .1,
|
||||
width: 80,
|
||||
defaultUnit : "cm",
|
||||
value: '3 cm',
|
||||
maxValue: 55.88,
|
||||
minValue: 0
|
||||
});
|
||||
this.spnShapeWidth.on('change', _.bind(function(field, newValue, oldValue, eOpts){
|
||||
if (this.chRatio.getValue()=='checked' && !this.chRatio.isDisabled()) {
|
||||
var w = field.getNumberValue();
|
||||
var h = w/this._nRatio;
|
||||
if (h>this.sizeMax.height) {
|
||||
h = this.sizeMax.height;
|
||||
w = h * this._nRatio;
|
||||
this.spnShapeWidth.setValue(w, true);
|
||||
}
|
||||
this.spnShapeHeight.setValue(h, true);
|
||||
}
|
||||
if (this._changedProps) {
|
||||
this._changedProps.put_Width(Common.Utils.Metric.fnRecalcToMM(field.getNumberValue()));
|
||||
this.fillShapeHeight();
|
||||
}
|
||||
}, this));
|
||||
this.spinners.push(this.spnShapeWidth);
|
||||
|
||||
this.spnShapeHeight = new Common.UI.MetricSpinner({
|
||||
el: $('#shape-advanced-spin-height'),
|
||||
step: .1,
|
||||
width: 80,
|
||||
defaultUnit : "cm",
|
||||
value: '3 cm',
|
||||
maxValue: 55.88,
|
||||
minValue: 0
|
||||
});
|
||||
this.spnShapeHeight.on('change', _.bind(function(field, newValue, oldValue, eOpts){
|
||||
var h = field.getNumberValue(), w = null;
|
||||
if (this.chRatio.getValue()=='checked' && !this.chRatio.isDisabled()) {
|
||||
w = h * this._nRatio;
|
||||
if (w>this.sizeMax.width) {
|
||||
w = this.sizeMax.width;
|
||||
h = w/this._nRatio;
|
||||
this.spnShapeHeight.setValue(h, true);
|
||||
}
|
||||
this.spnShapeWidth.setValue(w, true);
|
||||
}
|
||||
if (this._changedProps) {
|
||||
this._changedProps.put_Height(Common.Utils.Metric.fnRecalcToMM(field.getNumberValue()));
|
||||
this.fillShapeWidth();
|
||||
}
|
||||
}, this));
|
||||
this.spinners.push(this.spnShapeHeight);
|
||||
|
||||
this.spnShapeWidthPc = new Common.UI.MetricSpinner({
|
||||
el: $('#shape-advanced-spin-width-rel'),
|
||||
disabled: true,
|
||||
step: 1,
|
||||
width: 80,
|
||||
defaultUnit : "%",
|
||||
value: '1 %',
|
||||
maxValue: 1000,
|
||||
minValue: 1
|
||||
});
|
||||
this.spnShapeWidthPc.on('change', _.bind(function(field, newValue, oldValue, eOpts){
|
||||
if (this._changedProps) {
|
||||
if (this._changedProps.get_SizeRelH()===null || this._changedProps.get_SizeRelH()===undefined)
|
||||
this._changedProps.put_SizeRelH(new Asc.CImagePositionH());
|
||||
|
||||
this._changedProps.get_SizeRelH().put_Value(field.getNumberValue());
|
||||
this._changedProps.get_SizeRelH().put_RelativeFrom(this._state.ShapeWidthPcFrom);
|
||||
|
||||
this.fillShapeHeight();
|
||||
}
|
||||
}, this));
|
||||
|
||||
this.spnShapeHeightPc = new Common.UI.MetricSpinner({
|
||||
el: $('#shape-advanced-spin-height-rel'),
|
||||
disabled: true,
|
||||
step: 1,
|
||||
width: 80,
|
||||
defaultUnit : "%",
|
||||
value: '1 %',
|
||||
maxValue: 1000,
|
||||
minValue: 1
|
||||
});
|
||||
this.spnShapeHeightPc.on('change', _.bind(function(field, newValue, oldValue, eOpts){
|
||||
if (this._changedProps) {
|
||||
if (this._changedProps.get_SizeRelV()===null || this._changedProps.get_SizeRelV()===undefined)
|
||||
this._changedProps.put_SizeRelV(new Asc.CImagePositionV());
|
||||
|
||||
this._changedProps.get_SizeRelV().put_Value(field.getNumberValue());
|
||||
this._changedProps.get_SizeRelV().put_RelativeFrom(this._state.ShapeHeightPcFrom);
|
||||
|
||||
this.fillShapeWidth();
|
||||
}
|
||||
}, this));
|
||||
|
||||
this._arrHRelativePc = [
|
||||
{displayValue: this.textLeftMargin, value: Asc.c_oAscRelativeFromH.LeftMargin},
|
||||
{displayValue: this.textMargin, value: Asc.c_oAscRelativeFromH.Margin},
|
||||
{displayValue: this.textPage, value: Asc.c_oAscRelativeFromH.Page},
|
||||
{displayValue: this.textRightMargin, value: Asc.c_oAscRelativeFromH.RightMargin}
|
||||
];
|
||||
|
||||
this.cmbWidthPc = new Common.UI.ComboBox({
|
||||
el: $('#shape-combo-width-rel'),
|
||||
cls: 'input-group-nr',
|
||||
menuStyle: 'min-width: 115px;',
|
||||
editable: false,
|
||||
data: this._arrHRelativePc
|
||||
});
|
||||
this.cmbWidthPc.setDisabled(true);
|
||||
this.cmbWidthPc.setValue(this._state.ShapeWidthPcFrom);
|
||||
this.cmbWidthPc.on('selected', _.bind(this.onCmbWidthPcSelect, this));
|
||||
|
||||
this._arrVRelativePc = [
|
||||
{displayValue: this.textMargin, value: Asc.c_oAscRelativeFromV.Margin},
|
||||
{displayValue: this.textBottomMargin, value: Asc.c_oAscRelativeFromV.BottomMargin},
|
||||
{displayValue: this.textPage, value: Asc.c_oAscRelativeFromV.Page},
|
||||
{displayValue: this.textTopMargin, value: Asc.c_oAscRelativeFromV.TopMargin}
|
||||
];
|
||||
|
||||
this.cmbHeightPc = new Common.UI.ComboBox({
|
||||
el: $('#shape-combo-height-rel'),
|
||||
cls: 'input-group-nr',
|
||||
menuStyle: 'min-width: 115px;',
|
||||
editable: false,
|
||||
data: this._arrVRelativePc
|
||||
});
|
||||
this.cmbHeightPc.setDisabled(true);
|
||||
this.cmbHeightPc.setValue(this._state.ShapeHeightPcFrom);
|
||||
this.cmbHeightPc.on('selected', _.bind(this.onCmbHeightPcSelect, this));
|
||||
|
||||
// Wrapping
|
||||
|
||||
this.btnWrapInline = new Common.UI.Button({
|
||||
|
@ -471,13 +646,6 @@ define([ 'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
|
|||
}
|
||||
}, this));
|
||||
|
||||
this._arrHRelativePc = [
|
||||
{displayValue: this.textLeftMargin, value: Asc.c_oAscRelativeFromH.LeftMargin},
|
||||
{displayValue: this.textMargin, value: Asc.c_oAscRelativeFromH.Margin},
|
||||
{displayValue: this.textPage, value: Asc.c_oAscRelativeFromH.Page},
|
||||
{displayValue: this.textRightMargin, value: Asc.c_oAscRelativeFromH.RightMargin}
|
||||
];
|
||||
|
||||
this.cmbHPositionPc = new Common.UI.ComboBox({
|
||||
el: $('#image-combo-hpositionpc'),
|
||||
cls: 'input-group-nr',
|
||||
|
@ -560,13 +728,6 @@ define([ 'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
|
|||
}
|
||||
}, this));
|
||||
|
||||
this._arrVRelativePc = [
|
||||
{displayValue: this.textMargin, value: Asc.c_oAscRelativeFromV.Margin},
|
||||
{displayValue: this.textBottomMargin, value: Asc.c_oAscRelativeFromV.BottomMargin},
|
||||
{displayValue: this.textPage, value: Asc.c_oAscRelativeFromV.Page},
|
||||
{displayValue: this.textTopMargin, value: Asc.c_oAscRelativeFromV.TopMargin}
|
||||
];
|
||||
|
||||
this.cmbVPositionPc = new Common.UI.ComboBox({
|
||||
el: $('#image-combo-vpositionpc'),
|
||||
cls: 'input-group-nr',
|
||||
|
@ -906,6 +1067,26 @@ define([ 'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
|
|||
afterRender: function() {
|
||||
this.updateMetricUnit();
|
||||
this._setDefaults(this._originalProps);
|
||||
|
||||
var btnCategoryShapeSize, btnCategoryImageSize;
|
||||
_.each(this.btnsCategory, function(btn) {
|
||||
if (btn.options.contentTarget == 'id-adv-image-width')
|
||||
btnCategoryImageSize = btn;
|
||||
else if(btn.options.contentTarget == 'id-adv-shape-size')
|
||||
btnCategoryShapeSize = btn;
|
||||
});
|
||||
|
||||
this.content_panels.filter('.active').removeClass('active');
|
||||
|
||||
if (this._objectType == Asc.c_oAscTypeSelectElement.Shape) {
|
||||
btnCategoryImageSize.hide();
|
||||
btnCategoryShapeSize.toggle(true, true);
|
||||
$("#" + btnCategoryShapeSize.options.contentTarget).addClass('active');
|
||||
} else {
|
||||
btnCategoryShapeSize.hide();
|
||||
btnCategoryImageSize.toggle(true, true);
|
||||
$("#" + btnCategoryImageSize.options.contentTarget).addClass('active');
|
||||
}
|
||||
},
|
||||
|
||||
_setDefaults: function(props) {
|
||||
|
@ -958,13 +1139,6 @@ define([ 'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
|
|||
this._DisableElem(Asc.c_oAscWrapStyle2.Inline);
|
||||
}
|
||||
|
||||
this.spnWidth.setMaxValue(this.sizeMax.width);
|
||||
this.spnHeight.setMaxValue(this.sizeMax.height);
|
||||
value = props.get_Width();
|
||||
this.spnWidth.setValue((value!==undefined) ? Common.Utils.Metric.fnRecalcFromMM(value).toFixed(2) : '', true);
|
||||
value = props.get_Height();
|
||||
this.spnHeight.setValue((value!==undefined) ? Common.Utils.Metric.fnRecalcFromMM(value).toFixed(2) : '', true);
|
||||
|
||||
if (props.get_Paddings()) {
|
||||
var Paddings = {
|
||||
Top: props.get_Paddings().get_Top(),
|
||||
|
@ -1081,15 +1255,58 @@ define([ 'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
|
|||
|
||||
this.btnOriginalSize.setVisible(!(shapeprops || chartprops));
|
||||
this.btnOriginalSize.setDisabled(props.get_ImageUrl()===null || props.get_ImageUrl()===undefined);
|
||||
this.btnsCategory[3].setVisible(shapeprops!==null && !shapeprops.get_FromChart()); // Shapes
|
||||
this.btnsCategory[4].setVisible(shapeprops!==null && !shapeprops.get_FromChart()); // Margins
|
||||
this.btnsCategory[1].setDisabled(props.get_FromGroup()); // Wrapping
|
||||
this.btnsCategory[4].setVisible(shapeprops!==null && !shapeprops.get_FromChart()); // Shapes
|
||||
this.btnsCategory[5].setVisible(shapeprops!==null && !shapeprops.get_FromChart()); // Margins
|
||||
this.btnsCategory[2].setDisabled(props.get_FromGroup()); // Wrapping
|
||||
|
||||
if (shapeprops) {
|
||||
this._objectType = Asc.c_oAscTypeSelectElement.Shape;
|
||||
this._setShapeDefaults(shapeprops);
|
||||
this.setTitle(this.textTitleShape);
|
||||
value = Common.localStorage.getItem("de-settings-shaperatio");
|
||||
if (value!==null && parseInt(value) == 1) {
|
||||
this.chRatio.setValue(true);
|
||||
}
|
||||
|
||||
this.spnShapeWidth.setMaxValue(this.sizeMax.width);
|
||||
this.spnShapeHeight.setMaxValue(this.sizeMax.height);
|
||||
|
||||
var sizeRelH = props.get_SizeRelH();
|
||||
if (sizeRelH) {
|
||||
this.radioHSizePc.setValue(true);
|
||||
this.spnShapeWidthPc.setValue(sizeRelH.get_Value());
|
||||
value = sizeRelH.get_RelativeFrom();
|
||||
for (i=0; i<this._arrHRelativePc.length; i++) {
|
||||
if (value == this._arrHRelativePc[i].value) {
|
||||
this.cmbWidthPc.setValue(value);
|
||||
this._state.ShapeWidthPcFrom = value;
|
||||
break;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
this.radioHSize.setValue(true);
|
||||
value = props.get_Width();
|
||||
this.spnShapeWidth.setValue((value!==undefined) ? Common.Utils.Metric.fnRecalcFromMM(value).toFixed(2) : '', true);
|
||||
}
|
||||
|
||||
var sizeRelV = props.get_SizeRelV();
|
||||
if (sizeRelV) {
|
||||
this.radioVSizePc.setValue(true);
|
||||
this.spnShapeHeightPc.setValue(sizeRelV.get_Value());
|
||||
value = sizeRelV.get_RelativeFrom();
|
||||
for (i=0; i<this._arrVRelativePc.length; i++) {
|
||||
if (value == this._arrVRelativePc[i].value) {
|
||||
this.cmbHeightPc.setValue(value);
|
||||
this._state.ShapeHeightPcFrom = value;
|
||||
break;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
this.radioVSize.setValue(true);
|
||||
value = props.get_Height();
|
||||
this.spnShapeHeight.setValue((value!==undefined) ? Common.Utils.Metric.fnRecalcFromMM(value).toFixed(2) : '', true);
|
||||
}
|
||||
this.chRatio.setDisabled(this.radioVSizePc.getValue() || this.radioHSizePc.getValue());
|
||||
|
||||
var margins = shapeprops.get_paddings();
|
||||
if (margins) {
|
||||
|
@ -1103,9 +1320,10 @@ define([ 'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
|
|||
this.spnMarginBottom.setValue((null !== val && undefined !== val) ? Common.Utils.Metric.fnRecalcFromMM(val) : '', true);
|
||||
}
|
||||
|
||||
this.btnsCategory[4].setDisabled(null === margins); // Margins
|
||||
}
|
||||
else if (chartprops) {
|
||||
this.btnsCategory[5].setDisabled(null === margins); // Margins
|
||||
|
||||
} else {
|
||||
if (chartprops) {
|
||||
this._objectType = Asc.c_oAscTypeSelectElement.Chart;
|
||||
this.setTitle(this.textTitleChart);
|
||||
value = Common.localStorage.getItem("de-settings-chartratio");
|
||||
|
@ -1120,21 +1338,31 @@ define([ 'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
|
|||
this.btnRatio.toggle(true);
|
||||
}
|
||||
|
||||
this.spnWidth.setMaxValue(this.sizeMax.width);
|
||||
this.spnHeight.setMaxValue(this.sizeMax.height);
|
||||
value = props.get_Width();
|
||||
this.spnWidth.setValue((value!==undefined) ? Common.Utils.Metric.fnRecalcFromMM(value).toFixed(2) : '', true);
|
||||
value = props.get_Height();
|
||||
this.spnHeight.setValue((value!==undefined) ? Common.Utils.Metric.fnRecalcFromMM(value).toFixed(2) : '', true);
|
||||
}
|
||||
|
||||
this._changedProps = new Asc.asc_CImgProperty();
|
||||
}
|
||||
},
|
||||
|
||||
getSettings: function() {
|
||||
var value = (this.btnRatio.pressed) ? 1 : 0;
|
||||
if (this._objectType==Asc.c_oAscTypeSelectElement.Shape) {
|
||||
Common.localStorage.setItem("de-settings-shaperatio", value);
|
||||
}
|
||||
else if (this._objectType==Asc.c_oAscTypeSelectElement.Chart) {
|
||||
if (!this.chRatio.isDisabled())
|
||||
Common.localStorage.setItem("de-settings-shaperatio", (this.chRatio.getValue()=='checked') ? 1 : 0);
|
||||
} else {
|
||||
var value = (this.btnRatio.pressed) ? 1 : 0;
|
||||
if (this._objectType==Asc.c_oAscTypeSelectElement.Chart) {
|
||||
Common.localStorage.setItem("de-settings-chartratio", value);
|
||||
}
|
||||
else {
|
||||
Common.localStorage.setItem("de-settings-imageratio", value);
|
||||
}
|
||||
}
|
||||
|
||||
var properties = this._changedProps;
|
||||
|
||||
|
@ -1279,7 +1507,7 @@ define([ 'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
|
|||
this.spnTop.setDisabled(disabledTB);
|
||||
this.spnBottom.setDisabled(disabledTB);
|
||||
|
||||
this.btnsCategory[2].setDisabled(btnId == Asc.c_oAscWrapStyle2.Inline);
|
||||
this.btnsCategory[3].setDisabled(btnId == Asc.c_oAscWrapStyle2.Inline);
|
||||
},
|
||||
|
||||
onHAlignSelect: function(combo, record){
|
||||
|
@ -1388,7 +1616,6 @@ define([ 'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
|
|||
}
|
||||
},
|
||||
|
||||
|
||||
onVPositionPcSelect: function(combo, record){
|
||||
if (this._changedProps) {
|
||||
if (this._changedProps.get_PositionV()===null || this._changedProps.get_PositionV()===undefined)
|
||||
|
@ -1544,6 +1771,122 @@ define([ 'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
|
|||
}
|
||||
},
|
||||
|
||||
onRadioHSizeChange: function(field, newValue, eOpts) {
|
||||
if (newValue) {
|
||||
if (this._changedProps) {
|
||||
this._changedProps.put_Width(Common.Utils.Metric.fnRecalcToMM(this.spnShapeWidth.getNumberValue()));
|
||||
this._changedProps.put_SizeRelH(undefined);
|
||||
|
||||
this.fillShapeHeight();
|
||||
}
|
||||
this.chRatio.setDisabled(this.radioVSizePc.getValue());
|
||||
this.cmbWidthPc.setDisabled(true);
|
||||
this.spnShapeWidthPc.setDisabled(true);
|
||||
this.spnShapeWidth.setDisabled(false);
|
||||
}
|
||||
},
|
||||
|
||||
onRadioHSizePcChange: function(field, newValue, eOpts) {
|
||||
if (newValue) {
|
||||
if (this._changedProps) {
|
||||
if (this._changedProps.get_SizeRelH()===null || this._changedProps.get_SizeRelH()===undefined)
|
||||
this._changedProps.put_SizeRelH(new Asc.CImagePositionH());
|
||||
|
||||
this._changedProps.get_SizeRelH().put_Value(this.spnShapeWidthPc.getNumberValue());
|
||||
this._changedProps.get_SizeRelH().put_RelativeFrom(this._state.ShapeWidthPcFrom);
|
||||
|
||||
this.fillShapeHeight();
|
||||
}
|
||||
this.chRatio.setDisabled(true);
|
||||
this.cmbWidthPc.setDisabled(false);
|
||||
this.spnShapeWidthPc.setDisabled(false);
|
||||
this.spnShapeWidth.setDisabled(true);
|
||||
}
|
||||
},
|
||||
|
||||
onRadioVSizeChange: function(field, newValue, eOpts) {
|
||||
if (newValue) {
|
||||
if (this._changedProps) {
|
||||
this._changedProps.put_Height(Common.Utils.Metric.fnRecalcToMM(this.spnShapeHeight.getNumberValue()));
|
||||
this._changedProps.put_SizeRelV(undefined);
|
||||
|
||||
this.fillShapeWidth();
|
||||
}
|
||||
this.chRatio.setDisabled(this.radioHSizePc.getValue());
|
||||
this.cmbHeightPc.setDisabled(true);
|
||||
this.spnShapeHeightPc.setDisabled(true);
|
||||
this.spnShapeHeight.setDisabled(false);
|
||||
}
|
||||
},
|
||||
|
||||
onRadioVSizePcChange: function(field, newValue, eOpts) {
|
||||
if (newValue) {
|
||||
if (this._changedProps) {
|
||||
if (this._changedProps.get_SizeRelV()===null || this._changedProps.get_SizeRelV()===undefined)
|
||||
this._changedProps.put_SizeRelV(new Asc.CImagePositionV());
|
||||
|
||||
this._changedProps.get_SizeRelV().put_Value(this.spnShapeHeightPc.getNumberValue());
|
||||
this._changedProps.get_SizeRelV().put_RelativeFrom(this._state.ShapeHeightPcFrom);
|
||||
|
||||
this.fillShapeWidth();
|
||||
}
|
||||
this.chRatio.setDisabled(true);
|
||||
this.cmbHeightPc.setDisabled(false);
|
||||
this.spnShapeHeightPc.setDisabled(false);
|
||||
this.spnShapeHeight.setDisabled(true);
|
||||
}
|
||||
},
|
||||
|
||||
onCmbWidthPcSelect: function(combo, record){
|
||||
if (this._changedProps) {
|
||||
if (this._changedProps.get_SizeRelH()===null || this._changedProps.get_SizeRelH()===undefined)
|
||||
this._changedProps.put_SizeRelH(new Asc.CImagePositionH());
|
||||
|
||||
this._state.ShapeWidthPcFrom = record.value;
|
||||
this._changedProps.get_SizeRelH().put_Value(this.spnShapeWidthPc.getNumberValue());
|
||||
this._changedProps.get_SizeRelH().put_RelativeFrom(this._state.ShapeWidthPcFrom);
|
||||
|
||||
this.fillShapeHeight();
|
||||
}
|
||||
},
|
||||
|
||||
onCmbHeightPcSelect: function(combo, record){
|
||||
if (this._changedProps) {
|
||||
if (this._changedProps.get_SizeRelV()===null || this._changedProps.get_SizeRelV()===undefined)
|
||||
this._changedProps.put_SizeRelV(new Asc.CImagePositionV());
|
||||
|
||||
this._state.ShapeHeightPcFrom = record.value;
|
||||
this._changedProps.get_SizeRelV().put_Value(this.spnShapeHeightPc.getNumberValue());
|
||||
this._changedProps.get_SizeRelV().put_RelativeFrom(this._state.ShapeHeightPcFrom);
|
||||
|
||||
this.fillShapeWidth();
|
||||
}
|
||||
},
|
||||
|
||||
fillShapeWidth: function(combo, record){
|
||||
if (this.radioHSize.getValue())
|
||||
this._changedProps.put_Width(Common.Utils.Metric.fnRecalcToMM(this.spnShapeWidth.getNumberValue()));
|
||||
else {
|
||||
if (this._changedProps.get_SizeRelH()===null || this._changedProps.get_SizeRelH()===undefined)
|
||||
this._changedProps.put_SizeRelH(new Asc.CImagePositionH());
|
||||
|
||||
this._changedProps.get_SizeRelH().put_Value(this.spnShapeWidthPc.getNumberValue());
|
||||
this._changedProps.get_SizeRelH().put_RelativeFrom(this._state.ShapeWidthPcFrom);
|
||||
}
|
||||
},
|
||||
|
||||
fillShapeHeight: function(combo, record){
|
||||
if (this.radioVSize.getValue())
|
||||
this._changedProps.put_Height(Common.Utils.Metric.fnRecalcToMM(this.spnShapeHeight.getNumberValue()));
|
||||
else {
|
||||
if (this._changedProps.get_SizeRelV()===null || this._changedProps.get_SizeRelV()===undefined)
|
||||
this._changedProps.put_SizeRelV(new Asc.CImagePositionV());
|
||||
|
||||
this._changedProps.get_SizeRelV().put_Value(this.spnShapeHeightPc.getNumberValue());
|
||||
this._changedProps.get_SizeRelV().put_RelativeFrom(this._state.ShapeHeightPcFrom);
|
||||
}
|
||||
},
|
||||
|
||||
_updateSizeArr: function(combo, picker, record, sizeidx) {
|
||||
if (record.get('value')>0) {
|
||||
picker.store.each( function(rec){
|
||||
|
@ -1674,7 +2017,10 @@ define([ 'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
|
|||
textBeginSize: 'Begin Size',
|
||||
textEndStyle: 'End Style',
|
||||
textEndSize: 'End Size',
|
||||
textPositionPc: 'Relative position'
|
||||
textPositionPc: 'Relative position',
|
||||
textAspectRatio: 'Lock aspect ratio',
|
||||
textAbsoluteWH: 'Absolute',
|
||||
textRelativeWH: 'Relative'
|
||||
|
||||
}, DE.Views.ImageSettingsAdvanced || {}));
|
||||
});
|
|
@ -1017,6 +1017,9 @@
|
|||
"DE.Views.ImageSettingsAdvanced.textWrapThroughTooltip": "Through",
|
||||
"DE.Views.ImageSettingsAdvanced.textWrapTightTooltip": "Tight",
|
||||
"DE.Views.ImageSettingsAdvanced.textWrapTopbottomTooltip": "Top and Bottom",
|
||||
"DE.Views.ImageSettingsAdvanced.textAspectRatio": "Lock aspect ratio",
|
||||
"DE.Views.ImageSettingsAdvanced.textAbsoluteWH": "Absolute",
|
||||
"DE.Views.ImageSettingsAdvanced.textRelativeWH": "Relative",
|
||||
"DE.Views.LeftMenu.tipAbout": "About",
|
||||
"DE.Views.LeftMenu.tipChat": "Chat",
|
||||
"DE.Views.LeftMenu.tipComments": "Comments",
|
||||
|
|
Loading…
Reference in a new issue