Use MessageWidget's showClose option

Change-Id: I81292bd84ce6feefdb852f6a636109f68e55291d
This commit is contained in:
Ed Sanders 2022-02-03 16:43:45 +00:00
parent 6e75e580a9
commit 6869112aad
5 changed files with 4 additions and 23 deletions

View file

@ -116,7 +116,6 @@
"discussiontools-error-noswitchtove-template", "discussiontools-error-noswitchtove-template",
"discussiontools-error-noswitchtove-title", "discussiontools-error-noswitchtove-title",
"discussiontools-newtopic-legacy-hint", "discussiontools-newtopic-legacy-hint",
"discussiontools-newtopic-legacy-hint-close",
"discussiontools-newtopic-placeholder-title", "discussiontools-newtopic-placeholder-title",
"discussiontools-newtopic-missing-title", "discussiontools-newtopic-missing-title",
"discussiontools-replylink", "discussiontools-replylink",

View file

@ -39,7 +39,6 @@
"discussiontools-limitreport-timeusage": "DiscussionTools time usage", "discussiontools-limitreport-timeusage": "DiscussionTools time usage",
"discussiontools-limitreport-timeusage-value": "$1 {{PLURAL:$1|second|seconds}}", "discussiontools-limitreport-timeusage-value": "$1 {{PLURAL:$1|second|seconds}}",
"discussiontools-newtopic-legacy-hint": "<strong>A new way to start topics is here.</strong> This update enables you to add topics using an inline form and to ping others with a new shortcut. You can also [$1 switch back to the legacy experience].", "discussiontools-newtopic-legacy-hint": "<strong>A new way to start topics is here.</strong> This update enables you to add topics using an inline form and to ping others with a new shortcut. You can also [$1 switch back to the legacy experience].",
"discussiontools-newtopic-legacy-hint-close": "Close message and do not show again",
"discussiontools-newtopic-legacy-hint-return": "<strong>You are now viewing the legacy experience.</strong> You can [$1 return to the new experience] or visit preferences to [$2 set the legacy experience as your default].", "discussiontools-newtopic-legacy-hint-return": "<strong>You are now viewing the legacy experience.</strong> You can [$1 return to the new experience] or visit preferences to [$2 set the legacy experience as your default].",
"discussiontools-newtopic-missing-title": "Please provide a title for your discussion topic. If you click \"{{int:discussiontools-replywidget-newtopic}}\", your topic will be added without a title.", "discussiontools-newtopic-missing-title": "Please provide a title for your discussion topic. If you click \"{{int:discussiontools-replywidget-newtopic}}\", your topic will be added without a title.",
"discussiontools-newtopic-placeholder-title": "Title", "discussiontools-newtopic-placeholder-title": "Title",

View file

@ -50,7 +50,6 @@
"discussiontools-limitreport-timeusage": "Label for the time usage (duration) of DiscussionTools in the parser limit report. Followed by {{msg-mw|discussiontools-limitreport-timeusage-value}}.\n\nSimilar to:\n* {{msg-mw|limitreport-cputime}}\n* {{msg-mw|limitreport-walltime}}\n* {{msg-mw|scribunto-limitreport-timeusage}}", "discussiontools-limitreport-timeusage": "Label for the time usage (duration) of DiscussionTools in the parser limit report. Followed by {{msg-mw|discussiontools-limitreport-timeusage-value}}.\n\nSimilar to:\n* {{msg-mw|limitreport-cputime}}\n* {{msg-mw|limitreport-walltime}}\n* {{msg-mw|scribunto-limitreport-timeusage}}",
"discussiontools-limitreport-timeusage-value": "Follows {{msg-mw|discussiontools-limitreport-timeusage}}.\n\nParameters:\n* $1 - the usage in seconds\n{{Identical|Second}}", "discussiontools-limitreport-timeusage-value": "Follows {{msg-mw|discussiontools-limitreport-timeusage}}.\n\nParameters:\n* $1 - the usage in seconds\n{{Identical|Second}}",
"discussiontools-newtopic-legacy-hint": "Dismissable message explaining the new topic tool and how to return to the legacy section adding tool", "discussiontools-newtopic-legacy-hint": "Dismissable message explaining the new topic tool and how to return to the legacy section adding tool",
"discussiontools-newtopic-legacy-hint-close": "Tooltip for the close button that closes an info message so it's never shown again.",
"discussiontools-newtopic-legacy-hint-return": "Message shown on the legacy section adding tool", "discussiontools-newtopic-legacy-hint-return": "Message shown on the legacy section adding tool",
"discussiontools-newtopic-missing-title": "Warning message shown when leaving the title field empty while adding a new topic to the page.\n\nCopy <nowiki>{{int:discussiontools-replywidget-newtopic}}</nowiki> into your translation. It will be shown as {{msg-mw|discussiontools-replywidget-newtopic}}", "discussiontools-newtopic-missing-title": "Warning message shown when leaving the title field empty while adding a new topic to the page.\n\nCopy <nowiki>{{int:discussiontools-replywidget-newtopic}}</nowiki> into your translation. It will be shown as {{msg-mw|discussiontools-replywidget-newtopic}}",
"discussiontools-newtopic-placeholder-title": "Placeholder describing the heading field of a new topic\n{{identical|Title}}", "discussiontools-newtopic-placeholder-title": "Placeholder describing the heading field of a new topic\n{{identical|Title}}",

View file

@ -164,16 +164,11 @@ NewTopicController.prototype.setupTopicHint = function () {
this.topicHint = new OO.ui.MessageWidget( { this.topicHint = new OO.ui.MessageWidget( {
label: mw.message( 'discussiontools-newtopic-legacy-hint', legacyURI.toString() + fragment ).parseDom(), label: mw.message( 'discussiontools-newtopic-legacy-hint', legacyURI.toString() + fragment ).parseDom(),
showClose: true,
icon: 'article' icon: 'article'
} ); } )
.connect( this, { close: 'onTopicHintClose' } );
this.topicHint.$element.addClass( 'ext-discussiontools-ui-newTopic-hint' ); this.topicHint.$element.addClass( 'ext-discussiontools-ui-newTopic-hint' );
// TODO: Once showClose lands in OOUI's MessageWidget this can be replaced:
var dismissButton = new OO.ui.ButtonWidget( {
icon: 'close',
framed: false,
title: mw.msg( 'discussiontools-newtopic-legacy-hint-close' )
} ).connect( this, { click: 'onTopicHintCloseClick' } );
this.topicHint.$element.prepend( dismissButton.$element );
this.topicHint.$element.find( 'a' ).on( 'click', function () { this.topicHint.$element.find( 'a' ).on( 'click', function () {
// Clicking to follow this link should immediately discard the // Clicking to follow this link should immediately discard the
// autosave. We can do this before the onBeforeUnload handler asks // autosave. We can do this before the onBeforeUnload handler asks
@ -184,8 +179,6 @@ NewTopicController.prototype.setupTopicHint = function () {
} ); } );
this.container.$element.before( this.topicHint.$element ); this.container.$element.before( this.topicHint.$element );
this.topicHint.toggle( true );
// This needs to persist once it's shown // This needs to persist once it's shown
controller.getApi().saveOption( 'discussiontools-newtopictool-hint-shown', 1 ).then( function () { controller.getApi().saveOption( 'discussiontools-newtopictool-hint-shown', 1 ).then( function () {
mw.user.options.set( 'discussiontools-newtopictool-hint-shown', 1 ); mw.user.options.set( 'discussiontools-newtopictool-hint-shown', 1 );
@ -195,8 +188,7 @@ NewTopicController.prototype.setupTopicHint = function () {
/** /**
* Handle clicks on the close button for the hint dialog * Handle clicks on the close button for the hint dialog
*/ */
NewTopicController.prototype.onTopicHintCloseClick = function () { NewTopicController.prototype.onTopicHintClose = function () {
this.topicHint.toggle( false );
controller.getApi().saveOption( 'discussiontools-newtopictool-hint-shown', null ).then( function () { controller.getApi().saveOption( 'discussiontools-newtopictool-hint-shown', null ).then( function () {
mw.user.options.set( 'discussiontools-newtopictool-hint-shown', null ); mw.user.options.set( 'discussiontools-newtopictool-hint-shown', null );
} ); } );

View file

@ -36,12 +36,4 @@
margin-top: 2em; margin-top: 2em;
margin-bottom: -1.5em; margin-bottom: -1.5em;
padding-right: 48px; padding-right: 48px;
.oo-ui-buttonElement {
margin-right: 0;
/* Position relative to the surrounding .oo-ui-messageWidget */
position: absolute;
right: 8px;
top: 8px;
}
} }