// Mobile Router // ============= // Includes file dependencies define([ "jquery","backbone", "../models/CategoryModel", "../collections/CategoriesCollection", "../views/CategoryView" ], function( $, Backbone, CategoryModel, CategoriesCollection, CategoryView ) { // Extends Backbone.Router var CategoryRouter = Backbone.Router.extend( { // The Router constructor initialize: function() { // Instantiates a new Animal Category View this.animalsView = new CategoryView( { el: "#animals", collection: new CategoriesCollection( [] , { type: "animals" } ) } ); // Instantiates a new Colors Category View this.colorsView = new CategoryView( { el: "#colors", collection: new CategoriesCollection( [] , { type: "colors" } ) } ); // Instantiates a new Vehicles Category View this.vehiclesView = new CategoryView( { el: "#vehicles", collection: new CategoriesCollection( [] , { type: "vehicles" } ) } ); // Tells Backbone to start watching for hashchange events Backbone.history.start(); }, // Backbone.js Routes routes: { // When there is no hash bang on the url, the home method is called "": "home", // When #category? is on the url, the category method is called "category?:type": "category" }, // Home method home: function() { // Programatically changes to the categories page $.mobile.changePage( "#categories" , { reverse: false, changeHash: false } ); }, // Category method that passes in the type that is appended to the url hash category: function(type) { // Stores the current Category View inside of the currentView variable var currentView = this[ type + "View" ]; // If there are no collections in the current Category View if(!currentView.collection.length) { // Show's the jQuery Mobile loading icon $.mobile.loading( "show" ); // Fetches the Collection of Category Models for the current Category View currentView.collection.fetch().done( function() { // Programatically changes to the current categories page $.mobile.changePage( "#" + type, { reverse: false, changeHash: false } ); } ); } // If there already collections in the current Category View else { // Programatically changes to the current categories page $.mobile.changePage( "#" + type, { reverse: false, changeHash: false } ); } } } ); // Returns the Router class return CategoryRouter; } );