Code:
Ext.regModel('allItems', {
fields: [ {name: 'id', type: 'int'},
{name: 'text', type: 'string'},
{name: 'image', type: 'string'},
{name: 'description', type: 'string'}
]
});
var optionsStore = new Ext.data.TreeStore({
model: 'allItems',
proxy: {
url: 'json/?id=1&type=menu',
type: 'ajax',
reader: {
type: 'tree',
root: 'items'
}
}
});
Project.views.mainDataList = new Ext.NestedList({
fullscreen: true,
toolbar: {
ui:'dark',
id:'itemToolbar',
items: [
{xtype: 'spacer'},
{
text: 'Home',
align: 'right',
handler: function(){
Project.views.mainPanel.setActiveItem(0, {type:Project.defaultAnim, reverse: true});
}
}
]
},
title: 'Categories',
displayField: 'text',
emptyText: 'Could not load any items.',
store: optionsStore,
useTitleAsBackText: false,
loadingText: 'Loading...',
getDetailCard: function(record, parentRecord) {
currentItemRecord = record.attributes.record.get('text');
return new Ext.Panel({
items:[
{
xtype: 'container',
flex: 4,
cls: 'itemPhotoContainer',
layout: {type: 'vbox' },
height: Ext.is.Tablet ? 400 : 180,
html: '<div class="itemPhoto" style="background-image:url(images/' +
record.attributes.record.get('image') + ');"></div>'
}
]}
],
baseCls: 'homeCanvas',
scroll: 'vertical',
listeners: {
activate: function(){
Project.views.mainDataList.toolbar.setTitle(currentItemRecord);
}
}
});
}
});
Project.views.categoriesChooser = new Ext.Panel({
id: 'categoryLister',
dockedItems:[{
xtype: 'toolbar',
items: Project.objects.bottomToolbarOrder,
layout: { pack:'center' },
dock: 'bottom'
}
],
defaults: {
cls: 'card'
},
items: Project.views.mainDataList,
}
});