Add language settings button inside dropdown for non-content pages

NOTE: This patch is identical to patch with change-id:
Ifdf2a529b30e5a2df8867b606a525c9f7b3bdb6c

The above patch has been merged but reverted because of the usage
of '$skin->getTemplateDate()' method, which should be avoided. The
current patch replaces the usage of this method, with the usage of
the output page title ($out->getTitle()). All the rest of the code
has been kept the same.

Bug: T316559
Change-Id: Ibef9f6fd46d9055c3e0865905fb8aa8d031c1940
This commit is contained in:
NikG
2023-01-11 18:05:29 +02:00
parent 324f10ee3f
commit 965ffc3b1a
3 changed files with 57 additions and 0 deletions

View File

@@ -70,3 +70,7 @@
margin: 1em 0;
}
}
.empty-language-selector__language-settings-button {
margin: 12px;
}

View File

@@ -717,7 +717,54 @@
}
}
/**
* The new Vector 2022 skin uses a less prominent language button for non-content pages.
* For these pages, the ULS should not be displayed, but a dropdown with an appropriate message
* should appear. The UniversalLanguageSelector extension should add a button to open the
* language settings, inside this dropdown.
* This method adds this button inside the dropdown.
*/
function addLanguageSettingsToNonContentPages() {
var $languageBtn = $( '#p-lang-btn' );
var clickHandler = function ( event ) {
event.stopPropagation();
mw.loader.using( languageSettingsModules ).then( function () {
$( event.target ).languagesettings( {
autoOpen: true,
onPosition: function () {
var offset = $languageBtn.offset();
var top = offset.top + $languageBtn.outerHeight();
var right = $( window ).width() - offset.left - $languageBtn.outerWidth();
return { top: top, right: right };
}
} );
} );
};
// the first time the language button is clicked inside a non-content page,
// we should add the "Open language settings" button inside the dropdown
$languageBtn.one( 'mouseover', function () {
mw.loader.using( [ 'oojs-ui-widgets', 'oojs-ui.styles.icons-interactions', 'ext.uls.messages' ] )
.done( function () {
var actionButton = new ActionsMenuItem(
'settings',
$.i18n( 'ext-uls-actions-menu-language-settings-item-label' ),
clickHandler,
null
).render();
actionButton.$element.addClass( 'empty-language-selector__language-settings-button' );
var $emptyLanguageSelectorBody = $( '.mw-portlet-empty-language-selector-body' );
$emptyLanguageSelectorBody.after( actionButton.$element );
} );
} );
}
function init() {
// if it's not Vector skin, nothing to be done here
if ( mw.config.get( 'skin' ) === 'vector-2022' && mw.config.get( 'wgULSisLanguageSelectorEmpty' ) ) {
// if this is a non-content page, we should add the "Open language settings" button
// inside the language dropdown
addLanguageSettingsToNonContentPages();
}
initLanguageChangeUndoTooltip();
initIme();