mw.special.apisandbox: Use a real button to insert values in multi fields
Stuffing an indicator inside a normal widget is weird. Also, always add it, even when we also handle Enter presses on the input. Change-Id: I7191b4f31bfe4b42a524c786994150f318fd8cd9
This commit is contained in:
parent
60cc82da01
commit
258f2114ec
5 changed files with 36 additions and 37 deletions
|
|
@ -2080,6 +2080,7 @@
|
|||
"apisandbox-dynamic-error-exists": "A parameter named \"$1\" already exists.",
|
||||
"apisandbox-deprecated-parameters": "Deprecated parameters",
|
||||
"apisandbox-fetch-token": "Auto-fill the token",
|
||||
"apisandbox-add-multi": "Add",
|
||||
"apisandbox-submit-invalid-fields-title": "Some fields are invalid",
|
||||
"apisandbox-submit-invalid-fields-message": "Please correct the marked fields and try again.",
|
||||
"apisandbox-results": "Results",
|
||||
|
|
|
|||
|
|
@ -2277,6 +2277,7 @@
|
|||
"apisandbox-dynamic-error-exists": "Displayed as an error message from JavaScript when trying to add a new arbitrary parameter with a name that already exists. Parameters:\n* $1 - Parameter name that failed.",
|
||||
"apisandbox-deprecated-parameters": "JavaScript button label and fieldset legend for separating deprecated parameters in the UI.",
|
||||
"apisandbox-fetch-token": "Label for the button that fetches a CSRF token.",
|
||||
"apisandbox-add-multi": "Label for the button to add another value to a field that accepts multiple values",
|
||||
"apisandbox-submit-invalid-fields-title": "Title for a JavaScript error message when fields are invalid.",
|
||||
"apisandbox-submit-invalid-fields-message": "Content for a JavaScript error message when fields are invalid.",
|
||||
"apisandbox-results": "JavaScript tab label for the tab displaying the API query results.\n{{Identical|Result}}",
|
||||
|
|
|
|||
|
|
@ -2015,6 +2015,7 @@ return [
|
|||
'apisandbox-loading',
|
||||
'apisandbox-load-error',
|
||||
'apisandbox-fetch-token',
|
||||
'apisandbox-add-multi',
|
||||
'apisandbox-helpurls',
|
||||
'apisandbox-examples',
|
||||
'apisandbox-dynamic-parameters',
|
||||
|
|
|
|||
|
|
@ -21,6 +21,20 @@
|
|||
overflow: visible;
|
||||
}
|
||||
|
||||
/* Display contents of the popup on a single line */
|
||||
.mw-apisandbox-popup > .oo-ui-popupWidget-popup > .oo-ui-popupWidget-body {
|
||||
display: table;
|
||||
}
|
||||
|
||||
.mw-apisandbox-popup > .oo-ui-popupWidget-popup > .oo-ui-popupWidget-body > * {
|
||||
display: table-cell;
|
||||
}
|
||||
|
||||
.mw-apisandbox-popup > .oo-ui-popupWidget-popup > .oo-ui-popupWidget-body > .oo-ui-buttonWidget {
|
||||
padding-left: 0.5em;
|
||||
width: 1%;
|
||||
}
|
||||
|
||||
.mw-apisandbox-fullscreen #mw-apisandbox-ui {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
|
|
|
|||
|
|
@ -384,8 +384,10 @@
|
|||
* @return {OO.ui.Widget}
|
||||
*/
|
||||
createWidgetForParameter: function ( pi, opts ) {
|
||||
var widget, innerWidget, finalWidget, items, $button, $content, func,
|
||||
multiMode = 'none';
|
||||
var widget, innerWidget, finalWidget, items, $content, func,
|
||||
multiModeButton = null,
|
||||
multiModeInput = null,
|
||||
multiModeAllowed = false;
|
||||
|
||||
opts = opts || {};
|
||||
|
||||
|
|
@ -442,7 +444,8 @@
|
|||
$.extend( widget, WidgetMethods.textInputWidget );
|
||||
$.extend( widget, WidgetMethods.passwordWidget );
|
||||
widget.setValidation( Validators.generic );
|
||||
multiMode = 'enter';
|
||||
multiModeAllowed = true;
|
||||
multiModeInput = widget;
|
||||
break;
|
||||
|
||||
case 'integer':
|
||||
|
|
@ -458,7 +461,8 @@
|
|||
if ( Util.apiBool( pi.enforcerange ) ) {
|
||||
widget.setRange( pi.min || -Infinity, pi.max || Infinity );
|
||||
}
|
||||
multiMode = 'enter';
|
||||
multiModeAllowed = true;
|
||||
multiModeInput = widget;
|
||||
break;
|
||||
|
||||
case 'limit':
|
||||
|
|
@ -481,7 +485,8 @@
|
|||
pi.apiSandboxMax = mw.config.get( 'apihighlimits' ) ? pi.highmax : pi.max;
|
||||
widget.paramInfo = pi;
|
||||
$.extend( widget, WidgetMethods.textInputWidget );
|
||||
multiMode = 'enter';
|
||||
multiModeAllowed = true;
|
||||
multiModeInput = widget;
|
||||
break;
|
||||
|
||||
case 'timestamp':
|
||||
|
|
@ -495,7 +500,7 @@
|
|||
widget.paramInfo = pi;
|
||||
$.extend( widget, WidgetMethods.textInputWidget );
|
||||
$.extend( widget, WidgetMethods.dateTimeInputWidget );
|
||||
multiMode = 'indicator';
|
||||
multiModeAllowed = true;
|
||||
break;
|
||||
|
||||
case 'upload':
|
||||
|
|
@ -595,25 +600,13 @@
|
|||
break;
|
||||
}
|
||||
|
||||
if ( Util.apiBool( pi.multi ) && multiMode !== 'none' ) {
|
||||
if ( Util.apiBool( pi.multi ) && multiModeAllowed ) {
|
||||
innerWidget = widget;
|
||||
switch ( multiMode ) {
|
||||
case 'enter':
|
||||
$content = innerWidget.$element;
|
||||
break;
|
||||
|
||||
case 'indicator':
|
||||
$button = innerWidget.$indicator;
|
||||
$button.css( 'cursor', 'pointer' );
|
||||
$button.attr( 'tabindex', 0 );
|
||||
$button.parent().append( $button );
|
||||
innerWidget.setIndicator( 'next' );
|
||||
$content = innerWidget.$element;
|
||||
break;
|
||||
|
||||
default:
|
||||
throw new Error( 'Unknown multiMode "' + multiMode + '"' );
|
||||
}
|
||||
multiModeButton = new OO.ui.ButtonWidget( {
|
||||
label: mw.message( 'apisandbox-add-multi' ).text()
|
||||
} );
|
||||
$content = innerWidget.$element.add( multiModeButton.$element );
|
||||
|
||||
widget = new OO.ui.PopupTagMultiselectWidget( {
|
||||
allowArbitrary: true,
|
||||
|
|
@ -638,22 +631,11 @@
|
|||
return false;
|
||||
}
|
||||
};
|
||||
switch ( multiMode ) {
|
||||
case 'enter':
|
||||
innerWidget.connect( null, { enter: func } );
|
||||
break;
|
||||
|
||||
case 'indicator':
|
||||
$button.on( {
|
||||
click: func,
|
||||
keypress: function ( e ) {
|
||||
if ( e.which === OO.ui.Keys.SPACE || e.which === OO.ui.Keys.ENTER ) {
|
||||
func();
|
||||
}
|
||||
}
|
||||
} );
|
||||
break;
|
||||
if ( multiModeInput ) {
|
||||
multiModeInput.on( 'enter', func );
|
||||
}
|
||||
multiModeButton.on( 'click', func );
|
||||
}
|
||||
|
||||
if ( Util.apiBool( pi.required ) || opts.nooptional ) {
|
||||
|
|
|
|||
Loading…
Reference in a new issue