diff --git a/apps/presentationeditor/main/app/template/ShapeSettingsAdvanced.template b/apps/presentationeditor/main/app/template/ShapeSettingsAdvanced.template index 2310dfa5c..88a2bdfd1 100644 --- a/apps/presentationeditor/main/app/template/ShapeSettingsAdvanced.template +++ b/apps/presentationeditor/main/app/template/ShapeSettingsAdvanced.template @@ -93,4 +93,27 @@ + +
+
+ + + + + + + + + + +
+ +
+
+ + +
+ +
+
\ No newline at end of file diff --git a/apps/presentationeditor/main/app/view/ShapeSettingsAdvanced.js b/apps/presentationeditor/main/app/view/ShapeSettingsAdvanced.js index 8db195e7d..23b932e68 100644 --- a/apps/presentationeditor/main/app/view/ShapeSettingsAdvanced.js +++ b/apps/presentationeditor/main/app/view/ShapeSettingsAdvanced.js @@ -48,7 +48,7 @@ define([ 'text!presentationeditor/main/app/template/ShapeSettingsAdvanced.tem PE.Views.ShapeSettingsAdvanced = Common.Views.AdvancedSettingsWindow.extend(_.extend({ options: { contentWidth: 300, - height: 332, + height: 342, toggleGroup: 'shape-adv-settings-group', sizeOriginal: {width: 0, height: 0}, sizeMax: {width: 55.88, height: 55.88}, @@ -62,7 +62,8 @@ define([ 'text!presentationeditor/main/app/template/ShapeSettingsAdvanced.tem items: [ {panelId: 'id-adv-shape-width', panelCaption: this.textSize}, {panelId: 'id-adv-shape-shape', panelCaption: this.textWeightArrows}, - {panelId: 'id-adv-shape-margins', panelCaption: this.strMargins} + {panelId: 'id-adv-shape-margins', panelCaption: this.strMargins}, + {panelId: 'id-adv-shape-alttext', panelCaption: this.textAlt} ], contentTemplate: _.template(contentTemplate)({ scope: this @@ -410,6 +411,25 @@ define([ 'text!presentationeditor/main/app/template/ShapeSettingsAdvanced.tem this.mnuEndSizePicker.on('item:click', _.bind(this.onSelectEndSize, this)); this._selectStyleItem(this.btnEndSize, null); + // Alt Text + + this.inputAltTitle = new Common.UI.InputField({ + el : $('#shape-advanced-alt-title'), + allowBlank : true, + validateOnBlur: false, + style : 'width: 100%;' + }).on('changed:after', function() { + me.isAltTitleChanged = true; + }); + + this.textareaAltDescription = this.$window.find('textarea'); + this.textareaAltDescription.keydown(function (event) { + if (event.keyCode == Common.UI.Keys.RETURN) { + event.stopPropagation(); + } + me.isAltDescChanged = true; + }); + this.afterRender(); }, @@ -448,11 +468,23 @@ define([ 'text!presentationeditor/main/app/template/ShapeSettingsAdvanced.tem } this.btnsCategory[2].setDisabled(null === margins); // Margins + value = props.asc_getTitle(); + this.inputAltTitle.setValue(value ? value : ''); + + value = props.asc_getDescription(); + this.textareaAltDescription.val(value ? value : ''); + this._changedProps = new Asc.asc_CShapeProperty(); } }, getSettings: function() { + if (this.isAltTitleChanged) + this._changedProps.asc_putTitle(this.inputAltTitle.getValue()); + + if (this.isAltDescChanged) + this._changedProps.asc_putDescription(this.textareaAltDescription.val()); + Common.localStorage.setItem("pe-settings-shaperatio", (this.btnRatio.pressed) ? 1 : 0); return { shapeProps: this._changedProps} ; }, @@ -645,6 +677,11 @@ define([ 'text!presentationeditor/main/app/template/ShapeSettingsAdvanced.tem textLeft: 'Left', textBottom: 'Bottom', textRight: 'Right', - strMargins: 'Text Padding' + strMargins: 'Text Padding', + textAlt: 'Alternative Text', + textAltTitle: 'Title', + textAltDescription: 'Description', + textAltTip: 'The alternative text-based representation of the visual object information, which will be read to the people with vision or cognitive impairments to help them better understand what information there is in the image, autoshape, chart or table.' + }, PE.Views.ShapeSettingsAdvanced || {})); }); \ No newline at end of file diff --git a/apps/presentationeditor/main/locale/en.json b/apps/presentationeditor/main/locale/en.json index fd577aea1..cc905967e 100644 --- a/apps/presentationeditor/main/locale/en.json +++ b/apps/presentationeditor/main/locale/en.json @@ -970,6 +970,10 @@ "PE.Views.ShapeSettingsAdvanced.textWeightArrows": "Weights & Arrows", "PE.Views.ShapeSettingsAdvanced.textWidth": "Width", "PE.Views.ShapeSettingsAdvanced.txtNone": "None", + "PE.Views.ImageSettingsAdvanced.textAlt": "Alternative Text", + "PE.Views.ImageSettingsAdvanced.textAltTitle": "Title", + "PE.Views.ImageSettingsAdvanced.textAltDescription": "Description", + "PE.Views.ImageSettingsAdvanced.textAltTip": "The alternative text-based representation of the visual object information, which will be read to the people with vision or cognitive impairments to help them better understand what information there is in the image, autoshape, chart or table.", "PE.Views.SlideSettings.strBackground": "Background color", "PE.Views.SlideSettings.strColor": "Color", "PE.Views.SlideSettings.strDelay": "Delay", diff --git a/apps/presentationeditor/main/resources/less/rightmenu.less b/apps/presentationeditor/main/resources/less/rightmenu.less index 8b72a6696..158b5a157 100644 --- a/apps/presentationeditor/main/resources/less/rightmenu.less +++ b/apps/presentationeditor/main/resources/less/rightmenu.less @@ -83,6 +83,20 @@ .settings-hidden { display: none; } + + textarea { + .user-select(text); + width: 100%; + resize: none; + margin-bottom: 5px; + border: 1px solid @gray-dark; + height: 100%; + + &.disabled { + opacity: 0.65; + cursor: default !important; + } + } } .item-wrap {