Wikipedia:Administradores de interfaz/Tablón de solicitudes/Archivos/2024/03

Modificar las tablas plegables en MediaWiki:Common.js[editar]

Asunto

Desde hace años existe la clase mw-collapsible en el código de MediaWiki para permitir la creación de tablas plegables; sin embargo, en el common.js local se utiliza un pequeño script que no hace uso de ella. Además, existe el problema de que se ejecuta dos veces, apareciendo más botones, cuando se combina con accesorios como XTools. Por tanto, propongo sustituir el código entre las líneas 163 y 261 por el siguiente, tomado de en.wiki. De esta forma se sustituirán los usos de collapsible por mw-collapsible.

Código

	/**
	 * Collapsible tables; reimplemented with mw-collapsible
	 * Styling is also in place to avoid FOUC
	 *
	 * Allows tables to be collapsed, showing only the header. See [[Help:Collapsing]].
	 * @version 3.0.0 (2018-05-20)
	 * @source https://www.mediawiki.org/wiki/MediaWiki:Gadget-collapsibleTables.js
	 * @author [[User:R. Koot]]
	 * @author [[User:Krinkle]]
	 * @author [[User:TheDJ]]
	 * @deprecated Since MediaWiki 1.20: Use class="mw-collapsible" instead which
	 * is supported in MediaWiki core. Shimmable since MediaWiki 1.32
	 *
	 * @param {jQuery} $content
	 */
	function makeCollapsibleMwCollapsible( $content ) {
		var $tables = $content
			.find( 'table.collapsible:not(.mw-collapsible)' )
			.addClass( 'mw-collapsible' );

		$.each( $tables, function ( index, table ) {
			if ( $( table ).hasClass( 'collapsed' ) ) {
				$( table ).addClass( 'mw-collapsed' );
			}
		} );
		if ( $tables.length > 0 ) {
			mw.loader.using( 'jquery.makeCollapsible' ).then( function () {
				$tables.makeCollapsible();
			} );
		}
	}
	mw.hook( 'wikipage.content' ).add( makeCollapsibleMwCollapsible );

	/**
	 * Add support to mw-collapsible for autocollapse, innercollapse and outercollapse
	 *
	 * Maintainers: TheDJ
	 */
	function mwCollapsibleSetup( $collapsibleContent ) {
		var $element,
			$toggle,
			autoCollapseThreshold = 2;
		$.each( $collapsibleContent, function ( index, element ) {
			$element = $( element );
			if ( $element.hasClass( 'collapsible' ) ) {
				$element.find( 'tr:first > th:first' ).prepend( $element.find( 'tr:first > * > .mw-collapsible-toggle' ) );
			}
			if ( $collapsibleContent.length >= autoCollapseThreshold && $element.hasClass( 'autocollapse' ) ) {
				$element.data( 'mw-collapsible' ).collapse();
			} else if ( $element.hasClass( 'innercollapse' ) ) {
				if ( $element.parents( '.outercollapse' ).length > 0 ) {
					$element.data( 'mw-collapsible' ).collapse();
				}
			}
			// because of colored backgrounds, style the link in the text color
			// to ensure accessible contrast
			$toggle = $element.find( '.mw-collapsible-toggle' );
			if ( $toggle.length ) {
				// Make the toggle inherit text color (Updated for T333357 2023-04-29)
				if ( $toggle.parent()[ 0 ].style.color ) {
					$toggle.css( 'color', 'inherit' );
					$toggle.find( '.mw-collapsible-text' ).css( 'color', 'inherit' );
				}
			}
		} );
	}

	mw.hook( 'wikipage.collapsibleContent' ).add( mwCollapsibleSetup );

Como pequeño detalle, así se añadiría también la posibilidad de usar las clases innercollapse y outercollapse.

Usuario que lo solicita

sasha 23:00 26 mar 2024 (UTC)

Comentarios

@-sasha-, @Ezarate, parece que os ha faltado el estilo CSS, porque los textos «[mostrar]» y «[ocultar]» ahora en ciertos casos se ven en negrita (podéis ver un ejemplo en el código plegado de este mismo hilo). Además se ve con el mismo tamaño de texto que el elemento que oculta, que en algunos casos será demasiado grande y en otros demasiado pequeño, por lo que sugiero agregar el estilo font-size: small; para uniformar su tamaño en cualquier caso. -- Leoncastro (discusión) 13:25 27 mar 2024 (UTC)

@Leoncastro: Me indicas bien donde agregar esa línea y lo hago en breve. Gracias!!! Esteban (discusión) 15:28 27 mar 2024 (UTC)

@Ezarate: Sería añadir esto a Common.css:

/* Styling for jQuery makeCollapsible, matching that of collapseButton */
.mw-parser-output .mw-collapsible-toggle:not(.mw-ui-button) {
	font-weight: normal;
    font-size: small;
	padding-right: 0.2em;
	padding-left: 0.2em;
}

.mw-collapsible-leftside-toggle .mw-collapsible-toggle {
	/* @noflip */
	float: left;
}

sasha 16:25 27 mar 2024 (UTC)

Por cierto, @-sasha- y @Ezarate, se ha perdido la retrocompatibilidad con la antigua clase collapsed, por lo que sus usos directos o mediante plantillas como {{Ocultar}} ya no funcionan correctamente. Me temo que pueden ser miles de casos. El antiguo código funcionaba en cualquier elemento (según mw:Manual:Collapsible_elements#Simple), mientras que el nuevo está restringido al uso de tablas (que por cierto, no es lo más óptimo). -- Leoncastro (discusión) 19:04 27 mar 2024 (UTC)

@Ezarate, por favor, restaura estas dos líneas borradas, collapseCaption y expandCaption, justo antes de la línea 232 (NavigationBarHide) del actual Common.js para que no cause error. Gracias. -- Leoncastro (discusión) 19:15 27 mar 2024 (UTC)

@Ezarate, fíjate que las dos líneas que agregaste a Commons.css, te pedí agregarlas a MediaWiki:Common.js; así es normal que esté dando errores. -- Leoncastro (discusión) 01:18 28 mar 2024 (UTC)

Respuesta

Hecho Fijate si quedo ok Esteban (discusión) 23:31 26 mar 2024 (UTC)

Hecho Está dando errores el código, posiblemente haya que revertir todo Esteban (discusión) 23:05 27 mar 2024 (UTC)