Toggle menu
Toggle preferences menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.

MediaWiki:Citizen.js: Difference between revisions

MediaWiki interface page
Toggle apri/chiudi indice + rail-move
Default chiuso su TOC lunga + persistenza
 
Line 2: Line 2:


/* Indice d'archivio:
/* Indice d'archivio:
   1) dove esiste il rail di Citizen (pagine con sezioni) lo mettiamo lì, SOPRA
   1) dove esiste il rail di Citizen lo mettiamo lì SOPRA la TOC nativa (riuso);
      la TOC nativa (che riusiamo); dove il rail non esiste l'indice resta una
      dove il rail non c'è, l'indice resta flottante (.ai-rail) e non sparisce.
      colonna flottante (.ai-rail) e non sparisce.
   2) collassabile (chevron nella testata). Stato iniziale:
   2) il box è collassabile (toggle "Indice"): su pagine con TOC lunga si chiude
        - se l'utente ha già scelto, si ricorda (localStorage);
      l'indice e si tiene la TOC. La testata (link alla Dashboard) resta sempre. */
        - altrimenti default intelligente: chiuso se la TOC della pagina è lunga.
  3) la testata (link alla Dashboard) resta sempre visibile. */
mw.hook( 'wikipage.content' ).add( function () {
mw.hook( 'wikipage.content' ).add( function () {
var box = document.querySelector( '.archivio-indice.ai-rail' );
var KEY = 'ce-indice-collapsed';
if ( box ) {
 
// 1) posizionamento
var floatBox = document.querySelector( '.archivio-indice.ai-rail' );
if ( floatBox ) {
var rail =
var rail =
document.querySelector( '.citizen-page-sidebar' ) ||
document.querySelector( '.citizen-page-sidebar' ) ||
Line 15: Line 19:
document.querySelector( '.citizen-toc-container' );
document.querySelector( '.citizen-toc-container' );
if ( rail ) {
if ( rail ) {
box.classList.remove( 'ai-rail' );
floatBox.classList.remove( 'ai-rail' );
box.classList.add( 'ai-in-rail' );
floatBox.classList.add( 'ai-in-rail' );
rail.prepend( box );
rail.prepend( floatBox );
}
}
}
}


// Toggle apri/chiudi
var idx = document.querySelector( '.archivio-indice' );
if ( !idx ) {
return;
}
 
// 2) stato iniziale
var saved = null;
try {
saved = localStorage.getItem( KEY );
} catch ( e ) {}
var tocCount = document.querySelectorAll( '.citizen-toc-link' ).length;
var collapsed = ( saved === null ) ? ( tocCount > 8 ) : ( saved === '1' );
if ( collapsed ) {
idx.classList.add( 'ai-collapsed' );
}
 
// 3) toggle + persistenza
document.querySelectorAll( '.archivio-indice .ai-toggle' ).forEach( function ( t ) {
document.querySelectorAll( '.archivio-indice .ai-toggle' ).forEach( function ( t ) {
if ( t.dataset.bound ) {
if ( t.dataset.bound ) {
Line 27: Line 47:
}
}
t.dataset.bound = '1';
t.dataset.bound = '1';
var toggle = function () {
var act = function () {
t.closest( '.archivio-indice' ).classList.toggle( 'ai-collapsed' );
var b = t.closest( '.archivio-indice' );
b.classList.toggle( 'ai-collapsed' );
try {
localStorage.setItem( KEY, b.classList.contains( 'ai-collapsed' ) ? '1' : '0' );
} catch ( e ) {}
};
};
t.addEventListener( 'click', toggle );
t.addEventListener( 'click', act );
t.addEventListener( 'keydown', function ( e ) {
t.addEventListener( 'keydown', function ( e ) {
if ( e.key === 'Enter' || e.key === ' ' ) {
if ( e.key === 'Enter' || e.key === ' ' ) {
e.preventDefault();
e.preventDefault();
toggle();
act();
}
}
} );
} );
} );
} );
} );
} );

Latest revision as of 20:47, 15 June 2026

/* All JavaScript here will be loaded for users of the Citizen skin */

/* Indice d'archivio:
   1) dove esiste il rail di Citizen lo mettiamo lì SOPRA la TOC nativa (riuso);
      dove il rail non c'è, l'indice resta flottante (.ai-rail) e non sparisce.
   2) collassabile (chevron nella testata). Stato iniziale:
        - se l'utente ha già scelto, si ricorda (localStorage);
        - altrimenti default intelligente: chiuso se la TOC della pagina è lunga.
   3) la testata (link alla Dashboard) resta sempre visibile. */
mw.hook( 'wikipage.content' ).add( function () {
	var KEY = 'ce-indice-collapsed';

	// 1) posizionamento
	var floatBox = document.querySelector( '.archivio-indice.ai-rail' );
	if ( floatBox ) {
		var rail =
			document.querySelector( '.citizen-page-sidebar' ) ||
			document.querySelector( '.citizen-sidebar' ) ||
			document.querySelector( '.citizen-toc-container' );
		if ( rail ) {
			floatBox.classList.remove( 'ai-rail' );
			floatBox.classList.add( 'ai-in-rail' );
			rail.prepend( floatBox );
		}
	}

	var idx = document.querySelector( '.archivio-indice' );
	if ( !idx ) {
		return;
	}

	// 2) stato iniziale
	var saved = null;
	try {
		saved = localStorage.getItem( KEY );
	} catch ( e ) {}
	var tocCount = document.querySelectorAll( '.citizen-toc-link' ).length;
	var collapsed = ( saved === null ) ? ( tocCount > 8 ) : ( saved === '1' );
	if ( collapsed ) {
		idx.classList.add( 'ai-collapsed' );
	}

	// 3) toggle + persistenza
	document.querySelectorAll( '.archivio-indice .ai-toggle' ).forEach( function ( t ) {
		if ( t.dataset.bound ) {
			return;
		}
		t.dataset.bound = '1';
		var act = function () {
			var b = t.closest( '.archivio-indice' );
			b.classList.toggle( 'ai-collapsed' );
			try {
				localStorage.setItem( KEY, b.classList.contains( 'ai-collapsed' ) ? '1' : '0' );
			} catch ( e ) {}
		};
		t.addEventListener( 'click', act );
		t.addEventListener( 'keydown', function ( e ) {
			if ( e.key === 'Enter' || e.key === ' ' ) {
				e.preventDefault();
				act();
			}
		} );
	} );
} );