diff options
Diffstat (limited to 'vendor/oojs/oojs-ui/src/elements/LabelElement.js')
-rw-r--r-- | vendor/oojs/oojs-ui/src/elements/LabelElement.js | 152 |
1 files changed, 152 insertions, 0 deletions
diff --git a/vendor/oojs/oojs-ui/src/elements/LabelElement.js b/vendor/oojs/oojs-ui/src/elements/LabelElement.js new file mode 100644 index 00000000..674fa73a --- /dev/null +++ b/vendor/oojs/oojs-ui/src/elements/LabelElement.js @@ -0,0 +1,152 @@ +/** + * LabelElement is often mixed into other classes to generate a label, which + * helps identify the function of an interface element. + * See the [OOjs UI documentation on MediaWiki] [1] for more information. + * + * [1]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/Icons,_Indicators,_and_Labels#Labels + * + * @abstract + * @class + * + * @constructor + * @param {Object} [config] Configuration options + * @cfg {jQuery} [$label] The label element created by the class. If this + * configuration is omitted, the label element will use a generated `<span>`. + * @cfg {jQuery|string|Function|OO.ui.HtmlSnippet} [label] The label text. The label can be specified + * as a plaintext string, a jQuery selection of elements, or a function that will produce a string + * in the future. See the [OOjs UI documentation on MediaWiki] [2] for examples. + * [2]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/Icons,_Indicators,_and_Labels#Labels + * @cfg {boolean} [autoFitLabel=true] Fit the label to the width of the parent element. + * The label will be truncated to fit if necessary. + */ +OO.ui.LabelElement = function OoUiLabelElement( config ) { + // Configuration initialization + config = config || {}; + + // Properties + this.$label = null; + this.label = null; + this.autoFitLabel = config.autoFitLabel === undefined || !!config.autoFitLabel; + + // Initialization + this.setLabel( config.label || this.constructor.static.label ); + this.setLabelElement( config.$label || $( '<span>' ) ); +}; + +/* Setup */ + +OO.initClass( OO.ui.LabelElement ); + +/* Events */ + +/** + * @event labelChange + * @param {string} value + */ + +/* Static Properties */ + +/** + * The label text. The label can be specified as a plaintext string, a function that will + * produce a string in the future, or `null` for no label. The static value will + * be overridden if a label is specified with the #label config option. + * + * @static + * @inheritable + * @property {string|Function|null} + */ +OO.ui.LabelElement.static.label = null; + +/* Methods */ + +/** + * Set the label element. + * + * If an element is already set, it will be cleaned up before setting up the new element. + * + * @param {jQuery} $label Element to use as label + */ +OO.ui.LabelElement.prototype.setLabelElement = function ( $label ) { + if ( this.$label ) { + this.$label.removeClass( 'oo-ui-labelElement-label' ).empty(); + } + + this.$label = $label.addClass( 'oo-ui-labelElement-label' ); + this.setLabelContent( this.label ); +}; + +/** + * Set the label. + * + * An empty string will result in the label being hidden. A string containing only whitespace will + * be converted to a single ` `. + * + * @param {jQuery|string|OO.ui.HtmlSnippet|Function|null} label Label nodes; text; a function that returns nodes or + * text; or null for no label + * @chainable + */ +OO.ui.LabelElement.prototype.setLabel = function ( label ) { + label = typeof label === 'function' ? OO.ui.resolveMsg( label ) : label; + label = ( ( typeof label === 'string' && label.length ) || label instanceof jQuery || label instanceof OO.ui.HtmlSnippet ) ? label : null; + + this.$element.toggleClass( 'oo-ui-labelElement', !!label ); + + if ( this.label !== label ) { + if ( this.$label ) { + this.setLabelContent( label ); + } + this.label = label; + this.emit( 'labelChange' ); + } + + return this; +}; + +/** + * Get the label. + * + * @return {jQuery|string|Function|null} Label nodes; text; a function that returns nodes or + * text; or null for no label + */ +OO.ui.LabelElement.prototype.getLabel = function () { + return this.label; +}; + +/** + * Fit the label. + * + * @chainable + */ +OO.ui.LabelElement.prototype.fitLabel = function () { + if ( this.$label && this.$label.autoEllipsis && this.autoFitLabel ) { + this.$label.autoEllipsis( { hasSpan: false, tooltip: true } ); + } + + return this; +}; + +/** + * Set the content of the label. + * + * Do not call this method until after the label element has been set by #setLabelElement. + * + * @private + * @param {jQuery|string|Function|null} label Label nodes; text; a function that returns nodes or + * text; or null for no label + */ +OO.ui.LabelElement.prototype.setLabelContent = function ( label ) { + if ( typeof label === 'string' ) { + if ( label.match( /^\s*$/ ) ) { + // Convert whitespace only string to a single non-breaking space + this.$label.html( ' ' ); + } else { + this.$label.text( label ); + } + } else if ( label instanceof OO.ui.HtmlSnippet ) { + this.$label.html( label.toString() ); + } else if ( label instanceof jQuery ) { + this.$label.empty().append( label ); + } else { + this.$label.empty(); + } +}; |