text: /*
   * File: app/controller/CensusController.js
   *
   * This file was generated by Sencha Architect version 2.2.2.
   * http://www.sencha.com/products/architect/
   *
   * This file requires use of the Sencha Touch 2.2.x library, under independent license.
   * License of Sencha Architect does not include license for Sencha Touch 2.2.x. For more
   * details see http://www.sencha.com/license or contact license@sencha.com.
   *
   * This file will be auto-generated each and everytime you save your project.
   *
   * Do NOT hand edit this file.
   */
  
  Ext.define('TouchTreeGrid.controller.CensusController', {
      extend: 'Ext.app.Controller',
  
      config: {
          models: [
              'Census'
          ],
          stores: [
              'CensusMaine2000'
          ],
          views: [
              'CensusDetailPanel',
              'CensusContainer'
          ],
  
          refs: {
              censusdetailpanel: {
                  autoCreate: true,
                  selector: 'censusdetailpanel',
                  xtype: 'censusdetailpanel'
              },
              censusContainer: {
                  selector: 'censusContainer',
                  xtype: 'censusContainer'
              },
              censusmaine: '#censusmaine'
          },
  
          control: {
              "tabpanel#censustabpanel": {
                  activeitemchange: 'onCensusTabpanelActiveItemChange'
              },
              "list#censusmainelist": {
                  disclose: 'onCensusMaineListDisclose'
              },
              "list#censusfilterlist": {
                  disclose: 'onCensusFilterListDisclose'
              },
              "button#censusdetailbackbtn": {
                  tap: 'onCensusDetailBackButtonTap'
              },
              "button#censusfilterexpandbtn": {
                  tap: 'onCensusFilterExpandButtonTap'
              },
              "button#censusfiltercollapsebtn": {
                  tap: 'onCensusFilterCollapseButtonTap'
              },
              "selectfield#censusfilterselect": {
                  change: 'onCensusFilterSelectfieldChange'
              }
          }
      },
  
      onCensusTabpanelActiveItemChange: function(container, value, oldValue, eOpts) {
          var me = this;
          var newcont = value.getItemId();
          var grid, gridcont, numNodes, mydata, numRecords, gridListItemId;
  
          gridcont = value.down('touchtreegrid');
          gridListItemId = '#'+gridcont.getListItemId();
          grid = gridcont.down(gridListItemId);
  
  
          if (newcont === 'censusmainecontainer'){
              numRecords = grid.getStore().getData().length;
              if (numRecords === 0) {
                  me.loadCensusMaine2000Store();
              }  
          }
  
          if (newcont === 'censusfiltercont'){
              numRecords = grid.getStore().getData().length;
              if (numRecords === 0) {
                  me.loadCensusFilterStore(gridcont, grid);
              }      
  
          }
  
      },
  
      onCensusMaineListDisclose: function(list, record, target, index, e, eOpts) {
          var swapcont;
          var listitemid = list.getItemId();
          if (listitemid === 'censusmainelist') {
              swapcont = this.getCensusContainer().down('#censusmainecontainer');  
          }
          if (listitemid === 'censusfilterlist') {
              swapcont = this.getCensusContainer().down('#censusfiltercont');      
          }
          myList = swapcont.down('touchtreegrid');
  
          if (swapcont)
          {
              var newcont = this.getCensusdetailpanel(
              {
                  title : '2000 Census (Maine)',
                  itemId : 'censusmainedetail',
                  layout: {type: 'vbox'},
                  scrollable: 'vertical'
              }
              );
              newcont.swapcont = swapcont;  // store with component for use in back button
  
              var device = ((Ext.os.is.Phone) ? 'phone' : 'tablet');
              var orient = ((Ext.Viewport.getWindowWidth() > Ext.Viewport.getWindowHeight()) ? 'landscape' : 'portrait');
  
              var inputCls = ((device==='phone' && orient==='portrait') ? 'detailtextfields-phone-portrait' : 'detailtextfields');
  
              if (newcont)
              {
                  var newLabel = newcont.down('#censusdetaillabel');    
                  newLabel.setHtml(record.get('CATEG'));       
  
                  var fldSet = newcont.down('#censusfieldset1');
                  var result = fldSet.setConfig({
                      items : [
                      {label: 'Total Population',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.TotalPopulation, 0)}, 
                      {label: 'Male',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Male, 0)}, 
                      {label: 'Female',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Female, 0)}, 
                      {label: 'Under 5 years',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Under5years, 0)}, 
                      {label: '5 to 9',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age5to9, 0)}, 
                      {label: '10 to 14',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age10to14, 0)}, 
                      {label: '15 to 19',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age15to19, 0)}, 
                      {label: '20 to 24',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age20to24, 0)}, 
                      {label: '25 to 34',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age25to34, 0)}, 
                      {label: '35 to 44',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age35to44, 0)}, 
                      {label: '45 to 54',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age45to54, 0)}, 
                      {label: '55 to 59',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age55to59, 0)}, 
                      {label: '60 to 64',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age60to64, 0)}, 
                      {label: '65 to 74',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age65to74, 0)}, 
                      {label: '75 to 84',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age75to84, 0)}, 
                      {label: '85 and Over',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age85andOver, 0)}, 
                      {label: 'Median Age',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.MedianAge, 0)}, 
                      {label: '18 and Over',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age18andOver, 0)}, 
                      {label: '18 and Over Male',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age18andOverMale, 0)}, 
                      {label: '18 and Over Female',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age18andOverFemale, 0)}, 
                      {label: '21 and Over',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age21andOver, 0)}, 
                      {label: '62 and Over',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age62andOver, 0)}, 
                      {label: '65 and Over',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age65andOver, 0)}, 
                      {label: '65 and Over Male',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age65andOverMale, 0)}, 
                      {label: '65 and Over Female',labelWidth: '60%', inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age65andOverFemale, 0)}
                  ]}); 
  
                  var fldSet2 = newcont.down('#censusfieldset2');
                  var resul2t = fldSet2.setConfig({
                      items : [
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.TotalPopulation/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Male/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Female/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Under5years/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age5to9/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age10to14/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age15to19/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age20to24/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age25to34/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age35to44/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age45to54/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age55to59/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age60to64/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age65to74/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age75to84/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age85andOver/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.MedianAge/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age18andOver/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age18andOverMale/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age18andOverFemale/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age21andOver/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age62andOver/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age65andOver/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age65andOverMale/record.data.TotalPopulation*100, 1, "", "%")},
                      {inputCls: inputCls, xtype: 'textfield', readOnly: true, value: myList.formatNumbers(record.data.Age65andOverFemale/record.data.TotalPopulation*100, 1, "", "%")}
                  ]}); 
                  swapcont.add(newcont);
                  swapcont.setActiveItem(newcont);      
              }
          }
      },
  
      onCensusFilterListDisclose: function(list, record, target, index, e, eOpts) {
          this.onCensusMaineListDisclose(list, record, target, index, e, eOpts);
      },
  
      onCensusDetailBackButtonTap: function(button, e, eOpts) {
          // Resusing this back button method for both Censusmaine and Censusfilter items
          var priorcont =  button.up('#censusmainedetail'); 
  
          // Get parent containder for detail window (stored with priorcont component at creation)
          var swapcont = priorcont.swapcont;  
  
          if (swapcont)
          {
              var newcont = swapcont.down('container'); 
  
              newcont.setShowAnimation({type :"slide", direction : "right"});
              swapcont.setActiveItem(newcont);  
          }    
      },
  
      onCensusFilterExpandButtonTap: function(button, e, eOpts) {
          var gridcont = button.up('#censusfiltersubcont').down('touchtreegrid');
          var selectValue = button.up('toolbar').down('#censusfilterselect').getValue();
          this.applyCensusFilter(gridcont, selectValue, 99);
      },
  
      onCensusFilterCollapseButtonTap: function(button, e, eOpts) {
          var gridcont = button.up('#censusfiltersubcont').down('touchtreegrid');
          var selectValue = button.up('toolbar').down('#censusfilterselect').getValue();
          this.applyCensusFilter(gridcont, selectValue, 0);
      },
  
      onCensusFilterSelectfieldChange: function(selectfield, newValue, oldValue, eOpts) {
          var gridcont = selectfield.up('#censusfiltersubcont').down('touchtreegrid');
          this.applyCensusFilter(gridcont, newValue);
      },
  
      loadCensusMaine2000Store: function() {
          var me = this;
  
          var gridcont = me.getCensusmaine();
          var gridurl = 'data/censusmaine2000TREE.json';
  
          commonController.loadStore(me, gridcont, gridurl, 'Loading Census...');
  
  
      },
  
      loadColumnsCensusMaine: function(gridcont, noRefresh) {
          /* Demo grid column changes based on device (phone vs. tablet) and orientation (portrait vs. landscape) */
          /* NOTE:  When connected to data source suggest storing array configruations in a table 
          for each grid, device and orienation configuration */ 
  
          var device = ((Ext.os.is.Phone) ? 'phone' : 'tablet');
          var orient = ((Ext.Viewport.getWindowWidth() > Ext.Viewport.getWindowHeight()) ? 'landscape' : 'portrait');
  
          var colArr = [];
  
          if (device==='phone' && orient==='portrait') {
              colArr = [
              {
                  header: '&nbsp;',
                  dataIndex: 'CATEG',
                  width: '32%',
                  style: 'text-align: left;',
                  categStyle: 'font-weight: bold; text-align: left; color: blue;',
                  headerStyle: 'text-align: left; color: #ccc;'
              },
              {
                  header: 'Population',
                  dataIndex: 'TotalPopulation',
                  width: '20%',
                  style: 'text-align: right;',
                  categStyle: 'text-align: right;',
                  headerStyle: 'text-align: right; color: #ccc;',
                  renderer: 'this.formatNumbers(values.TotalPopulation, 0)'
              },
              {
                  header: 'Males',
                  dataIndex: 'Male',
                  width: '15%',
                  style: 'text-align: right;',
                  categStyle: 'text-align: right;',
                  headerStyle: 'text-align: right; color: #ccc;',
                  renderer: 'this.formatNumbers(values.Male, 0)'
              },
              {
                  header: 'Females',
                  dataIndex: 'Female',
                  width: '15%',
                  style: 'text-align: right;',
                  categStyle: 'text-align: right;',
                  headerStyle: 'text-align: right; color: #ccc;',
                  renderer: 'this.formatNumbers(values.Female, 0)'
              }
              ];    
          }
  
          if (device==='phone' && orient==='landscape') {
              colArr = [
              {
                  header: '&nbsp;',
                  dataIndex: 'CATEG',
                  width: '32%',
                  style: 'text-align: left;',
                  categStyle: 'font-weight: bold; text-align: left; color: blue;',
                  headerStyle: 'text-align: left; color: #ccc;'
              },
              {
                  header: 'Population',
                  dataIndex: 'TotalPopulation',
                  width: '15%',
                  style: 'text-align: right;',
                  categStyle: 'text-align: right;',
                  headerStyle: 'text-align: right; color: #ccc;',
                  renderer: 'this.formatNumbers(values.TotalPopulation, 0)'
              },
              {
                  header: 'Males',
                  dataIndex: 'Male',
                  width: '15%',
                  style: 'text-align: right;',
                  categStyle: 'text-align: right;',
                  headerStyle: 'text-align: right; color: #ccc;',
                  renderer: 'this.formatNumbers(values.Male, 0)'
              },
              {
                  header: 'Females',
                  dataIndex: 'Female',
                  width: '15%',
                  style: 'text-align: right;',
                  categStyle: 'text-align: right;',
                  headerStyle: 'text-align: right; color: #ccc;',
                  renderer: 'this.formatNumbers(values.Female, 0)'
              },
              {
                  header: 'Median',
                  dataIndex: 'MedianAge',
                  width: '15%',
                  style: 'text-align: center;',
                  categStyle: 'text-align: center;',
                  headerStyle: 'text-align: center; color: #ccc;',
                  renderer: 'this.formatNumbers(values.MedianAge, 0)'
              }
              ];  
          }
  
          if (device==='tablet' && orient==='portrait') {
              colArr = [
              {
                  header: '&nbsp;',
                  dataIndex: 'CATEG',
                  width: '21%',
                  style: 'text-align: left;',
                  categStyle: 'font-weight: bold; text-align: left; color: blue;',
                  headerStyle: 'text-align: left; color: #ccc;'
              },
              {
                  header: 'Population',
                  dataIndex: 'TotalPopulation',
                  width: '11%',
                  style: 'text-align: right;',
                  categStyle: 'text-align: right;',
                  headerStyle: 'text-align: right; color: #ccc;',
                  renderer: 'this.formatNumbers(values.TotalPopulation, 0)'
              },
              {
                  header: 'Males',
                  dataIndex: 'Male',
                  width: '11%',
                  style: 'text-align: right;',
                  categStyle: 'text-align: right;',
                  headerStyle: 'text-align: right; color: #ccc;',
                  renderer: 'this.formatNumbers(values.Male, 0)'
              },
              {
                  header: 'Females',
                  dataIndex: 'Female',
                  width: '11%',
                  style: 'text-align: right;',
                  categStyle: 'text-align: right;',
                  headerStyle: 'text-align: right; color: #ccc;',
                  renderer: 'this.formatNumbers(values.Female, 0)'
              },
              {
                  header: 'Median',
                  dataIndex: 'MedianAge',
                  width: '11%',
                  style: 'text-align: center;',
                  categStyle: 'text-align: center;',
                  headerStyle: 'text-align: center; color: #ccc;',
                  renderer: 'this.formatNumbers(values.MedianAge, 0)'
              },
              {
                  header: '18+',
                  dataIndex: 'Age18andOver',
                  width: '11%',
                  style: 'text-align: right;',
                  categStyle: 'text-align: right;',
                  headerStyle: 'text-align: right; color: #ccc;',
                  renderer: 'this.formatNumbers(values.Age18andOver, 0)'
              },
              {
                  header: '21+',
                  dataIndex: 'Age21andOver',
                  width: '11%',
                  style: 'text-align: right;',
                  categStyle: 'text-align: right;',
                  headerStyle: 'text-align: right; color: #ccc;',
                  renderer: 'this.formatNumbers(values.Age21andOver, 0)'
              }
              ];    
  
          }
  
          if (device==='tablet' && orient==='landscape') {
              colArr = [
              {
                  header: '&nbsp;',
                  dataIndex: 'CATEG',
                  width: '21%',
                  style: 'text-align: left;',
                  categStyle: 'font-weight: bold; text-align: left; color: blue;',
                  headerStyle: 'text-align: left; color: #ccc;'
              },
              {
                  header: 'Population',
                  dataIndex: 'TotalPopulation',
                  width: '10%',
                  style: 'text-align: right;',
                  categStyle: 'text-align: right;',
                  headerStyle: 'text-align: right; color: #ccc;',
                  renderer: 'this.formatNumbers(values.TotalPopulation, 0)'
              },
              {
                  header: 'Males',
                  dataIndex: 'Male',
                  width: '8%',
                  style: 'text-align: right;',
                  categStyle: 'text-align: right;',
                  headerStyle: 'text-align: right; color: #ccc;',
                  renderer: 'this.formatNumbers(values.Male, 0)'
              },
              {
                  header: 'Females',
                  dataIndex: 'Female',
                  width: '8%',
                  style: 'text-align: right;',
                  categStyle: 'text-align: right;',
                  headerStyle: 'text-align: right; color: #ccc;',
                  renderer: 'this.formatNumbers(values.Female, 0)'
              },
              {
                  header: 'Median',
                  dataIndex: 'MedianAge',
                  width: '8%',
                  style: 'text-align: center;',
                  categStyle: 'text-align: center;',
                  headerStyle: 'text-align: center; color: #ccc;',
                  renderer: 'this.formatNumbers(values.MedianAge, 0)'
              },
              {
                  header: '18+',
                  dataIndex: 'Age18andOver',
                  width: '8%',
                  style: 'text-align: right;',
                  categStyle: 'text-align: right;',
                  headerStyle: 'text-align: right; color: #ccc;',
                  renderer: 'this.formatNumbers(values.Age18andOver, 0)'
              },
              {
                  header: '21+',
                  dataIndex: 'Age21andOver',
                  width: '8%',
                  style: 'text-align: right;',
                  categStyle: 'text-align: right;',
                  headerStyle: 'text-align: right; color: #ccc;',
                  renderer: 'this.formatNumbers(values.Age21andOver, 0)'
              },
              {
                  header: '62+',
                  dataIndex: 'Age62andOver',
                  width: '8%',
                  style: 'text-align: right;',
                  categStyle: 'text-align: right;',
                  headerStyle: 'text-align: right; color: #ccc;',
                  renderer: 'this.formatNumbers(values.Age62andOver, 0)'
              },
              {
                  header: '65+',
                  dataIndex: 'Age65andOver',
                  width: '8%',
                  style: 'text-align: right;',
                  categStyle: 'text-align: right;',
                  headerStyle: 'text-align: right; color: #ccc;',
                  renderer: 'this.formatNumbers(values.Age65andOver, 0)'
              }
              ];    
  
          }
  
  
          gridcont.setColumns(colArr);
          if (!noRefresh) {
              gridcont.doRefreshList(true);   // Don't change collapse levels when refreshing
          }    
  
      },
  
      loadCensusFilterStore: function(gridcont, grid) {
          var me = this;
          var gridurl = 'data/censusmaine2000FLAT.json';
  
          // Passing loadStoreInPostProcess=true because for this example we will 
          // be loading census store (flatfile format) and then post-processing
          // into treestore format 
          commonController.loadStore(me, gridcont, gridurl, 'Loading Census Filter...', true);
  
      },
  
      applyCensusFilter: function(gridcont, selectFieldValue, collapseTo) {
          var gridlistname = gridcont.getListItemId();
          var gridlist = gridcont.down('#'+gridlistname);
          var ArrRef = gridlist.ArrRef;
          var myFilt, skipApplyDefaultCollapseLevel;
  
  
          if (selectFieldValue === '0') {
  
              collapseLvl = (Ext.isEmpty(gridcont.collapseLevel) ? 1 : gridcont.collapseLevel);
              skipApplyDefaultCollapseLevel = false;
              // Refer to expCollapse() method where collapseLevel could be updated for manual expand processing
              myFilt = {};
  
          } else {
              collapseLvl = 99; // Fully expand filtered output
              skipApplyDefaultCollapseLevel = true;
              myFilt = {
                  enabled: true,
                  displayNodesWithAllMembersFilteredAsLeafs: true
              };
  
              if (selectFieldValue === '1') {  // Males > Females             
                  // Alternative way to define function if building dynamically
                  var v1 = 'Male';
                  var v2 = 'Female';
                  var oper = '>=';
  
                  // myFilt.filterFn = function (rowObj) {return (parseInt(rowObj.Male) >= parseInt(rowObj.Female));};
                  // var func = new Function("x", "y", "return x*y;");
                  myFilt.filterFn = new Function("rowObj", "return (parseInt(rowObj." + v1 + ') ' + oper +
                  ' parseInt(rowObj.' + v2 + "));");        
              }
              if (selectFieldValue === '2') {  // Females > Males
                  myFilt.filterFn = function (rowObj) {return (parseInt(rowObj.Female) >= parseInt(rowObj.Male));};
              }    
              if (selectFieldValue === '3') {  // Population > 10k
                  myFilt.filterFn = function (rowObj) {return (parseInt(rowObj.TotalPopulation) >= 10000);};
              }     
          }    
  
          commonController.loadTree((Ext.isEmpty(collapseTo) ? collapseLvl : collapseTo),
          ArrRef, [], gridcont, null, true, myFilt, 
          (Ext.isEmpty(collapseTo) ? skipApplyDefaultCollapseLevel : true)); 
  
  
  
      }
  
  });