* New file mediawiki.toc.js without global function.
* Keep minimal function mediaWiki.util.toggleToc() for compatibility.
* Mark mediaWiki.util.toggleToc() as deprecated.
* Adapt mediawiki.util.test.js.
* Add new file mediawiki.toc.test.js.
* Solves bug 60030 and allow multiple toc.
Bug: 60030
Change-Id: I3ca2acb70db98d00e3f1bd2227091bd32d8e18a5
),
'targets' => array( 'desktop', 'mobile' ),
),
+ 'mediawiki.toc' => array(
+ 'scripts' => 'resources/mediawiki/mediawiki.toc.js',
+ 'dependencies' => array(
+ 'jquery.cookie',
+ ),
+ 'messages' => array( 'showtoc', 'hidetoc' ),
+ 'targets' => array( 'desktop', 'mobile' ),
+ ),
'mediawiki.Uri' => array(
'scripts' => 'resources/mediawiki/mediawiki.Uri.js',
'targets' => array( 'desktop', 'mobile' ),
'scripts' => 'resources/mediawiki/mediawiki.util.js',
'dependencies' => array(
'jquery.client',
- 'jquery.cookie',
'jquery.mwExtension',
'mediawiki.notify',
+ 'mediawiki.toc',
),
- 'messages' => array( 'showtoc', 'hidetoc' ),
'position' => 'top', // For $wgPreloadJavaScriptMwUtil
'targets' => array( 'desktop', 'mobile' ),
),
--- /dev/null
+( function ( mw, $ ) {
+ 'use strict';
+
+ // Table of contents toggle
+ mw.hook( 'wikipage.content' ).add( function ( $content ) {
+
+ /**
+ * Hide/show the table of contents element
+ *
+ * @param {jQuery} $toggleLink A jQuery object of the toggle link.
+ */
+ function toggleToc( $toggleLink ) {
+ var $tocList = $content.find( '#toc ul:first' );
+
+ // This function shouldn't be called if there's no TOC,
+ // but just in case...
+ if ( $tocList.length ) {
+ if ( $tocList.is( ':hidden' ) ) {
+ $tocList.slideDown( 'fast' );
+ $toggleLink.text( mw.msg( 'hidetoc' ) );
+ $content.find( '#toc' ).removeClass( 'tochidden' );
+ $.cookie( 'mw_hidetoc', null, {
+ expires: 30,
+ path: '/'
+ } );
+ } else {
+ $tocList.slideUp( 'fast' );
+ $toggleLink.text( mw.msg( 'showtoc' ) );
+ $content.find( '#toc' ).addClass( 'tochidden' );
+ $.cookie( 'mw_hidetoc', '1', {
+ expires: 30,
+ path: '/'
+ } );
+ }
+ }
+ }
+
+ var $tocTitle, $tocToggleLink, hideTocCookie;
+ $tocTitle = $content.find( '#toctitle' );
+ $tocToggleLink = $content.find( '#togglelink' );
+ // Only add it if there is a TOC and there is no toggle added already
+ if ( $content.find( '#toc' ).length && $tocTitle.length && !$tocToggleLink.length ) {
+ hideTocCookie = $.cookie( 'mw_hidetoc' );
+ $tocToggleLink = $( '<a href="#" class="internal" id="togglelink"></a>' )
+ .text( mw.msg( 'hidetoc' ) )
+ .click( function ( e ) {
+ e.preventDefault();
+ toggleToc( $( this ) );
+ } );
+ $tocTitle.append(
+ $tocToggleLink
+ .wrap( '<span class="toctoggle"></span>' )
+ .parent()
+ .prepend( ' [' )
+ .append( '] ' )
+ );
+
+ if ( hideTocCookie === '1' ) {
+ toggleToc( $tocToggleLink );
+ }
+ }
+ } );
+
+}( mediaWiki, jQuery ) );
// Make sure we don't unset util.$content if it was preset and we don't find anything
return util.$content;
} )();
-
- // Table of contents toggle
- mw.hook( 'wikipage.content' ).add( function ( $content ) {
- var $tocTitle, $tocToggleLink, hideTocCookie;
- $tocTitle = $content.find( '#toctitle' );
- $tocToggleLink = $content.find( '#togglelink' );
- // Only add it if there is a TOC and there is no toggle added already
- if ( $content.find( '#toc' ).length && $tocTitle.length && !$tocToggleLink.length ) {
- hideTocCookie = $.cookie( 'mw_hidetoc' );
- $tocToggleLink = $( '<a href="#" class="internal" id="togglelink"></a>' )
- .text( mw.msg( 'hidetoc' ) )
- .click( function ( e ) {
- e.preventDefault();
- util.toggleToc( $( this ) );
- } );
- $tocTitle.append(
- $tocToggleLink
- .wrap( '<span class="toctoggle"></span>' )
- .parent()
- .prepend( ' [' )
- .append( '] ' )
- );
-
- if ( hideTocCookie === '1' ) {
- util.toggleToc( $tocToggleLink );
- }
- }
- } );
},
/* Main body */
* completed (including the animation).
* @return {Mixed} Boolean visibility of the toc (true if it's visible)
* or Null if there was no table of contents.
+ * @deprecated since 1.23 Use jQuery
*/
toggleToc: function ( $toggleLink, callback ) {
- var $tocList = $( '#toc ul:first' );
+ var ret, $tocList = $( '#toc ul:first' );
// This function shouldn't be called if there's no TOC,
// but just in case...
- if ( $tocList.length ) {
- if ( $tocList.is( ':hidden' ) ) {
- $tocList.slideDown( 'fast', callback );
- $toggleLink.text( mw.msg( 'hidetoc' ) );
- $( '#toc' ).removeClass( 'tochidden' );
- $.cookie( 'mw_hidetoc', null, {
- expires: 30,
- path: '/'
- } );
- return true;
- } else {
- $tocList.slideUp( 'fast', callback );
- $toggleLink.text( mw.msg( 'showtoc' ) );
- $( '#toc' ).addClass( 'tochidden' );
- $.cookie( 'mw_hidetoc', '1', {
- expires: 30,
- path: '/'
- } );
- return false;
- }
- } else {
+ if ( !$tocList.length ) {
return null;
}
+ ret = $tocList.is( ':hidden' );
+ $toggleLink.click();
+ $tocList.promise().done( callback );
+ return ret;
},
/**
'tests/qunit/suites/resources/mediawiki/mediawiki.jscompat.test.js',
'tests/qunit/suites/resources/mediawiki/mediawiki.test.js',
'tests/qunit/suites/resources/mediawiki/mediawiki.Title.test.js',
+ 'tests/qunit/suites/resources/mediawiki/mediawiki.toc.test.js',
'tests/qunit/suites/resources/mediawiki/mediawiki.Uri.test.js',
'tests/qunit/suites/resources/mediawiki/mediawiki.user.test.js',
'tests/qunit/suites/resources/mediawiki/mediawiki.util.test.js',
--- /dev/null
+( function ( mw, $ ) {
+ QUnit.module( 'mediawiki.toc', QUnit.newMwEnvironment() );
+
+ QUnit.asyncTest( 'toggleToc', 4, function ( assert ) {
+ var tocHtml, $toggleLink, $tocList;
+
+ function actionC() {
+ QUnit.start();
+ }
+
+ function actionB() {
+ assert.strictEqual( $tocList.is( ':hidden' ), true, 'Return boolean true if the TOC is now visible.' );
+ $toggleLink.click();
+ $tocList.promise().done( actionC );
+ }
+
+ function actionA() {
+ assert.strictEqual( $tocList.is( ':hidden' ), false, 'Return boolean false if the TOC is now hidden.' );
+ $toggleLink.click();
+ $tocList.promise().done( actionB );
+ }
+
+ assert.strictEqual( $( '#toc' ).length, 0, 'Return 0 if there is no table of contents on the page.' );
+
+ tocHtml = '<div id="toc" class="toc">' +
+ '<div id="toctitle">' +
+ '<h2>Contents</h2>' +
+ '</div>' +
+ '<ul><li></li></ul>' +
+ '</div>';
+ $( tocHtml ).appendTo( '#qunit-fixture' );
+ mw.hook( 'wikipage.content' ).fire( $( '#qunit-fixture' ) );
+ $tocList = $( '#toc ul:first' );
+ $toggleLink = $( '#togglelink' );
+
+ assert.strictEqual( $toggleLink.length, 1, 'Toggle link is appended to the page.' );
+
+ actionA();
+ } );
+}( mediaWiki, jQuery ) );
tocHtml = '<div id="toc" class="toc">' +
'<div id="toctitle">' +
'<h2>Contents</h2>' +
- '<span class="toctoggle"> [<a href="#" class="internal" id="togglelink">Hide</a> ]</span>' +
'</div>' +
'<ul><li></li></ul>' +
'</div>';
$( tocHtml ).appendTo( '#qunit-fixture' );
+ mw.hook( 'wikipage.content' ).fire( $( '#qunit-fixture' ) );
$toggleLink = $( '#togglelink' );
assert.strictEqual( $toggleLink.length, 1, 'Toggle link is appended to the page.' );