CSSREVOLT - blog personale di Filippo Buratti

Da tempo cercavo una soluzione al noto problema del salvataggio della cronologia nello sviluppo di applicazioni web interamente realizzate in Ajax: infatti con questa tecnologia viene compromesso il corretto funzionamento del tasto "back" del browser e non è possibile salvare gli url delle varie pagine web. Fortunatamente in rete numerosi programmatori hanno provveduto ad ovviare al problema: in realtà, nessuna delle soluzioni trovate mi ha soddisfatto pienamente, vuoi per la difficoltà di implementazione, vuoi per la non perfetta resa cross-browser.

Simon Martin (Netatoo Studio) ha scritto una  libreria basata su prototype che permette di risolvere agevolmente questi problemi: PrototypeXtensions. A me è piaciuta veramente tanto, l'ho utilizzata nell'ultimo lavoro e sto realizzandoci anche un nuovo progetto personale.

Questo script, oltre a permettere di gestire correttamente la cronologia e il tasto "indietro" (history), presenta numerose altre features, Class.accessors ed EventManager, che offrono la possibilità di gestire facilmente le opzioni di una classe e di creare eventi personalizzati, Cookie e Number per manipolare rispettivamente cookie e il calcolo del tempo. Inoltre lo script prevede di poter gestire con estrema semplicità lo sniffing del browser utilizzato dagli utenti e un plugin per la creazione unobtrusiva di un menu a tab, con numerose opzioni e che ben si integra  con History.

History

History è basata sugli Hash di Prototype e consente di definire variabili in modo dinamico nell'hash dell'url. Per assicurare la compatibilità con IE 6/7 inserisce attraverso il DOM un iframe nascosto. A proposito di compatibilità cross-browser, insieme al già citato Explorer si aggiungono tutti i browser moderni (Firefox, Opera, Google Chrome, e anche Safari!)

History dispone di tre semplici metodi: History.set(), History.get(), History.unset()

Ajax.History

PrototypeXtensions introduce due nuovi strumenti Ajax che possono essere utilizzati in luogo dei classici di prototype (ajax.Request e ajax.Updater), per inviare dati al server o aggiornare frammenti di una pagina: si tratta di Ajax.History.Request e Ajax.History.Updater in cui è appunto implementata Ajax.History.

Ajax.History dispone  di tre parametri più un callback:

• history.id: parametro identificativo aggiunto nell'url della pagina, opzionale in AjaxHistory.Updater (in caso di assenza viene utilizzato l'id dell'elemento che viene aggiornato con la chiamata Ajax)
• state: stato di History.id (opzionale),viene aggiunto nell'url.
• history.cache: se settata a true le chiamate Ajax saranno simulate da una chiamata precedente, con conseguente diminuzione dei tempi di caricamento, fantastico!
• history.onStateChange: permette di definire delle funzioni di callback avviate quando avviene un cambiamento nello stato della cronologia.

Vi segnalo anche questo link dove si trova uno script esemplificativo di Ajax.history che mi è stato inviato dall'autore della libreria, molto disponibile a fornire ulteriori spiegazioni alla pur completa documentazione.