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

[DE] Added alternative text for objects.

Browse source
This commit is contained in:
Julia Radzhabova 2017-01-18 16:14:03 +03:00
parent a45f5891e6
commit 87b31bfb11
3 changed files with 67 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
apps/documenteditor/main/app/template/ImageSettingsAdvanced.template
View file

@ -325,3 +325,26 @@
</table>
</div>
</div>
<div id="id-adv-image-alttext" class="settings-panel active">
<div class="inner-content">
<table cols="1" width="100%">
<tr>
<td class="padding-large">
<label class="header"><%= scope.textAltTitle %></label>
<div id="image-advanced-alt-title"></div>
</td>
</tr>
<tr>
<td>
<label class="header"><%= scope.textAltDescription %></label>
<textarea id="image-advanced-alt-description" class="form-control" style="width: 100%; height: 120px;"></textarea>
</td>
</tr>
<tr>
<td>
<label><%= scope.textAltTip %></label>
</td>
</tr>
</table>
</div>
</div>

40
apps/documenteditor/main/app/view/ImageSettingsAdvanced.js
View file

@ -67,7 +67,8 @@ 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.textShape},
{panelId: 'id-adv-image-margins', panelCaption: this.strMargins}
{panelId: 'id-adv-image-margins', panelCaption: this.strMargins},
{panelId: 'id-adv-image-alttext', panelCaption: this.textAlt}
],
contentTemplate: _.template(contentTemplate)({
scope: this
@ -1069,6 +1070,25 @@ define([ 'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
this.mnuEndSizePicker.on('item:click', _.bind(this.onSelectEndSize, this));
this._selectStyleItem(this.btnEndSize, null);
// Alt Text
this.inputAltTitle = new Common.UI.InputField({
el : $('#image-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();
},
@ -1334,6 +1354,12 @@ define([ 'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
this.spnHeight.setValue((value!==undefined) ? Common.Utils.Metric.fnRecalcFromMM(value).toFixed(2) : '', true);
}
value = props.asc_getTitle();
this.inputAltTitle.setValue(value ? value : '');
value = props.asc_getDescription();
this.textareaAltDescription.val(value ? value : '');
this._changedProps = new Asc.asc_CImgProperty();
}
},
@ -1370,6 +1396,12 @@ define([ 'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
}
}
if (this.isAltTitleChanged)
properties.asc_putTitle(this.inputAltTitle.getValue());
if (this.isAltDescChanged)
properties.asc_putDescription(this.textareaAltDescription.val());
return { imageProps: properties} ;
},
@ -1995,7 +2027,11 @@ define([ 'text!documenteditor/main/app/template/ImageSettingsAdvanced.templat
textPositionPc: 'Relative position',
textAspectRatio: 'Lock aspect ratio',
textAbsoluteWH: 'Absolute',
textRelativeWH: 'Relative'
textRelativeWH: 'Relative',
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.'
}, DE.Views.ImageSettingsAdvanced || {}));
});

4
apps/documenteditor/main/locale/en.json
View file

@ -1056,6 +1056,10 @@
"DE.Views.ImageSettingsAdvanced.textWrapThroughTooltip": "Through",
"DE.Views.ImageSettingsAdvanced.textWrapTightTooltip": "Tight",
"DE.Views.ImageSettingsAdvanced.textWrapTopbottomTooltip": "Top and Bottom",
"DE.Views.ImageSettingsAdvanced.textAlt": "Alternative Text",
"DE.Views.ImageSettingsAdvanced.textAltTitle": "Title",
"DE.Views.ImageSettingsAdvanced.textAltDescription": "Description",
"DE.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.",
"DE.Views.LeftMenu.tipAbout": "About",
"DE.Views.LeftMenu.tipChat": "Chat",
"DE.Views.LeftMenu.tipComments": "Comments",