Relocate parameter descriptions in the transclusion dialog

Bug: T273425
Change-Id: I2044b65ba88ae00e394fb84cb8e96a218995918a
This commit is contained in:
Andrew Kostka 2021-04-15 12:55:09 +02:00
parent 60f4429e43
commit 3c2db5fba9
5 changed files with 51 additions and 24 deletions

View file

@ -174,6 +174,10 @@
"VisualEditorTransclusionDialogSuggestedValues": {
"description": "Temporary flag to enable suggested values in the transclusion dialog.",
"value": false
},
"VisualEditorTransclusionDialogInlineDescriptions": {
"description": "Temporary flag to enable inline parameter descriptions in the transclusion dialog.",
"value": false
}
},
"APIModules": {

View file

@ -1048,6 +1048,8 @@ class VisualEditorHooks {
'feedbackTitle' => $veConfig->get( 'VisualEditorFeedbackTitle' ),
'sourceFeedbackTitle' => $veConfig->get( 'VisualEditorSourceFeedbackTitle' ),
'transclusionDialogSuggestedValues' => $veConfig->get( 'VisualEditorTransclusionDialogSuggestedValues' ),
'transclusionDialogInlineDescriptions' =>
$veConfig->get( 'VisualEditorTransclusionDialogInlineDescriptions' ),
];
}

View file

@ -128,28 +128,30 @@ ve.ui.MWParameterPage = function VeUiMWParameterPage( parameter, name, config )
this.$actions.append( this.rawFallbackButton.$element );
}
if ( this.$description.text().trim() === '' ) {
this.infoButton = new OO.ui.ButtonWidget( {
disabled: true,
title: ve.msg( 'visualeditor-dialog-transclusion-param-info-missing' ),
framed: false,
icon: 'info',
classes: [ 've-ui-mwParameterPage-infoButton' ]
} );
} else {
this.infoButton = new OO.ui.PopupButtonWidget( {
$overlay: config.$overlay,
popup: {
$content: this.$description
},
title: ve.msg( 'visualeditor-dialog-transclusion-param-info' ),
framed: false,
icon: 'info',
classes: [ 've-ui-mwParameterPage-infoButton' ]
} );
}
if ( !veConfig.transclusionDialogInlineDescriptions ) {
if ( this.$description.text().trim() === '' ) {
this.infoButton = new OO.ui.ButtonWidget( {
disabled: true,
title: ve.msg( 'visualeditor-dialog-transclusion-param-info-missing' ),
framed: false,
icon: 'info',
classes: [ 've-ui-mwParameterPage-infoButton' ]
} );
} else {
this.infoButton = new OO.ui.PopupButtonWidget( {
$overlay: config.$overlay,
popup: {
$content: this.$description
},
title: ve.msg( 'visualeditor-dialog-transclusion-param-info' ),
framed: false,
icon: 'info',
classes: [ 've-ui-mwParameterPage-infoButton' ]
} );
}
this.$actions.append( this.infoButton.$element );
this.$actions.append( this.infoButton.$element );
}
if ( !this.parameter.isRequired() && !config.readOnly ) {
this.removeButton = new OO.ui.ButtonWidget( {
@ -204,6 +206,12 @@ ve.ui.MWParameterPage = function VeUiMWParameterPage( parameter, name, config )
this.$element
.addClass( 've-ui-mwParameterPage' )
.append( this.$info, this.$field, this.$actions );
if ( veConfig.transclusionDialogInlineDescriptions ) {
this.$description.addClass( 've-ui-mwParameterPage-inlineDescription' );
this.$info.after( this.$description );
}
if ( !config.readOnly ) {
this.$element.append( this.$more );
}
@ -223,6 +231,7 @@ OO.inheritClass( ve.ui.MWParameterPage, OO.ui.PageLayout );
*/
ve.ui.MWParameterPage.prototype.getDefaultInputConfig = function () {
var required = this.parameter.isRequired(),
veConfig = mw.config.get( 'wgVisualEditorConfig' ),
valueInputConfig = {
autosize: true,
required: required,
@ -234,7 +243,7 @@ ve.ui.MWParameterPage.prototype.getDefaultInputConfig = function () {
'visualeditor-dialog-transclusion-param-default',
this.defaultValue
);
} else if ( this.exampleValue ) {
} else if ( this.exampleValue && !veConfig.transclusionDialogInlineDescriptions ) {
valueInputConfig.placeholder = ve.msg(
'visualeditor-dialog-transclusion-param-example',
this.exampleValue

View file

@ -61,8 +61,15 @@
padding: 0.25em 1em;
}
.ve-ui-mwParameterPage-inlineDescription {
font-size: inherit;
padding: 0 2.5em;
clear: both;
}
.ve-ui-mwParameterPage-description-required,
.ve-ui-mwParameterPage-description-deprecated {
.ve-ui-mwParameterPage-description-deprecated,
.ve-ui-mwParameterPage-inlineDescription .ve-ui-mwParameterPage-description-example {
font-style: italic;
color: #54595d;
}

View file

@ -19,8 +19,13 @@
opacity: 0.5;
}
.ve-ui-mwParameterPage-inlineDescription {
max-width: 50em;
}
.ve-ui-mwParameterPage-description-required,
.ve-ui-mwParameterPage-description-deprecated {
.ve-ui-mwParameterPage-description-deprecated,
.ve-ui-mwParameterPage-inlineDescription .ve-ui-mwParameterPage-description-example {
font-style: italic;
color: #54595d;
}