From: MatmaRex <matma.rex@gmail.com>
Date: Fri, 15 Mar 2013 20:10:08 +0000 (+0100)
Subject: jquery.makeCollapsible: add plainMode support
X-Git-Tag: 1.31.0-rc.0~20323^2
X-Git-Url: http://git.cyclocoop.org/%22%20.%20generer_url_ecrire%28%22calendrier%22%2C%22type=semaine%22%29%20.%20%22?a=commitdiff_plain;h=df93eedd8b9ed9b71e4b16a9afec40763f1bb418;p=lhc%2Fweb%2Fwiklou.git

jquery.makeCollapsible: add plainMode support

When .makeCollapsible() is used on a <ol>/<ul> list, the toggler is
inserted as the zeroth list item and clicking is causes all the other
list items to be hidden separately, one by one.

This hiding behavior is applied even when using custom togglers placed
outside of the list. This has some pretty serious performance
considerations when applied to large lists or tables (more than
~25 items/rows).

Enter plainMode. In combination with custom togglers, it makes all
types of elements to be treated the same and hidden/shown as a whole.

Change-Id: Idd9429b20d70741af72657feef26e1c95c76d51f
---

diff --git a/resources/jquery/jquery.makeCollapsible.js b/resources/jquery/jquery.makeCollapsible.js
index def2c60c6e..e8e59d006a 100644
--- a/resources/jquery/jquery.makeCollapsible.js
+++ b/resources/jquery/jquery.makeCollapsible.js
@@ -49,7 +49,7 @@
 
 		// Handle different kinds of elements
 
-		if ( $collapsible.is( 'table' ) ) {
+		if ( !options.plainMode && $collapsible.is( 'table' ) ) {
 			// Tables
 			$containers = $collapsible.find( '> tbody > tr' );
 			if ( $defaultToggle ) {
@@ -70,7 +70,7 @@
 				$containers.stop( true, true ).fadeIn();
 			}
 
-		} else if ( $collapsible.is( 'ul' ) || $collapsible.is( 'ol' ) ) {
+		} else if ( !options.plainMode && ( $collapsible.is( 'ul' ) || $collapsible.is( 'ol' ) ) ) {
 			// Lists
 			$containers = $collapsible.find( '> li' );
 			if ( $defaultToggle ) {
@@ -93,7 +93,7 @@
 			$collapsibleContent = $collapsible.find( '> .mw-collapsible-content' );
 
 			// If a collapsible-content is defined, act on it
-			if ( $collapsibleContent.length ) {
+			if ( !options.plainMode && $collapsibleContent.length ) {
 				if ( action === 'collapse' ) {
 					if ( options.instantHide ) {
 						$collapsibleContent.hide();
@@ -236,6 +236,11 @@
 	 *   for this collapsible element. By default, if the collapsible element
 	 *   has an id attribute like 'mw-customcollapsible-XXX', elements with a
 	 *   *class* of 'mw-customtoggle-XXX' are made togglers for it.
+	 * - plainMode: boolean, whether to use a "plain mode" when making the
+	 *   element collapsible - that is, hide entire tables and lists (instead
+	 *   of hiding only all rows but first of tables, and hiding each list
+	 *   item separately for lists) and don't wrap other elements in
+	 *   div.mw-collapsible-content. May only be used with custom togglers.
 	 */
 	$.fn.makeCollapsible = function ( options ) {
 		return this.each(function () {