Bmansurov has uploaded a new change for review.
https://gerrit.wikimedia.org/r/313628
Change subject: WIP: Beta: use TOC from core
......................................................................
WIP: Beta: use TOC from core
This allows us to:
* get rid of the custom TOC in MF, thus reducing tech debt and
bytes shipped to users, among other benefits;
* get rid of section collapsing, thus improving site performance
with fewer reflows and front end computations; searching text in
a page will also be possible if sections are collapsed;
* create a floating TOC for JS capable browsers;
This change also shows the TOC for non JS browsers and small
mobile devices.
Change-Id: I57ed56421b842e82652a9970329026f66eacdecb
---
M extension.json
M includes/MobileFrontend.body.php
M includes/MobileFrontend.hooks.php
A resources/mobile.toc.beta/TableOfContentsOverlay.js
A resources/mobile.toc.beta/toc.less
M resources/skins.minerva.base.styles/common.less
A resources/skins.minerva.beta.scripts/toc.js
7 files changed, 84 insertions(+), 5 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/MobileFrontend
refs/changes/28/313628/1
diff --git a/extension.json b/extension.json
index d03ccc9..41626cf 100644
--- a/extension.json
+++ b/extension.json
@@ -535,6 +535,28 @@
"toc"
]
},
+ "mobile.toc.beta": {
+ "targets": [
+ "mobile",
+ "desktop"
+ ],
+ "dependencies": [
+ "mobile.overlays",
+ "mobile.toc.images"
+ ],
+ "scripts": [
+
"resources/mobile.toc.beta/TableOfContentsOverlay.js"
+ ],
+ "styles": [
+ "resources/mobile.toc.beta/toc.less"
+ ],
+ "templates": {
+ "toc.hogan":
"resources/mobile.toc.beta/tocButton.hogan"
+ },
+ "messages": [
+ "toc"
+ ]
+ },
"mobile.ajax": {
"targets": [
"mobile",
@@ -1770,10 +1792,12 @@
"skins.minerva.scripts",
"mobile.settings",
"mobile.foreignApi",
- "mobile.backtotop"
+ "mobile.backtotop",
+ "mobile.toc.beta"
],
"scripts": [
-
"resources/skins.minerva.beta.scripts/fontchanger.js"
+
"resources/skins.minerva.beta.scripts/fontchanger.js",
+ "resources/skins.minerva.beta.scripts/toc.js"
],
"messages": [
"mobile-frontend-commons-category-view"
diff --git a/includes/MobileFrontend.body.php b/includes/MobileFrontend.body.php
index 83745f7..af45ada 100644
--- a/includes/MobileFrontend.body.php
+++ b/includes/MobileFrontend.body.php
@@ -43,7 +43,8 @@
// and the MFTOC flag has been set (which means the page
originally had a table of contents)
$includeTOC = $out->getProperty( 'MFTOC' ) && $ns === NS_MAIN;
$formatter = MobileFormatter::newFromContext( $context, $html );
- $formatter->enableTOCPlaceholder( $includeTOC );
+ // Enable TOC placeholder only in stable
+ $formatter->enableTOCPlaceholder( $includeTOC &&
!$context->isBetaGroupMember() );
Hooks::run( 'MobileFrontendBeforeDOM', [ $context, $formatter ]
);
diff --git a/includes/MobileFrontend.hooks.php
b/includes/MobileFrontend.hooks.php
index 34f1dd7..b937c59 100644
--- a/includes/MobileFrontend.hooks.php
+++ b/includes/MobileFrontend.hooks.php
@@ -1240,7 +1240,7 @@
/**
* OutputPageParserOutput hook handler
- * Disables TOC in output before it grabs HTML
+ * In stable, disables TOC in output before it grabs HTML
* @see
https://www.mediawiki.org/wiki/Manual:Hooks/OutputPageParserOutput
*
* @param OutputPage $outputPage
@@ -1251,7 +1251,7 @@
$context = MobileContext::singleton();
if ( $context->shouldDisplayMobileView() ) {
- $outputPage->enableTOC( false );
+ $outputPage->enableTOC( $context->isBetaGroupMember() );
$outputPage->setProperty( 'MFTOC', $po->getTOCHTML()
!== '' );
if ( $context->shouldShowWikibaseDescriptions(
'tagline' ) ) {
diff --git a/resources/mobile.toc.beta/TableOfContentsOverlay.js
b/resources/mobile.toc.beta/TableOfContentsOverlay.js
new file mode 100644
index 0000000..3e37c66
--- /dev/null
+++ b/resources/mobile.toc.beta/TableOfContentsOverlay.js
@@ -0,0 +1,28 @@
+( function ( M, $ ) {
+ var Overlay = M.require( 'mobile.overlays/Overlay' ),
+ $toc = $( '#toc' );
+
+ /**
+ * Table of Contents overlay
+ * @class TableOfContentsOverlay
+ * @extends Overlay
+ */
+ function TableOfContentsOverlay( $toc ) {
+ Overlay.apply( this, arguments );
+ }
+
+ OO.mfExtend( TableOfContentsOverlay, Overlay, {
+ shouldRemoveOnHide: false,
+ className: 'overlay pointer-overlay toc-overlay',
+ /** @inheritdoc */
+ postRender: function () {
+ this.$( '.overlay-content' ).append( this.options.$toc
);
+ },
+ onExit: function ( ev ) {
+ this.hide();
+ }
+ } );
+
+ M.define( 'mobile.toc.beta/TableOfContentsOverlay',
TableOfContentsOverlay );
+
+}( mw.mobileFrontend, jQuery ) );
diff --git a/resources/mobile.toc.beta/toc.less
b/resources/mobile.toc.beta/toc.less
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/resources/mobile.toc.beta/toc.less
diff --git a/resources/skins.minerva.base.styles/common.less
b/resources/skins.minerva.base.styles/common.less
index 1ed48a5..85451da 100644
--- a/resources/skins.minerva.base.styles/common.less
+++ b/resources/skins.minerva.base.styles/common.less
@@ -51,6 +51,17 @@
resize: none;
}
+// TOC from core in beta
+#toc {
+ // FIXME: prevent `mediawiki.toc` from loading or make it work better
on mobile
+ .toctoggle {
+ display: none;
+ }
+ ul {
+ list-style: none;
+ }
+}
+
// We hide the table of contents unless the user is viewing in tablet
resolution or higher
.toc-mobile,
// We also need a more specific rule for tablet non-JS users who will load
skins.minerva.tablet.styles
diff --git a/resources/skins.minerva.beta.scripts/toc.js
b/resources/skins.minerva.beta.scripts/toc.js
new file mode 100644
index 0000000..7bbe69c
--- /dev/null
+++ b/resources/skins.minerva.beta.scripts/toc.js
@@ -0,0 +1,15 @@
+( function ( M, $ ) {
+ var TableOfContentsOverlay = M.require(
'mobile.toc.beta/TableOfContentsOverlay' ),
+ $toc = $( '#toc' ).find( 'ul' ),
+ $tocButton = $( '<a id="toc-button">Floating TOC</a>' );
+
+ $( function () {
+ $tocButton.on( 'click', function () {
+ new TableOfContentsOverlay( {
+ $toc: $toc.clone()
+ } ).show();
+ } );
+ $( '#content' ).append( $tocButton );
+ } );
+
+}( mw.mobileFrontend, jQuery ) );
--
To view, visit https://gerrit.wikimedia.org/r/313628
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I57ed56421b842e82652a9970329026f66eacdecb
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/MobileFrontend
Gerrit-Branch: master
Gerrit-Owner: Bmansurov <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits