enrutamiento de backbone detectando si se presiona adelante o atrás

Question

Estoy escribiendo una aplicación usando backbone.js, y estoy animando entre páginas (un poco como el estilo de iPhone ui). Por lo tanto, cuando hace clic en un botón, la página siguiente se desliza desde la derecha, y al hacer clic en un botón Atrás la página siguiente se deslizará desde la izquierda. Quiero poder hacer lo mismo con los botones de avance y retroceso del navegador, usando un enrutador. ¿Es posible saber qué se presionó (hacia delante o hacia atrás) para poder garantizar que la animación vaya en la dirección correcta?

Solo para aclarar, no estoy preguntando cómo hacer el enrutamiento de la red troncal. Estoy preguntando al hacer el enrutamiento de la red troncal, cómo puedes ver qué botón hizo que cambie la URL, ¿era el botón de retroceso o el de reenvío?

Gracias

Answer 1

Escucha un evento de clic en todos los enlaces. (CoffeeScript)

$(document).on 'click', 'a' -> 
    window.linkClicked = true 

Como alternativa, puede interceptar Backbone.history.navigate(). Si alguien hace clic en él, significa que no volverán, por lo tanto, establezca un indicador en true. También tenga un evento en su enrutador escuchando todos los eventos del enrutador. Guarde siempre el fragmento anterior (Backbone.history.getFragment()). Compara el fragmento actual con el fragmento anterior. Si son iguales, compruebe si ese indicador se configuró en true o false. Si se establece en false, sabrá que regresó, si true no lo está y que alguien hizo clic en un enlace pero llegó a la misma página anterior. Finalmente, reinicie esta bandera al false.

class SnazzyRouter extends Backbone.Router 
    initialize: -> 
     # This gets triggered everytime a route event gets triggered 
     @on 'all', => 
      currentFragment = Backbone.history.getFragment() 
      window.backDetected = false # assume no back detected 

      if !window.linkClicked and currentFragment == window.previousFragment 
       window.backDetected = true 

      window.linkClicked = false # reset 
      window.previousFragment = currentFragment 

window.linkClicked = false 
window.backDetected = false 
window.previousFragment = null 

snazzyRouter = new SnazzyRouter() 

Ahora, es un simple

# Did we go back? 
console.log "I CAN'T BELIEVE WE WENT BACK!" if window.backDetected 

Déjeme saber si usted necesita cualquier aclaración (I Sólo se aplicó esto para mi aplicación y funciona).