mediawiki-skins-Vector/includes/SkinVector.php

933 lines
31 KiB
PHP
Raw Normal View History

<?php
/**
* Vector - Modern version of MonoBook with fresh look and many usability
* improvements.
*
* This program is free software; you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation; either version 2 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License along
* with this program; if not, write to the Free Software Foundation, Inc.,
* 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
* http://www.gnu.org/copyleft/gpl.html
*
* @file
* @ingroup Skins
*/
namespace MediaWiki\Skins\Vector;
use ExtensionRegistry;
use Html;
use Linker;
Merge SkinVector and VectorTemplate (step 1/2) Please note I7e06a4cc226f3434c0f655212a464b8b98bcc7f4 should be merged at the same time as this patch. == The background == All extensions have been weaned of BaseTemplate hooks in Wikimedia projects. This change now means that Vector will no longer run any BaseTemplate hooks. See the epic T253809 for the implementation details. == The change == BaseTemplate will now have nothing to do with the rendering of Vector. The skin version is added to express the significance of breaking compatibility with 3rd party extensions. We TEMPORARILY remove SkinVector to retain git blame. SkinTemplateVector will be renamed SkinVector in the follow up (see 2/2) Update skin.json to use SkinTemplateVector for the skin (this will be fixed in a follow up). The isLegacy method is moved to SkinTemplateVector. Changes of note: * html-debuglog is no longer needed. SkinMustache includes this information on the skins behalf * html-printtail and html-headelement are now not needed in the master template and added by SkinMustache * Skin::getAfterPortlet does not provide the `after-portlet` wrapping element provided by BaseTemplate::getAfterPortlet so this is added * SkinTemplate::getFooterIcons does not support the options that BaseTemplate::getFooterIcons does so any icons which do not have an image must be manually checked for and unset Known changes to HTML output as a result of intentionally delegating their output to the core SkinMustache class: * A new line is removed between the body element and #mw-page-base * #mw-html-debug-log now appears at the end of the body element * #printfooter is now a child of #mw-content-text rather than sibling. Bug: T251212 Change-Id: I4e89beb96f6401ed7e51bafdf0aac408f5a2c42f
2020-04-28 21:16:21 +00:00
use MediaWiki\MediaWikiServices;
use RuntimeException;
use SkinMustache;
use SkinTemplate;
use SpecialPage;
use Title;
use User;
/**
* Skin subclass for Vector that may be the new or old version of Vector.
* IMPORTANT: DO NOT put new code here.
*
* @ingroup Skins
* Skins extending SkinVector are not supported
*
* @package Vector
* @internal
*
* @todo
* - Move all modern code into SkinVector22.
* - Move legacy skin code from SkinVector to SkinVectorLegacy.
* - SkinVector left as alias if necessary.
*/
abstract class SkinVector extends SkinMustache {
/** @var null|array for caching purposes */
private $languages;
/** @var int */
private const MENU_TYPE_DEFAULT = 0;
/** @var int */
private const MENU_TYPE_TABS = 1;
/** @var int */
private const MENU_TYPE_DROPDOWN = 2;
private const MENU_TYPE_PORTAL = 3;
private const TALK_ICON = [
'href' => '#',
'id' => 'ca-talk-sticky-header',
'event' => 'talk-sticky-header',
'icon' => 'wikimedia-speechBubbles',
'is-quiet' => true,
'tabindex' => '-1',
'class' => 'sticky-header-icon'
];
private const SUBJECT_ICON = [
'href' => '#',
'id' => 'ca-subject-sticky-header',
'event' => 'subject-sticky-header',
'icon' => 'wikimedia-article',
'is-quiet' => true,
'tabindex' => '-1',
'class' => 'sticky-header-icon'
];
private const HISTORY_ICON = [
'href' => '#',
'id' => 'ca-history-sticky-header',
'event' => 'history-sticky-header',
'icon' => 'wikimedia-history',
'is-quiet' => true,
'tabindex' => '-1',
'class' => 'sticky-header-icon'
];
// Event and icon will be updated depending on watchstar state
private const WATCHSTAR_ICON = [
'href' => '#',
'id' => 'ca-watchstar-sticky-header',
'event' => 'watch-sticky-header',
'icon' => 'wikimedia-star',
'is-quiet' => true,
'tabindex' => '-1',
'class' => 'sticky-header-icon mw-watchlink'
];
private const EDIT_VE_ICON = [
'href' => '#',
'id' => 'ca-ve-edit-sticky-header',
'event' => 've-edit-sticky-header',
'icon' => 'wikimedia-edit',
'is-quiet' => true,
'tabindex' => '-1',
'class' => 'sticky-header-icon'
];
private const EDIT_WIKITEXT_ICON = [
'href' => '#',
'id' => 'ca-edit-sticky-header',
'event' => 'wikitext-edit-sticky-header',
'icon' => 'wikimedia-wikiText',
'is-quiet' => true,
'tabindex' => '-1',
'class' => 'sticky-header-icon'
];
private const EDIT_PROTECTED_ICON = [
'href' => '#',
'id' => 'ca-viewsource-sticky-header',
'event' => 've-edit-protected-sticky-header',
'icon' => 'wikimedia-editLock',
'is-quiet' => true,
'tabindex' => '-1',
'class' => 'sticky-header-icon'
];
private const SEARCH_SHOW_THUMBNAIL_CLASS = 'vector-search-box-show-thumbnail';
private const SEARCH_AUTO_EXPAND_WIDTH_CLASS = 'vector-search-box-auto-expand-width';
private const CLASS_QUIET_BUTTON = 'mw-ui-button mw-ui-quiet';
private const CLASS_PROGRESSIVE = 'mw-ui-progressive';
private const CLASS_ICON_BUTTON = 'mw-ui-icon mw-ui-icon-element';
Add opt-out link to Sidebar for Vector/Logged-in Users Without Abstractions This commit is singularly focused on adding a link to the sidebar for Vector, logged-in users. It does the bare minimum to fulfill the requirements of T243281. Additionally, it will help to answer the question "Do we need to use abstractions (other than maybe different templates) to separate Legacy Vector from Vector" by intentionally leaving out any abstractions in order to make it easier to compare with a follow-up patch (Ib2ef15180df73360cc1de25b893e49d415d23e1a) which does use abstractions. It is a good thing to question whether or not we need addtional abstractions in VectorTemplate and if they will help us as unnecessary abstractions can have the opposite effect and just lead to further frustrations down the road. Therefore, I urge you, the reviewer, to let me know your thoughts! If abstractions are viewed as not making our lives any easier, the follow-up patches may be completely discarded and that's totally okay with me. :) I think it's a good think to talk about now though. Important changes: * The VectorTemplate constructor was changed to allow injecting the config, templateParser, and isLegacy boolean (only the config was allowed before this commit). According to MediaWiki's Stable Interface Policy, "Constructor signatures are generally considered unstable unless explicitly declared stable for calling" [3]. Given that VecorTemplate's constructor is not marked as stable, it is justified to do this without warning according to the policy. * Due to the above, the 'setTemplate' method is no longer needed and was marked as deprecated. * VectorTemplateTest was made to adapt to the new VectorTemplate constructor. Additionally, it now extends from MediaWikiIntegrationTestCase which my intelliphense server can pick up. I *think* MediaWikiTestCase is just an alias to MediaWikiIntegrationTestCase [1] and MediaWikiTestCase file was renamed to MediaWikiIntegrationTestCase in [2], but I'm willing to change it back if there is pushback to this. Open questions: * What are VectorTemplate's responsibilities? To me, it acts right now as a controller (because it echos the full HTML string from the template), a model (because SkinTemplate::prepareQuickTemplate sets data on it which it later retrieves through `$this->get()`), a presenter (because it adds data tailored for a web-centric view), and a view (because it renders HTML strings instead of letting the view/template be solely responsible for that). Arguably, some business logic might be mixed in there as well (because it checks to see if a User is logged in/has necessary permissions to show x which my changes here add to). This might not be a problem if we keep VectorTemplate relatively small, but will it remain this way as we progress further in Desktop Improvements? * How do we write tests for VectorTemplate without exposing unnecessary public methods? For example, if I want to test the `getSkinData()` method to see what state will be sent to the template, how should I do this? One option might be to use `TestingAccessWrapper` to expose these private methods which is what `VectorTemplateTest::testbuildViewsProps()` does. Another option is to accept this method as public. Is there a better way? Keep in mind that even with access to this method, there might be many things to mock. [1] https://github.com/wikimedia/mediawiki/blob/0030cb525be6cabc1d63de80586b2017d4bbe354/tests/common/TestsAutoLoader.php#L64 [2] Ie717b0ecf4fcfd089d46248f14853c80b7ef4a76 [3] https://www.mediawiki.org/wiki/Stable_interface_policy Bug: T243281 Change-Id: I0571b041bcd7f19bec9f103fa7bccdd093f6394d
2020-03-17 20:21:33 +00:00
/**
* T243281: Code used to track clicks to opt-out link.
*
* The "vct" substring is used to describe the newest "Vector" (non-legacy)
* feature. The "w" describes the web platform. The "1" describes the version
* of the feature.
*
* @see https://wikitech.wikimedia.org/wiki/Provenance
* @var string
*/
private const OPT_OUT_LINK_TRACKING_CODE = 'vctw1';
/**
* @param string $icon the name of the icon without wikimedia- prefix.
* @return string
*/
private function iconClass( $icon ) {
if ( $icon ) {
return 'mw-ui-icon-wikimedia-' . $icon;
}
return '';
}
abstract protected function isLegacy(): bool;
/**
* Calls getLanguages with caching.
* @return array
*/
protected function getLanguagesCached(): array {
if ( $this->languages === null ) {
$this->languages = $this->getLanguages();
}
return $this->languages;
}
/**
* This should be upstreamed to the Skin class in core once the logic is finalized.
* Returns false if the page is a special page without any languages, or if an action
* other than view is being used.
* @return bool
*/
private function canHaveLanguages(): bool {
if ( $this->getContext()->getActionName() !== 'view' ) {
return false;
}
$title = $this->getTitle();
// Defensive programming - if a special page has added languages explicitly, best to show it.
if ( $title && $title->isSpecialPage() && empty( $this->getLanguagesCached() ) ) {
return false;
}
return true;
}
/**
* @param string $location Either 'top' or 'bottom' is accepted.
* @return bool
*/
protected function isLanguagesInContentAt( $location ) {
if ( !$this->canHaveLanguages() ) {
return false;
}
$featureManager = VectorServices::getFeatureManager();
$inContent = $featureManager->isFeatureEnabled(
Constants::FEATURE_LANGUAGE_IN_HEADER
);
$isMainPage = $this->getTitle() ? $this->getTitle()->isMainPage() : false;
switch ( $location ) {
case 'top':
return $isMainPage ? $inContent && $featureManager->isFeatureEnabled(
Constants::FEATURE_LANGUAGE_IN_MAIN_PAGE_HEADER
) : $inContent;
case 'bottom':
return $inContent && $isMainPage && !$featureManager->isFeatureEnabled(
Constants::FEATURE_LANGUAGE_IN_MAIN_PAGE_HEADER
);
default:
throw new RuntimeException( 'unknown language button location' );
}
}
/**
* Whether or not the languages are out of the sidebar and in the content either at
* the top or the bottom.
* @return bool
*/
private function isLanguagesInContent() {
return $this->isLanguagesInContentAt( 'top' ) || $this->isLanguagesInContentAt( 'bottom' );
}
/**
* Show the ULS button if it's modern Vector, languages in header is enabled,
* and the ULS extension is enabled. Hide it otherwise.
* There is no point in showing the language button if ULS extension is unavailable
* as there is no ways to add languages without it.
* @return bool
*/
protected function shouldHideLanguages() {
return $this->isLegacy() || !$this->isLanguagesInContent() || !$this->isULSExtensionEnabled();
}
/**
* Returns HTML for the create account link inside the anon user links
* @param string[] $returnto array of query strings used to build the login link
* @param bool $isDropdownItem Set true for create account link inside the user menu dropdown
* which includes icon classes and is not styled like a button
* @return string
*/
private function getCreateAccountHTML( $returnto, $isDropdownItem ) {
$createAccountData = $this->buildCreateAccountData( $returnto );
$createAccountData = array_merge( $createAccountData, [
'class' => $isDropdownItem ? [
'vector-menu-content-item',
] : '',
'collapsible' => true,
'icon' => $isDropdownItem ? $createAccountData['icon'] : null,
'button' => !$isDropdownItem,
] );
$createAccountData = Hooks::updateMenuItem( $createAccountData, true );
return $this->makeLink( 'create-account', $createAccountData );
}
/**
* Returns HTML for the watchlist link inside user links
* @param array|null $watchlistMenuData (optional)
* @return string
*/
private function getWatchlistHTML( $watchlistMenuData = null ) {
return $watchlistMenuData ? $watchlistMenuData['html-items'] : '';
}
/**
* Returns HTML for the create account button, login button and learn more link inside the anon user menu
* @param string[] $returnto array of query strings used to build the login link
* @param bool $useCombinedLoginLink if a combined login/signup link will be used
* @param bool $isTempUser
* @return string
*/
private function getAnonMenuBeforePortletHTML( $returnto, $useCombinedLoginLink, $isTempUser ) {
$templateParser = $this->getTemplateParser();
$loginLinkData = array_merge( $this->buildLoginData( $returnto, $useCombinedLoginLink ), [
'class' => [ 'vector-menu-content-item', 'vector-menu-content-item-login' ],
] );
$loginLinkData = Hooks::updateMenuItem( $loginLinkData, true );
$templateData = [
'htmlCreateAccount' => $this->getCreateAccountHTML( $returnto, true ),
'htmlLogin' => $this->makeLink( 'login', $loginLinkData ),
];
if ( $isTempUser ) {
$templateName = 'UserLinks__templogin';
} else {
$templateName = 'UserLinks__login';
$learnMoreLinkData = [
'text' => $this->msg( 'vector-anon-user-menu-pages-learn' )->text(),
'href' => Title::newFromText( $this->msg( 'vector-intro-page' )->text() )->getLocalURL(),
'aria-label' => $this->msg( 'vector-anon-user-menu-pages-label' )->text(),
];
$templateData['htmlLearnMoreLink'] = $this->makeLink( '', $learnMoreLinkData );
$templateData['msgLearnMore'] = $this->msg( 'vector-anon-user-menu-pages' );
}
return $templateParser->processTemplate( $templateName, $templateData );
}
/**
* Returns HTML for the logout button that should be placed in the user (personal) menu
* after the menu itself.
* @return string
*/
private function getLogoutHTML() {
$logoutLinkData = array_merge( $this->buildLogoutLinkData(), [
'class' => [ 'vector-menu-content-item', 'vector-menu-content-item-logout' ],
] );
$logoutLinkData = Hooks::updateMenuItem( $logoutLinkData, true );
$templateParser = $this->getTemplateParser();
return $templateParser->processTemplate( 'UserLinks__logout', [
'htmlLogout' => $this->makeLink( 'logout', $logoutLinkData )
] );
}
/**
* Returns template data for UserLinks.mustache
* @param array $menuData existing menu template data to be transformed and copied for UserLinks
* @param User $user the context user
* @return array
*/
private function getUserLinksTemplateData( $menuData, $user ): array {
$isAnon = !$user->isRegistered();
$isTempUser = $user->isTemp();
$returnto = $this->getReturnToParam();
$useCombinedLoginLink = $this->useCombinedLoginLink();
$htmlCreateAccount = $this->getCreateAccountHTML( $returnto, false );
$templateParser = $this->getTemplateParser();
// See T288428#7303233. The following conditional checks whether config is disabling account creation for
// anonymous users in modern Vector. This check excludes the use case of extensions using core and legacy hooks
// to remove the "Create account" link from the personal toolbar. Ideally this should be managed with a new hook
// that tracks account creation ability.
// Supporting removing items via hook involves unnecessary additional complexity we'd rather avoid at this time.
// (see https://gerrit.wikimedia.org/r/c/mediawiki/skins/Vector/+/713505/3)
// Account creation can be disabled by setting `$wgGroupPermissions['*']['createaccount'] = false;`
$isCreateAccountAllowed = ( $isAnon || $isTempUser )
&& $this->getAuthority()->isAllowed( 'createaccount' );
$userMoreHtmlItems = $templateParser->processTemplate( 'UserLinks__more', [
'is-anon' => $isAnon,
'is-create-account-allowed' => $isCreateAccountAllowed,
'html-create-account' => $htmlCreateAccount,
'data-user-interface-preferences' => $menuData[ 'data-user-interface-preferences' ],
'data-notifications' => $menuData[ 'data-notifications' ],
'data-user-page' => $menuData[ 'data-user-page' ],
'html-vector-watchlist' => $this->getWatchlistHTML( $menuData[ 'data-vector-user-menu-overflow' ] ?? null ),
] );
$userMoreData = $this->decoratePortletData( 'data-user-more', [
'id' => 'p-personal-more',
'class' => 'mw-portlet mw-portlet-personal-more vector-user-menu-more',
'html-items' => $userMoreHtmlItems,
] );
$userMenuData = $menuData[ 'data-user-menu' ];
if ( $isAnon || $isTempUser ) {
$userMenuData[ 'html-before-portal' ] .= $this->getAnonMenuBeforePortletHTML(
$returnto,
$useCombinedLoginLink,
$isTempUser
);
} else {
// Appending as to not override data potentially set by the onSkinAfterPortlet hook.
$userMenuData[ 'html-after-portal' ] .= $this->getLogoutHTML();
}
$moreItems = substr_count( $userMoreData['html-items'], '<li' );
return [
'is-wide' => $moreItems > 3,
'data-user-more' => $userMoreData,
'data-user-menu' => $userMenuData
];
}
/**
* @inheritDoc
*/
protected function runOnSkinTemplateNavigationHooks( SkinTemplate $skin, &$content_navigation ) {
parent::runOnSkinTemplateNavigationHooks( $skin, $content_navigation );
Hooks::onSkinTemplateNavigation( $skin, $content_navigation );
}
/**
* Check whether ULS is enabled
*
* @return bool
*/
private function isULSExtensionEnabled(): bool {
return ExtensionRegistry::getInstance()->isLoaded( 'UniversalLanguageSelector' );
}
/**
* Generate data needed to generate the sticky header.
* @param array $searchBoxData
* @param bool $includeEditIcons
* @return array
*/
final protected function getStickyHeaderData( $searchBoxData, $includeEditIcons ): array {
$btns = [
self::TALK_ICON,
self::SUBJECT_ICON,
self::HISTORY_ICON,
self::WATCHSTAR_ICON,
];
if ( $includeEditIcons ) {
$btns[] = self::EDIT_WIKITEXT_ICON;
$btns[] = self::EDIT_PROTECTED_ICON;
$btns[] = self::EDIT_VE_ICON;
}
$btns[] = $this->getAddSectionButtonData();
// Show sticky ULS if the ULS extension is enabled and the ULS in header is not hidden
$showStickyULS = $this->isULSExtensionEnabled() && !$this->shouldHideLanguages();
return [
'data-primary-action' => $showStickyULS ?
$this->getULSButtonData() : null,
'data-button-start' => [
'label' => $this->msg( 'search' ),
'icon' => 'wikimedia-search',
'is-quiet' => true,
'tabindex' => '-1',
'class' => 'vector-sticky-header-search-toggle',
'event' => 'ui.' . $searchBoxData['form-id'] . '.icon'
],
'data-search' => $searchBoxData,
'data-buttons' => $btns,
];
}
/**
* Generate data needed to create SidebarAction item.
* @param array $htmlData data to make a link or raw html
* @param array $headingOptions optional heading for the html
* @return array keyed data for the SidebarAction template
*/
private function makeSidebarActionData( array $htmlData = [], array $headingOptions = [] ): array {
$htmlContent = '';
// Populates the sidebar as a standalone link or custom html.
if ( array_key_exists( 'link', $htmlData ) ) {
$htmlContent = $this->makeLink( 'link', $htmlData['link'] );
} elseif ( array_key_exists( 'html-content', $htmlData ) ) {
$htmlContent = $htmlData['html-content'];
}
return $headingOptions + [
'html-content' => $htmlContent,
];
}
/**
* Determines if the language switching alert box should be in the sidebar.
*
* @return bool
*/
private function shouldLanguageAlertBeInSidebar(): bool {
$featureManager = VectorServices::getFeatureManager();
$isMainPage = $this->getTitle() ? $this->getTitle()->isMainPage() : false;
$shouldShowOnMainPage = $isMainPage && !empty( $this->getLanguagesCached() ) &&
$featureManager->isFeatureEnabled( Constants::FEATURE_LANGUAGE_IN_MAIN_PAGE_HEADER );
return ( $this->isLanguagesInContentAt( 'top' ) && !$isMainPage && !$this->shouldHideLanguages() &&
$featureManager->isFeatureEnabled( Constants::FEATURE_LANGUAGE_ALERT_IN_SIDEBAR ) ) ||
$shouldShowOnMainPage;
}
/**
Merge SkinVector and VectorTemplate (step 1/2) Please note I7e06a4cc226f3434c0f655212a464b8b98bcc7f4 should be merged at the same time as this patch. == The background == All extensions have been weaned of BaseTemplate hooks in Wikimedia projects. This change now means that Vector will no longer run any BaseTemplate hooks. See the epic T253809 for the implementation details. == The change == BaseTemplate will now have nothing to do with the rendering of Vector. The skin version is added to express the significance of breaking compatibility with 3rd party extensions. We TEMPORARILY remove SkinVector to retain git blame. SkinTemplateVector will be renamed SkinVector in the follow up (see 2/2) Update skin.json to use SkinTemplateVector for the skin (this will be fixed in a follow up). The isLegacy method is moved to SkinTemplateVector. Changes of note: * html-debuglog is no longer needed. SkinMustache includes this information on the skins behalf * html-printtail and html-headelement are now not needed in the master template and added by SkinMustache * Skin::getAfterPortlet does not provide the `after-portlet` wrapping element provided by BaseTemplate::getAfterPortlet so this is added * SkinTemplate::getFooterIcons does not support the options that BaseTemplate::getFooterIcons does so any icons which do not have an image must be manually checked for and unset Known changes to HTML output as a result of intentionally delegating their output to the core SkinMustache class: * A new line is removed between the body element and #mw-page-base * #mw-html-debug-log now appears at the end of the body element * #printfooter is now a child of #mw-content-text rather than sibling. Bug: T251212 Change-Id: I4e89beb96f6401ed7e51bafdf0aac408f5a2c42f
2020-04-28 21:16:21 +00:00
* @inheritDoc
*/
public function getTemplateData(): array {
Merge SkinVector and VectorTemplate (step 1/2) Please note I7e06a4cc226f3434c0f655212a464b8b98bcc7f4 should be merged at the same time as this patch. == The background == All extensions have been weaned of BaseTemplate hooks in Wikimedia projects. This change now means that Vector will no longer run any BaseTemplate hooks. See the epic T253809 for the implementation details. == The change == BaseTemplate will now have nothing to do with the rendering of Vector. The skin version is added to express the significance of breaking compatibility with 3rd party extensions. We TEMPORARILY remove SkinVector to retain git blame. SkinTemplateVector will be renamed SkinVector in the follow up (see 2/2) Update skin.json to use SkinTemplateVector for the skin (this will be fixed in a follow up). The isLegacy method is moved to SkinTemplateVector. Changes of note: * html-debuglog is no longer needed. SkinMustache includes this information on the skins behalf * html-printtail and html-headelement are now not needed in the master template and added by SkinMustache * Skin::getAfterPortlet does not provide the `after-portlet` wrapping element provided by BaseTemplate::getAfterPortlet so this is added * SkinTemplate::getFooterIcons does not support the options that BaseTemplate::getFooterIcons does so any icons which do not have an image must be manually checked for and unset Known changes to HTML output as a result of intentionally delegating their output to the core SkinMustache class: * A new line is removed between the body element and #mw-page-base * #mw-html-debug-log now appears at the end of the body element * #printfooter is now a child of #mw-content-text rather than sibling. Bug: T251212 Change-Id: I4e89beb96f6401ed7e51bafdf0aac408f5a2c42f
2020-04-28 21:16:21 +00:00
$skin = $this;
$parentData = $this->decoratePortletsData( parent::getTemplateData() );
$featureManager = VectorServices::getFeatureManager();
// SkinVector sometimes serves new Vector as part of removing the
// skin version user preference. TCho avoid T302461 we need to unset it here.
// This shouldn't be run on SkinVector22.
if ( $this->getSkinName() === 'vector' ) {
unset( $parentData['data-toc'] );
}
//
// Naming conventions for Mustache parameters.
//
// Value type (first segment):
// - Prefix "is" or "has" for boolean values.
// - Prefix "msg-" for interface message text.
// - Prefix "html-" for raw HTML.
// - Prefix "data-" for an array of template parameters that should be passed directly
// to a template partial.
// - Prefix "array-" for lists of any values.
//
// Source of value (first or second segment)
// - Segment "page-" for data relating to the current page (e.g. Title, WikiPage, or OutputPage).
// - Segment "hook-" for any thing generated from a hook.
// It should be followed by the name of the hook in hyphenated lowercase.
//
// Conditionally used values must use null to indicate absence (not false or '').
$commonSkinData = array_merge( $parentData, [
'is-legacy' => $this->isLegacy(),
'input-location' => $this->getSearchBoxInputLocation(),
'sidebar-visible' => $this->isSidebarVisible(),
'is-language-in-content' => $this->isLanguagesInContent(),
'is-language-in-content-top' => $this->isLanguagesInContentAt( 'top' ),
'is-language-in-content-bottom' => $this->isLanguagesInContentAt( 'bottom' ),
'data-search-box' => $this->getSearchData(
$parentData['data-search-box'],
!$this->isLegacy(),
// is primary mode of search
true,
'searchform',
true
)
] );
$user = $skin->getUser();
if ( $user->isRegistered() ) {
// Note: This data is also passed to legacy template where it is unused.
$optOutUrl = [
'text' => $this->msg( 'vector-opt-out' )->text(),
Add opt-out link to Sidebar for Vector/Logged-in Users Without Abstractions This commit is singularly focused on adding a link to the sidebar for Vector, logged-in users. It does the bare minimum to fulfill the requirements of T243281. Additionally, it will help to answer the question "Do we need to use abstractions (other than maybe different templates) to separate Legacy Vector from Vector" by intentionally leaving out any abstractions in order to make it easier to compare with a follow-up patch (Ib2ef15180df73360cc1de25b893e49d415d23e1a) which does use abstractions. It is a good thing to question whether or not we need addtional abstractions in VectorTemplate and if they will help us as unnecessary abstractions can have the opposite effect and just lead to further frustrations down the road. Therefore, I urge you, the reviewer, to let me know your thoughts! If abstractions are viewed as not making our lives any easier, the follow-up patches may be completely discarded and that's totally okay with me. :) I think it's a good think to talk about now though. Important changes: * The VectorTemplate constructor was changed to allow injecting the config, templateParser, and isLegacy boolean (only the config was allowed before this commit). According to MediaWiki's Stable Interface Policy, "Constructor signatures are generally considered unstable unless explicitly declared stable for calling" [3]. Given that VecorTemplate's constructor is not marked as stable, it is justified to do this without warning according to the policy. * Due to the above, the 'setTemplate' method is no longer needed and was marked as deprecated. * VectorTemplateTest was made to adapt to the new VectorTemplate constructor. Additionally, it now extends from MediaWikiIntegrationTestCase which my intelliphense server can pick up. I *think* MediaWikiTestCase is just an alias to MediaWikiIntegrationTestCase [1] and MediaWikiTestCase file was renamed to MediaWikiIntegrationTestCase in [2], but I'm willing to change it back if there is pushback to this. Open questions: * What are VectorTemplate's responsibilities? To me, it acts right now as a controller (because it echos the full HTML string from the template), a model (because SkinTemplate::prepareQuickTemplate sets data on it which it later retrieves through `$this->get()`), a presenter (because it adds data tailored for a web-centric view), and a view (because it renders HTML strings instead of letting the view/template be solely responsible for that). Arguably, some business logic might be mixed in there as well (because it checks to see if a User is logged in/has necessary permissions to show x which my changes here add to). This might not be a problem if we keep VectorTemplate relatively small, but will it remain this way as we progress further in Desktop Improvements? * How do we write tests for VectorTemplate without exposing unnecessary public methods? For example, if I want to test the `getSkinData()` method to see what state will be sent to the template, how should I do this? One option might be to use `TestingAccessWrapper` to expose these private methods which is what `VectorTemplateTest::testbuildViewsProps()` does. Another option is to accept this method as public. Is there a better way? Keep in mind that even with access to this method, there might be many things to mock. [1] https://github.com/wikimedia/mediawiki/blob/0030cb525be6cabc1d63de80586b2017d4bbe354/tests/common/TestsAutoLoader.php#L64 [2] Ie717b0ecf4fcfd089d46248f14853c80b7ef4a76 [3] https://www.mediawiki.org/wiki/Stable_interface_policy Bug: T243281 Change-Id: I0571b041bcd7f19bec9f103fa7bccdd093f6394d
2020-03-17 20:21:33 +00:00
'href' => SpecialPage::getTitleFor(
'Preferences',
false,
'mw-prefsection-rendering-skin'
)->getLinkURL( 'useskin=vector&wprov=' . self::OPT_OUT_LINK_TRACKING_CODE ),
'title' => $this->msg( 'vector-opt-out-tooltip' )->text(),
'active' => false,
Add opt-out link to Sidebar for Vector/Logged-in Users Without Abstractions This commit is singularly focused on adding a link to the sidebar for Vector, logged-in users. It does the bare minimum to fulfill the requirements of T243281. Additionally, it will help to answer the question "Do we need to use abstractions (other than maybe different templates) to separate Legacy Vector from Vector" by intentionally leaving out any abstractions in order to make it easier to compare with a follow-up patch (Ib2ef15180df73360cc1de25b893e49d415d23e1a) which does use abstractions. It is a good thing to question whether or not we need addtional abstractions in VectorTemplate and if they will help us as unnecessary abstractions can have the opposite effect and just lead to further frustrations down the road. Therefore, I urge you, the reviewer, to let me know your thoughts! If abstractions are viewed as not making our lives any easier, the follow-up patches may be completely discarded and that's totally okay with me. :) I think it's a good think to talk about now though. Important changes: * The VectorTemplate constructor was changed to allow injecting the config, templateParser, and isLegacy boolean (only the config was allowed before this commit). According to MediaWiki's Stable Interface Policy, "Constructor signatures are generally considered unstable unless explicitly declared stable for calling" [3]. Given that VecorTemplate's constructor is not marked as stable, it is justified to do this without warning according to the policy. * Due to the above, the 'setTemplate' method is no longer needed and was marked as deprecated. * VectorTemplateTest was made to adapt to the new VectorTemplate constructor. Additionally, it now extends from MediaWikiIntegrationTestCase which my intelliphense server can pick up. I *think* MediaWikiTestCase is just an alias to MediaWikiIntegrationTestCase [1] and MediaWikiTestCase file was renamed to MediaWikiIntegrationTestCase in [2], but I'm willing to change it back if there is pushback to this. Open questions: * What are VectorTemplate's responsibilities? To me, it acts right now as a controller (because it echos the full HTML string from the template), a model (because SkinTemplate::prepareQuickTemplate sets data on it which it later retrieves through `$this->get()`), a presenter (because it adds data tailored for a web-centric view), and a view (because it renders HTML strings instead of letting the view/template be solely responsible for that). Arguably, some business logic might be mixed in there as well (because it checks to see if a User is logged in/has necessary permissions to show x which my changes here add to). This might not be a problem if we keep VectorTemplate relatively small, but will it remain this way as we progress further in Desktop Improvements? * How do we write tests for VectorTemplate without exposing unnecessary public methods? For example, if I want to test the `getSkinData()` method to see what state will be sent to the template, how should I do this? One option might be to use `TestingAccessWrapper` to expose these private methods which is what `VectorTemplateTest::testbuildViewsProps()` does. Another option is to accept this method as public. Is there a better way? Keep in mind that even with access to this method, there might be many things to mock. [1] https://github.com/wikimedia/mediawiki/blob/0030cb525be6cabc1d63de80586b2017d4bbe354/tests/common/TestsAutoLoader.php#L64 [2] Ie717b0ecf4fcfd089d46248f14853c80b7ef4a76 [3] https://www.mediawiki.org/wiki/Stable_interface_policy Bug: T243281 Change-Id: I0571b041bcd7f19bec9f103fa7bccdd093f6394d
2020-03-17 20:21:33 +00:00
];
$htmlData = [
'link' => $optOutUrl,
];
$commonSkinData['data-emphasized-sidebar-action'][] = $this->makeSidebarActionData(
$htmlData,
[]
);
}
if ( !$this->isLegacy() ) {
$commonSkinData['data-vector-user-links'] = $this->getUserLinksTemplateData(
$commonSkinData['data-portlets'],
$user
);
// T295555 Add language switch alert message temporarily (to be removed).
if ( $this->shouldLanguageAlertBeInSidebar() ) {
$languageSwitchAlert = [
'html-content' => Html::noticeBox(
$this->msg( 'vector-language-redirect-to-top' )->parse(),
'vector-language-sidebar-alert'
),
];
$headingOptions = [
'heading' => $this->msg( 'vector-languages' )->plain(),
];
$commonSkinData['data-vector-language-switch-alert'][] = $this->makeSidebarActionData(
$languageSwitchAlert,
$headingOptions
);
}
Add opt-out link to Sidebar for Vector/Logged-in Users Without Abstractions This commit is singularly focused on adding a link to the sidebar for Vector, logged-in users. It does the bare minimum to fulfill the requirements of T243281. Additionally, it will help to answer the question "Do we need to use abstractions (other than maybe different templates) to separate Legacy Vector from Vector" by intentionally leaving out any abstractions in order to make it easier to compare with a follow-up patch (Ib2ef15180df73360cc1de25b893e49d415d23e1a) which does use abstractions. It is a good thing to question whether or not we need addtional abstractions in VectorTemplate and if they will help us as unnecessary abstractions can have the opposite effect and just lead to further frustrations down the road. Therefore, I urge you, the reviewer, to let me know your thoughts! If abstractions are viewed as not making our lives any easier, the follow-up patches may be completely discarded and that's totally okay with me. :) I think it's a good think to talk about now though. Important changes: * The VectorTemplate constructor was changed to allow injecting the config, templateParser, and isLegacy boolean (only the config was allowed before this commit). According to MediaWiki's Stable Interface Policy, "Constructor signatures are generally considered unstable unless explicitly declared stable for calling" [3]. Given that VecorTemplate's constructor is not marked as stable, it is justified to do this without warning according to the policy. * Due to the above, the 'setTemplate' method is no longer needed and was marked as deprecated. * VectorTemplateTest was made to adapt to the new VectorTemplate constructor. Additionally, it now extends from MediaWikiIntegrationTestCase which my intelliphense server can pick up. I *think* MediaWikiTestCase is just an alias to MediaWikiIntegrationTestCase [1] and MediaWikiTestCase file was renamed to MediaWikiIntegrationTestCase in [2], but I'm willing to change it back if there is pushback to this. Open questions: * What are VectorTemplate's responsibilities? To me, it acts right now as a controller (because it echos the full HTML string from the template), a model (because SkinTemplate::prepareQuickTemplate sets data on it which it later retrieves through `$this->get()`), a presenter (because it adds data tailored for a web-centric view), and a view (because it renders HTML strings instead of letting the view/template be solely responsible for that). Arguably, some business logic might be mixed in there as well (because it checks to see if a User is logged in/has necessary permissions to show x which my changes here add to). This might not be a problem if we keep VectorTemplate relatively small, but will it remain this way as we progress further in Desktop Improvements? * How do we write tests for VectorTemplate without exposing unnecessary public methods? For example, if I want to test the `getSkinData()` method to see what state will be sent to the template, how should I do this? One option might be to use `TestingAccessWrapper` to expose these private methods which is what `VectorTemplateTest::testbuildViewsProps()` does. Another option is to accept this method as public. Is there a better way? Keep in mind that even with access to this method, there might be many things to mock. [1] https://github.com/wikimedia/mediawiki/blob/0030cb525be6cabc1d63de80586b2017d4bbe354/tests/common/TestsAutoLoader.php#L64 [2] Ie717b0ecf4fcfd089d46248f14853c80b7ef4a76 [3] https://www.mediawiki.org/wiki/Stable_interface_policy Bug: T243281 Change-Id: I0571b041bcd7f19bec9f103fa7bccdd093f6394d
2020-03-17 20:21:33 +00:00
}
return $commonSkinData;
}
/**
* Annotates search box with Vector-specific information
*
* @param array $searchBoxData
* @param bool $isCollapsible
* @param bool $isPrimary
* @param string $formId
* @param bool $autoExpandWidth
* @return array modified version of $searchBoxData
*/
final protected function getSearchData(
array $searchBoxData,
bool $isCollapsible,
bool $isPrimary,
string $formId,
bool $autoExpandWidth
) {
$searchClass = 'vector-search-box-vue ';
if ( $isCollapsible ) {
$searchClass .= ' vector-search-box-collapses ';
}
if ( $this->doesSearchHaveThumbnails() ) {
$searchClass .= ' ' . self::SEARCH_SHOW_THUMBNAIL_CLASS .
( $autoExpandWidth ? ' ' . self::SEARCH_AUTO_EXPAND_WIDTH_CLASS : '' );
}
// Annotate search box with a component class.
$searchBoxData['class'] = trim( $searchClass );
$searchBoxData['is-collapsible'] = $isCollapsible;
$searchBoxData['is-primary'] = $isPrimary;
$searchBoxData['form-id'] = $formId;
// At lower resolutions the search input is hidden search and only the submit button is shown.
// It should behave like a form submit link (e.g. submit the form with no input value).
// We'll wire this up in a later task T284242.
$collapseIconAttrs = Linker::tooltipAndAccesskeyAttribs( 'search' );
$searchBoxData['data-collapse-icon'] = array_merge( [
'href' => Title::newFromText( $searchBoxData['page-title'] )->getLocalUrl(),
'label' => $this->msg( 'search' ),
'icon' => 'wikimedia-search',
'is-quiet' => true,
'class' => 'search-toggle',
], $collapseIconAttrs );
return $searchBoxData;
}
/**
* Gets the value of the "input-location" parameter for the SearchBox Mustache template.
*
* @return string Either `Constants::SEARCH_BOX_INPUT_LOCATION_DEFAULT` or
* `Constants::SEARCH_BOX_INPUT_LOCATION_MOVED`
*/
private function getSearchBoxInputLocation(): string {
if ( $this->isLegacy() ) {
return Constants::SEARCH_BOX_INPUT_LOCATION_DEFAULT;
}
return Constants::SEARCH_BOX_INPUT_LOCATION_MOVED;
}
/**
* @inheritDoc
*/
public function isResponsive() {
// Check it's enabled by user preference and configuration
$responsive = parent::isResponsive() && $this->getConfig()->get( 'VectorResponsive' );
// For historic reasons, the viewport is added when Vector is loaded on the mobile
// domain. This is only possible for 3rd parties or by useskin parameter as there is
// no preference for changing mobile skin. Only need to check if $responsive is falsey.
if ( !$responsive && ExtensionRegistry::getInstance()->isLoaded( 'MobileFrontend' ) ) {
$mobFrontContext = MediaWikiServices::getInstance()->getService( 'MobileFrontend.Context' );
if ( $mobFrontContext->shouldDisplayMobileView() ) {
return true;
}
}
return $responsive;
}
/**
* Returns `true` if Vue search is enabled to show thumbnails and `false` otherwise.
* Note this is only relevant for Vue search experience (not legacy search).
*
* @return bool
*/
private function doesSearchHaveThumbnails(): bool {
return $this->getConfig()->get( 'VectorWvuiSearchOptions' )['showThumbnail'];
}
/**
* Determines wheather the initial state of sidebar is visible on not
*
* @return bool
*/
private function isSidebarVisible() {
$skin = $this->getSkin();
if ( $skin->getUser()->isRegistered() ) {
$userOptionsLookup = MediaWikiServices::getInstance()->getUserOptionsLookup();
$userPrefSidebarState = $userOptionsLookup->getOption(
$skin->getUser(),
Constants::PREF_KEY_SIDEBAR_VISIBLE
);
$defaultLoggedinSidebarState = $this->getConfig()->get(
Constants::CONFIG_KEY_DEFAULT_SIDEBAR_VISIBLE_FOR_AUTHORISED_USER
);
// If the sidebar user preference has been set, return that value,
// if not, then the default sidebar state for logged-in users.
return ( $userPrefSidebarState !== null )
? (bool)$userPrefSidebarState
: $defaultLoggedinSidebarState;
}
return $this->getConfig()->get(
Constants::CONFIG_KEY_DEFAULT_SIDEBAR_VISIBLE_FOR_ANONYMOUS_USER
);
}
/**
* Returns ULS button label within the context of the translated message taking a placeholder.
*
* @param string $message
* @param int $count
* @return string
*/
private function getULSLabel( string $message, int $count ): string {
return $this->msg( $message )
->numParams( $count )
->escaped();
}
/**
* Creates button data for the "Add section" button in the sticky header
*
* @return array
*/
private function getAddSectionButtonData() {
return [
'href' => '#',
'id' => 'ca-addsection-sticky-header',
'event' => 'addsection-sticky-header',
'html-vector-button-icon' => Hooks::makeIcon( 'wikimedia-speechBubbleAdd-progressive' ),
'label' => $this->msg( [ 'vector-2022-action-addsection', 'skin-action-addsection' ] ),
'is-quiet' => true,
'tabindex' => '-1',
'class' => 'sticky-header-icon mw-ui-primary mw-ui-progressive'
];
}
/**
* Creates button data for the ULS button in the sticky header
*
* @return array
*/
private function getULSButtonData() {
$numLanguages = count( $this->getLanguagesCached() );
return [
'id' => 'p-lang-btn-sticky-header',
'class' => 'mw-interlanguage-selector',
'is-quiet' => true,
'tabindex' => '-1',
'label' => $this->getULSLabel( 'vector-language-button-label', $numLanguages ),
'html-vector-button-icon' => Hooks::makeIcon( 'wikimedia-language' ),
'event' => 'ui.dropdown-p-lang-btn-sticky-header'
];
}
/**
* Creates portlet data for the ULS button in the header
*
* @return array
*/
private function getULSPortletData() {
$numLanguages = count( $this->getLanguagesCached() );
$languageButtonData = [
'id' => 'p-lang-btn',
// No languages present for the article.
// But the page can show languages if there were languages.
'label' => $numLanguages === 0 ?
$this->msg( 'vector-no-language-button-label' )->text() :
$this->getULSLabel( 'vector-language-button-label', $numLanguages ),
'aria-label' => $numLanguages === 0 ?
$this->msg( 'vector-no-language-button-aria-label' )->text() :
$this->getULSLabel( 'vector-language-button-aria-label', $numLanguages ),
// ext.uls.interface attaches click handler to this selector.
'checkbox-class' => ' mw-interlanguage-selector ',
'html-vector-heading-icon' => Hooks::makeIcon( 'wikimedia-language-progressive' ),
'heading-class' => self::CLASS_QUIET_BUTTON . ' ' . self::CLASS_PROGRESSIVE .
' mw-portlet-lang-heading-' . strval( $numLanguages ),
];
// Adds class to hide language button
// Temporary solution to T287206, can be removed when ULS dialog includes interwiki links
if ( $this->shouldHideLanguages() ) {
$languageButtonData['class'] = ' mw-portlet-empty';
}
return $languageButtonData;
}
/**
* helper for applying Vector menu classes to portlets
*
* @param array $portletData returned by SkinMustache to decorate
* @param int $type representing one of the menu types (see MENU_TYPE_* constants)
* @return array modified version of portletData input
*/
private function decoratePortletClass(
array $portletData,
int $type = self::MENU_TYPE_DEFAULT
) {
$extraClasses = [
self::MENU_TYPE_DROPDOWN => 'vector-menu-dropdown',
self::MENU_TYPE_TABS => 'vector-menu-tabs',
self::MENU_TYPE_PORTAL => 'vector-menu-portal portal',
self::MENU_TYPE_DEFAULT => '',
];
if ( $this->isLegacy() ) {
$extraClasses[self::MENU_TYPE_TABS] .= ' vector-menu-tabs-legacy';
}
$portletData['heading-class'] = '';
// Add target class to apply different icon to personal menu dropdown for logged in users.
if ( $portletData['id'] === 'p-personal' ) {
if ( $this->isLegacy() ) {
$portletData['class'] .= ' vector-user-menu-legacy';
} else {
$portletData['class'] .= ' vector-user-menu';
$portletData['class'] .= $this->loggedin ?
' vector-user-menu-logged-in' :
' vector-user-menu-logged-out';
$portletData['heading-class'] .= ' ' . self::CLASS_QUIET_BUTTON . ' ' .
self::CLASS_ICON_BUTTON . ' ';
if ( $this->getUser()->isTemp() ) {
$icon = 'userAnonymous';
} elseif ( $this->loggedin ) {
$icon = 'userAvatar';
} else {
$icon = 'ellipsis';
}
$portletData['heading-class'] .= $this->iconClass( $icon );
}
}
switch ( $portletData['id'] ) {
case 'p-variants':
case 'p-cactions':
$portletData['class'] .= ' vector-menu-dropdown-noicon';
break;
default:
break;
}
if ( $portletData['id'] === 'p-lang' && $this->isLanguagesInContent() ) {
$portletData = array_merge( $portletData, $this->getULSPortletData() );
}
$class = $portletData['class'];
$portletData['class'] = trim( "$class $extraClasses[$type]" );
return $portletData;
}
/**
* Performs updates to all portlets.
*
* @param array $data
* @return array
*/
private function decoratePortletsData( array $data ) {
foreach ( $data['data-portlets'] as $key => $pData ) {
$data['data-portlets'][$key] = $this->decoratePortletData(
$key,
$pData
);
}
$sidebar = $data['data-portlets-sidebar'];
$sidebar['data-portlets-first'] = $this->decoratePortletData(
'navigation', $sidebar['data-portlets-first']
);
$rest = $sidebar['array-portlets-rest'];
foreach ( $rest as $key => $pData ) {
$rest[$key] = $this->decoratePortletData(
$pData['id'], $pData
);
}
$sidebar['array-portlets-rest'] = $rest;
$data['data-portlets-sidebar'] = $sidebar;
return $data;
}
/**
* Performs the following updates to portlet data:
* - Adds concept of menu types
* - Marks the selected variant in the variant portlet
* - modifies tooltips of personal and user-menu portlets
* @param string $key
* @param array $portletData
* @return array
*/
private function decoratePortletData(
string $key,
array $portletData
): array {
switch ( $key ) {
case 'data-user-menu':
case 'data-actions':
case 'data-variants':
$type = self::MENU_TYPE_DROPDOWN;
break;
case 'data-views':
case 'data-namespaces':
$type = self::MENU_TYPE_TABS;
break;
case 'data-notifications':
case 'data-personal':
case 'data-user-page':
case 'data-user-more':
$type = self::MENU_TYPE_DEFAULT;
break;
case 'data-languages':
$type = $this->isLanguagesInContent() ?
self::MENU_TYPE_DROPDOWN : self::MENU_TYPE_PORTAL;
break;
default:
$type = self::MENU_TYPE_PORTAL;
break;
}
$portletData = $this->decoratePortletClass(
$portletData,
$type
);
// Special casing for Variant to change label to selected.
// Hopefully we can revisit and possibly remove this code when the language switcher is moved.
if ( $key === 'data-variants' ) {
$languageConverterFactory = MediaWikiServices::getInstance()->getLanguageConverterFactory();
$pageLang = $this->getTitle()->getPageLanguage();
$converter = $languageConverterFactory->getLanguageConverter( $pageLang );
$portletData['label'] = $pageLang->getVariantname(
$converter->getPreferredVariant()
);
// T289523 Add aria-label data to the language variant switcher.
$portletData['aria-label'] = $this->msg( 'vector-language-variant-switcher-label' );
}
// T287494 We use tooltip messages to provide title attributes on hover over certain menu icons. For modern
// Vector, the "tooltip-p-personal" key is set to "User menu" which is appropriate for the user icon (dropdown
// indicator for user links menu) for logged-in users. This overrides the tooltip for the user links menu icon
// which is an ellipsis for anonymous users.
if ( $key === 'data-user-menu' && !$this->isLegacy() && !$this->loggedin ) {
$portletData['html-tooltip'] = Linker::tooltip( 'vector-anon-user-menu-title' );
}
// Set tooltip to empty string for the personal menu for both logged-in and logged-out users to avoid showing
// the tooltip for legacy version.
if ( $key === 'data-personal' && $this->isLegacy() ) {
$portletData['html-tooltip'] = '';
}
return $portletData + [
'is-dropdown' => $type === self::MENU_TYPE_DROPDOWN,
'is-portal' => $type === self::MENU_TYPE_PORTAL,
];
}
}