Rainbow è una libreria gratuita scritta in puro Javascript ed indipendente da jQuery che permette di evidenziare la sintassi del codice che si intende mostrare nelle pagine web. Essa è stata progettatata per essere leggera, di facile utilizzo ed estendibile sia per quanto riguarda i linguaggi supportati che a livello grafico tramite i CSS.
Il principio del funzionamento di questa libreria è presto riassunto:
Vengono individuati nella pagina i blocchi di codice identificati dai tag pre e code, il loro contenuto viene elaborato in base a dei modelli regex relativi al linguaggio desiderato dopodichè le porzioni di codice corrispondenti ai modelli vengono avvolti in tag span assegnando una classe; a questo puntola tematizzazione è lasciata ai CSS.
Mi fermo qua con le spiegazioni in quanto lo scopo di questo articolo non è quello di approfondirle in tal senso ne quello di fornire indicazioni all'installazione che è piuttosto semplice e che per la quale rimando al sito del produttore dove sono ampiamente descritti i vari passaggi e dove trovate il link diretto al progetto su GitHub.
Il mio contributo al miglioramento di questa libreria è stato quello di aggiungere l'ASP ai linguaggi supportati e quindi il relativo file js con i pattern regex (regular expression) per il riconoscimento delle stringhe, delle funzioni, delle dichiarazioni, ecc..., alcune righe di codice per la temizzazione delle porzioni di codice precedentemente descritte ed un esempio del risultato finale.
I file che ho aggiunto li trovate sul mio profilo GitHub alla repositories rainbow.
Un'anteprima del risultato e del codice realizzato è visibile anche su JSFiddle, di seguito l'incorporamento dello stesso con relativa visualizzazione di quanto enunciato osservabile rispettivamente dal tab "Result" e dai tab "HTML", "Javascript" e "CSS":
Nessuno ha ancora commentato questo articolo, fallo tu per primo!
Scrivi un Commento