Can I use this callback result with Backbone? - backbone.js

Question

I hope someone can help me as Ive been trying for well over a week to see if I can use this callback result to populate a Backbone model/Collection.
Specifically, I want to list the Area Name and the AreaGUID - I also want to get the total price from the PriceMatrix.
PriceMatrix aside - I'd even settle for the Area Name and AreaGUID as I would hopefully learn how to traverse this JSON, and make collections from its nested values.
JSON:
$esro.GenericCallBack: (
{
"CustomCallback": "getEventDescriptionCallback",
"ErrorDescription": "",
"EvalMe": "",
"HasError": false,
"Result": {
"__type": "EventItemEntity:#eSRO.Code.JSonEntities",
"Areas": [
{
"Area": {
"AreaGuid": "9fc8ae7e-2059-4eb6-8c6f-527f3a0ea5fc",
"AreaMapGuid": "97a511ac-6b36-4223-9a08-5e099ebcd6ee",
"DefaultSeatingType": 10,
"GADefaultSettings": {
"Capacity": 10000,
"PriceLevelGuid": null,
"Restrictions": null
},
"Name": {
"Value": "Balc Fest 2013 Murmur"
},
"NameForReports": {
"Value": "Balc Fest 2013 Murmur"
},
"Ordinal": 0,
"ParentHallGuid": "b4df2722-fe70-4b03-bf9b-4a35286b1330",
"StandId": null,
"StandName": null
},
"AreaMap": {
"AreaMapGuid": "97a511ac-6b36-4223-9a08-5e099ebcd6ee",
"DescriptionLevel": 1,
"GASettings": null,
"GateCombinations": null,
"IncludedInMultipleVersions": false,
"Name": {
"Value": "Balc Fest 2013 Murmur"
},
"NumberOfSeats": 180,
"ParentAreaGuid": "9fc8ae7e-2059-4eb6-8c6f-527f3a0ea5fc",
"SeatingType": 20,
"Sectors": null,
"Status": 20,
"TurnstileCombinations": null,
"PriceLevelIds": [
"7ec859f6-2294-4b0f-b57a-9fa120c221a6",
"5112ea83-0880-4785-b93c-21e18c7a667b"
]
},
"Connector": {
"AreaLevelViewXaml": null,
"AreaMapGuid": "97a511ac-6b36-4223-9a08-5e099ebcd6ee",
"BackgroundImageIds": null,
"BestAvailableReservation": true,
"HallLevelViewXaml": "<Properties><Width>770</Width><Height>185</Height><X>0</X><Y>0</Y><Angle>0</Angle><Xaml /><AreaLabel /><StageSide /><IfShowLabel /></Properties>",
"Ordinal": 1,
"ParentVersionGuid": "b0352f6b-056d-4577-b3c1-c0ae8773bbb5",
"StaticViewXamls": null,
"ViewFromAreaImageId": null
},
"DependencyTags": [
"AreaMap=97a511ac-6b36-4223-9a08-5e099ebcd6ee",
"SeatingPlan=0aaa76eb-0b49-4ab7-9ef7-767b8400fb11",
"Area=9fc8ae7e-2059-4eb6-8c6f-527f3a0ea5fc;SeatingPlan=0aaa76eb-0b49-4ab7-9ef7-767b8400fb11",
"Show=37f6bcd8-c63c-4967-9982-3c3ae4c204e4",
"Area=9fc8ae7e-2059-4eb6-8c6f-527f3a0ea5fc;Show=37f6bcd8-c63c-4967-9982-3c3ae4c204e4",
"HallVersion=b0352f6b-056d-4577-b3c1-c0ae8773bbb5",
"Area=9fc8ae7e-2059-4eb6-8c6f-527f3a0ea5fc;HallVersion=b0352f6b-056d-4577-b3c1-c0ae8773bbb5"
],
"ImageUris": []
},
{
"Area": {
"AreaGuid": "063b1dad-e789-4857-852f-5e733fa84865",
"AreaMapGuid": "6c716990-9686-4304-a015-4db450f2fbd5",
"DefaultSeatingType": 10,
"GADefaultSettings": {
"Capacity": 1078,
"PriceLevelGuid": null,
"Restrictions": null
},
"Name": {
"Value": "ORCH Fest 2013 Murmur"
},
"NameForReports": {
"Value": "ORCH Fest 2013 Murmur"
},
"Ordinal": 0,
"ParentHallGuid": "b4df2722-fe70-4b03-bf9b-4a35286b1330",
"StandId": null,
"StandName": null
},
"AreaMap": {
"AreaMapGuid": "6c716990-9686-4304-a015-4db450f2fbd5",
"DescriptionLevel": 1,
"GASettings": null,
"GateCombinations": null,
"IncludedInMultipleVersions": false,
"Name": {
"Value": "ORCH Fest 2013 Murmur"
},
"NumberOfSeats": 425,
"ParentAreaGuid": "063b1dad-e789-4857-852f-5e733fa84865",
"SeatingType": 20,
"Sectors": null,
"Status": 20,
"TurnstileCombinations": null,
"PriceLevelIds": [
"7ec859f6-2294-4b0f-b57a-9fa120c221a6",
"5c9fa97b-c47c-463a-8da4-78956a241e5e",
"5112ea83-0880-4785-b93c-21e18c7a667b",
"01b28b26-b09c-46c3-b75a-02331c1231f9",
"e717cf91-986d-486d-b533-1309123fbf78"
]
},
"Connector": {
"AreaLevelViewXaml": null,
"AreaMapGuid": "6c716990-9686-4304-a015-4db450f2fbd5",
"BackgroundImageIds": null,
"BestAvailableReservation": true,
"HallLevelViewXaml": "<Properties><Width>770</Width><Height>185</Height><X>0</X><Y>195</Y><Angle>0</Angle><Xaml /><AreaLabel /><StageSide /><IfShowLabel /></Properties>",
"Ordinal": 2,
"ParentVersionGuid": "b0352f6b-056d-4577-b3c1-c0ae8773bbb5",
"StaticViewXamls": null,
"ViewFromAreaImageId": null
},
"DependencyTags": [
"AreaMap=6c716990-9686-4304-a015-4db450f2fbd5",
"SeatingPlan=0aaa76eb-0b49-4ab7-9ef7-767b8400fb11",
"Area=063b1dad-e789-4857-852f-5e733fa84865;SeatingPlan=0aaa76eb-0b49-4ab7-9ef7-767b8400fb11",
"Show=37f6bcd8-c63c-4967-9982-3c3ae4c204e4",
"Area=063b1dad-e789-4857-852f-5e733fa84865;Show=37f6bcd8-c63c-4967-9982-3c3ae4c204e4",
"HallVersion=b0352f6b-056d-4577-b3c1-c0ae8773bbb5",
"Area=063b1dad-e789-4857-852f-5e733fa84865;HallVersion=b0352f6b-056d-4577-b3c1-c0ae8773bbb5"
],
"ImageUris": []
}
],
"Id": "0aaa76eb-0b49-4ab7-9ef7-767b8400fb11",
"Pricing": {
"PriceLevelAxis": [
{
"key": "7ec859f6-2294-4b0f-b57a-9fa120c221a6",
"value": "C Price"
},
{
"key": "5112ea83-0880-4785-b93c-21e18c7a667b",
"value": "B Price"
},
{
"key": "5c9fa97b-c47c-463a-8da4-78956a241e5e",
"value": "W/C Wheel chair** C Price"
},
{
"key": "01b28b26-b09c-46c3-b75a-02331c1231f9",
"value": "W/C Wheel chair** B Price"
},
{
"key": "e717cf91-986d-486d-b533-1309123fbf78",
"value": "A Price"
}
],
"PriceMatrix": [
[
{
"ListPrice": "<Money amount=\"25\" currencyCode=\"\" xmlns=\"http://foundation.toptix.com/2007\"/>",
"PriceModifiers": null,
"TotalPrice": "<Money amount=\"25\" currencyCode=\"\" xmlns=\"http://foundation.toptix.com/2007\"/>"
},
{
"ListPrice": "<Money amount=\"40\" currencyCode=\"\" xmlns=\"http://foundation.toptix.com/2007\"/>",
"PriceModifiers": null,
"TotalPrice": "<Money amount=\"40\" currencyCode=\"\" xmlns=\"http://foundation.toptix.com/2007\"/>"
},
{
"ListPrice": "<Money amount=\"25\" currencyCode=\"\" xmlns=\"http://foundation.toptix.com/2007\"/>",
"PriceModifiers": null,
"TotalPrice": "<Money amount=\"25\" currencyCode=\"\" xmlns=\"http://foundation.toptix.com/2007\"/>"
},
{
"ListPrice": "<Money amount=\"40\" currencyCode=\"\" xmlns=\"http://foundation.toptix.com/2007\"/>",
"PriceModifiers": null,
"TotalPrice": "<Money amount=\"40\" currencyCode=\"\" xmlns=\"http://foundation.toptix.com/2007\"/>"
},
{
"ListPrice": "<Money amount=\"55\" currencyCode=\"\" xmlns=\"http://foundation.toptix.com/2007\"/>",
"PriceModifiers": null,
"TotalPrice": "<Money amount=\"55\" currencyCode=\"\" xmlns=\"http://foundation.toptix.com/2007\"/>"
}
]
],
"PriceModifierDescriptions": [],
"PriceTypeAxis": [
{
"key": "5ea4520c-d647-4a8c-b392-3f52910396d4",
"value": "FULL"
}
]
},
"SeatingTypeEnum": [
{
"key": "GA",
"value": 10
},
{
"key": "BA",
"value": 20
}
],
"ShowName": "Murmurs"
}
}
)
Model and Collection currently:
Entities.Area = Backbone.Model.extend({
defaults: {
Id: '',
AreaGuid:'',
AreaMapGuid: '',
AreaNameValue: '',
DefaultSeatingType: '',
PriceLevelIds: '',
MinPriceLevelIds: '',
MaxPriceLevelIds: '',
SeatingPlan: '',
BestAvailableReservation: '',
PriceLevelAxis: '',
PriceMatrix: '',
ShowName: '',
FacilityFee: '',
ServiceFee : '',
SeatPriceTotal : ''
Collection:
Entities.AreaCollection = Backbone.Collection.extend({
initialize: function() {
this.on('all', function(e) { console.log("Area event: " +e); });
},
url: "./murmurs.json",
model: Entities.Area,
parse : function(response){
return response.Result;
}
});
Please help if you can - and thanks!

Answer 1

you can have a straightforward hierarchical design like this ...
var RootModel = Backbone.Model.extend({
default:
{
"CustomCallback": "",
"ErrorDescription": "",
"EvalMe": "",
"HasError": false,
"Result": null
}
});
var ResultModel = Backbone.Model.extend({
default:
{
"__type": "",
"Areas": []
}
});
var AreaCollection = Backbone.Collection.extend({
model: areaDetailsModel
});
var AreaDetailsModel = Backbone.Model.extend({
default:
{
"Area": null,
"AreaMap": null,
"Connector": null
}
});
var AreaModel = Backbone.Model.extend({
default:
{
"AreaGuid": "",
"AreaMapGuid": "",
"DefaultSeatingType": 0,
"GADefaultSettings": null,
"Name": "",
"NameForReports": "",
"Ordinal": 0,
"ParentHallGuid": "",
"StandId": null,
"StandName": null
}
});
var AreaMapModel = Backbone.Model.extend({
default:
{
"AreaMapGuid": "",
"DescriptionLevel": "",
"GASettings": null,
"GateCombinations": null,
"IncludedInMultipleVersions": false,
"Name": "",
"NumberOfSeats": 0,
"ParentAreaGuid": "",
"SeatingType": 0,
"Sectors": null,
"Status": 0,
"TurnstileCombinations": null,
"PriceLevelIds": []
}
});
....
Then, you can assign your callback result to the rootModel.
var rootModel= new RootModel("your callback to JSON");
var resultModel = new ResultModel(rootModel.get("Result"));
var areas = new AreaCollection(resultModel.get("Areas"));
var areaDetail = areas.at(0);
var area = new AreaModel(areadetail.get("area");
...

Answer 2

I have not tried it but this may work.
var area_detail_model = Backbone.Model.extend({
defaults: {
AreaGuid: null,
AreaMapGuid: null
}
});
var area_map_model = Backbone.Model.extend({
defaults: {
AreaMapGuid: null,
DescriptionLevel: null
}
});
var area_model = Backbone.Model.extend({
defaults: {
Area: new area_detail_model(),
AreaMap: new area_map_model(),
Connector: [] // can declare a model for connector also
DependencyTags: [] // when using an array we can write bb_obj.get('Attr').ArrayItemName
},
parse : function(response){
// at this point only area models exist, i.e from area collection each area model
// is passed to this parse method
response.Area = new area_model(response.Area);
response.AreaModel = new area_map_model(response.AreaModel);
return response;
}
});
var area_collection = Backbone.Collection.extend({
model: area_model,
url: '/Areas',
parse : function(response){
return response; // place a break point and check out the contents of response
}
});
var result_model = Backbone.Model.extend({
defaults: {
Areas: new area_collection(),
Id: null,
Pricing: null,
},
url: '/GetResults',
parse : function(response){
response.Result.Areas = new area_collection(response.Result.Areas);
return response.Result; // this will return only the Result section from your JSON
}
});
var result_obj = new result_model();
result_obj.fetch();
So when the response is fetched then the result_model parse function will only pick Result from JSON and then we create a collection out the areas and the corresponding parse for each collection and method will be called in order. Let me know if it works.