/*!
- * OOjs UI v0.22.2
+ * OOjs UI v0.22.4
* https://www.mediawiki.org/wiki/OOjs_UI
*
* Copyright 2011–2017 OOjs UI Team and other contributors.
* Released under the MIT license
* http://oojs.mit-license.org
*
- * Date: 2017-06-28T19:51:59Z
+ * Date: 2017-08-03T19:36:51Z
*/
( function ( OO ) {
this.$titled = $titled;
if ( this.title ) {
- this.$titled.attr( 'title', this.title );
+ this.updateTitle();
}
};
title = ( typeof title === 'string' && title.length ) ? title : null;
if ( this.title !== title ) {
- if ( this.$titled ) {
- if ( title !== null ) {
- this.$titled.attr( 'title', title );
- } else {
- this.$titled.removeAttr( 'title' );
- }
- }
this.title = title;
+ this.updateTitle();
}
return this;
};
+/**
+ * Update the title attribute, in case of changes to title or accessKey.
+ *
+ * @protected
+ * @chainable
+ */
+OO.ui.mixin.TitledElement.prototype.updateTitle = function () {
+ var title = this.getTitle();
+ if ( this.$titled ) {
+ if ( title !== null ) {
+ // Only if this is an AccessKeyedElement
+ if ( this.formatTitleWithAccessKey ) {
+ title = this.formatTitleWithAccessKey( title );
+ }
+ this.$titled.attr( 'title', title );
+ } else {
+ this.$titled.removeAttr( 'title' );
+ }
+ }
+ return this;
+};
+
/**
* Get title.
*
// Initialization
this.setAccessKey( config.accessKey || null );
this.setAccessKeyedElement( config.$accessKeyed || this.$element );
+
+ // If this is also a TitledElement and it initialized before we did, we may have
+ // to update the title with the access key
+ if ( this.updateTitle ) {
+ this.updateTitle();
+ }
};
/* Setup */
}
}
this.accessKey = accessKey;
+
+ // Only if this is a TitledElement
+ if ( this.updateTitle ) {
+ this.updateTitle();
+ }
}
return this;
return this.accessKey;
};
+/**
+ * Add information about the access key to the element's tooltip label.
+ * (This is only public for hacky usage in FieldLayout.)
+ *
+ * @param {string} title Tooltip label for `title` attribute
+ * @return {string}
+ */
+OO.ui.mixin.AccessKeyedElement.prototype.formatTitleWithAccessKey = function ( title ) {
+ var accessKey;
+
+ if ( !this.$accessKeyed ) {
+ // Not initialized yet; the constructor will call updateTitle() which will rerun this function
+ return title;
+ }
+ // Use jquery.accessKeyLabel if available to show modifiers, otherwise just display the single key
+ if ( $.fn.updateTooltipAccessKeys && $.fn.updateTooltipAccessKeys.getAccessKeyLabel ) {
+ accessKey = $.fn.updateTooltipAccessKeys.getAccessKeyLabel( this.$accessKeyed[ 0 ] );
+ } else {
+ accessKey = this.getAccessKey();
+ }
+ if ( accessKey ) {
+ title += ' [' + accessKey + ']';
+ }
+ return title;
+};
+
/**
* ButtonWidget is a generic widget for buttons. A wide variety of looks,
* feels, and functionality can be customized via the class’s configuration options
// Properties
this.$anchor = $( '<div>' );
- // If undefined, will be computed lazily in updateDimensions()
+ // If undefined, will be computed lazily in computePosition()
this.$container = config.$container;
this.containerPadding = config.containerPadding !== undefined ? config.containerPadding : 10;
this.autoClose = !!config.autoClose;
return this.popupPosition;
};
+/**
+ * Get an ID of the body element, this can be used as the
+ * `aria-describedby` attribute for an input field.
+ *
+ * @return {string} The ID of the body element
+ */
+OO.ui.PopupWidget.prototype.getBodyId = function () {
+ var id = this.$body.attr( 'id' );
+ if ( id === undefined ) {
+ id = OO.ui.generateElementId();
+ this.$body.attr( 'id', id );
+ }
+ return id;
+};
+
/**
* PopupElement is mixed into other classes to generate a {@link OO.ui.PopupWidget popup widget}.
* A popup is a container for content. It is overlaid and positioned absolutely. By default, each
this.togglePositioning( !!this.$floatableContainer );
this.toggleClipping( true );
+ this.$focusOwner.attr( 'aria-expanded', 'true' );
+
if ( this.getSelectedItem() ) {
this.$focusOwner.attr( 'aria-activedescendant', this.getSelectedItem().getElementId() );
this.getSelectedItem().scrollElementIntoView( { duration: 0 } );
this.$focusOwner.removeAttr( 'aria-activedescendant' );
this.unbindKeyDownListener();
this.unbindKeyPressListener();
+ this.$focusOwner.attr( 'aria-expanded', 'false' );
this.getElementDocument().removeEventListener( 'mousedown', this.onDocumentMouseDownHandler, true );
this.togglePositioning( false );
this.toggleClipping( false );
*/
OO.ui.DropdownWidget.prototype.onMenuToggle = function ( isVisible ) {
this.$element.toggleClass( 'oo-ui-dropdownWidget-open', isVisible );
+ this.$handle.attr(
+ 'aria-expanded',
+ this.$element.hasClass( 'oo-ui-dropdownWidget-open' ).toString()
+ );
};
/**
this.setOptions( config.options || [] );
// Have to repeat this from parent, as we need options to be set up for this to make sense
this.setValue( config.value );
+
+ // setValue when checkboxMultiselectWidget changes
+ this.checkboxMultiselectWidget.on( 'change', function () {
+ this.setValue( this.checkboxMultiselectWidget.getSelectedItemsData() );
+ }.bind( this ) );
};
/* Setup */
* @chainable
*/
OO.ui.TextInputWidget.prototype.positionLabel = function () {
- var after, rtl, property;
+ var after, rtl, property, newCss;
if ( this.isWaitingToBeAttached ) {
// #onElementAttach will be called soon, which calls this method
return this;
}
- // Clear old values
- this.$input
- // Clear old values if present
- .css( {
- 'padding-right': '',
- 'padding-left': ''
- } );
+ newCss = {
+ 'padding-right': '',
+ 'padding-left': ''
+ };
if ( this.label ) {
this.$element.append( this.$label );
} else {
this.$label.detach();
+ // Clear old values if present
+ this.$input.css( newCss );
return;
}
rtl = this.$element.css( 'direction' ) === 'rtl';
property = after === rtl ? 'padding-left' : 'padding-right';
- this.$input.css( property, this.$label.outerWidth( true ) + ( after ? this.scrollWidth : 0 ) );
+ newCss[ property ] = this.$label.outerWidth( true ) + ( after ? this.scrollWidth : 0 );
+ // We have to clear the padding on the other side, in case the element direction changed
+ this.$input.css( newCss );
return this;
};
this.fieldWidget.connect( this, { disable: 'onFieldDisable' } );
// Initialization
+ if ( config.help ) {
+ // Set the 'aria-describedby' attribute on the fieldWidget
+ // Preference given to an input or a button
+ (
+ this.fieldWidget.$input ||
+ this.fieldWidget.$button ||
+ this.fieldWidget.$element
+ ).attr(
+ 'aria-describedby',
+ this.popupButtonWidget.getPopup().getBodyId()
+ );
+ }
if ( this.fieldWidget.getInputId() ) {
this.$label.attr( 'for', this.fieldWidget.getInputId() );
} else {
this.setErrors( config.errors || [] );
this.setNotices( config.notices || [] );
this.setAlignment( config.align );
+ // Call this again to take into account the widget's accessKey
+ this.updateTitle();
};
/* Setup */
$listItem = $( '<li>' );
if ( kind === 'error' ) {
$icon = new OO.ui.IconWidget( { icon: 'alert', flags: [ 'warning' ] } ).$element;
+ $listItem.attr( 'role', 'alert' );
} else if ( kind === 'notice' ) {
$icon = new OO.ui.IconWidget( { icon: 'info' } ).$element;
} else {
}
};
+/**
+ * Include information about the widget's accessKey in our title. TitledElement calls this method.
+ * (This is a bit of a hack.)
+ *
+ * @protected
+ * @param {string} title Tooltip label for 'title' attribute
+ * @return {string}
+ */
+OO.ui.FieldLayout.prototype.formatTitleWithAccessKey = function ( title ) {
+ if ( this.fieldWidget && this.fieldWidget.formatTitleWithAccessKey ) {
+ return this.fieldWidget.formatTitleWithAccessKey( title );
+ }
+ return title;
+};
+
/**
* ActionFieldLayouts are used with OO.ui.FieldsetLayout. The layout consists of a field-widget, a button,
* and an optional label and/or help text. The field-widget (e.g., a {@link OO.ui.TextInputWidget TextInputWidget}),
// Mixin constructors
OO.ui.mixin.IconElement.call( this, config );
- OO.ui.mixin.LabelElement.call( this, $.extend( {}, config, { $label: $( '<div>' ) } ) );
+ OO.ui.mixin.LabelElement.call( this, config );
OO.ui.mixin.GroupElement.call( this, config );
// Properties
- this.$header = $( '<div>' );
+ this.$header = $( '<legend>' );
if ( config.help ) {
this.popupButtonWidget = new OO.ui.PopupButtonWidget( {
$overlay: config.$overlay,
dépôts / lhc / web / wiklou.git / blobdiff