jenkins-bot has submitted this change and it was merged. (
https://gerrit.wikimedia.org/r/334439 )
Change subject: CapsuleMultiselectWidget: Make popup really work with $overlay
......................................................................
CapsuleMultiselectWidget: Make popup really work with $overlay
Currently, if you tried to make a CapsuleMultiselectWidget with
both 'popup' and '$overlay' config options, the popup would not
be correctly positioned under the capsules and instead appear
in the top-left corner of the document.
Added an example to the demo.
Change-Id: I02975617b64dcf6e30f52afb7687a62b8a6d4650
---
M demos/pages/dialogs.js
M src/widgets/CapsuleMultiselectWidget.js
2 files changed, 41 insertions(+), 5 deletions(-)
Approvals:
jenkins-bot: Verified
Mooeypoo: Looks good to me, approved
diff --git a/demos/pages/dialogs.js b/demos/pages/dialogs.js
index e6108ff..f48d456 100644
--- a/demos/pages/dialogs.js
+++ b/demos/pages/dialogs.js
@@ -553,6 +553,27 @@
return this.items;
};
+ function ExampleCapsuleMultiselectWidget( config ) {
+ this.capsulePopupWidget = new OO.ui.NumberInputWidget( {
+ isInteger: true
+ } );
+ this.capsulePopupWidget.connect( this, {
+ enter: 'onPopupWidgetEnter'
+ } );
+ config = $.extend( {}, config, {
+ allowArbitrary: true,
+ popup: { $content: this.capsulePopupWidget.$element }
+ } );
+ OO.ui.CapsuleMultiselectWidget.call( this, config );
+ }
+ OO.inheritClass( ExampleCapsuleMultiselectWidget,
OO.ui.CapsuleMultiselectWidget );
+ ExampleCapsuleMultiselectWidget.prototype.onPopupWidgetEnter = function
() {
+ if ( !isNaN( this.capsulePopupWidget.getNumericValue() ) ) {
+ this.addItemsFromData( [
this.capsulePopupWidget.getNumericValue() ] );
+ this.capsulePopupWidget.setValue( '' );
+ }
+ };
+
function DialogWithDropdowns( config ) {
DialogWithDropdowns.parent.call( this, config );
}
@@ -654,8 +675,8 @@
}
} ), $spacer.clone() ]
} ),
- new SamplePage( 'capsule', {
- label: 'CapsuleMultiselectWidget',
+ new SamplePage( 'capsulemenu', {
+ label: 'CapsuleMultiselectWidget (menu)',
content: [ $spacer.clone(), new
OO.ui.CapsuleMultiselectWidget( {
$overlay: this.$overlay,
menu: {
@@ -663,14 +684,25 @@
}
} ), $spacer.clone() ]
} ),
- new SamplePage( 'capsule2', {
- label: 'CapsuleMultiselectWidget',
+ new SamplePage( 'capsulemenu2', {
+ label: 'CapsuleMultiselectWidget (menu)',
icon: 'alert',
content: [ $spacer.clone(), new
OO.ui.CapsuleMultiselectWidget( {
menu: {
items: this.makeItems()
}
} ), $spacer.clone() ]
+ } ),
+ new SamplePage( 'capsulepopup', {
+ label: 'CapsuleMultiselectWidget (popup)',
+ content: [ $spacer.clone(), new
ExampleCapsuleMultiselectWidget( {
+ $overlay: this.$overlay
+ } ), $spacer.clone() ]
+ } ),
+ new SamplePage( 'capsulepopup2', {
+ label: 'CapsuleMultiselectWidget (popup)',
+ icon: 'alert',
+ content: [ $spacer.clone(), new
ExampleCapsuleMultiselectWidget(), $spacer.clone() ]
} )
];
this.bookletLayout.on( 'set', function ( page ) {
diff --git a/src/widgets/CapsuleMultiselectWidget.js
b/src/widgets/CapsuleMultiselectWidget.js
index 4677a6e..31428b7 100644
--- a/src/widgets/CapsuleMultiselectWidget.js
+++ b/src/widgets/CapsuleMultiselectWidget.js
@@ -92,7 +92,11 @@
align: 'forwards',
anchor: false
} );
- OO.ui.mixin.PopupElement.call( this, config );
+ OO.ui.mixin.PopupElement.call( this, $.extend( true, {},
config, {
+ popup: {
+ $floatableContainer: this.$element
+ }
+ } ) );
$tabFocus = $( '<span>' );
OO.ui.mixin.TabIndexedElement.call( this, $.extend( {}, config,
{ $tabIndexed: $tabFocus } ) );
} else {
--
To view, visit https://gerrit.wikimedia.org/r/334439
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: I02975617b64dcf6e30f52afb7687a62b8a6d4650
Gerrit-PatchSet: 2
Gerrit-Project: oojs/ui
Gerrit-Branch: master
Gerrit-Owner: Bartosz Dziewoński <matma....@gmail.com>
Gerrit-Reviewer: Bartosz Dziewoński <matma....@gmail.com>
Gerrit-Reviewer: Mooeypoo <mor...@gmail.com>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
