src/examples/states/app/view/Main.js

   1 Ext.define('States.view.Main', {
   2     extend: 'Ext.Panel',
   3     config: {
   4         layout: 'fit',
   5         style: 'background: white',
   6         items: [
   7             {
   8                 xtype: 'titlebar',
   9                 id: 'titlebar',
  10                 ui: 'light',
  11                 title: '2010 Census Data - USA',
  12                 docked: 'top'
  13             },
  14             {
  15                 xclass: 'Ext.Carousel',
  16                 direction: 'horizontal',
  17                 defaults: {
  18                     layout: 'fit',
  19                     style: 'background: white;  padding-bottom: 30px'
  20                 },
  21                 items: [
  22                     {
  23                         title: 'Map',
  24                         items: [
  25                             {
  26                                 xclass: "States.view.USMap",
  27                                 store: "GeoStore"
  28                             }
  29                         ]
  30                     },
  31                     {
  32                         title: 'Population',
  33                         items: [
  34                             {
  35                                 xclass: "States.view.Population"
  36                             }
  37                         ]
  38                     }
  39                 ]
  40             },
  41             {
  42                 layout: 'vbox',
  43                 width : 350,
  44                 docked: 'right',
  45                 id: 'compositePanelV',
  46                 items: [
  47                     {
  48                         flex: 1,
  49                         layout: 'fit',
  50                         id: 'genderPanel',
  51                         items: {
  52                             xclass: "States.view.Gender",
  53                             innerPadding: {
  54                                 left: 10
  55                             }
  56                         }
  57                     },
  58                     {
  59                         flex: 1,
  60                         layout: 'fit',
  61                         id: 'racePanel',
  62                         items: {
  63                             xclass: "States.view.Race"
  64                         }
  65                     }
  66                 ]
  67             },
  68             {
  69                 layout: 'hbox',
  70                 height: 0,
  71                 docked: 'bottom',
  72                 id: 'compositePanelH'
  73             }
  74         ]
  75     }
  76 });