Jforrester has uploaded a new change for review. https://gerrit.wikimedia.org/r/250835
Change subject: Update OOjs UI to v0.13.1 ...................................................................... Update OOjs UI to v0.13.1 Release notes: https://git.wikimedia.org/blob/oojs%2Fui.git/v0.13.1/History.md Change-Id: Ic8fbb6ee4326c73243ea655708b9cfd09bc7e52a --- M composer.json M resources/lib/oojs-ui/i18n/hy.json M resources/lib/oojs-ui/i18n/jv.json M resources/lib/oojs-ui/i18n/lb.json M resources/lib/oojs-ui/i18n/lt.json M resources/lib/oojs-ui/i18n/pt-br.json M resources/lib/oojs-ui/oojs-ui-apex-noimages.css M resources/lib/oojs-ui/oojs-ui-apex.js M resources/lib/oojs-ui/oojs-ui-mediawiki-noimages.css M resources/lib/oojs-ui/oojs-ui-mediawiki.js M resources/lib/oojs-ui/oojs-ui.js 11 files changed, 229 insertions(+), 111 deletions(-) git pull ssh://gerrit.wikimedia.org:29418/mediawiki/core refs/changes/35/250835/1 diff --git a/composer.json b/composer.json index 553ec44..78c23ce 100644 --- a/composer.json +++ b/composer.json @@ -21,7 +21,7 @@ "ext-iconv": "*", "liuggio/statsd-php-client": "1.0.16", "mediawiki/at-ease": "1.1.0", - "oojs/oojs-ui": "0.13.0", + "oojs/oojs-ui": "0.13.1", "oyejorge/less.php": "1.7.0.9", "php": ">=5.3.3", "psr/log": "1.0.0", diff --git a/resources/lib/oojs-ui/i18n/hy.json b/resources/lib/oojs-ui/i18n/hy.json index c2b45a8..2cd688e 100644 --- a/resources/lib/oojs-ui/i18n/hy.json +++ b/resources/lib/oojs-ui/i18n/hy.json @@ -19,6 +19,8 @@ "ooui-dialog-process-dismiss": "Փակել", "ooui-dialog-process-retry": "Կրկին փորձել", "ooui-dialog-process-continue": "Շարունակել", + "ooui-selectfile-button-select": "Ընտրել նիշք", "ooui-selectfile-not-supported": "Ֆայլի ընտրությունը չի պաշտպանվում", - "ooui-selectfile-placeholder": "Ֆայլն ընտրված չէ" + "ooui-selectfile-placeholder": "Ֆայլն ընտրված չէ", + "ooui-selectfile-dragdrop-placeholder": "Ֆայլը գցել այստե" } diff --git a/resources/lib/oojs-ui/i18n/jv.json b/resources/lib/oojs-ui/i18n/jv.json index 677b1c3..1024d2a 100644 --- a/resources/lib/oojs-ui/i18n/jv.json +++ b/resources/lib/oojs-ui/i18n/jv.json @@ -4,14 +4,15 @@ "Gleki", "NoiX180", "Pras", - "Jadinegara" + "Jadinegara", + "Meursault2004" ] }, "ooui-outline-control-move-down": "Pindhahaken butir mangandhap", - "ooui-outline-control-move-up": "Pindhah kara mêndhuwur", + "ooui-outline-control-move-up": "Pindhah kara menyang dhuwur", "ooui-outline-control-remove": "Busak kara", - "ooui-toolbar-more": "Mênèh", - "ooui-toolgroup-expand": "Mênèh", + "ooui-toolbar-more": "Manèh", + "ooui-toolgroup-expand": "Manèh", "ooui-toolgroup-collapse": "Suda", "ooui-dialog-message-accept": "Oké", "ooui-dialog-message-reject": "Batal", @@ -19,6 +20,6 @@ "ooui-dialog-process-dismiss": "Tutup", "ooui-dialog-process-retry": "Jajal manèh", "ooui-dialog-process-continue": "Tutug", - "ooui-selectfile-not-supported": "Pilihan bêrkas ora disokong", - "ooui-selectfile-placeholder": "Ora ana bêrkas sing kapilih" + "ooui-selectfile-not-supported": "Pilihan berkas ora disokong", + "ooui-selectfile-placeholder": "Ora ana berkas sing kapilih" } diff --git a/resources/lib/oojs-ui/i18n/lb.json b/resources/lib/oojs-ui/i18n/lb.json index 39bc670..fad4c1c 100644 --- a/resources/lib/oojs-ui/i18n/lb.json +++ b/resources/lib/oojs-ui/i18n/lb.json @@ -23,6 +23,7 @@ "ooui-dialog-process-retry": "Nach eng Kéier probéieren", "ooui-dialog-process-continue": "Virufueren", "ooui-selectfile-button-select": "E Fichier eraussichen", + "ooui-selectfile-not-supported": "D'Eraussiche vu Fichiere gëtt net ënnerstëtzt.", "ooui-selectfile-placeholder": "Et ass kee Fichier erausgesicht", "ooui-selectfile-dragdrop-placeholder": "Fichier hei ofleeën" } diff --git a/resources/lib/oojs-ui/i18n/lt.json b/resources/lib/oojs-ui/i18n/lt.json index fbd22d0..86c6d64 100644 --- a/resources/lib/oojs-ui/i18n/lt.json +++ b/resources/lib/oojs-ui/i18n/lt.json @@ -9,7 +9,7 @@ }, "ooui-outline-control-move-down": "Perkelti elementą žemyn", "ooui-outline-control-move-up": "Perkelti elementą aukštyn", - "ooui-outline-control-remove": "Šalinti elementus", + "ooui-outline-control-remove": "Šalinti įrašą", "ooui-toolbar-more": "Daugiau", "ooui-toolgroup-expand": "Daugiau", "ooui-toolgroup-collapse": "Mažiau", diff --git a/resources/lib/oojs-ui/i18n/pt-br.json b/resources/lib/oojs-ui/i18n/pt-br.json index bcc31e0..fc29962 100644 --- a/resources/lib/oojs-ui/i18n/pt-br.json +++ b/resources/lib/oojs-ui/i18n/pt-br.json @@ -26,6 +26,8 @@ "ooui-dialog-process-dismiss": "Dispensar", "ooui-dialog-process-retry": "Tentar novamente", "ooui-dialog-process-continue": "Continuar", + "ooui-selectfile-button-select": "Selecionar um arquivo", "ooui-selectfile-not-supported": "O selecionamento de arquivos não é suportado", - "ooui-selectfile-placeholder": "Nenhum arquivo selecionado" + "ooui-selectfile-placeholder": "Nenhum arquivo selecionado", + "ooui-selectfile-dragdrop-placeholder": "Arraste o arquivo para cá" } diff --git a/resources/lib/oojs-ui/oojs-ui-apex-noimages.css b/resources/lib/oojs-ui/oojs-ui-apex-noimages.css index 131413e..9abc847 100644 --- a/resources/lib/oojs-ui/oojs-ui-apex-noimages.css +++ b/resources/lib/oojs-ui/oojs-ui-apex-noimages.css @@ -1,12 +1,12 @@ /*! - * OOjs UI v0.13.0 + * OOjs UI v0.13.1 * https://www.mediawiki.org/wiki/OOjs_UI * * Copyright 2011–2015 OOjs UI Team and other contributors. * Released under the MIT license * http://oojs.mit-license.org * - * Date: 2015-10-27T17:53:00Z + * Date: 2015-11-03T21:42:28Z */ @-webkit-keyframes oo-ui-progressBarWidget-slide { from { @@ -1777,9 +1777,6 @@ .oo-ui-textInputWidget textarea.oo-ui-pendingElement-pending { background-color: transparent; } -.oo-ui-textInputWidget-icon { - width: 2em; -} .oo-ui-textInputWidget.oo-ui-widget-enabled input:focus, .oo-ui-textInputWidget.oo-ui-widget-enabled textarea:focus { outline: none; @@ -1815,6 +1812,7 @@ } .oo-ui-textInputWidget.oo-ui-iconElement .oo-ui-iconElement-icon { width: 1.875em; + max-height: 2.375em; margin-left: 0.3em; } .oo-ui-textInputWidget.oo-ui-indicatorElement input, @@ -1823,6 +1821,7 @@ } .oo-ui-textInputWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { width: 0.9375em; + max-height: 2.375em; margin-right: 0.775em; } .oo-ui-textInputWidget > .oo-ui-labelElement-label { diff --git a/resources/lib/oojs-ui/oojs-ui-apex.js b/resources/lib/oojs-ui/oojs-ui-apex.js index 3158bfe..00a0966 100644 --- a/resources/lib/oojs-ui/oojs-ui-apex.js +++ b/resources/lib/oojs-ui/oojs-ui-apex.js @@ -1,12 +1,12 @@ /*! - * OOjs UI v0.13.0 + * OOjs UI v0.13.1 * https://www.mediawiki.org/wiki/OOjs_UI * * Copyright 2011–2015 OOjs UI Team and other contributors. * Released under the MIT license * http://oojs.mit-license.org * - * Date: 2015-10-27T17:52:51Z + * Date: 2015-11-03T21:42:20Z */ /** * @class diff --git a/resources/lib/oojs-ui/oojs-ui-mediawiki-noimages.css b/resources/lib/oojs-ui/oojs-ui-mediawiki-noimages.css index 96ba45c..fdb06e5 100644 --- a/resources/lib/oojs-ui/oojs-ui-mediawiki-noimages.css +++ b/resources/lib/oojs-ui/oojs-ui-mediawiki-noimages.css @@ -1,12 +1,12 @@ /*! - * OOjs UI v0.13.0 + * OOjs UI v0.13.1 * https://www.mediawiki.org/wiki/OOjs_UI * * Copyright 2011–2015 OOjs UI Team and other contributors. * Released under the MIT license * http://oojs.mit-license.org * - * Date: 2015-10-27T17:53:00Z + * Date: 2015-11-03T21:42:28Z */ @-webkit-keyframes oo-ui-progressBarWidget-slide { from { @@ -1974,9 +1974,6 @@ .oo-ui-textInputWidget textarea.oo-ui-pendingElement-pending { background-color: transparent; } -.oo-ui-textInputWidget-icon { - width: 2em; -} .oo-ui-textInputWidget.oo-ui-widget-enabled input, .oo-ui-textInputWidget.oo-ui-widget-enabled textarea { -webkit-transition: border 200ms cubic-bezier(0.39, 0.575, 0.565, 1), box-shadow 200ms cubic-bezier(0.39, 0.575, 0.565, 1); @@ -2031,6 +2028,7 @@ .oo-ui-textInputWidget.oo-ui-iconElement .oo-ui-iconElement-icon { left: 0; width: 1.875em; + max-height: 2.375em; margin-left: 0.5em; height: 100%; background-position: right center; @@ -2041,6 +2039,7 @@ } .oo-ui-textInputWidget.oo-ui-indicatorElement .oo-ui-indicatorElement-indicator { width: 0.9375em; + max-height: 2.375em; margin: 0 0.775em; height: 100%; } @@ -2053,7 +2052,7 @@ margin-right: 2.0875em; } .oo-ui-textInputWidget-labelPosition-before.oo-ui-iconElement > .oo-ui-labelElement-label { - margin-right: 2.475em; + margin-left: 2.475em; } .oo-ui-menuSelectWidget { position: absolute; diff --git a/resources/lib/oojs-ui/oojs-ui-mediawiki.js b/resources/lib/oojs-ui/oojs-ui-mediawiki.js index 95e8b47..d9a17a2 100644 --- a/resources/lib/oojs-ui/oojs-ui-mediawiki.js +++ b/resources/lib/oojs-ui/oojs-ui-mediawiki.js @@ -1,12 +1,12 @@ /*! - * OOjs UI v0.13.0 + * OOjs UI v0.13.1 * https://www.mediawiki.org/wiki/OOjs_UI * * Copyright 2011–2015 OOjs UI Team and other contributors. * Released under the MIT license * http://oojs.mit-license.org * - * Date: 2015-10-27T17:52:51Z + * Date: 2015-11-03T21:42:20Z */ /** * @class diff --git a/resources/lib/oojs-ui/oojs-ui.js b/resources/lib/oojs-ui/oojs-ui.js index fbffe09..b4dc48c 100644 --- a/resources/lib/oojs-ui/oojs-ui.js +++ b/resources/lib/oojs-ui/oojs-ui.js @@ -1,12 +1,12 @@ /*! - * OOjs UI v0.13.0 + * OOjs UI v0.13.1 * https://www.mediawiki.org/wiki/OOjs_UI * * Copyright 2011–2015 OOjs UI Team and other contributors. * Released under the MIT license * http://oojs.mit-license.org * - * Date: 2015-10-27T17:52:51Z + * Date: 2015-11-03T21:42:20Z */ ( function ( OO ) { @@ -1289,17 +1289,25 @@ } } } ); + // allow widgets to reuse parts of the DOM + data = cls.static.reusePreInfuseDOM( $elem[ 0 ], data ); // pick up dynamic state, like focus, value of form inputs, scroll position, etc. - state = cls.static.gatherPreInfuseState( $elem, data ); + state = cls.static.gatherPreInfuseState( $elem[ 0 ], data ); + // rebuild widget // jscs:disable requireCapitalizedConstructors - obj = new cls( data ); // rebuild widget + obj = new cls( data ); + // jscs:enable requireCapitalizedConstructors // now replace old DOM with this new DOM. if ( top ) { - $elem.replaceWith( obj.$element ); - // This element is now gone from the DOM, but if anyone is holding a reference to it, - // let's allow them to OO.ui.infuse() it and do what they expect (T105828). - // Do not use jQuery.data(), as using it on detached nodes leaks memory in 1.x line by design. - $elem[ 0 ].oouiInfused = obj; + // An efficient constructor might be able to reuse the entire DOM tree of the original element, + // so only mutate the DOM if we need to. + if ( $elem[ 0 ] !== obj.$element[ 0 ] ) { + $elem.replaceWith( obj.$element ); + // This element is now gone from the DOM, but if anyone is holding a reference to it, + // let's allow them to OO.ui.infuse() it and do what they expect (T105828). + // Do not use jQuery.data(), as using it on detached nodes leaks memory in 1.x line by design. + $elem[ 0 ].oouiInfused = obj; + } top.resolve(); } obj.$element.data( 'ooui-infused', obj ); @@ -1308,6 +1316,22 @@ // restore dynamic state after the new element is inserted into DOM domPromise.done( obj.restorePreInfuseState.bind( obj, state ) ); return obj; +}; + +/** + * Pick out parts of `node`'s DOM to be reused when infusing a widget. + * + * This method **must not** make any changes to the DOM, only find interesting pieces and add them + * to `config` (which should then be returned). Actual DOM juggling should then be done by the + * constructor, which will be given the enhanced config. + * + * @protected + * @param {HTMLElement} node + * @param {Object} config + * @return {Object} + */ +OO.ui.Element.static.reusePreInfuseDOM = function ( node, config ) { + return config; }; /** @@ -9021,7 +9045,7 @@ * @throws {Error} An error is thrown if no widget is specified */ OO.ui.FieldLayout = function OoUiFieldLayout( fieldWidget, config ) { - var hasInputWidget, div, i; + var hasInputWidget, div; // Allow passing positional parameters inside the config object if ( OO.isPlainObject( fieldWidget ) && config === undefined ) { @@ -9048,8 +9072,8 @@ // Properties this.fieldWidget = fieldWidget; - this.errors = config.errors || []; - this.notices = config.notices || []; + this.errors = []; + this.notices = []; this.$field = $( '<div>' ); this.$messages = $( '<ul>' ); this.$body = $( '<' + ( hasInputWidget ? 'label' : 'div' ) + '>' ); @@ -9085,9 +9109,6 @@ this.$element .addClass( 'oo-ui-fieldLayout' ) .append( this.$help, this.$body ); - if ( this.errors.length || this.notices.length ) { - this.$element.append( this.$messages ); - } this.$body.addClass( 'oo-ui-fieldLayout-body' ); this.$messages.addClass( 'oo-ui-fieldLayout-messages' ); this.$field @@ -9095,13 +9116,8 @@ .toggleClass( 'oo-ui-fieldLayout-disable', this.fieldWidget.isDisabled() ) .append( this.fieldWidget.$element ); - for ( i = 0; i < this.notices.length; i++ ) { - this.$messages.append( this.makeMessage( 'notice', this.notices[ i ] ) ); - } - for ( i = 0; i < this.errors.length; i++ ) { - this.$messages.append( this.makeMessage( 'error', this.errors[ i ] ) ); - } - + this.setErrors( config.errors || [] ); + this.setNotices( config.notices || [] ); this.setAlignment( config.align ); }; @@ -9144,6 +9160,7 @@ }; /** + * @protected * @param {string} kind 'error' or 'notice' * @param {string|OO.ui.HtmlSnippet} text * @return {jQuery} @@ -9197,6 +9214,56 @@ } return this; +}; + +/** + * Set the list of error messages. + * + * @param {Array} errors Error messages about the widget, which will be displayed below the widget. + * The array may contain strings or OO.ui.HtmlSnippet instances. + * @chainable + */ +OO.ui.FieldLayout.prototype.setErrors = function ( errors ) { + this.errors = errors.slice(); + this.updateMessages(); + return this; +}; + +/** + * Set the list of notice messages. + * + * @param {Array} notices Notices about the widget, which will be displayed below the widget. + * The array may contain strings or OO.ui.HtmlSnippet instances. + * @chainable + */ +OO.ui.FieldLayout.prototype.setNotices = function ( notices ) { + this.notices = notices.slice(); + this.updateMessages(); + return this; +}; + +/** + * Update the rendering of error and notice messages. + * + * @private + */ +OO.ui.FieldLayout.prototype.updateMessages = function () { + var i; + this.$messages.empty(); + + if ( this.errors.length || this.notices.length ) { + this.$body.after( this.$messages ); + } else { + this.$messages.remove(); + return; + } + + for ( i = 0; i < this.notices.length; i++ ) { + this.$messages.append( this.makeMessage( 'notice', this.notices[ i ] ) ); + } + for ( i = 0; i < this.errors.length; i++ ) { + this.$messages.append( this.makeMessage( 'error', this.errors[ i ] ) ); + } }; /** @@ -14569,7 +14636,7 @@ * @param {Object} [config] Configuration options * @cfg {string} [name=''] The value of the input’s HTML `name` attribute. * @cfg {string} [value=''] The value of the input. - * @cfg {string} [accessKey=''] The access key of the input. + * @cfg {string} [dir] The directionality of the input (ltr/rtl). * @cfg {Function} [inputFilter] The name of an input filter function. Input filters modify the value of an input * before it is accepted. */ @@ -14604,6 +14671,9 @@ .append( this.$input ); this.setValue( config.value ); this.setAccessKey( config.accessKey ); + if ( config.dir ) { + this.setDir( config.dir ); + } }; /* Setup */ @@ -14623,13 +14693,21 @@ /** * @inheritdoc */ +OO.ui.InputWidget.static.reusePreInfuseDOM = function ( node, config ) { + config = OO.ui.InputWidget.parent.static.reusePreInfuseDOM( node, config ); + // Reusing $input lets browsers preserve inputted values across page reloads (T114134) + config.$input = $( node ).find( '.oo-ui-inputWidget-input' ); + return config; +}; + +/** + * @inheritdoc + */ OO.ui.InputWidget.static.gatherPreInfuseState = function ( node, config ) { - var - state = OO.ui.InputWidget.parent.static.gatherPreInfuseState( node, config ), - $input = state.$input || $( node ).find( '.oo-ui-inputWidget-input' ); - state.value = $input.val(); + var state = OO.ui.InputWidget.parent.static.gatherPreInfuseState( node, config ); + state.value = config.$input.val(); // Might be better in TabIndexedElement, but it's awkward to do there because mixins are awkward - state.focus = $input.is( ':focus' ); + state.focus = config.$input.is( ':focus' ); return state; }; @@ -14655,8 +14733,9 @@ * @param {Object} config Configuration options * @return {jQuery} Input element */ -OO.ui.InputWidget.prototype.getInputElement = function () { - return $( '<input>' ); +OO.ui.InputWidget.prototype.getInputElement = function ( config ) { + // See #reusePreInfuseDOM about config.$input + return config.$input || $( '<input>' ); }; /** @@ -14691,13 +14770,26 @@ }; /** - * Set the direction of the input, either RTL (right-to-left) or LTR (left-to-right). + * Set the directionality of the input, either RTL (right-to-left) or LTR (left-to-right). * - * @param {boolean} isRTL - * Direction is right-to-left + * @deprecated since v0.13.1, use #setDir directly + * @param {boolean} isRTL Directionality is right-to-left + * @chainable */ OO.ui.InputWidget.prototype.setRTL = function ( isRTL ) { - this.$input.prop( 'dir', isRTL ? 'rtl' : 'ltr' ); + this.setDir( isRTL ? 'rtl' : 'ltr' ); + return this; +}; + +/** + * Set the directionality of the input. + * + * @param {string} dir Text directionality: 'ltr', 'rtl' or 'auto' + * @chainable + */ +OO.ui.InputWidget.prototype.setDir = function ( dir ) { + this.$input.prop( 'dir', dir ); + return this; }; /** @@ -14906,9 +14998,12 @@ * @protected */ OO.ui.ButtonInputWidget.prototype.getInputElement = function ( config ) { - var type = [ 'button', 'submit', 'reset' ].indexOf( config.type ) !== -1 ? - config.type : - 'button'; + var type; + // See InputWidget#reusePreInfuseDOM about config.$input + if ( config.$input ) { + return config.$input.empty(); + } + type = [ 'button', 'submit', 'reset' ].indexOf( config.type ) !== -1 ? config.type : 'button'; return $( '<' + ( config.useInputTag ? 'input' : 'button' ) + ' type="' + type + '">' ); }; @@ -15022,11 +15117,8 @@ * @inheritdoc */ OO.ui.CheckboxInputWidget.static.gatherPreInfuseState = function ( node, config ) { - var - state = OO.ui.CheckboxInputWidget.parent.static.gatherPreInfuseState( node, config ), - $input = $( node ).find( '.oo-ui-inputWidget-input' ); - state.$input = $input; // shortcut for performance, used in InputWidget - state.checked = $input.prop( 'checked' ); + var state = OO.ui.CheckboxInputWidget.parent.static.gatherPreInfuseState( node, config ); + state.checked = config.$input.prop( 'checked' ); return state; }; @@ -15162,7 +15254,11 @@ * @inheritdoc * @protected */ -OO.ui.DropdownInputWidget.prototype.getInputElement = function () { +OO.ui.DropdownInputWidget.prototype.getInputElement = function ( config ) { + // See InputWidget#reusePreInfuseDOM about config.$input + if ( config.$input ) { + return config.$input.addClass( 'oo-ui-element-hidden' ); + } return $( '<input type="hidden">' ); }; @@ -15313,11 +15409,8 @@ * @inheritdoc */ OO.ui.RadioInputWidget.static.gatherPreInfuseState = function ( node, config ) { - var - state = OO.ui.RadioInputWidget.parent.static.gatherPreInfuseState( node, config ), - $input = $( node ).find( '.oo-ui-inputWidget-input' ); - state.$input = $input; // shortcut for performance, used in InputWidget - state.checked = $input.prop( 'checked' ); + var state = OO.ui.RadioInputWidget.parent.static.gatherPreInfuseState( node, config ); + state.checked = config.$input.prop( 'checked' ); return state; }; @@ -15604,6 +15697,7 @@ this.maxRows = config.maxRows || Math.max( 2 * ( this.minRows || 0 ), 10 ); this.validate = null; this.styleHeight = null; + this.scrollWidth = null; // Clone for resizing if ( this.autosize ) { @@ -15696,12 +15790,9 @@ * @inheritdoc */ OO.ui.TextInputWidget.static.gatherPreInfuseState = function ( node, config ) { - var - state = OO.ui.TextInputWidget.parent.static.gatherPreInfuseState( node, config ), - $input = $( node ).find( '.oo-ui-inputWidget-input' ); - state.$input = $input; // shortcut for performance, used in InputWidget + var state = OO.ui.TextInputWidget.parent.static.gatherPreInfuseState( node, config ); if ( config.multiline ) { - state.scrollTop = $input.scrollTop(); + state.scrollTop = config.$input.scrollTop(); } return state; }; @@ -15914,47 +16005,67 @@ * @fires resize */ OO.ui.TextInputWidget.prototype.adjustSize = function () { - var scrollHeight, innerHeight, outerHeight, maxInnerHeight, measurementError, idealHeight, newHeight; + var scrollHeight, innerHeight, outerHeight, maxInnerHeight, measurementError, + idealHeight, newHeight, scrollWidth, property; - if ( this.multiline && this.autosize && this.$input.val() !== this.valCache ) { - this.$clone - .val( this.$input.val() ) - .attr( 'rows', this.minRows ) - // Set inline height property to 0 to measure scroll height - .css( 'height', 0 ); + if ( this.multiline && this.$input.val() !== this.valCache ) { + if ( this.autosize ) { + this.$clone + .val( this.$input.val() ) + .attr( 'rows', this.minRows ) + // Set inline height property to 0 to measure scroll height + .css( 'height', 0 ); - this.$clone.removeClass( 'oo-ui-element-hidden' ); + this.$clone.removeClass( 'oo-ui-element-hidden' ); - this.valCache = this.$input.val(); + this.valCache = this.$input.val(); - scrollHeight = this.$clone[ 0 ].scrollHeight; + scrollHeight = this.$clone[ 0 ].scrollHeight; - // Remove inline height property to measure natural heights - this.$clone.css( 'height', '' ); - innerHeight = this.$clone.innerHeight(); - outerHeight = this.$clone.outerHeight(); + // Remove inline height property to measure natural heights + this.$clone.css( 'height', '' ); + innerHeight = this.$clone.innerHeight(); + outerHeight = this.$clone.outerHeight(); - // Measure max rows height - this.$clone - .attr( 'rows', this.maxRows ) - .css( 'height', 'auto' ) - .val( '' ); - maxInnerHeight = this.$clone.innerHeight(); + // Measure max rows height + this.$clone + .attr( 'rows', this.maxRows ) + .css( 'height', 'auto' ) + .val( '' ); + maxInnerHeight = this.$clone.innerHeight(); - // Difference between reported innerHeight and scrollHeight with no scrollbars present - // Equals 1 on Blink-based browsers and 0 everywhere else - measurementError = maxInnerHeight - this.$clone[ 0 ].scrollHeight; - idealHeight = Math.min( maxInnerHeight, scrollHeight + measurementError ); + // Difference between reported innerHeight and scrollHeight with no scrollbars present + // Equals 1 on Blink-based browsers and 0 everywhere else + measurementError = maxInnerHeight - this.$clone[ 0 ].scrollHeight; + idealHeight = Math.min( maxInnerHeight, scrollHeight + measurementError ); - this.$clone.addClass( 'oo-ui-element-hidden' ); + this.$clone.addClass( 'oo-ui-element-hidden' ); - // Only apply inline height when expansion beyond natural height is needed - // Use the difference between the inner and outer height as a buffer - newHeight = idealHeight > innerHeight ? idealHeight + ( outerHeight - innerHeight ) : ''; - if ( newHeight !== this.styleHeight ) { - this.$input.css( 'height', newHeight ); - this.styleHeight = newHeight; - this.emit( 'resize' ); + // Only apply inline height when expansion beyond natural height is needed + // Use the difference between the inner and outer height as a buffer + newHeight = idealHeight > innerHeight ? idealHeight + ( outerHeight - innerHeight ) : ''; + if ( newHeight !== this.styleHeight ) { + this.$input.css( 'height', newHeight ); + this.styleHeight = newHeight; + this.emit( 'resize' ); + } + } + scrollWidth = this.$input[ 0 ].offsetWidth - this.$input[ 0 ].clientWidth; + if ( scrollWidth !== this.scrollWidth ) { + property = this.$element.css( 'direction' ) === 'rtl' ? 'left' : 'right'; + // Reset + this.$label.css( { right: '', left: '' } ); + this.$indicator.css( { right: '', left: '' } ); + + if ( scrollWidth ) { + this.$indicator.css( property, scrollWidth ); + if ( this.labelPosition === 'after' ) { + this.$label.css( property, scrollWidth ); + } + } + + this.scrollWidth = scrollWidth; + this.positionLabel(); } } return this; @@ -16221,6 +16332,9 @@ .toggleClass( 'oo-ui-textInputWidget-labelPosition-after', !!this.label && after ) .toggleClass( 'oo-ui-textInputWidget-labelPosition-before', !!this.label && !after ); + this.valCache = null; + this.scrollWidth = null; + this.adjustSize(); this.positionLabel(); return this; @@ -16267,7 +16381,7 @@ rtl = this.$element.css( 'direction' ) === 'rtl'; property = after === rtl ? 'padding-left' : 'padding-right'; - this.$input.css( property, this.$label.outerWidth( true ) ); + this.$input.css( property, this.$label.outerWidth( true ) + ( after ? this.scrollWidth : 0 ) ); return this; }; -- To view, visit https://gerrit.wikimedia.org/r/250835 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: newchange Gerrit-Change-Id: Ic8fbb6ee4326c73243ea655708b9cfd09bc7e52a Gerrit-PatchSet: 1 Gerrit-Project: mediawiki/core Gerrit-Branch: master Gerrit-Owner: Jforrester <[email protected]> _______________________________________________ MediaWiki-commits mailing list [email protected] https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
