[DE][SSE] Add autofit settings for shape

apps/documenteditor/main/app/template/ImageSettingsAdvanced.template

@@ -327,7 +327,25 @@
 </div>
 <div id="id-adv-image-margins" class="settings-panel">
     <div class="inner-content">
+        <table cols="1" style="width: 100%;">
+            <tr>
+                <td class="padding-small">
+                    <label class="header"><%= scope.textAutofit %></label>
+                </td>
+            </tr>
+            <tr>
+                <td class="padding-large">
+                    <div id="shape-checkbox-autofit"></div>
+                </td>
+            </tr>
+        </table>
+        <div class="separator horizontal padding-large"></div>
         <table cols="2" style="width: 100%;">
+            <tr>
+                <td colspan=2 class="padding-small">
+                    <label class="header"><%= scope.strMargins %></label>
+                </td>
+            </tr>
             <tr>
                 <td class="padding-small" width="125px">
                     <label class="input-label"><%= scope.textTop %></label>

apps/documenteditor/main/app/view/ImageSettingsAdvanced.js

@@ -68,7 +68,7 @@ define([    'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
                     {panelId: 'id-adv-image-wrap',       panelCaption: this.textBtnWrap},
                     {panelId: 'id-adv-image-position',   panelCaption: this.textPosition},
                     {panelId: 'id-adv-image-shape',      panelCaption: this.textWeightArrows},
-                    {panelId: 'id-adv-image-margins',    panelCaption: this.strMargins},
+                    {panelId: 'id-adv-image-margins',    panelCaption: this.textTextBox},
                     {panelId: 'id-adv-image-alttext',    panelCaption: this.textAlt}
                 ],
                 contentTemplate: _.template(contentTemplate)({
@@ -914,6 +914,16 @@ define([    'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
             }, this));
             this.spinners.push(this.spnMarginRight);
 
+            this.chAutofit = new Common.UI.CheckBox({
+                el: $('#shape-checkbox-autofit'),
+                labelText: this.textResizeFit
+            });
+            this.chAutofit.on('change', _.bind(function(field, newValue, oldValue, eOpts){
+                if (this._changedShapeProps) {
+                    this._changedShapeProps.asc_putTextFitType(field.getValue()=='checked' ? AscFormat.text_fit_Auto : AscFormat.text_fit_No);
+                }
+            }, this));
+
             // Shape
             this._arrCapType = [
                 {displayValue: this.textFlat,   value: Asc.c_oAscLineCapType.Flat},
@@ -1367,6 +1377,8 @@ define([    'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
                         this.spnMarginBottom.setValue((null !== val && undefined !== val) ? Common.Utils.Metric.fnRecalcFromMM(val) : '', true);
                     }
 
+                    this.chAutofit.setValue(shapeprops.asc_getTextFitType()==AscFormat.text_fit_Auto);
+
                     this.btnsCategory[6].setDisabled(null === margins);   // Margins
                     this.btnsCategory[5].setDisabled(shapeprops.get_stroke().get_type() == Asc.c_oAscStrokeType.STROKE_NONE);   // Weights & Arrows
 
@@ -2083,7 +2095,10 @@ define([    'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
         textAngle: 'Angle',
         textFlipped: 'Flipped',
         textHorizontally: 'Horizontally',
-        textVertically: 'Vertically'
+        textVertically: 'Vertically',
+        textTextBox: 'Text Box',
+        textAutofit: 'AutoFit',
+        textResizeFit: 'Resize shape to fit text'
 
     }, DE.Views.ImageSettingsAdvanced || {}));
 });

apps/documenteditor/main/locale/en.json

@@ -1662,6 +1662,9 @@
   "DE.Views.ImageSettingsAdvanced.textWrapThroughTooltip": "Through",
   "DE.Views.ImageSettingsAdvanced.textWrapTightTooltip": "Tight",
   "DE.Views.ImageSettingsAdvanced.textWrapTopbottomTooltip": "Top and bottom",
+  "DE.Views.ImageSettingsAdvanced.textTextBox": "Text Box",
+  "DE.Views.ImageSettingsAdvanced.textAutofit": "AutoFit",
+  "DE.Views.ImageSettingsAdvanced.textResizeFit": "Resize shape to fit text",
   "DE.Views.LeftMenu.tipAbout": "About",
   "DE.Views.LeftMenu.tipChat": "Chat",
   "DE.Views.LeftMenu.tipComments": "Comments",

apps/spreadsheeteditor/main/app/template/ShapeSettingsAdvanced.template

@@ -96,7 +96,25 @@
 </div>
 <div id="id-adv-shape-margins" class="settings-panel">
     <div class="inner-content">
+        <table cols="1" style="width: 100%;">
+            <tr>
+                <td class="padding-small">
+                    <label class="header"><%= scope.textAutofit %></label>
+                </td>
+            </tr>
+            <tr>
+                <td class="padding-large">
+                    <div id="shape-checkbox-autofit"></div>
+                </td>
+            </tr>
+        </table>
+        <div class="separator horizontal padding-large"></div>
         <table cols="2" style="width: 100%;">
+            <tr>
+                <td colspan=2 class="padding-small">
+                    <label class="header"><%= scope.strMargins %></label>
+                </td>
+            </tr>
             <tr>
                 <td class="padding-small" width="125px">
                     <label class="input-label"><%= scope.textTop %></label>

apps/spreadsheeteditor/main/app/view/ShapeSettingsAdvanced.js

@@ -64,7 +64,7 @@ define([    'text!spreadsheeteditor/main/app/template/ShapeSettingsAdvanced.temp
                     {panelId: 'id-adv-shape-width',      panelCaption: this.textSize},
                     {panelId: 'id-adv-shape-rotate',     panelCaption: this.textRotation},
                     {panelId: 'id-adv-shape-shape',      panelCaption: this.textWeightArrows},
-                    {panelId: 'id-adv-shape-margins',    panelCaption: this.strMargins},
+                    {panelId: 'id-adv-shape-margins',    panelCaption: this.textTextBox},
                     {panelId: 'id-adv-shape-columns',    panelCaption: this.strColumns},
                     {panelId: 'id-adv-shape-snap',       panelCaption: this.textSnap},
                     {panelId: 'id-adv-shape-alttext',    panelCaption: this.textAlt}
@@ -249,6 +249,18 @@ define([    'text!spreadsheeteditor/main/app/template/ShapeSettingsAdvanced.temp
             }, this));
             this.spinners.push(this.spnMarginRight);
 
+            this.chAutofit = new Common.UI.CheckBox({
+                el: $('#shape-checkbox-autofit'),
+                labelText: this.textResizeFit
+            });
+            this.chAutofit.on('change', _.bind(function(field, newValue, oldValue, eOpts){
+                if (this._changedProps) {
+                    if (this._changedProps.asc_getShapeProperties()===null || this._changedProps.asc_getShapeProperties()===undefined)
+                        this._changedProps.asc_putShapeProperties(new Asc.asc_CShapeProperty());
+                    this._changedProps.asc_getShapeProperties().asc_putTextFitType(field.getValue()=='checked' ? AscFormat.text_fit_Auto : AscFormat.text_fit_No);
+                }
+            }, this));
+
             // Rotation
             this.spnAngle = new Common.UI.MetricSpinner({
                 el: $('#shape-advanced-spin-angle'),
@@ -588,6 +600,8 @@ define([    'text!spreadsheeteditor/main/app/template/ShapeSettingsAdvanced.temp
                 }
                 this.btnsCategory[3].setDisabled(null === margins);   // Margins
 
+                this.chAutofit.setValue(shapeprops.asc_getTextFitType()==AscFormat.text_fit_Auto);
+
                 var shapetype = shapeprops.asc_getType();
                 this.btnsCategory[4].setDisabled(shapetype=='line' || shapetype=='bentConnector2' || shapetype=='bentConnector3'
                     || shapetype=='bentConnector4' || shapetype=='bentConnector5' || shapetype=='curvedConnector2'
@@ -863,7 +877,10 @@ define([    'text!spreadsheeteditor/main/app/template/ShapeSettingsAdvanced.temp
         textSnap: 'Cell Snapping',
         textAbsolute: 'Don\'t move or size with cells',
         textOneCell: 'Move but don\'t size with cells',
-        textTwoCell: 'Move and size with cells'
+        textTwoCell: 'Move and size with cells',
+        textTextBox: 'Text Box',
+        textAutofit: 'AutoFit',
+        textResizeFit: 'Resize shape to fit text'
 
     }, SSE.Views.ShapeSettingsAdvanced || {}));
 });

apps/spreadsheeteditor/main/locale/en.json

@@ -2072,6 +2072,9 @@
   "SSE.Views.ShapeSettingsAdvanced.textVertically": "Vertically",
   "SSE.Views.ShapeSettingsAdvanced.textWeightArrows": "Weights & Arrows",
   "SSE.Views.ShapeSettingsAdvanced.textWidth": "Width",
+  "SSE.Views.ShapeSettingsAdvanced.textTextBox": "Text Box",
+  "SSE.Views.ShapeSettingsAdvanced.textAutofit": "AutoFit",
+  "SSE.Views.ShapeSettingsAdvanced.textResizeFit": "Resize shape to fit text",
   "SSE.Views.SignatureSettings.notcriticalErrorTitle": "Warning",
   "SSE.Views.SignatureSettings.strDelete": "Remove Signature",
   "SSE.Views.SignatureSettings.strDetails": "Signature Details",