- // Go ahead and create the TreePanel now so that we can use it below
- var treePanel = new Ext.tree.TreePanel({
- id: 'tree-panel',
- title: 'Sample Layouts',
+ // Gets all layouts examples
+ var layoutExamples = [];
+ Ext.Object.each(getBasicLayouts(), function(name, example) {
+ layoutExamples.push(example);
+ });
+
+ Ext.Object.each(getCombinationLayouts(), function(name, example){
+ layoutExamples.push(example);
+ });
+
+ Ext.Object.each(getCustomLayouts(), function(name, example){
+ layoutExamples.push(example);
+ });
+
+ // This is the main content center region that will contain each example layout panel.
+ // It will be implemented as a CardLayout since it will contain multiple panels with
+ // only one being visible at any given time.
+
+ var contentPanel = {
+ id: 'content-panel',
+ region: 'center', // this is what makes this panel into a region within the containing layout
+ layout: 'card',
+ margins: '2 5 5 0',
+ activeItem: 0,
+ border: false,
+ items: layoutExamples
+ };
+
+ var store = Ext.create('Ext.data.TreeStore', {
+ root: {
+ expanded: true
+ },
+ proxy: {
+ type: 'ajax',
+ url: 'tree-data.json'
+ }
+ });
+
+ // Go ahead and create the TreePanel now so that we can use it below
+ var treePanel = Ext.create('Ext.tree.Panel', {
+ id: 'tree-panel',
+ title: 'Sample Layouts',