Wikipedia

Utente:Codicorumus/Fix colore collapseButton

< Utente:Codicorumus

Lo script Fix_colore_collapseButton.js ha principalmente lo scopo di aggiustare il colore dei pulsanti [mostra/nascondi] dei box richiudibili basati sui template {{Navbox}}[1] e {{Cassetto}}[2] e altri analoghi.

Questi template vengono individuati da Mediawiki:Common.js e modificati con l'aggiunta del pulsante di apertura/chiusura e con l'eventuale occultamento dei testo interno. Può capitare che il colore del pulsante sia tanto simile a quello dello sfondo da renderlo poco o per nulla visibile.

Questo script interviene dopo la costruzione dei pulsanti e, a seconda delle opzioni impostate, verifica se la combinazioni di colori rende il testo poco leggibile ed eventualmente sostituisce il colore del testo con uno adatto allo sfondo. La stessa operazione viene eseguita sui link  V · D · M  presenti in alcuni template.

La soglia di intervento per la sostituzione del colore e il tipo di colore da usare sono impostabili tramite opzioni. La soglia di intervento, in considerazione della possibilità di voler essere più conservativi con i link  V · D · M , in cui il colore veicola informazioni aggiuntive (redlink e pagine visitate), può essere differenziata per i due tipi di link.

Quando l'elemento table superiore dei Navbox o quello div dei Cassetti contengono la classe header-color-for-links, il colore sostitutivo non viene calcolato e viene usato, invece, quello dell'elemento HTML che contiene il titolo del Navbox o Cassetto. Lo stesso risultato si può ottenere indiscriminatamente attraverso le opzioni forceHeaderColor.

Lo script utilizza le funzionalità fornite dal plugin jQuery Utente:Codicorumus/$.fn.fittingColor, che può anche essere adoperato direttamente per costruire un fix alternativo dei pulsanti [mostra/nascondi] o di altri elementi che presentino lo stesso problema.

Caricamento ed esecuzione dello script modifica

È sufficiente aggiungere la seguente riga nel proprio common.js o nel js personale della skin che si utilizza (vector.js o monobook.js, per esempio). Eventualmente preceduta dall'impostazione delle opzioni.

importScript( 'Utente:Codicorumus/Fix_colore_collapseButton.js' );

Funzionalità accessorie modifica

Oltre alla funzionalità base, sono presenti due funzionalità accessorie.

È possibile rendere minuscole le lettere "V" e "D" dei  V · D · M  per indicare le pagine non esistenti in maniera indipendente dal colore. Vedi l'opzione vdM.

È inoltre possibile aggiungere ai cassetti alcuni pulsanti che permettono di aprirli e chiuderli tutti con un solo click. Ciò può essere utile, per esempio, per cercare un testo nella pagina stabilendo se nella ricerca debba essere incluso o escluso il testo all'interno dei cassetti. I pulsanti aggiuntivi sono nascosti, compaiono quando si passa con il mouse sopra il pulsante [mostra/nascondi]. Vedi l'opzione pilotAll.

Al momento, queste funzionalità sono attivate per default, allo scopo di mostrarle agli utenti che sperimentano lo script, in seguito potrebbero essere escluse dal default e dovranno essere attivate tramite le opzioni.

Parametro url no-collapsibles-fix modifica

Se si desidera vedere l'aspetto della pagina senza le modifiche eseguite dallo script, è possibile anche senza disattivarlo. Basta aggiungere all'indirizzo della pagina:

  • ?no-collapsibles-fix per gli indirizzi tipo .../wiki/titolo_pagina

oppure

  • &no-collapsibles-fix per gli indirizzi tipo .../w/index.php?title=titolo_pagina...

Opzioni dello script modifica

È possibile personalizzare il funzionamento dello script impostando, le proprie opzioni nello stesso js in cui si è inserita la riga importScript( 'Utente:Codicorumus/Fix_colore_collapseButton.js' );, purché si trovino prima della riga stessa.

Il seguente codice può essere copiato nel proprio js e contiene l'indicazione di tutte le opzioni supportate, impostate ai valori di default dello script. Di seguito vengono spiegate e vengono indicati i valori possibili per ognuna di esse. 

// inizio opzioni per //it.wikipedia.org/wiki/Utente:Codicorumus/Fix_colore_collapseButton.js
window.CollapsibleBoxes = $.extend( true, window.CollapsibleBoxes || {}, {
    options: {
        user : {
            collapseButtonLevel : 1,
            vdmLevel : 0.3,
            mode : 'smooth',
            forceHeaderColor : {
                navFrames : false,
                collapsibleTables : false
            },
            vdM : true,
            pilotAll : true
        }
    }
} );
// fine opzioni per //it.wikipedia.org/wiki/Utente:Codicorumus/Fix_colore_collapseButton.js

L'oggetto prodotto dal codice qui sopra può essere generato anche in altro modo, ma questo garantisce la compatibilità con il livello di opzioni CollapsibleBoxes.options.project, che è già previsto dal codice e potrebbe essere stato già impostato quando viene eseguita l'impostazione di CollapsibleBoxes.options.user. Al momento dell'esecuzione, le opzioni user hanno la precedenza su quelle project che, a loro volta hanno la precedenza su quelle di default. Un ulteriore livello con precedenza massima è previsto per la invocazione diretta di window.fixButtonsColor( options ).

collapseButtonLevel modifica

default = 1  —  Un valore numerico compreso tra 0 e 1. Indica il valore di soglia nelle differenze di colore e luminosità che causa la sostituzione del colore dei pulsanti [mostra/nascondi]. Più alto il valore, maggiori le sostituzioni.

Trattandosi, in pratica, di codice javascript, i decimali vanno indicati con il punto e non con la virgola.

  • Il valore 1 causa la sostituzione senza alcuna verifica sulla combinazione di colori.
  • Il valore 0.5 adotta le soglie raccomandate dal W3C[3].
  • Il valore 0 evita la sostituzione del colore senza alcuna verifica sulla combinazione di colori.
  • Valore intermedi producono più o meno sostituzioni.

vdmLevel modifica

default = 0.3  —  Il valore di soglia per la sostituzione del colore nei link  V · D · M . Tranne il default, come in collapseButtonLevel.

Il valore scelto come default ha lo scopo di garantire per quanto possibile la conservazione dell'informazione veicolata dal colore dei link. In combinazione con l'opzione vdM = true anche questa opzione può essere portata a 1 (sostituzione incondizionata).

mode modifica

default = 'smooth'  —  Una stringa indicante una delle modalità supportate per la costruzione del colore di testo adatto allo sfondo:

  • 'smooth'  —  Viene usato un colore con la stessa tinta del colore di sfondo, ma reso più chiaro o più scuro, per creare un contrasto di luminosità.
  • 'chroma'  —  All'effetto di 'smooth' viene aggiunta la sostituzione della tinta con il colore complementare.
  • 'b|w'  —  Il testo viene reso bianco o nero, rispettivamente per gli sfondi scuri e chiari.

forceHeaderColor modifica

È un gruppo di due opzioni che possono assumere i valori true (vero) o false (falso). Il valore true fa sì che, invece di un colore sostitutivo calcolato in base allo sfondo, venga adoperato lo stesso colore del titolo del Navbox o Cassetto.

Al momento, il template {{Cassetto}} non permette l'impostazione del colore del testo del titolo e, con questa opzione, il risultato è sempre il nero standard del testo. I titoli di colore diverso sono ottenuti inserendo elementi HTML con una propria indicazione di colore che lo script non identifica.

In {{Navbox}}, invece, il colore può essere impostato tramite il parametro titlestyle e quindi adoperato dallo script tramite l'impostazione di queste opzioni.

navFrames modifica

default = false — Attiva l'opzione per i Cassetti (div.NavFrame).

collapsibleTables modifica

default = false — Attiva l'opzione per i Navbox (table.collapsible).

vdM modifica

default = true[4] — Può assumere i valori true o false. Il valore true fa sì che il link delle pagine non esistenti venga reso minuscolo, consentendone l'identificazione indipendentemente dal colore.

pilotAll modifica

default = true[4] — Può assumere i valori true o false. Il valore true fa sì che venga aggiunto a sinistra del pulsante [mostra/nascondi] un gruppo di tre pulsanti che comandano l'apertura o chiusura contemporanea di tutti i Navbox e Cassetti.

⇓ ⇑ ∼ [mostra]

Il primo pulsante (⇓) apre tutti i Cassetti e Navbox. Il secondo (⇑) li chiude tutti. Il terzo (∼) inverte lo stato di apertura di tutti.

Questi pulsanti divengono visibili quando si passa col mouse sopra [mostra/nascondi].

window.CollapsibleBoxes modifica

Lo script genera questo oggetto e vi memorizza dati che possono essere utili anche dopo la sua esecuzione e funzioni che possono essere richiamate in un secondo momento.

fixButtonsColor( options ) modifica

È la funzione che esegue le modifiche alla pagina e può essere richiamata anche dopo la sua normale esecuzione al caricamento dello script. Le opzioni possibili sono le stesse indicate più sopra in Opzioni dello script ed hanno la precedenza sugli altri livelli di opzioni. Il parametro options è opzionale e deve essere un oggetto costituito da uno o più dei componenti indicati più sopra per CollapsibleBoxes.options.user.

Per esempio: 

CollapsibleBoxes.fixButtonsColor( {
    vdmLevel : 1,
    mode : 'chroma'
} );

pilotAllCollapsibles( action ) modifica

È la funzione che controlla l'apertura e chiusura contemporanea di tutti gli elementi. Il parametro action è obbligatorio e può essere una delle seguenti stringhe:

  • 'open' — Per l'apertura.
  • 'close' — Per la chiusura.
  • 'invert' — Per l'inversione dello stato di apertura o chiusura.

navFrames modifica

Un oggetto jQuery contenente i div.NavFrame della pagina, generati da {{Cassetto}} e simili.

collapsibleTables modifica

Un oggetto jQuery contenente i table.collapsible della pagina, generati da {{Navbox}} e simili e derivati, e dalle altre tabelle richiudibili.

options modifica

Questo oggetto memorizza i vari livelli di opzioni e le loro elaborazioni.

  • default, project e user sono, rispettivamente, le opzioni impostate come default dallo script, quelle impostate a livello di progetto e infine quelle dell'utente; le ultime sovrascrivono le precedenti. Il risultato della loro combinazione è memorizzato in working. default e working sono impostate dallo script stesso, le altre due, perché abbiano effetto, devono essere impostate prima del caricamento dello script.
  • lastRun memorizza le impostazioni effettivamente adoperate nell'ultima esecuzione di fixButtonsColor( options ) e sarà identico a working se la funzione è stata chiamata senza il parametro options.

Altri modifica

  • info contiene una sommaria descrizione dell'oggetto e il rimando allo script.
  • scriptPage indica l'indirizzo della pagina dello script.
  • debug contiene, come da nome, dati utili per il debug.

Note modifica

  1. ^ Come esempio del tipo di template e conseguenti box HTML identificati dal selettore CSS table.collapsible, nel seguito indicati genericamente come Navbox.
  2. ^ Come esempio del tipo di template e conseguenti box HTML identificati dal selettore CSS div.NavFrame, nel seguito indicati genericamente come Cassetti.
  3. ^ (EN) Checkpoint 2.2 - Ensure that foreground and background color combinations provide sufficient contrast when viewed by someone having color deficits or when viewed on a black and white screen, in Techniques For Accessibility Evaluation And Repair Tools (W3C Working Draft), World Wide Web Consortium, 26 aprile 2000. URL consultato il 23 maggio 2012.
  4. ^ a b Il default di questa opzione è al momento true allo scopo di far sperimentare la funzionalità a chi prova il template, in futuro potrebbe divenire false.
Estratto da "https://it.wikipedia.org/w/index.php?title=Utente:Codicorumus/Fix_colore_collapseButton&oldid=132673026"