jQTouch e Backbone.js Routing/Viste

Question

Mi chiedo se qualcuno stia utilizzando l'ultimo jQTouch con Backbone.js e, in tal caso, come gestiscono la transizione tra le pagine utilizzando i router e le viste di Backbone invece di jQTouch che tenta automaticamente di mostrare un div con l'ID specifico relativo all'hash.

Answer 1

Cosa stai cercando di ottenere con jQTouch? AFAIK, è un framework mobile leggero che consente di creare un'applicazione web mobile di una sola pagina mostrando e nascondendo i div. Le tre cose principali che ti dà:

1. Nizza elementi mobili UI
2. transizioni CSS3 tra le pagine (diapositive, pop, dissolvenza, etc).
3. Un quadro di navigazione che transizioni automaticamente tra le pagine in base al elemento dell'interfaccia utente che si tocca (ad esempio toccare un ancoraggio con href #about volontà transizione automatica dalla pagina corrente alla pagina (div) con ID about)

I presumiamo che ti piacerebbe mantenere 1) e 2) per rendere la tua vita più semplice e per BackBone per gestire 3) - questo ha senso per me come la struttura MVC di BackBone e la propagazione degli eventi tra le viste è piacevole. Se questo è il caso, in realtà 1) e 2) sono solo trucchi CSS. Quindi mantieni il jqtouch.css e il fosso jqtouch.js. In questo modo, avrai tutto lo stile e potrai programmare in modo programmato le transizioni nelle tue viste BackBone, senza jqTouch intromettersi nella navigazione.

Se si esegue questa operazione, ricordarsi di avvolgere l'intera app in <div id="jqt"></div> in modo che il foglio di stile trovi e stili tutti gli elementi ei pulsanti dell'elenco. Quando si desidera utilizzare una transizione, utilizzare jQuery/Zepto aggiungere il corretto CSS per ogni pagina:

$("#toPage").addClass('slideleft in current'); 
$("#fromPage").addClass('slideleft out'); 

In tal modo, le transizioni CSS3 specificati in jqtouch.css. L'elenco delle transizioni disponibili è disponibile in jqtouch.js, riga 61 in poi. Basta cambiare slideleft nel codice sopra per un nome di animazione diverso per ottenere una transizione diversa.

Disclaimer! In realtà non ho provato questo, solo una teoria e potrebbe non funzionare ... anche se sto cercando di ottenere esattamente questo, utilizzare un bel tema di interfaccia utente mobile con BackBone, e questo è il più vicino che riesco a trovare. Quando avrò la possibilità proverò a codificarlo nei prossimi giorni. Se ci arrivi prima e provalo per favore fammi sapere come vai avanti!