From a96afeb262f74455f654ad92c25e4103a608bdb4 Mon Sep 17 00:00:00 2001
From: =?utf8?q?Bartosz=20Dziewo=C5=84ski?= <matma.rex@gmail.com>
Date: Wed, 11 Jun 2014 00:25:48 +0200
Subject: [PATCH] Separate Vector skin from core

This makes it behave exactly like a custom skin, with the caveat that
it is still hardcoded in several places :(, most notably lots of
skinStyles in Resources.php, the installer and some tests.

* Renamed directory to reflect skin name.
* Split skin classes to separate PHP files.
* Removed core autoloader entries for skin classes.
* Changed the hack in Setup.php to require_once the skin PHP file, as
  the skin is now registered there.
* Extracted skin-specific localisation messages.
* Extracted skin-specific resources. Did not touch skinStyles yet.
* Hacked up the installer not to fall over entirely if Vector is
  missing.
* Adjusted hardcoded paths in some more places...

Change-Id: Idfffc1430790b3a104cc9835a6367137bcbf0e4e
---
 includes/AutoLoader.php                       |   2 -
 includes/Setup.php                            |   2 +-
 includes/installer/WebInstallerOutput.php     |  10 +++
 languages/i18n/en.json                        |  15 ----
 languages/i18n/qqq.json                       |  15 ----
 resources/Resources.php                       |  26 +-----
 skins/Vector/SkinVector.php                   |  83 ++++++++++++++++++
 skins/Vector/Vector.php                       |  60 +++++++++++++
 .../Vector.php => Vector/VectorTemplate.php}  |  66 +-------------
 skins/{vector => Vector}/collapsibleTabs.js   |   0
 .../components/animations.less                |   0
 .../{vector => Vector}/components/common.less |   0
 .../components/externalLinks.less             |   0
 .../{vector => Vector}/components/footer.less |   0
 .../components/navigation.less                |   0
 .../components/notifications.less             |   0
 .../components/personalMenu.less              |   0
 .../{vector => Vector}/components/search.less |   0
 skins/{vector => Vector}/components/tabs.less |   0
 .../components/watchstar.less                 |   0
 skins/{vector => Vector}/csshover.htc         |   0
 skins/{vector => Vector}/csshover.min.htc     |   0
 skins/Vector/i18n/en.json                     |  20 +++++
 skins/Vector/i18n/qqq.json                    |  20 +++++
 .../images/arrow-collapsed-ltr.png            | Bin
 .../images/arrow-collapsed-ltr.svg            |   0
 .../images/arrow-collapsed-rtl.png            | Bin
 .../images/arrow-collapsed-rtl.svg            |   0
 .../images/arrow-down-focus-icon.png          | Bin
 .../images/arrow-down-focus-icon.svg          |   0
 .../images/arrow-down-icon.png                | Bin
 .../images/arrow-down-icon.svg                |   0
 .../images/arrow-expanded.png                 | Bin
 .../images/arrow-expanded.svg                 |   0
 .../{vector => Vector}/images/bullet-icon.png | Bin
 .../images/external-link-ltr-icon.png         | Bin
 .../images/external-link-ltr-icon.svg         |   0
 .../images/external-link-rtl-icon.png         | Bin
 .../images/external-link-rtl-icon.svg         |   0
 skins/{vector => Vector}/images/link-icon.png | Bin
 .../images/magnify-clip.png                   | Bin
 skins/{vector => Vector}/images/page-fade.png | Bin
 .../images/portal-break-ltr.png               | Bin
 .../images/portal-break-rtl.png               | Bin
 .../images/portal-break.png                   | Bin
 .../images/preferences/break.png              | Bin
 .../images/preferences/fade.png               | Bin
 .../{vector => Vector}/images/search-fade.png | Bin
 .../{vector => Vector}/images/search-ltr.png  | Bin
 .../{vector => Vector}/images/search-ltr.svg  |   0
 .../{vector => Vector}/images/search-rtl.png  | Bin
 .../{vector => Vector}/images/search-rtl.svg  |   0
 skins/{vector => Vector}/images/tab-break.png | Bin
 .../images/tab-current-fade.png               | Bin
 .../images/tab-normal-fade.png                | Bin
 .../images/unwatch-icon-hl.png                | Bin
 .../images/unwatch-icon-hl.svg                |   0
 .../images/unwatch-icon.png                   | Bin
 .../images/unwatch-icon.svg                   |   0
 skins/{vector => Vector}/images/user-icon.png | Bin
 skins/{vector => Vector}/images/user-icon.svg |   0
 .../images/watch-icon-hl.png                  | Bin
 .../images/watch-icon-hl.svg                  |   0
 .../images/watch-icon-loading.png             | Bin
 .../images/watch-icon-loading.svg             |   0
 .../{vector => Vector}/images/watch-icon.png  | Bin
 .../{vector => Vector}/images/watch-icon.svg  |   0
 skins/{vector => Vector}/screen-hd.less       |   0
 skins/{vector => Vector}/screen.less          |   0
 skins/{vector => Vector}/special.less         |   0
 .../special.preferences.less                  |   0
 skins/{vector => Vector}/variables.less       |   0
 skins/{vector => Vector}/vector.js            |   0
 73 files changed, 197 insertions(+), 122 deletions(-)
 create mode 100644 skins/Vector/SkinVector.php
 create mode 100644 skins/Vector/Vector.php
 rename skins/{vector/Vector.php => Vector/VectorTemplate.php} (89%)
 rename skins/{vector => Vector}/collapsibleTabs.js (100%)
 rename skins/{vector => Vector}/components/animations.less (100%)
 rename skins/{vector => Vector}/components/common.less (100%)
 rename skins/{vector => Vector}/components/externalLinks.less (100%)
 rename skins/{vector => Vector}/components/footer.less (100%)
 rename skins/{vector => Vector}/components/navigation.less (100%)
 rename skins/{vector => Vector}/components/notifications.less (100%)
 rename skins/{vector => Vector}/components/personalMenu.less (100%)
 rename skins/{vector => Vector}/components/search.less (100%)
 rename skins/{vector => Vector}/components/tabs.less (100%)
 rename skins/{vector => Vector}/components/watchstar.less (100%)
 rename skins/{vector => Vector}/csshover.htc (100%)
 rename skins/{vector => Vector}/csshover.min.htc (100%)
 create mode 100644 skins/Vector/i18n/en.json
 create mode 100644 skins/Vector/i18n/qqq.json
 rename skins/{vector => Vector}/images/arrow-collapsed-ltr.png (100%)
 rename skins/{vector => Vector}/images/arrow-collapsed-ltr.svg (100%)
 rename skins/{vector => Vector}/images/arrow-collapsed-rtl.png (100%)
 rename skins/{vector => Vector}/images/arrow-collapsed-rtl.svg (100%)
 rename skins/{vector => Vector}/images/arrow-down-focus-icon.png (100%)
 rename skins/{vector => Vector}/images/arrow-down-focus-icon.svg (100%)
 rename skins/{vector => Vector}/images/arrow-down-icon.png (100%)
 rename skins/{vector => Vector}/images/arrow-down-icon.svg (100%)
 rename skins/{vector => Vector}/images/arrow-expanded.png (100%)
 rename skins/{vector => Vector}/images/arrow-expanded.svg (100%)
 rename skins/{vector => Vector}/images/bullet-icon.png (100%)
 rename skins/{vector => Vector}/images/external-link-ltr-icon.png (100%)
 rename skins/{vector => Vector}/images/external-link-ltr-icon.svg (100%)
 rename skins/{vector => Vector}/images/external-link-rtl-icon.png (100%)
 rename skins/{vector => Vector}/images/external-link-rtl-icon.svg (100%)
 rename skins/{vector => Vector}/images/link-icon.png (100%)
 rename skins/{vector => Vector}/images/magnify-clip.png (100%)
 rename skins/{vector => Vector}/images/page-fade.png (100%)
 rename skins/{vector => Vector}/images/portal-break-ltr.png (100%)
 rename skins/{vector => Vector}/images/portal-break-rtl.png (100%)
 rename skins/{vector => Vector}/images/portal-break.png (100%)
 rename skins/{vector => Vector}/images/preferences/break.png (100%)
 rename skins/{vector => Vector}/images/preferences/fade.png (100%)
 rename skins/{vector => Vector}/images/search-fade.png (100%)
 rename skins/{vector => Vector}/images/search-ltr.png (100%)
 rename skins/{vector => Vector}/images/search-ltr.svg (100%)
 rename skins/{vector => Vector}/images/search-rtl.png (100%)
 rename skins/{vector => Vector}/images/search-rtl.svg (100%)
 rename skins/{vector => Vector}/images/tab-break.png (100%)
 rename skins/{vector => Vector}/images/tab-current-fade.png (100%)
 rename skins/{vector => Vector}/images/tab-normal-fade.png (100%)
 rename skins/{vector => Vector}/images/unwatch-icon-hl.png (100%)
 rename skins/{vector => Vector}/images/unwatch-icon-hl.svg (100%)
 rename skins/{vector => Vector}/images/unwatch-icon.png (100%)
 rename skins/{vector => Vector}/images/unwatch-icon.svg (100%)
 rename skins/{vector => Vector}/images/user-icon.png (100%)
 rename skins/{vector => Vector}/images/user-icon.svg (100%)
 rename skins/{vector => Vector}/images/watch-icon-hl.png (100%)
 rename skins/{vector => Vector}/images/watch-icon-hl.svg (100%)
 rename skins/{vector => Vector}/images/watch-icon-loading.png (100%)
 rename skins/{vector => Vector}/images/watch-icon-loading.svg (100%)
 rename skins/{vector => Vector}/images/watch-icon.png (100%)
 rename skins/{vector => Vector}/images/watch-icon.svg (100%)
 rename skins/{vector => Vector}/screen-hd.less (100%)
 rename skins/{vector => Vector}/screen.less (100%)
 rename skins/{vector => Vector}/special.less (100%)
 rename skins/{vector => Vector}/special.preferences.less (100%)
 rename skins/{vector => Vector}/variables.less (100%)
 rename skins/{vector => Vector}/vector.js (100%)

diff --git a/includes/AutoLoader.php b/includes/AutoLoader.php
index 81c057d67d..f969f799cb 100644
--- a/includes/AutoLoader.php
+++ b/includes/AutoLoader.php
@@ -1181,8 +1181,6 @@ $wgAutoloadLocalClasses = array(
 	# skins
 	'MonoBookTemplate' => 'skins/monobook/MonoBook.php',
 	'SkinMonoBook' => 'skins/monobook/MonoBook.php',
-	'SkinVector' => 'skins/vector/Vector.php',
-	'VectorTemplate' => 'skins/vector/Vector.php',
 );
 
 class AutoLoader {
diff --git a/includes/Setup.php b/includes/Setup.php
index 51368b1730..91baefba7d 100644
--- a/includes/Setup.php
+++ b/includes/Setup.php
@@ -606,7 +606,7 @@ $wgDeferredUpdateList = array();
 // These lines should eventually be placed in skins' meta definition files, and loaded by a
 // require_once for each skin file generated by the installer and placed in LocalSettings.php.
 $wgValidSkinNames['monobook'] = 'MonoBook';
-$wgValidSkinNames['vector'] = 'Vector';
+require_once "$wgStyleDirectory/Vector/Vector.php";
 
 wfProfileOut( $fname . '-globals' );
 wfProfileIn( $fname . '-extensions' );
diff --git a/includes/installer/WebInstallerOutput.php b/includes/installer/WebInstallerOutput.php
index d81111b5fe..97f48300bf 100644
--- a/includes/installer/WebInstallerOutput.php
+++ b/includes/installer/WebInstallerOutput.php
@@ -124,6 +124,12 @@ class WebInstallerOutput {
 	 * @return string
 	 */
 	public function getCSS() {
+		// Horrible, horrible hack: the installer is currently hardcoded to use the Vector skin, so load
+		// it here. Include instead of require, as this will work without it, it will just look bad.
+		global $wgResourceModules;
+		global $wgStyleDirectory;
+		include_once "$wgStyleDirectory/Vector/Vector.php";
+
 		$moduleNames = array(
 			// See SkinTemplate::setupSkinUserCss
 			'mediawiki.legacy.shared',
@@ -146,6 +152,10 @@ class WebInstallerOutput {
 		foreach ( $moduleNames as $moduleName ) {
 			/** @var ResourceLoaderFileModule $module */
 			$module = $resourceLoader->getModule( $moduleName );
+			// One of the modules will be missing if Vector is unavailable
+			if ( !$module ) {
+				continue;
+			}
 
 			// Based on: ResourceLoaderFileModule::getStyles (without the DB query)
 			$styles = ResourceLoader::makeCombinedStyles( $module->readStyleFiles(
diff --git a/languages/i18n/en.json b/languages/i18n/en.json
index 667b6f7c2c..1ad6a38f22 100644
--- a/languages/i18n/en.json
+++ b/languages/i18n/en.json
@@ -150,19 +150,7 @@
 	"faqpage": "Project:FAQ",
 	"sitetitle": "{{SITENAME}}",
 	"sitesubtitle": "",
-	"vector-action-addsection": "Add topic",
-	"vector-action-delete": "Delete",
-	"vector-action-move": "Move",
-	"vector-action-protect": "Protect",
-	"vector-action-undelete": "Undelete",
-	"vector-action-unprotect": "Change protection",
-	"vector-view-create": "Create",
-	"vector-view-edit": "Edit",
-	"vector-view-history": "View history",
-	"vector-view-view": "Read",
-	"vector-view-viewsource": "View source",
 	"actions": "Actions",
-	"vector-more-actions": "More",
 	"namespaces": "Namespaces",
 	"variants": "Variants",
 	"navigation-heading": "Navigation menu",
@@ -2475,7 +2463,6 @@
 	"interlanguage-link-title-nonlangonly": "$1",
 	"common.css": "/* CSS placed here will be applied to all skins */",
 	"monobook.css": "/* CSS placed here will affect users of the MonoBook skin */",
-	"vector.css": "/* CSS placed here will affect users of the Vector skin */",
 	"print.css": "/* CSS placed here will affect the print output */",
 	"noscript.css": "/* CSS placed here will affect users with JavaScript disabled */",
 	"group-autoconfirmed.css": "/* CSS placed here will affect autoconfirmed users only */",
@@ -2485,7 +2472,6 @@
 	"group-bureaucrat.css": "/* CSS placed here will affect bureaucrats only */",
 	"common.js": "/* Any JavaScript here will be loaded for all users on every page load. */",
 	"monobook.js": "/* Any JavaScript here will be loaded for users using the MonoBook skin */",
-	"vector.js": "/* Any JavaScript here will be loaded for users using the Vector skin */",
 	"group-autoconfirmed.js": "/* Any JavaScript here will be loaded for autoconfirmed users only */",
 	"group-user.js": "/* Any JavaScript here will be loaded for registered users only */",
 	"group-bot.js": "/* Any JavaScript here will be loaded for bots only */",
@@ -2558,7 +2544,6 @@
 	"pageinfo-category-subcats": "Number of subcategories",
 	"pageinfo-category-files": "Number of files",
 	"skinname-monobook": "MonoBook",
-	"skinname-vector": "Vector",
 	"markaspatrolleddiff": "Mark as patrolled",
 	"markaspatrolledlink": "[$1]",
 	"markaspatrolledtext": "Mark this page as patrolled",
diff --git a/languages/i18n/qqq.json b/languages/i18n/qqq.json
index 455896100d..4d5d6e17bc 100644
--- a/languages/i18n/qqq.json
+++ b/languages/i18n/qqq.json
@@ -312,19 +312,7 @@
 	"faqpage": "{{doc-important|Do not translate <code>Project:</code> part.}}\n\"FAQ\" is short for \"frequently asked questions\".\n\nThis page is only linked in CologneBlue (an old skin), not in Monobook or Vector.",
 	"sitetitle": "{{Ignore}}",
 	"sitesubtitle": "{{Ignore}}",
-	"vector-action-addsection": "Used in the Vector skin. See for example {{canonicalurl:Talk:Main_Page|useskin=vector}}",
-	"vector-action-delete": "Used in the Vector skin, as the name of a tab at the top of the page. See for example {{canonicalurl:Main_Page|useskin=vector}}\n\n{{Identical|Delete}}",
-	"vector-action-move": "Used in the Vector skin, on the tabs at the top of the page. See for example {{canonicalurl:Talk:Main_Page|useskin=vector}}\n\n{{Identical|Move}}",
-	"vector-action-protect": "Tab at top of page, in vector skin\n\n{{Identical|Protect}}",
-	"vector-action-undelete": "Tab at top of page, in vector skin.\n{{Identical|Undelete}}",
-	"vector-action-unprotect": "Tab at top of page, in vector skin.\n{{Identical|Change protection}}",
-	"vector-view-create": "Tab label in the Vector skin. See for example {{canonicalurl:Foo|useskin=vector}}\n{{Identical|Create}}",
-	"vector-view-edit": "Tab label in the Vector skin. See for example {{canonicalurl:Main_Page|useskin=vector}}\n{{Identical|Edit}}",
-	"vector-view-history": "Tab label in the Vector skin. See for example {{canonicalurl:Main_Page|useskin=vector}}\n{{Identical|View history}}",
-	"vector-view-view": "Tab label in the Vector skin (verb). See for example {{canonicalurl:Main_Page|useskin=vector}}.\n{{Identical|Read}}",
-	"vector-view-viewsource": "Tab label in the Vector skin.\n{{Identical|View source}}",
 	"actions": "{{Identical|Action}}",
-	"vector-more-actions": "Label in the Vector skin's menu for the less-important or rarer actions which are not shown as tabs (like moving the page, or for sysops deleting or protecting the page), as well as (for users with a narrow viewing window in their browser) the less-important tab actions which the user's browser is unable to fit in. {{Identical|More}}",
 	"namespaces": "{{Identical|Namespace}}",
 	"variants": "Used by the Vector skin.",
 	"navigation-heading": "Heading shown above the navigation menu (sidebar) for screen-readers (or in non-standard skins).",
@@ -2637,7 +2625,6 @@
 	"interlanguage-link-title-nonlangonly": "{{ignored}}Interlanguage link title. Parameters: $1 replaced with name of the target wiki (probably not a language name).",
 	"common.css": "{{optional}}\nCSS applied to all users.",
 	"monobook.css": "{{optional}}\nCSS applied to users using Monobook skin.",
-	"vector.css": "{{optional}}",
 	"print.css": "{{optional}}",
 	"noscript.css": "{{optional}}",
 	"group-autoconfirmed.css": "{{doc-group|autoconfirmed|css}}",
@@ -2647,7 +2634,6 @@
 	"group-bureaucrat.css": "{{doc-group|bureaucrat|css}}",
 	"common.js": "{{optional}}\nJS for all users.",
 	"monobook.js": "{{optional}}\nJS for users using Monobook skin.",
-	"vector.js": "{{optional}}",
 	"group-autoconfirmed.js": "{{doc-group|autoconfirmed|js}}",
 	"group-user.js": "{{doc-group|user|js}}",
 	"group-bot.js": "{{doc-group|bot|js}}",
@@ -2720,7 +2706,6 @@
 	"pageinfo-category-subcats": "See also:\n* {{msg-mw|Pageinfo-category-pages}}\n* {{msg-mw|Pageinfo-category-files}}",
 	"pageinfo-category-files": "See also:\n* {{msg-mw|Pageinfo-category-pages}}\n* {{msg-mw|Pageinfo-category-subcats}}",
 	"skinname-monobook": "{{optional}}",
-	"skinname-vector": "{{optional}}",
 	"markaspatrolleddiff": "{{doc-actionlink}}\nSee also:\n* {{msg-mw|Markaspatrolledtext}}\n{{Identical|Mark as patrolled}}",
 	"markaspatrolledlink": "{{notranslate}}\nParameters:\n* $1 - link which has text {{msg-mw|Markaspatrolledtext}}",
 	"markaspatrolledtext": "{{doc-actionlink}}\nSee also:\n* {{msg-mw|Markaspatrolleddiff}}",
diff --git a/resources/Resources.php b/resources/Resources.php
index 93415a5b92..ec02e5b36f 100644
--- a/resources/Resources.php
+++ b/resources/Resources.php
@@ -128,15 +128,6 @@ return array(
 	 *
 	 * See Vector for an example.
 	 */
-	'skins.vector.styles' => array(
-		// Used in the web installer. Test it after modifying this definition!
-		'styles' => array(
-			'screen.less' => array( 'media' => 'screen' ),
-			'screen-hd.less' => array( 'media' => 'screen and (min-width: 982px)' ),
-		),
-		'remoteSkinPath' => 'vector',
-		'localBasePath' => $GLOBALS['wgStyleDirectory'] . '/vector',
-	),
 	'skins.monobook.styles' => array(
 		'styles' => array(
 			'main.css' => array( 'media' => 'screen' ),
@@ -144,19 +135,6 @@ return array(
 		'remoteSkinPath' => 'monobook',
 		'localBasePath' => $GLOBALS['wgStyleDirectory'] . '/monobook',
 	),
-	'skins.vector.js' => array(
-		'scripts' => array(
-			'collapsibleTabs.js',
-			'vector.js',
-		),
-		'position' => 'top',
-		'dependencies' => array(
-			'jquery.throttle-debounce',
-			'jquery.tabIndex',
-		),
-		'remoteSkinPath' => 'vector',
-		'localBasePath' => $GLOBALS['wgStyleDirectory'] . '/vector',
-	),
 
 	/* jQuery */
 
@@ -1229,7 +1207,7 @@ return array(
 		'scripts' => 'resources/src/mediawiki.special/mediawiki.special.js',
 		'styles' => 'resources/src/mediawiki.special/mediawiki.special.css',
 		'skinStyles' => array(
-			'vector' => 'skins/vector/special.less', // FIXME this should use $wgStyleDirectory
+			'vector' => 'skins/Vector/special.less', // FIXME this should use $wgStyleDirectory
 		),
 	),
 	'mediawiki.special.block' => array(
@@ -1278,7 +1256,7 @@ return array(
 		'styles' => 'resources/src/mediawiki.special/mediawiki.special.preferences.css',
 		'position' => 'top',
 		'skinStyles' => array(
-			'vector' => 'skins/vector/special.preferences.less', // FIXME this should use $wgStyleDirectory
+			'vector' => 'skins/Vector/special.preferences.less', // FIXME this should use $wgStyleDirectory
 		),
 		'messages' => array(
 			'prefs-tabs-navigation-hint',
diff --git a/skins/Vector/SkinVector.php b/skins/Vector/SkinVector.php
new file mode 100644
index 0000000000..237a2419b9
--- /dev/null
+++ b/skins/Vector/SkinVector.php
@@ -0,0 +1,83 @@
+<?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
+ */
+
+/**
+ * SkinTemplate class for Vector skin
+ * @ingroup Skins
+ */
+class SkinVector extends SkinTemplate {
+	public $skinname = 'vector';
+	public $stylename = 'Vector';
+	public $template = 'VectorTemplate';
+
+	protected static $bodyClasses = array( 'vector-animateLayout' );
+
+	/**
+	 * Initializes output page and sets up skin-specific parameters
+	 * @param OutputPage $out Object to initialize
+	 */
+	public function initPage( OutputPage $out ) {
+		global $wgLocalStylePath;
+
+		parent::initPage( $out );
+
+		// Append CSS which includes IE only behavior fixes for hover support -
+		// this is better than including this in a CSS file since it doesn't
+		// wait for the CSS file to load before fetching the HTC file.
+		$min = $this->getRequest()->getFuzzyBool( 'debug' ) ? '' : '.min';
+		$out->addHeadItem( 'csshover',
+			'<!--[if lt IE 7]><style type="text/css">body{behavior:url("' .
+				htmlspecialchars( $wgLocalStylePath ) .
+				"/{$this->stylename}/csshover{$min}.htc\")}</style><![endif]-->"
+		);
+
+		$out->addModules( array( 'skins.vector.js' ) );
+	}
+
+	/**
+	 * Loads skin and user CSS files.
+	 * @param OutputPage $out
+	 */
+	function setupSkinUserCss( OutputPage $out ) {
+		parent::setupSkinUserCss( $out );
+
+		$styles = array( 'mediawiki.skinning.interface', 'skins.vector.styles' );
+		wfRunHooks( 'SkinVectorStyleModules', array( $this, &$styles ) );
+		$out->addModuleStyles( $styles );
+	}
+
+	/**
+	 * Adds classes to the body element.
+	 *
+	 * @param OutputPage $out
+	 * @param array &$bodyAttrs Array of attributes that will be set on the body element
+	 */
+	function addToBodyAttributes( $out, &$bodyAttrs ) {
+		if ( isset( $bodyAttrs['class'] ) && strlen( $bodyAttrs['class'] ) > 0 ) {
+			$bodyAttrs['class'] .= ' ' . implode( ' ', static::$bodyClasses );
+		} else {
+			$bodyAttrs['class'] = implode( ' ', static::$bodyClasses );
+		}
+	}
+}
diff --git a/skins/Vector/Vector.php b/skins/Vector/Vector.php
new file mode 100644
index 0000000000..adc23067c7
--- /dev/null
+++ b/skins/Vector/Vector.php
@@ -0,0 +1,60 @@
+<?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
+ */
+
+$wgExtensionCredits['skin'][] = array(
+	'path' => __FILE__,
+	'name' => 'Vector',
+	'url' => 'https://www.mediawiki.org/wiki/Skin:Vector',
+);
+
+// Register files
+$wgAutoloadClasses['SkinVector'] = __DIR__ . '/SkinVector.php';
+$wgAutoloadClasses['VectorTemplate'] = __DIR__ . '/VectorTemplate.php';
+$wgMessagesDirs['Vector'] = __DIR__ . '/i18n';
+
+// Register skin
+$wgValidSkinNames['vector'] = 'Vector';
+
+// Register modules
+$wgResourceModules['skins.vector.styles'] = array(
+	'styles' => array(
+		'screen.less' => array( 'media' => 'screen' ),
+		'screen-hd.less' => array( 'media' => 'screen and (min-width: 982px)' ),
+	),
+	'remoteSkinPath' => 'Vector',
+	'localBasePath' => __DIR__,
+);
+$wgResourceModules['skins.vector.js'] = array(
+	'scripts' => array(
+		'collapsibleTabs.js',
+		'vector.js',
+	),
+	'position' => 'top',
+	'dependencies' => array(
+		'jquery.throttle-debounce',
+		'jquery.tabIndex',
+	),
+	'remoteSkinPath' => 'Vector',
+	'localBasePath' => __DIR__,
+);
diff --git a/skins/vector/Vector.php b/skins/Vector/VectorTemplate.php
similarity index 89%
rename from skins/vector/Vector.php
rename to skins/Vector/VectorTemplate.php
index 650a52bf23..7dc376ae77 100644
--- a/skins/vector/Vector.php
+++ b/skins/Vector/VectorTemplate.php
@@ -18,75 +18,10 @@
  * 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
  * http://www.gnu.org/copyleft/gpl.html
  *
- * @todo document
  * @file
  * @ingroup Skins
  */
 
-if ( !defined( 'MEDIAWIKI' ) ) {
-	die( -1 );
-}
-
-/**
- * SkinTemplate class for Vector skin
- * @ingroup Skins
- */
-class SkinVector extends SkinTemplate {
-	public $skinname = 'vector';
-	public $stylename = 'vector';
-	public $template = 'VectorTemplate';
-
-	protected static $bodyClasses = array( 'vector-animateLayout' );
-
-	/**
-	 * Initializes output page and sets up skin-specific parameters
-	 * @param OutputPage $out Object to initialize
-	 */
-	public function initPage( OutputPage $out ) {
-		global $wgLocalStylePath;
-
-		parent::initPage( $out );
-
-		// Append CSS which includes IE only behavior fixes for hover support -
-		// this is better than including this in a CSS file since it doesn't
-		// wait for the CSS file to load before fetching the HTC file.
-		$min = $this->getRequest()->getFuzzyBool( 'debug' ) ? '' : '.min';
-		$out->addHeadItem( 'csshover',
-			'<!--[if lt IE 7]><style type="text/css">body{behavior:url("' .
-				htmlspecialchars( $wgLocalStylePath ) .
-				"/{$this->stylename}/csshover{$min}.htc\")}</style><![endif]-->"
-		);
-
-		$out->addModules( array( 'skins.vector.js' ) );
-	}
-
-	/**
-	 * Loads skin and user CSS files.
-	 * @param OutputPage $out
-	 */
-	function setupSkinUserCss( OutputPage $out ) {
-		parent::setupSkinUserCss( $out );
-
-		$styles = array( 'mediawiki.skinning.interface', 'skins.vector.styles' );
-		wfRunHooks( 'SkinVectorStyleModules', array( $this, &$styles ) );
-		$out->addModuleStyles( $styles );
-	}
-
-	/**
-	 * Adds classes to the body element.
-	 *
-	 * @param OutputPage $out
-	 * @param array &$bodyAttrs Array of attributes that will be set on the body element
-	 */
-	function addToBodyAttributes( $out, &$bodyAttrs ) {
-		if ( isset( $bodyAttrs['class'] ) && strlen( $bodyAttrs['class'] ) > 0 ) {
-			$bodyAttrs['class'] .= ' ' . implode( ' ', static::$bodyClasses );
-		} else {
-			$bodyAttrs['class'] = implode( ' ', static::$bodyClasses );
-		}
-	}
-}
-
 /**
  * QuickTemplate class for Vector skin
  * @ingroup Skins
@@ -162,6 +97,7 @@ class VectorTemplate extends BaseTemplate {
 		<div id="content" class="mw-body" role="main">
 			<a id="top"></a>
 
+			<div id="mw-js-message" style="display:none;"<?php $this->html( 'userlangattributes' ) ?>></div>
 			<?php
 			if ( $this->data['sitenotice'] ) {
 				?>
diff --git a/skins/vector/collapsibleTabs.js b/skins/Vector/collapsibleTabs.js
similarity index 100%
rename from skins/vector/collapsibleTabs.js
rename to skins/Vector/collapsibleTabs.js
diff --git a/skins/vector/components/animations.less b/skins/Vector/components/animations.less
similarity index 100%
rename from skins/vector/components/animations.less
rename to skins/Vector/components/animations.less
diff --git a/skins/vector/components/common.less b/skins/Vector/components/common.less
similarity index 100%
rename from skins/vector/components/common.less
rename to skins/Vector/components/common.less
diff --git a/skins/vector/components/externalLinks.less b/skins/Vector/components/externalLinks.less
similarity index 100%
rename from skins/vector/components/externalLinks.less
rename to skins/Vector/components/externalLinks.less
diff --git a/skins/vector/components/footer.less b/skins/Vector/components/footer.less
similarity index 100%
rename from skins/vector/components/footer.less
rename to skins/Vector/components/footer.less
diff --git a/skins/vector/components/navigation.less b/skins/Vector/components/navigation.less
similarity index 100%
rename from skins/vector/components/navigation.less
rename to skins/Vector/components/navigation.less
diff --git a/skins/vector/components/notifications.less b/skins/Vector/components/notifications.less
similarity index 100%
rename from skins/vector/components/notifications.less
rename to skins/Vector/components/notifications.less
diff --git a/skins/vector/components/personalMenu.less b/skins/Vector/components/personalMenu.less
similarity index 100%
rename from skins/vector/components/personalMenu.less
rename to skins/Vector/components/personalMenu.less
diff --git a/skins/vector/components/search.less b/skins/Vector/components/search.less
similarity index 100%
rename from skins/vector/components/search.less
rename to skins/Vector/components/search.less
diff --git a/skins/vector/components/tabs.less b/skins/Vector/components/tabs.less
similarity index 100%
rename from skins/vector/components/tabs.less
rename to skins/Vector/components/tabs.less
diff --git a/skins/vector/components/watchstar.less b/skins/Vector/components/watchstar.less
similarity index 100%
rename from skins/vector/components/watchstar.less
rename to skins/Vector/components/watchstar.less
diff --git a/skins/vector/csshover.htc b/skins/Vector/csshover.htc
similarity index 100%
rename from skins/vector/csshover.htc
rename to skins/Vector/csshover.htc
diff --git a/skins/vector/csshover.min.htc b/skins/Vector/csshover.min.htc
similarity index 100%
rename from skins/vector/csshover.min.htc
rename to skins/Vector/csshover.min.htc
diff --git a/skins/Vector/i18n/en.json b/skins/Vector/i18n/en.json
new file mode 100644
index 0000000000..5851dcefbe
--- /dev/null
+++ b/skins/Vector/i18n/en.json
@@ -0,0 +1,20 @@
+{
+	"@metadata": {
+		"authors": []
+	},
+	"skinname-vector": "Vector",
+	"vector.css": "/* CSS placed here will affect users of the Vector skin */",
+	"vector.js": "/* Any JavaScript here will be loaded for users using the Vector skin */",
+	"vector-action-addsection": "Add topic",
+	"vector-action-delete": "Delete",
+	"vector-action-move": "Move",
+	"vector-action-protect": "Protect",
+	"vector-action-undelete": "Undelete",
+	"vector-action-unprotect": "Change protection",
+	"vector-view-create": "Create",
+	"vector-view-edit": "Edit",
+	"vector-view-history": "View history",
+	"vector-view-view": "Read",
+	"vector-view-viewsource": "View source",
+	"vector-more-actions": "More"
+}
diff --git a/skins/Vector/i18n/qqq.json b/skins/Vector/i18n/qqq.json
new file mode 100644
index 0000000000..ad42fa4cab
--- /dev/null
+++ b/skins/Vector/i18n/qqq.json
@@ -0,0 +1,20 @@
+{
+	"@metadata": {
+		"authors": []
+	},
+	"skinname-vector": "{{optional}}",
+	"vector.css": "{{optional}}",
+	"vector.js": "{{optional}}",
+	"vector-action-addsection": "Used in the Vector skin. See for example {{canonicalurl:Talk:Main_Page|useskin=vector}}",
+	"vector-action-delete": "Used in the Vector skin, as the name of a tab at the top of the page. See for example {{canonicalurl:Main_Page|useskin=vector}}\n\n{{Identical|Delete}}",
+	"vector-action-move": "Used in the Vector skin, on the tabs at the top of the page. See for example {{canonicalurl:Talk:Main_Page|useskin=vector}}\n\n{{Identical|Move}}",
+	"vector-action-protect": "Tab at top of page, in vector skin\n\n{{Identical|Protect}}",
+	"vector-action-undelete": "Tab at top of page, in vector skin.\n{{Identical|Undelete}}",
+	"vector-action-unprotect": "Tab at top of page, in vector skin.\n{{Identical|Change protection}}",
+	"vector-view-create": "Tab label in the Vector skin. See for example {{canonicalurl:Foo|useskin=vector}}\n{{Identical|Create}}",
+	"vector-view-edit": "Tab label in the Vector skin. See for example {{canonicalurl:Main_Page|useskin=vector}}\n{{Identical|Edit}}",
+	"vector-view-history": "Tab label in the Vector skin. See for example {{canonicalurl:Main_Page|useskin=vector}}\n{{Identical|View history}}",
+	"vector-view-view": "Tab label in the Vector skin (verb). See for example {{canonicalurl:Main_Page|useskin=vector}}.\n{{Identical|Read}}",
+	"vector-view-viewsource": "Tab label in the Vector skin.\n{{Identical|View source}}",
+	"vector-more-actions": "Label in the Vector skin's menu for the less-important or rarer actions which are not shown as tabs (like moving the page, or for sysops deleting or protecting the page), as well as (for users with a narrow viewing window in their browser) the less-important tab actions which the user's browser is unable to fit in. {{Identical|More}}"
+}
diff --git a/skins/vector/images/arrow-collapsed-ltr.png b/skins/Vector/images/arrow-collapsed-ltr.png
similarity index 100%
rename from skins/vector/images/arrow-collapsed-ltr.png
rename to skins/Vector/images/arrow-collapsed-ltr.png
diff --git a/skins/vector/images/arrow-collapsed-ltr.svg b/skins/Vector/images/arrow-collapsed-ltr.svg
similarity index 100%
rename from skins/vector/images/arrow-collapsed-ltr.svg
rename to skins/Vector/images/arrow-collapsed-ltr.svg
diff --git a/skins/vector/images/arrow-collapsed-rtl.png b/skins/Vector/images/arrow-collapsed-rtl.png
similarity index 100%
rename from skins/vector/images/arrow-collapsed-rtl.png
rename to skins/Vector/images/arrow-collapsed-rtl.png
diff --git a/skins/vector/images/arrow-collapsed-rtl.svg b/skins/Vector/images/arrow-collapsed-rtl.svg
similarity index 100%
rename from skins/vector/images/arrow-collapsed-rtl.svg
rename to skins/Vector/images/arrow-collapsed-rtl.svg
diff --git a/skins/vector/images/arrow-down-focus-icon.png b/skins/Vector/images/arrow-down-focus-icon.png
similarity index 100%
rename from skins/vector/images/arrow-down-focus-icon.png
rename to skins/Vector/images/arrow-down-focus-icon.png
diff --git a/skins/vector/images/arrow-down-focus-icon.svg b/skins/Vector/images/arrow-down-focus-icon.svg
similarity index 100%
rename from skins/vector/images/arrow-down-focus-icon.svg
rename to skins/Vector/images/arrow-down-focus-icon.svg
diff --git a/skins/vector/images/arrow-down-icon.png b/skins/Vector/images/arrow-down-icon.png
similarity index 100%
rename from skins/vector/images/arrow-down-icon.png
rename to skins/Vector/images/arrow-down-icon.png
diff --git a/skins/vector/images/arrow-down-icon.svg b/skins/Vector/images/arrow-down-icon.svg
similarity index 100%
rename from skins/vector/images/arrow-down-icon.svg
rename to skins/Vector/images/arrow-down-icon.svg
diff --git a/skins/vector/images/arrow-expanded.png b/skins/Vector/images/arrow-expanded.png
similarity index 100%
rename from skins/vector/images/arrow-expanded.png
rename to skins/Vector/images/arrow-expanded.png
diff --git a/skins/vector/images/arrow-expanded.svg b/skins/Vector/images/arrow-expanded.svg
similarity index 100%
rename from skins/vector/images/arrow-expanded.svg
rename to skins/Vector/images/arrow-expanded.svg
diff --git a/skins/vector/images/bullet-icon.png b/skins/Vector/images/bullet-icon.png
similarity index 100%
rename from skins/vector/images/bullet-icon.png
rename to skins/Vector/images/bullet-icon.png
diff --git a/skins/vector/images/external-link-ltr-icon.png b/skins/Vector/images/external-link-ltr-icon.png
similarity index 100%
rename from skins/vector/images/external-link-ltr-icon.png
rename to skins/Vector/images/external-link-ltr-icon.png
diff --git a/skins/vector/images/external-link-ltr-icon.svg b/skins/Vector/images/external-link-ltr-icon.svg
similarity index 100%
rename from skins/vector/images/external-link-ltr-icon.svg
rename to skins/Vector/images/external-link-ltr-icon.svg
diff --git a/skins/vector/images/external-link-rtl-icon.png b/skins/Vector/images/external-link-rtl-icon.png
similarity index 100%
rename from skins/vector/images/external-link-rtl-icon.png
rename to skins/Vector/images/external-link-rtl-icon.png
diff --git a/skins/vector/images/external-link-rtl-icon.svg b/skins/Vector/images/external-link-rtl-icon.svg
similarity index 100%
rename from skins/vector/images/external-link-rtl-icon.svg
rename to skins/Vector/images/external-link-rtl-icon.svg
diff --git a/skins/vector/images/link-icon.png b/skins/Vector/images/link-icon.png
similarity index 100%
rename from skins/vector/images/link-icon.png
rename to skins/Vector/images/link-icon.png
diff --git a/skins/vector/images/magnify-clip.png b/skins/Vector/images/magnify-clip.png
similarity index 100%
rename from skins/vector/images/magnify-clip.png
rename to skins/Vector/images/magnify-clip.png
diff --git a/skins/vector/images/page-fade.png b/skins/Vector/images/page-fade.png
similarity index 100%
rename from skins/vector/images/page-fade.png
rename to skins/Vector/images/page-fade.png
diff --git a/skins/vector/images/portal-break-ltr.png b/skins/Vector/images/portal-break-ltr.png
similarity index 100%
rename from skins/vector/images/portal-break-ltr.png
rename to skins/Vector/images/portal-break-ltr.png
diff --git a/skins/vector/images/portal-break-rtl.png b/skins/Vector/images/portal-break-rtl.png
similarity index 100%
rename from skins/vector/images/portal-break-rtl.png
rename to skins/Vector/images/portal-break-rtl.png
diff --git a/skins/vector/images/portal-break.png b/skins/Vector/images/portal-break.png
similarity index 100%
rename from skins/vector/images/portal-break.png
rename to skins/Vector/images/portal-break.png
diff --git a/skins/vector/images/preferences/break.png b/skins/Vector/images/preferences/break.png
similarity index 100%
rename from skins/vector/images/preferences/break.png
rename to skins/Vector/images/preferences/break.png
diff --git a/skins/vector/images/preferences/fade.png b/skins/Vector/images/preferences/fade.png
similarity index 100%
rename from skins/vector/images/preferences/fade.png
rename to skins/Vector/images/preferences/fade.png
diff --git a/skins/vector/images/search-fade.png b/skins/Vector/images/search-fade.png
similarity index 100%
rename from skins/vector/images/search-fade.png
rename to skins/Vector/images/search-fade.png
diff --git a/skins/vector/images/search-ltr.png b/skins/Vector/images/search-ltr.png
similarity index 100%
rename from skins/vector/images/search-ltr.png
rename to skins/Vector/images/search-ltr.png
diff --git a/skins/vector/images/search-ltr.svg b/skins/Vector/images/search-ltr.svg
similarity index 100%
rename from skins/vector/images/search-ltr.svg
rename to skins/Vector/images/search-ltr.svg
diff --git a/skins/vector/images/search-rtl.png b/skins/Vector/images/search-rtl.png
similarity index 100%
rename from skins/vector/images/search-rtl.png
rename to skins/Vector/images/search-rtl.png
diff --git a/skins/vector/images/search-rtl.svg b/skins/Vector/images/search-rtl.svg
similarity index 100%
rename from skins/vector/images/search-rtl.svg
rename to skins/Vector/images/search-rtl.svg
diff --git a/skins/vector/images/tab-break.png b/skins/Vector/images/tab-break.png
similarity index 100%
rename from skins/vector/images/tab-break.png
rename to skins/Vector/images/tab-break.png
diff --git a/skins/vector/images/tab-current-fade.png b/skins/Vector/images/tab-current-fade.png
similarity index 100%
rename from skins/vector/images/tab-current-fade.png
rename to skins/Vector/images/tab-current-fade.png
diff --git a/skins/vector/images/tab-normal-fade.png b/skins/Vector/images/tab-normal-fade.png
similarity index 100%
rename from skins/vector/images/tab-normal-fade.png
rename to skins/Vector/images/tab-normal-fade.png
diff --git a/skins/vector/images/unwatch-icon-hl.png b/skins/Vector/images/unwatch-icon-hl.png
similarity index 100%
rename from skins/vector/images/unwatch-icon-hl.png
rename to skins/Vector/images/unwatch-icon-hl.png
diff --git a/skins/vector/images/unwatch-icon-hl.svg b/skins/Vector/images/unwatch-icon-hl.svg
similarity index 100%
rename from skins/vector/images/unwatch-icon-hl.svg
rename to skins/Vector/images/unwatch-icon-hl.svg
diff --git a/skins/vector/images/unwatch-icon.png b/skins/Vector/images/unwatch-icon.png
similarity index 100%
rename from skins/vector/images/unwatch-icon.png
rename to skins/Vector/images/unwatch-icon.png
diff --git a/skins/vector/images/unwatch-icon.svg b/skins/Vector/images/unwatch-icon.svg
similarity index 100%
rename from skins/vector/images/unwatch-icon.svg
rename to skins/Vector/images/unwatch-icon.svg
diff --git a/skins/vector/images/user-icon.png b/skins/Vector/images/user-icon.png
similarity index 100%
rename from skins/vector/images/user-icon.png
rename to skins/Vector/images/user-icon.png
diff --git a/skins/vector/images/user-icon.svg b/skins/Vector/images/user-icon.svg
similarity index 100%
rename from skins/vector/images/user-icon.svg
rename to skins/Vector/images/user-icon.svg
diff --git a/skins/vector/images/watch-icon-hl.png b/skins/Vector/images/watch-icon-hl.png
similarity index 100%
rename from skins/vector/images/watch-icon-hl.png
rename to skins/Vector/images/watch-icon-hl.png
diff --git a/skins/vector/images/watch-icon-hl.svg b/skins/Vector/images/watch-icon-hl.svg
similarity index 100%
rename from skins/vector/images/watch-icon-hl.svg
rename to skins/Vector/images/watch-icon-hl.svg
diff --git a/skins/vector/images/watch-icon-loading.png b/skins/Vector/images/watch-icon-loading.png
similarity index 100%
rename from skins/vector/images/watch-icon-loading.png
rename to skins/Vector/images/watch-icon-loading.png
diff --git a/skins/vector/images/watch-icon-loading.svg b/skins/Vector/images/watch-icon-loading.svg
similarity index 100%
rename from skins/vector/images/watch-icon-loading.svg
rename to skins/Vector/images/watch-icon-loading.svg
diff --git a/skins/vector/images/watch-icon.png b/skins/Vector/images/watch-icon.png
similarity index 100%
rename from skins/vector/images/watch-icon.png
rename to skins/Vector/images/watch-icon.png
diff --git a/skins/vector/images/watch-icon.svg b/skins/Vector/images/watch-icon.svg
similarity index 100%
rename from skins/vector/images/watch-icon.svg
rename to skins/Vector/images/watch-icon.svg
diff --git a/skins/vector/screen-hd.less b/skins/Vector/screen-hd.less
similarity index 100%
rename from skins/vector/screen-hd.less
rename to skins/Vector/screen-hd.less
diff --git a/skins/vector/screen.less b/skins/Vector/screen.less
similarity index 100%
rename from skins/vector/screen.less
rename to skins/Vector/screen.less
diff --git a/skins/vector/special.less b/skins/Vector/special.less
similarity index 100%
rename from skins/vector/special.less
rename to skins/Vector/special.less
diff --git a/skins/vector/special.preferences.less b/skins/Vector/special.preferences.less
similarity index 100%
rename from skins/vector/special.preferences.less
rename to skins/Vector/special.preferences.less
diff --git a/skins/vector/variables.less b/skins/Vector/variables.less
similarity index 100%
rename from skins/vector/variables.less
rename to skins/Vector/variables.less
diff --git a/skins/vector/vector.js b/skins/Vector/vector.js
similarity index 100%
rename from skins/vector/vector.js
rename to skins/Vector/vector.js
-- 
2.20.1