Hoo man has submitted this change and it was merged. Change subject: Update OOjs UI to v0.6.6 ......................................................................
Update OOjs UI to v0.6.6 Release notes: https://git.wikimedia.org/blob/oojs%2Fui.git/v0.6.6/History.md Change-Id: I8e0ea18c23df5fe0530cc841799830c4f0082eff --- M composer.json M composer.lock M composer/autoload_namespaces.php M composer/installed.json M oojs/oojs-ui/History.md M oojs/oojs-ui/build/typos.json M oojs/oojs-ui/package.json M oojs/oojs-ui/src/Widget.js M oojs/oojs-ui/src/Window.js M oojs/oojs-ui/src/dialogs/ProcessDialog.js M oojs/oojs-ui/src/elements/DraggableGroupElement.js M oojs/oojs-ui/src/elements/TabIndexedElement.js M oojs/oojs-ui/src/layouts/BookletLayout.js M oojs/oojs-ui/src/layouts/MenuLayout.js M oojs/oojs-ui/src/layouts/StackLayout.js A oojs/oojs-ui/src/styles/Element.less M oojs/oojs-ui/src/styles/core.less M oojs/oojs-ui/src/styles/layouts/MenuLayout.less M oojs/oojs-ui/src/styles/layouts/StackLayout.less M oojs/oojs-ui/src/styles/theme.less M oojs/oojs-ui/src/themes/apex/elements.less M oojs/oojs-ui/src/themes/apex/widgets.less M oojs/oojs-ui/src/themes/blank/elements.less M oojs/oojs-ui/src/themes/mediawiki/elements.less M oojs/oojs-ui/src/themes/mediawiki/widgets.less M oojs/oojs-ui/src/widgets/ButtonWidget.js M oojs/oojs-ui/src/widgets/MenuSelectWidget.js M oojs/oojs-ui/src/widgets/PopupWidget.js M oojs/oojs-ui/src/widgets/TextInputWidget.js 29 files changed, 185 insertions(+), 207 deletions(-) Approvals: Mooeypoo: Verified; Looks good to me, approved diff --git a/composer.json b/composer.json index f7efe64..0004c35 100644 --- a/composer.json +++ b/composer.json @@ -10,7 +10,7 @@ "psr/log": "1.0.0", "monolog/monolog": "1.11.0", "ruflin/elastica": "1.3.0.0", - "oojs/oojs-ui": "0.6.5", + "oojs/oojs-ui": "0.6.6", "wikimedia/cdb": "1.0.1", "wikimedia/composer-merge-plugin": "0.5.0", "zordius/lightncandy": "0.18" diff --git a/composer.lock b/composer.lock index 04c450c..c884b2a 100644 --- a/composer.lock +++ b/composer.lock @@ -4,52 +4,8 @@ "Read more about it at http://getcomposer.org/doc/01-basic-usage.md#composer-lock-the-lock-file";, "This file is @generated automatically" ], - "hash": "0b09782f743df8081fb436c9b17f257c", + "hash": "45c4b1f2950b6dce6d34f008c6a628aa", "packages": [ - { - "name": "Plancake/EmailParser", - "version": "dev-master", - "source": { - "type": "git", - "url": "https://github.com/plancake/official-library-php-email-parser.git";, - "reference": "e7453ead1f3a74810d8050a30afb96feed74477a" - }, - "dist": { - "type": "zip", - "url": "https://api.github.com/repos/plancake/official-library-php-email-parser/zipball/2108a328221b2994ab4ed16e608dcfbe7937d57e";, - "reference": "e7453ead1f3a74810d8050a30afb96feed74477a", - "shasum": "" - }, - "require": { - "php": ">=5.3.0" - }, - "type": "library", - "autoload": { - "psr-0": { - "PlancakeEmailParser": "." - } - }, - "license": [ - "GPLv3" - ], - "authors": [ - { - "name": "Daniele Occhipinti", - "email": "d...@plancake.com" - } - ], - "description": "Plancake Email Parser is a simple emailparser for php", - "homepage": "http://www.plancake.com";, - "keywords": [ - "email", - "parser" - ], - "support": { - "source": "https://github.com/plancake/official-library-php-email-parser/tree/master";, - "issues": "https://github.com/plancake/official-library-php-email-parser/issues"; - }, - "time": "2013-09-05 21:02:55" - }, { "name": "cssjanus/cssjanus", "version": "v1.1.1", @@ -200,16 +156,16 @@ }, { "name": "oojs/oojs-ui", - "version": "v0.6.5", + "version": "v0.6.6", "source": { "type": "git", "url": "https://github.com/wikimedia/oojs-ui.git";, - "reference": "57b2cc74b44c9efa7a262d30ef1cfdb935fa6138" + "reference": "e2dc8fe83ba530f4d35258e8ac0b3061582eaf72" }, "dist": { "type": "zip", - "url": "https://api.github.com/repos/wikimedia/oojs-ui/zipball/57b2cc74b44c9efa7a262d30ef1cfdb935fa6138";, - "reference": "57b2cc74b44c9efa7a262d30ef1cfdb935fa6138", + "url": "https://api.github.com/repos/wikimedia/oojs-ui/zipball/e2dc8fe83ba530f4d35258e8ac0b3061582eaf72";, + "reference": "e2dc8fe83ba530f4d35258e8ac0b3061582eaf72", "shasum": "" }, "require": { @@ -226,7 +182,7 @@ "MIT" ], "homepage": "https://www.mediawiki.org/wiki/OOjs_UI";, - "time": "2015-02-02 02:41:40" + "time": "2015-02-04 16:06:54" }, { "name": "psr/log", diff --git a/composer/autoload_namespaces.php b/composer/autoload_namespaces.php index d794f0f..02adf07 100644 --- a/composer/autoload_namespaces.php +++ b/composer/autoload_namespaces.php @@ -7,7 +7,6 @@ return array( 'Psr\\Log\\' => array($vendorDir . '/psr/log'), - 'PlancakeEmailParser' => array($vendorDir . '/Plancake/EmailParser'), 'Elastica\\Test' => array($vendorDir . '/ruflin/elastica/test/lib'), 'Elastica' => array($vendorDir . '/ruflin/elastica/lib'), '' => array($vendorDir . '/cssjanus/cssjanus/src'), diff --git a/composer/installed.json b/composer/installed.json index 64ebbaa..51ff65b 100644 --- a/composer/installed.json +++ b/composer/installed.json @@ -40,52 +40,6 @@ ] }, { - "name": "Plancake/EmailParser", - "version": "dev-master", - "version_normalized": "9999999-dev", - "source": { - "type": "git", - "url": "https://github.com/plancake/official-library-php-email-parser.git";, - "reference": "e7453ead1f3a74810d8050a30afb96feed74477a" - }, - "dist": { - "type": "zip", - "url": "https://api.github.com/repos/plancake/official-library-php-email-parser/zipball/2108a328221b2994ab4ed16e608dcfbe7937d57e";, - "reference": "e7453ead1f3a74810d8050a30afb96feed74477a", - "shasum": "" - }, - "require": { - "php": ">=5.3.0" - }, - "time": "2013-09-05 21:02:55", - "type": "library", - "installation-source": "dist", - "autoload": { - "psr-0": { - "PlancakeEmailParser": "." - } - }, - "license": [ - "GPLv3" - ], - "authors": [ - { - "name": "Daniele Occhipinti", - "email": "d...@plancake.com" - } - ], - "description": "Plancake Email Parser is a simple emailparser for php", - "homepage": "http://www.plancake.com";, - "keywords": [ - "email", - "parser" - ], - "support": { - "source": "https://github.com/plancake/official-library-php-email-parser/tree/master";, - "issues": "https://github.com/plancake/official-library-php-email-parser/issues"; - } - }, - { "name": "monolog/monolog", "version": "1.11.0", "version_normalized": "1.11.0.0", @@ -440,23 +394,23 @@ }, { "name": "oojs/oojs-ui", - "version": "v0.6.5", - "version_normalized": "0.6.5.0", + "version": "v0.6.6", + "version_normalized": "0.6.6.0", "source": { "type": "git", "url": "https://github.com/wikimedia/oojs-ui.git";, - "reference": "57b2cc74b44c9efa7a262d30ef1cfdb935fa6138" + "reference": "e2dc8fe83ba530f4d35258e8ac0b3061582eaf72" }, "dist": { "type": "zip", - "url": "https://api.github.com/repos/wikimedia/oojs-ui/zipball/57b2cc74b44c9efa7a262d30ef1cfdb935fa6138";, - "reference": "57b2cc74b44c9efa7a262d30ef1cfdb935fa6138", + "url": "https://api.github.com/repos/wikimedia/oojs-ui/zipball/e2dc8fe83ba530f4d35258e8ac0b3061582eaf72";, + "reference": "e2dc8fe83ba530f4d35258e8ac0b3061582eaf72", "shasum": "" }, "require": { "php": ">=5.3.3" }, - "time": "2015-02-02 02:41:40", + "time": "2015-02-04 16:06:54", "type": "library", "installation-source": "dist", "autoload": { diff --git a/oojs/oojs-ui/History.md b/oojs/oojs-ui/History.md index 1813495..e84cd41 100644 --- a/oojs/oojs-ui/History.md +++ b/oojs/oojs-ui/History.md @@ -1,5 +1,14 @@ # OOjs UI Release History +## v0.6.6 / 2014-02-04 +* TextInputWidget: Mostly revert "Don't try adjusting size when detached" (Bartosz Dziewoński) +* Use css class instead of jQuery .show()/hide()/toggle() (Moriel Schottlender) +* build: Use karma to v0.12.31 (Timo Tijhof) +* Use standard border colours for progress bars (Ed Sanders) +* Remove disabled elements from keyboard navigation flow (Derk-Jan Hartman) +* Fix BookletLayout#toggleOutline to use MenuLayout method (Ed Sanders) +* Use CSS overriding trick to support RTL in menu layouts (Ed Sanders) + ## v0.6.5 / 2014-02-01 * Make BookletLayout inherit from MenuLayout instead of embedding a GridLayout (Ed Sanders) * ButtonElement: Unbreak 'pressed' state (Bartosz Dziewoński) diff --git a/oojs/oojs-ui/build/typos.json b/oojs/oojs-ui/build/typos.json index faa0960..4554e3b 100644 --- a/oojs/oojs-ui/build/typos.json +++ b/oojs/oojs-ui/build/typos.json @@ -8,9 +8,9 @@ [ "visiblit(ies|y)", "visibilit$1" ], [ "movablilties", "movabilities" ], [ "inpsect(ors?|ion)", "inspect$1" ], - [ "teh", "the" ], + [ "\bteh\b", "the" ], [ "intialization", "initialization" ], [ "durring", "during" ], [ "occured", "occurred" ] ] -} \ No newline at end of file +} diff --git a/oojs/oojs-ui/package.json b/oojs/oojs-ui/package.json index 6a9f080..94b70f1 100644 --- a/oojs/oojs-ui/package.json +++ b/oojs/oojs-ui/package.json @@ -1,6 +1,6 @@ { "name": "oojs-ui", - "version": "0.6.5", + "version": "0.6.6", "description": "User interface classes built on the OOjs framework.", "keywords": [ "oojs-plugin", @@ -40,7 +40,7 @@ "grunt-svg2png": "0.2.5", "grunt-karma": "0.9.0", "grunt-promise-q": "0.1.1", - "karma": "0.12.28", + "karma": "0.12.31", "karma-chrome-launcher": "0.1.7", "karma-coverage": "0.2.7", "karma-firefox-launcher": "0.1.3", diff --git a/oojs/oojs-ui/src/Widget.js b/oojs/oojs-ui/src/Widget.js index 78ef892..513a3ea 100644 --- a/oojs/oojs-ui/src/Widget.js +++ b/oojs/oojs-ui/src/Widget.js @@ -104,7 +104,7 @@ if ( show !== this.isVisible() ) { this.visible = show; - this.$element.toggle( show ); + this.$element.toggleClass( 'oo-ui-element-hidden', !this.visible ); this.emit( 'toggle', show ); } diff --git a/oojs/oojs-ui/src/Window.js b/oojs/oojs-ui/src/Window.js index 202affe..5daaa3e 100644 --- a/oojs/oojs-ui/src/Window.js +++ b/oojs/oojs-ui/src/Window.js @@ -465,9 +465,12 @@ if ( this.isolated && !this.isLoaded() ) { // Hide the window using visibility instead of display until loading is complete // Can't use display: none; because that prevents the iframe from loading in Firefox - this.$element.css( 'visibility', show ? 'visible' : 'hidden' ); + this.$element + .css( 'visibility', show ? 'visible' : 'hidden' ); } else { - this.$element.toggle( show ).css( 'visibility', '' ); + this.$element + .toggleClass( 'oo-ui-element-hidden', !this.visible ) + .css( 'visibility', '' ); } this.emit( 'toggle', show ); } @@ -656,8 +659,7 @@ var win = this, deferred = $.Deferred(); - this.$element.show(); - this.visible = true; + this.toggle( true ); this.getSetupProcess( data ).execute().done( function () { // Force redraw by asking the browser to measure the elements' widths win.$element.addClass( 'oo-ui-window-setup' ).width(); @@ -740,7 +742,7 @@ // Force redraw by asking the browser to measure the elements' widths win.$element.removeClass( 'oo-ui-window-load oo-ui-window-setup' ).width(); win.$content.removeClass( 'oo-ui-window-content-setup' ).width(); - win.$element.hide(); + win.$element.addClass( 'oo-ui-element-hidden' ); win.visible = false; deferred.resolve(); } ); diff --git a/oojs/oojs-ui/src/dialogs/ProcessDialog.js b/oojs/oojs-ui/src/dialogs/ProcessDialog.js index 2cdaee4..98658cc 100644 --- a/oojs/oojs-ui/src/dialogs/ProcessDialog.js +++ b/oojs/oojs-ui/src/dialogs/ProcessDialog.js @@ -206,14 +206,14 @@ } this.retryButton.toggle( recoverable ); this.$errorsTitle.after( this.$errorItems ); - this.$errors.show().scrollTop( 0 ); + this.$errors.removeClass( 'oo-ui-widget-hidden' ).scrollTop( 0 ); }; /** * Hide errors. */ OO.ui.ProcessDialog.prototype.hideErrors = function () { - this.$errors.hide(); + this.$errors.addClass( 'oo-ui-widget-hidden' ); this.$errorItems.remove(); this.$errorItems = null; }; diff --git a/oojs/oojs-ui/src/elements/DraggableGroupElement.js b/oojs/oojs-ui/src/elements/DraggableGroupElement.js index a4c0a57..b09e4bc 100644 --- a/oojs/oojs-ui/src/elements/DraggableGroupElement.js +++ b/oojs/oojs-ui/src/elements/DraggableGroupElement.js @@ -132,7 +132,7 @@ // This means the item was dragged outside the widget this.$placeholder .css( 'left', 0 ) - .hide(); + .addClass( 'oo-ui-element-hidden' ); }; /** @@ -196,20 +196,20 @@ if ( this.sideInsertion ) { this.$placeholder .css( cssOutput ) - .show(); + .removeClass( 'oo-ui-element-hidden' ); } else { this.$placeholder .css( { left: 0, top: 0 } ) - .hide(); + .addClass( 'oo-ui-element-hidden' ); } } else { // This means the item was dragged outside the widget this.$placeholder .css( 'left', 0 ) - .hide(); + .addClass( 'oo-ui-element-hidden' ); } // Prevent default e.preventDefault(); @@ -229,7 +229,7 @@ OO.ui.DraggableGroupElement.prototype.unsetDragItem = function () { this.dragItem = null; this.itemDragOver = null; - this.$placeholder.hide(); + this.$placeholder.addClass( 'oo-ui-element-hidden' ); this.sideInsertion = ''; }; diff --git a/oojs/oojs-ui/src/elements/TabIndexedElement.js b/oojs/oojs-ui/src/elements/TabIndexedElement.js index 580e4ee..2328162 100644 --- a/oojs/oojs-ui/src/elements/TabIndexedElement.js +++ b/oojs/oojs-ui/src/elements/TabIndexedElement.js @@ -18,6 +18,9 @@ this.$tabIndexed = null; this.tabIndex = null; + // Events + this.connect( this, { disable: 'onDisable' } ); + // Initialization this.setTabIndex( config.tabIndex || 0 ); this.setTabIndexedElement( config.$tabIndexed || this.$element ); @@ -38,12 +41,17 @@ */ OO.ui.TabIndexedElement.prototype.setTabIndexedElement = function ( $tabIndexed ) { if ( this.$tabIndexed ) { - this.$tabIndexed.removeAttr( 'tabindex' ); + this.$tabIndexed.removeAttr( 'tabindex aria-disabled' ); } this.$tabIndexed = $tabIndexed; if ( this.tabIndex !== null ) { - this.$tabIndexed.attr( 'tabindex', this.tabIndex ); + this.$tabIndexed.attr( { + // Do not index over disabled elements + tabindex: this.isDisabled() ? -1 : this.tabIndex, + // ChromeVox and NVDA do not seem to inherit this from parent elements + 'aria-disabled': this.isDisabled().toString() + } ); } }; @@ -59,9 +67,14 @@ if ( this.tabIndex !== tabIndex ) { if ( this.$tabIndexed ) { if ( tabIndex !== null ) { - this.$tabIndexed.attr( 'tabindex', tabIndex ); + this.$tabIndexed.attr( { + // Do not index over disabled elements + tabindex: this.isDisabled() ? -1 : tabIndex, + // ChromeVox and NVDA do not seem to inherit this from parent elements + 'aria-disabled': this.isDisabled().toString() + } ); } else { - this.$tabIndexed.removeAttr( 'tabindex' ); + this.$tabIndexed.removeAttr( 'tabindex aria-disabled' ); } } this.tabIndex = tabIndex; @@ -71,6 +84,22 @@ }; /** + * Handle disable events. + * + * @param {boolean} disabled Element is disabled + */ +OO.ui.TabIndexedElement.prototype.onDisable = function ( disabled ) { + if ( this.$tabIndexed && this.tabIndex !== null ) { + this.$tabIndexed.attr( { + // Do not index over disabled elements + tabindex: disabled ? -1 : this.tabIndex, + // ChromeVox and NVDA do not seem to inherit this from parent elements + 'aria-disabled': disabled.toString() + } ); + } +}; + +/** * Get tab index value. * * @return {number} Tab index value diff --git a/oojs/oojs-ui/src/layouts/BookletLayout.js b/oojs/oojs-ui/src/layouts/BookletLayout.js index 4284330..9a1cc7d 100644 --- a/oojs/oojs-ui/src/layouts/BookletLayout.js +++ b/oojs/oojs-ui/src/layouts/BookletLayout.js @@ -198,7 +198,7 @@ if ( this.outlined ) { show = show === undefined ? !this.outlineVisible : !!show; this.outlineVisible = show; - this.gridLayout.layout( show ? [ 1, 2 ] : [ 0, 1 ], [ 1 ] ); + this.toggleMenu( show ); } return this; diff --git a/oojs/oojs-ui/src/layouts/MenuLayout.js b/oojs/oojs-ui/src/layouts/MenuLayout.js index 8d98726..6dd915e 100644 --- a/oojs/oojs-ui/src/layouts/MenuLayout.js +++ b/oojs/oojs-ui/src/layouts/MenuLayout.js @@ -41,11 +41,9 @@ */ this.$content = this.$( '<div>' ); - // Events - this.$element.on( 'DOMNodeInsertedIntoDocument', this.onElementAttach.bind( this ) ); - // Initialization this.toggleMenu( this.showMenu ); + this.updateSizes(); this.$menu .addClass( 'oo-ui-menuLayout-menu' ) .css( this.menuPosition.sizeProperty, this.menuSize ); @@ -64,39 +62,23 @@ OO.ui.MenuLayout.static.menuPositions = { top: { sizeProperty: 'height', - positionProperty: 'top', className: 'oo-ui-menuLayout-top' }, after: { sizeProperty: 'width', - positionProperty: 'right', - rtlPositionProperty: 'left', className: 'oo-ui-menuLayout-after' }, bottom: { sizeProperty: 'height', - positionProperty: 'bottom', className: 'oo-ui-menuLayout-bottom' }, before: { sizeProperty: 'width', - positionProperty: 'left', - rtlPositionProperty: 'right', className: 'oo-ui-menuLayout-before' } }; /* Methods */ - -/** - * Handle DOM attachment events - */ -OO.ui.MenuLayout.prototype.onElementAttach = function () { - // getPositionProperty won't know about directionality until the layout is attached - if ( this.showMenu ) { - this.$content.css( this.getPositionProperty(), this.menuSize ); - } -}; /** * Toggle menu. @@ -139,18 +121,32 @@ /** * Update menu and content CSS based on current menu size and visibility + * + * This method is called internally when size or position is changed. */ OO.ui.MenuLayout.prototype.updateSizes = function () { if ( this.showMenu ) { this.$menu .css( this.menuPosition.sizeProperty, this.menuSize ) .css( 'overflow', '' ); - this.$content.css( this.getPositionProperty(), this.menuSize ); + // Set offsets on all sides. CSS resets all but one with + // 'important' rules so directionality flips are supported + this.$content.css( { + top: this.menuSize, + right: this.menuSize, + bottom: this.menuSize, + left: this.menuSize + } ); } else { this.$menu .css( this.menuPosition.sizeProperty, 0 ) .css( 'overflow', 'hidden' ); - this.$content.css( this.getPositionProperty(), 0 ); + this.$content.css( { + top: 0, + right: 0, + bottom: 0, + left: 0 + } ); } }; @@ -171,15 +167,13 @@ * @chainable */ OO.ui.MenuLayout.prototype.setMenuPosition = function ( position ) { - var positionProperty, positions = this.constructor.static.menuPositions; + var positions = this.constructor.static.menuPositions; if ( !positions[ position ] ) { throw new Error( 'Cannot set position; unsupported position value: ' + position ); } - positionProperty = this.getPositionProperty(); this.$menu.css( this.menuPosition.sizeProperty, '' ); - this.$content.css( positionProperty, '' ); this.$element.removeClass( this.menuPosition.className ); this.menuPosition = positions[ position ]; @@ -197,17 +191,4 @@ */ OO.ui.MenuLayout.prototype.getMenuPosition = function () { return this.menuPosition; -}; - -/** - * Get the menu position property. - * - * @return {string} Menu position CSS property - */ -OO.ui.MenuLayout.prototype.getPositionProperty = function () { - if ( this.menuPosition.rtlPositionProperty && this.$element.css( 'direction' ) === 'rtl' ) { - return this.menuPosition.rtlPositionProperty; - } else { - return this.menuPosition.positionProperty; - } }; diff --git a/oojs/oojs-ui/src/layouts/StackLayout.js b/oojs/oojs-ui/src/layouts/StackLayout.js index 02f613e..507993b 100644 --- a/oojs/oojs-ui/src/layouts/StackLayout.js +++ b/oojs/oojs-ui/src/layouts/StackLayout.js @@ -84,6 +84,9 @@ * @chainable */ OO.ui.StackLayout.prototype.addItems = function ( items, index ) { + // Update the visibility + this.updateHiddenState( items, this.currentItem ); + // Mixin method OO.ui.GroupElement.prototype.addItems.call( this, items, index ); @@ -146,18 +149,10 @@ * @fires set */ OO.ui.StackLayout.prototype.setItem = function ( item ) { - var i, len; - if ( item !== this.currentItem ) { - if ( !this.continuous ) { - for ( i = 0, len = this.items.length; i < len; i++ ) { - this.items[ i ].$element.css( 'display', '' ); - } - } + this.updateHiddenState( this.items, item ); + if ( $.inArray( item, this.items ) !== -1 ) { - if ( !this.continuous ) { - item.$element.css( 'display', 'block' ); - } this.currentItem = item; this.emit( 'set', item ); } else { @@ -167,3 +162,27 @@ return this; }; + +/** + * Update the visibility of all items in case of non-continuous view. + * + * Ensure all items are hidden except for the selected one. + * This method does nothing when the stack is continuous. + * + * @param {OO.ui.Layout[]} items Item list iterate over + * @param {OO.ui.Layout} [selectedItem] Selected item to show + */ +OO.ui.StackLayout.prototype.updateHiddenState = function ( items, selectedItem ) { + var i, len; + + if ( !this.continuous ) { + for ( i = 0, len = items.length; i < len; i++ ) { + if ( !selectedItem || selectedItem !== items[ i ] ) { + items[ i ].$element.addClass( 'oo-ui-element-hidden' ); + } + } + if ( selectedItem ) { + selectedItem.$element.removeClass( 'oo-ui-element-hidden' ); + } + } +}; diff --git a/oojs/oojs-ui/src/styles/Element.less b/oojs/oojs-ui/src/styles/Element.less new file mode 100644 index 0000000..f8f3389 --- /dev/null +++ b/oojs/oojs-ui/src/styles/Element.less @@ -0,0 +1,9 @@ +@import 'common'; + +.oo-ui-element { + &-hidden { + display: none !important; + } + + .theme-oo-ui-element(); +} diff --git a/oojs/oojs-ui/src/styles/core.less b/oojs/oojs-ui/src/styles/core.less index 8ea9d2d..6bac0ff 100644 --- a/oojs/oojs-ui/src/styles/core.less +++ b/oojs/oojs-ui/src/styles/core.less @@ -16,6 +16,7 @@ direction: ltr; } +@import 'Element.less'; @import 'elements/ButtonElement.less'; @import 'elements/ClippableElement.less'; @import 'elements/FlaggedElement.less'; diff --git a/oojs/oojs-ui/src/styles/layouts/MenuLayout.less b/oojs/oojs-ui/src/styles/layouts/MenuLayout.less index 8947795..baf2dbf 100644 --- a/oojs/oojs-ui/src/styles/layouts/MenuLayout.less +++ b/oojs/oojs-ui/src/styles/layouts/MenuLayout.less @@ -44,5 +44,29 @@ top: 0; } + &-top .oo-ui-menuLayout-content { + right: 0 !important; + bottom: 0 !important; + left: 0 !important; + } + + &-after .oo-ui-menuLayout-content { + bottom: 0 !important; + left: 0 !important; + top: 0 !important; + } + + &-bottom .oo-ui-menuLayout-content { + left: 0 !important; + top: 0 !important; + right: 0 !important; + } + + &-before .oo-ui-menuLayout-content { + top: 0 !important; + right: 0 !important; + bottom: 0 !important; + } + .theme-oo-ui-menuLayout(); } diff --git a/oojs/oojs-ui/src/styles/layouts/StackLayout.less b/oojs/oojs-ui/src/styles/layouts/StackLayout.less index 103556b..6dd4fa7 100644 --- a/oojs/oojs-ui/src/styles/layouts/StackLayout.less +++ b/oojs/oojs-ui/src/styles/layouts/StackLayout.less @@ -1,10 +1,6 @@ @import '../common'; .oo-ui-stackLayout { - > .oo-ui-panelLayout { - display: none; - } - &-continuous > .oo-ui-panelLayout { display: block; position: relative; diff --git a/oojs/oojs-ui/src/styles/theme.less b/oojs/oojs-ui/src/styles/theme.less index 8bc99de..25b5acf 100644 --- a/oojs/oojs-ui/src/styles/theme.less +++ b/oojs/oojs-ui/src/styles/theme.less @@ -6,6 +6,7 @@ // .theme-oo-ui-layout () {} +.theme-oo-ui-element () {} .theme-oo-ui-widget () {} .theme-oo-ui-window () {} .theme-oo-ui-dialog () {} diff --git a/oojs/oojs-ui/src/themes/apex/elements.less b/oojs/oojs-ui/src/themes/apex/elements.less index dd38afd..5ca5b3e 100644 --- a/oojs/oojs-ui/src/themes/apex/elements.less +++ b/oojs/oojs-ui/src/themes/apex/elements.less @@ -1,5 +1,7 @@ @import 'common'; +.theme-oo-ui-element () {} + .theme-oo-ui-buttonElement () { > .oo-ui-buttonElement-button { color: #333; diff --git a/oojs/oojs-ui/src/themes/apex/widgets.less b/oojs/oojs-ui/src/themes/apex/widgets.less index 1c94e3a..c124b6d 100644 --- a/oojs/oojs-ui/src/themes/apex/widgets.less +++ b/oojs/oojs-ui/src/themes/apex/widgets.less @@ -686,13 +686,13 @@ .theme-oo-ui-progressBarWidget () { max-width: 50em; - border: solid 1px @progressive-border; + border: solid 1px #ccc; border-radius: 0.25em; overflow: hidden; &-bar { height: 1em; - border-right: solid 1px @progressive-border; + border-right: solid 1px #ccc; .oo-ui-transition(width 200ms, margin-left 200ms); .oo-ui-vertical-gradient(@progressive-gradient-start, @progressive-gradient-end); } diff --git a/oojs/oojs-ui/src/themes/blank/elements.less b/oojs/oojs-ui/src/themes/blank/elements.less index 923176c..89b9664 100644 --- a/oojs/oojs-ui/src/themes/blank/elements.less +++ b/oojs/oojs-ui/src/themes/blank/elements.less @@ -1,5 +1,7 @@ @import 'common'; +.theme-oo-ui-element () {} + .theme-oo-ui-buttonElement () {} .theme-oo-ui-clippableElement () {} diff --git a/oojs/oojs-ui/src/themes/mediawiki/elements.less b/oojs/oojs-ui/src/themes/mediawiki/elements.less index 058f8b0..b475b00 100644 --- a/oojs/oojs-ui/src/themes/mediawiki/elements.less +++ b/oojs/oojs-ui/src/themes/mediawiki/elements.less @@ -1,5 +1,7 @@ @import 'common'; +.theme-oo-ui-element () {} + .theme-oo-ui-buttonElement () { > .oo-ui-buttonElement-button { font-weight: bold; diff --git a/oojs/oojs-ui/src/themes/mediawiki/widgets.less b/oojs/oojs-ui/src/themes/mediawiki/widgets.less index 02be1e7..1617ad3 100644 --- a/oojs/oojs-ui/src/themes/mediawiki/widgets.less +++ b/oojs/oojs-ui/src/themes/mediawiki/widgets.less @@ -883,13 +883,13 @@ .theme-oo-ui-progressBarWidget () { max-width: 50em; - border: solid 1px @progressive-fill; + border: solid 1px #ccc; border-radius: 0.1em; overflow: hidden; &-bar { height: 1em; - background: @progressive-fill; + background: #ddd; .oo-ui-transition(width 200ms, margin-left 200ms); } &-indeterminate { @@ -901,7 +901,7 @@ } } &.oo-ui-widget-disabled { - opacity: 0.2; + opacity: 0.6; } } diff --git a/oojs/oojs-ui/src/widgets/ButtonWidget.js b/oojs/oojs-ui/src/widgets/ButtonWidget.js index d6a061d..27a4083 100644 --- a/oojs/oojs-ui/src/widgets/ButtonWidget.js +++ b/oojs/oojs-ui/src/widgets/ButtonWidget.js @@ -91,8 +91,11 @@ * @inheritdoc */ OO.ui.ButtonWidget.prototype.onMouseDown = function ( e ) { - // Remove the tab-index while the button is down to prevent the button from stealing focus - this.$button.removeAttr( 'tabindex' ); + if ( !this.isDisabled() ) { + // Remove the tab-index while the button is down to prevent the button from stealing focus + this.$button.removeAttr( 'tabindex' ); + } + return OO.ui.ButtonElement.prototype.onMouseDown.call( this, e ); }; @@ -100,8 +103,11 @@ * @inheritdoc */ OO.ui.ButtonWidget.prototype.onMouseUp = function ( e ) { - // Restore the tab-index after the button is up to restore the button's accessibility - this.$button.attr( 'tabindex', this.tabIndex ); + if ( !this.isDisabled() ) { + // Restore the tab-index after the button is up to restore the button's accessibility + this.$button.attr( 'tabindex', this.tabIndex ); + } + return OO.ui.ButtonElement.prototype.onMouseUp.call( this, e ); }; diff --git a/oojs/oojs-ui/src/widgets/MenuSelectWidget.js b/oojs/oojs-ui/src/widgets/MenuSelectWidget.js index cfd1c92..3e1fa84 100644 --- a/oojs/oojs-ui/src/widgets/MenuSelectWidget.js +++ b/oojs/oojs-ui/src/widgets/MenuSelectWidget.js @@ -39,9 +39,8 @@ // Initialization this.$element - .hide() - .attr( 'role', 'menu' ) - .addClass( 'oo-ui-menuSelectWidget' ); + .addClass( 'oo-ui-menuSelectWidget oo-ui-element-hidden' ) + .attr( 'role', 'menu' ); }; /* Setup */ diff --git a/oojs/oojs-ui/src/widgets/PopupWidget.js b/oojs/oojs-ui/src/widgets/PopupWidget.js index c9bd2a1..e8bf928 100644 --- a/oojs/oojs-ui/src/widgets/PopupWidget.js +++ b/oojs/oojs-ui/src/widgets/PopupWidget.js @@ -60,14 +60,13 @@ .addClass( 'oo-ui-popupWidget-head' ) .append( this.$label, this.closeButton.$element ); if ( !config.head ) { - this.$head.hide(); + this.$head.addClass( 'oo-ui-element-hidden' ); } this.$popup .addClass( 'oo-ui-popupWidget-popup' ) .append( this.$head, this.$body ); this.$element - .hide() - .addClass( 'oo-ui-popupWidget' ) + .addClass( 'oo-ui-popupWidget oo-ui-element-hidden' ) .append( this.$popup, this.$anchor ); // Move content, which was added to #$element by OO.ui.Widget, to the body if ( config.$content instanceof jQuery ) { diff --git a/oojs/oojs-ui/src/widgets/TextInputWidget.js b/oojs/oojs-ui/src/widgets/TextInputWidget.js index afcff10..39fe0d7 100644 --- a/oojs/oojs-ui/src/widgets/TextInputWidget.js +++ b/oojs/oojs-ui/src/widgets/TextInputWidget.js @@ -45,14 +45,13 @@ this.autosize = !!config.autosize; this.maxRows = config.maxRows; this.validate = null; - this.attached = false; // Clone for resizing if ( this.autosize ) { this.$clone = this.$input .clone() .insertAfter( this.$input ) - .hide(); + .addClass( 'oo-ui-element-hidden' ); } this.setValidation( config.validate ); @@ -64,7 +63,6 @@ blur: this.setValidityFlag.bind( this ) } ); this.$element.on( 'DOMNodeInsertedIntoDocument', this.onElementAttach.bind( this ) ); - this.$element.on( 'DOMNodeRemovedFromDocument', this.onElementDetach.bind( this ) ); this.$icon.on( 'mousedown', this.onIconMouseDown.bind( this ) ); this.$indicator.on( 'mousedown', this.onIndicatorMouseDown.bind( this ) ); this.on( 'labelChange', this.updatePosition.bind( this ) ); @@ -170,20 +168,10 @@ * @param {jQuery.Event} e Element attach event */ OO.ui.TextInputWidget.prototype.onElementAttach = function () { - this.attached = true; - // If we reattached elsewhere, the valCache is now invalid + // Any previously calculated size is now probably invalid if we reattached elsewhere this.valCache = null; this.adjustSize(); this.positionLabel(); -}; - -/** - * Handle element detach events. - * - * @param {jQuery.Event} e Element detach event - */ -OO.ui.TextInputWidget.prototype.onElementDetach = function () { - this.attached = false; }; /** @@ -241,7 +229,7 @@ OO.ui.TextInputWidget.prototype.adjustSize = function () { var scrollHeight, innerHeight, outerHeight, maxInnerHeight, measurementError, idealHeight; - if ( this.multiline && this.autosize && this.attached && this.$input.val() !== this.valCache ) { + if ( this.multiline && this.autosize && this.$input.val() !== this.valCache ) { this.$clone .val( this.$input.val() ) .attr( 'rows', '' ) -- To view, visit https://gerrit.wikimedia.org/r/188580 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: merged Gerrit-Change-Id: I8e0ea18c23df5fe0530cc841799830c4f0082eff Gerrit-PatchSet: 1 Gerrit-Project: mediawiki/vendor Gerrit-Branch: master Gerrit-Owner: Jforrester <jforres...@wikimedia.org> Gerrit-Reviewer: Hoo man <h...@online.de> Gerrit-Reviewer: Legoktm <legoktm.wikipe...@gmail.com> Gerrit-Reviewer: Mooeypoo <mor...@gmail.com> _______________________________________________ MediaWiki-commits mailing list MediaWiki-commits@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
