2021-10-31 10:08:13 +00:00
|
|
|
/**
|
|
|
|
* Mixin for adding descriptive ARIA support to elements.
|
|
|
|
*
|
|
|
|
* @class
|
|
|
|
* @abstract
|
|
|
|
*
|
|
|
|
* @constructor
|
|
|
|
* @param {Object} [config] Configuration options
|
2021-11-01 15:47:31 +00:00
|
|
|
* @cfg {jQuery} [$ariaDescribedBy]
|
2021-10-31 10:08:13 +00:00
|
|
|
* @cfg {string} [ariaLabel]
|
2021-11-16 11:00:12 +00:00
|
|
|
* @cfg {jQuery} [$describedElement]
|
2021-10-31 10:08:13 +00:00
|
|
|
*/
|
|
|
|
ve.ui.MWAriaDescribe = function VeUiMWAriaDescribe( config ) {
|
2021-11-16 11:00:12 +00:00
|
|
|
this.$describedElement = config.$describedElement || this.$element;
|
|
|
|
|
2021-11-01 15:47:31 +00:00
|
|
|
if ( config.$ariaDescribedBy ) {
|
|
|
|
this.setAriaDescribedBy( config.$ariaDescribedBy );
|
2021-10-31 10:08:13 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
if ( config.ariaLabel ) {
|
|
|
|
this.setAriaLabel( config.ariaLabel );
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
/* Setup */
|
|
|
|
|
|
|
|
OO.initClass( ve.ui.MWAriaDescribe );
|
|
|
|
|
|
|
|
/**
|
2021-11-16 11:00:12 +00:00
|
|
|
* @param {jQuery} [$description]
|
2021-10-31 10:08:13 +00:00
|
|
|
* @chainable
|
|
|
|
* @return {OO.ui.Element} The element, for chaining
|
|
|
|
*/
|
2021-11-01 15:47:31 +00:00
|
|
|
ve.ui.MWAriaDescribe.prototype.setAriaDescribedBy = function ( $description ) {
|
2021-11-16 11:00:12 +00:00
|
|
|
if ( !$description ) {
|
|
|
|
this.$describedElement.removeAttr( 'aria-describedby' );
|
|
|
|
return this;
|
|
|
|
}
|
|
|
|
|
2021-11-01 15:47:31 +00:00
|
|
|
if ( !$description.attr( 'id' ) ) {
|
|
|
|
$description.attr( 'id', OO.ui.generateElementId() );
|
|
|
|
}
|
2021-11-16 11:00:12 +00:00
|
|
|
this.$describedElement.attr( 'aria-describedby', $description.attr( 'id' ) );
|
2021-10-31 10:08:13 +00:00
|
|
|
return this;
|
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* @param {string} label
|
|
|
|
* @chainable
|
|
|
|
* @return {OO.ui.Element} The element, for chaining
|
|
|
|
*/
|
|
|
|
ve.ui.MWAriaDescribe.prototype.setAriaLabel = function ( label ) {
|
2021-11-16 11:00:12 +00:00
|
|
|
this.$describedElement.attr( 'aria-label', label );
|
2021-10-31 10:08:13 +00:00
|
|
|
return this;
|
|
|
|
};
|