Create user preference to turn fixed width on and off

Additional changes:
* Move static classes (skin-vector-legacy and vector-toc-not-collapsed)
to skin.json

Bug: T319447
Change-Id: I3525f8bfe27445e3af83ce5cd34b4da643178fe2

i18n/en.json

@@ -51,5 +51,7 @@
 	"vector-toc-collapsible-button-label": "Toggle the table of contents",
 	"vector-site-nav-label": "Site",
 	"vector-2022-prefs-talkpage": "[[mw:Talk:Reading/Web/Desktop_Improvements|Discussion]]",
-	"tooltip-vector-anon-user-menu-title": "More options"
+	"tooltip-vector-anon-user-menu-title": "More options",
+	"prefs-skin-limited-width": "Enable limited width mode",
+	"prefs-help-skin-limited-width": "Enable limited width mode, for more centered reading and viewing experinence"
 }

i18n/qqq.json

@@ -66,5 +66,7 @@
 	"vector-toc-collapsible-button-label": "Used as the label for the table of contents collapsible toggle button",
 	"vector-site-nav-label": "Accessible label for site (main menu) nav landmark",
 	"vector-2022-prefs-talkpage": "Link to the desktop improvements project talk page which is shown before the preview link in skin preferences. See T307113 for more information.",
-	"tooltip-vector-anon-user-menu-title": "Used as title attribute for user menu icon on hover for anonymous users."
+	"tooltip-vector-anon-user-menu-title": "Used as title attribute for user menu icon on hover for anonymous users.",
+	"prefs-skin-limited-width": "Used in [[Special:Preferences]]",
+	"prefs-help-skin-limited-width": "Help message used on [[Special:Preferences]].\n\nSee also:\n* {{msg-mw|Mypreferences}}"
 }

includes/Constants.php

@@ -240,6 +240,16 @@ final class Constants {
 	 */
 	public const FEATURE_ARTICLE_TOOLS = 'ArticleTools';
 
+	/**
+	 * @var string
+	 */
+	public const PREF_KEY_LIMITED_WIDTH = 'skin-limited-width';
+
+	/**
+	 * @var bool
+	 */
+	public const CONFIG_DEFAULT_LIMITED_WIDTH = 1;
+
 	/**
 	 * This class is for namespacing constants only. Forbid construction.
 	 * @throws FatalError

includes/Hooks.php

@@ -14,6 +14,7 @@ use MediaWiki\ResourceLoader as RL;
 use MediaWiki\ResourceLoader\Hook\ResourceLoaderSiteModulePagesHook;
 use MediaWiki\ResourceLoader\Hook\ResourceLoaderSiteStylesModulePagesHook;
 use MediaWiki\Skins\Hook\SkinPageReadyConfigHook;
+use MediaWiki\User\Hook\UserGetDefaultOptionsHook;
 use OutputPage;
 use RuntimeException;
 use Skin;
@@ -37,7 +38,8 @@ class Hooks implements
 	ResourceLoaderSiteModulePagesHook,
 	ResourceLoaderSiteStylesModulePagesHook,
 	RequestContextCreateSkinHook,
-	SkinPageReadyConfigHook
+	SkinPageReadyConfigHook,
+	UserGetDefaultOptionsHook
 {
 	/**
 	 * Checks if the current skin is a variant of Vector
@@ -631,6 +633,13 @@ class Hooks implements
 					Constants::CONFIG_KEY_DEFAULT_SIDEBAR_VISIBLE_FOR_AUTHORISED_USER
 				),
 			],
+			Constants::PREF_KEY_LIMITED_WIDTH => [
+				'type' => 'toggle',
+				'label-message' => 'prefs-skin-limited-width',
+				'section' => 'rendering/skin/skin-prefs',
+				'help-message' => 'prefs-help-skin-limited-width',
+				'hide-if' => [ '!==', 'wpskin', Constants::SKIN_NAME_MODERN ],
+			]
 		];
 		$prefs += $vectorPrefs;
 	}
@@ -708,27 +717,24 @@ class Hooks implements
 		//
 		// See https://codesearch.wmcloud.org/deployed/?q=skin-vector-legacy for an up-to-date
 		// list.
-		if ( self::isSkinVersionLegacy( $skinName ) ) {
-			$bodyAttrs['class'] .= ' skin-vector-legacy';
-		}
 
 		$tocClasses = self::getTocClasses( $sk, $config );
 		if ( $tocClasses ) {
 			$bodyAttrs['class'] .= ' ' . implode( ' ', $tocClasses );
 		}
 
-		// Should we disable the max-width styling?
-		if ( !self::isSkinVersionLegacy( $skinName ) && $sk->getTitle() && self::shouldDisableMaxWidth(
+		$shouldDisableMaxWidth = !self::isSkinVersionLegacy( $skinName ) &&
+			$sk->getTitle() &&
+			self::shouldDisableMaxWidth(
 				$config->get( 'VectorMaxWidthOptions' ),
 				$sk->getTitle(),
 				$out->getRequest()->getValues()
-		) ) {
+			);
+		// Should we disable the max-width styling?
+		if ( $sk instanceof SkinVector22 && ( !$sk->hasUserLimitedWidthEnabled() || $shouldDisableMaxWidth ) ) {
 			$bodyAttrs['class'] .= ' skin-vector-disable-max-width';
 		}
 
-		// TOC is not collapsed by default
-		$bodyAttrs['class'] .= ' vector-toc-not-collapsed';
-
 		$featureManager = VectorServices::getFeatureManager();
 		$bodyAttrs['class'] .= ' ' . implode( ' ', $featureManager->getFeatureBodyClass() );
 		$bodyAttrs['class'] = trim( $bodyAttrs['class'] );
@@ -869,4 +875,11 @@ class Hooks implements
 	private static function isSkinVersionLegacy( $skinName ): bool {
 		return $skinName === Constants::SKIN_NAME_LEGACY;
 	}
+
+	/**
+	 * @inheritDoc
+	 */
+	public function onUserGetDefaultOptions( &$defaultOptions ) {
+		$defaultOptions[ Constants::PREF_KEY_LIMITED_WIDTH ] = Constants::CONFIG_DEFAULT_LIMITED_WIDTH;
+	}
 }

includes/SkinVector22.php

@@ -2,6 +2,8 @@
 
 namespace MediaWiki\Skins\Vector;
 
+use MediaWiki\MediaWikiServices;
+
 /**
  * @ingroup Skins
  * @package Vector
@@ -194,4 +196,25 @@ class SkinVector22 extends SkinVector {
 			) : false,
 		] );
 	}
+
+	/**
+	 * Indicates if this skin should be shown with max-width.
+	 * @internal
+	 * @since 1.40
+	 *
+	 * @return bool
+	 */
+	public function hasUserLimitedWidthEnabled() {
+		$userOptionsLookup = MediaWikiServices::getInstance()->getUserOptionsLookup();
+		$isSkinModern = $this->getSkin()->getSkinName() === Constants::SKIN_NAME_MODERN;
+		$isLimitedWidth = $userOptionsLookup->getOption(
+			$this->getSkin()->getUser(),
+			Constants::PREF_KEY_LIMITED_WIDTH
+		);
+		$isLimitedWidth = $isLimitedWidth === null ? true : $userOptionsLookup->getBoolOption(
+			$this->getUser(),
+			Constants::PREF_KEY_LIMITED_WIDTH
+		);
+		return $isSkinModern && $this->getSkin()->getTitle() && $isLimitedWidth;
+	}
 }

skin.json

@@ -39,7 +39,8 @@
 					},
 					"bodyClasses": [
 						"skin-vector",
-						"skin-vector-search-vue"
+						"skin-vector-search-vue",
+						"vector-toc-not-collapsed"
 					],
 					"menus": [
 						"user-interface-preferences",
@@ -107,6 +108,9 @@
 							"tag": "span"
 						}
 					},
+					"bodyClasses": [
+						"skin-vector-legacy"
+					],
 					"scripts": [
 						"skins.vector.legacy.js"
 					],
@@ -166,7 +170,8 @@
 		"OutputPageBodyAttributes": "VectorHooks",
 		"ResourceLoaderSiteModulePages": "VectorHooks",
 		"ResourceLoaderSiteStylesModulePages": "VectorHooks",
-		"SkinPageReadyConfig": "VectorHooks"
+		"SkinPageReadyConfig": "VectorHooks",
+		"UserGetDefaultOptions": "VectorHooks"
 	},
 	"@note": "When modifying skins.vector.styles definition, make sure the installer still works",
 	"ResourceModules": {