Backbone application with routes from a static json file (read-only)?
-
13-12-2019 - |
Question
I'm building a read only backbone app with data (sourced from a single static json file) that follows a building/campus structure of sort. That is:
[{
"name": "Building Name",
"id": "building",
"floors":[{
"name":"Ground Floor",
"rooms":[{
"name": "Room 1"
},
{
"name": "Room 2"
}]
},
{
"name":"First Floor",
"rooms":[{
"name": "Room 3"
},
{
"name": "Room 4"
}]
}]
},
{
"name": "Another Building",
"id": "building_2",
"floors":[{
"name":"Ground Floor",
"rooms":[{
}]
},
{
"name":"First Floor",
"rooms":[{
}]
}]
}]
I currently have a basic app set up that shows the list of buildings and floors for each building on a default '' route.
I would like to use the router so that APP/#buildingId/ shows the list of floors for a building with 'buildingId' and APP/#buildingId/#floorId shows the relevant list of rooms, etc.
JSBIN of my current code (without data.json) - http://jsbin.com/welcome/5850/edit
Lots of code is probably obsolete, but I was trying different ways to structure the models/collections. This app will never be more than read-only which is why I went with a static file.
Similar problem: How to use JSON to power interactive Backbone.js app
The solution presented doesn't use the Router at all.
Solution
Is this what you are asking for?:
// code simplified and no tested
App.Router = Backbone.Router.extend({
routes: {
"/APP/:buildingId/:floorId": "showRooms",
"/APP/:buildingId": "showFloors"
},
showRooms: function( buildingId, floorId ) {
// code to show the rooms
},
showFloors: function( buildingId ) {
// code to show the floors
},
});
Or am I missing something?