title: How do i control sencha tabpanel navigation
body: <p>I have a tabpanel with four tabs, After the application finished launching, I am showing tabpanel (first tab will be active item) and When the user trying to tap any other 3 tabs, I need to check the user logged in already or not.</p>
  
  <p>If the user didn't logged in then i need to show login layout panel and i need to set first tab as active item.</p>
  
  <p>If the user logged in then i need to 2/3/4th tab, what ever your clicked.</p>
  
  <p>I can show login overlay panel if the user didn't logged in, but changing the active item back to first tab is the problem.</p>
  
  <p><strong>I wrote the following code at tabpanel view</strong></p>
  
  <pre><code>    listeners : {
      activeitemchange : function() {
          var token = localStorage.token; // user already logged in there will be a token at localStorage.
          if (token == undefined || token == '') {
              this.setActiveItem(0);
              this.getAt(0).setActiveItem('firstTab');
          }
      }
  }
  </code></pre>
  
  <p>It showing error like this but, Its woking (i don't want below error, even though its working)</p>
  
  <pre><code>Uncaught Error: [ERROR][Ext.Container#factoryItem] Invalid config, must be a valid config object sencha-touch-all-debug.js:26029
  Ext.define.doWrite sencha-touch-all-debug.js:26029
  Ext.define.write sencha-touch-all-debug.js:18416
  Ext.define.log sencha-touch-all-debug.js:18298
  (anonymous function) sencha-touch-all-debug.js:18316
  Ext.apply.factory sencha-touch-all-debug.js:9221
  Ext.define.factoryItem sencha-touch-all-debug.js:64065
  Ext.define.applyActiveItem sencha-touch-all-debug.js:64664
  (anonymous function) sencha-touch-all-debug.js:27233
  Ext.define.config.listeners.activeitemchange /myapp/app/view/myTab.js?_dc=1365571204916:39
  Ext.define.doFire sencha-touch-all-debug.js:17322
  Ext.define.fire sencha-touch-all-debug.js:17249
  Ext.define.doDispatchEvent sencha-touch-all-debug.js:22349
  Ext.define.dispatchEvent sencha-touch-all-debug.js:22330
  Ext.define.doFireEvent sencha-touch-all-debug.js:26577
  Ext.define.fireAction sencha-touch-all-debug.js:26566
  (anonymous function) sencha-touch-all-debug.js:27246
  Ext.define.config.listeners.activeitemchange /myapp/app/view/myTab.js?_dc=1365571204916:38
  Ext.define.doFire sencha-touch-all-debug.js:17322
  Ext.define.fire sencha-touch-all-debug.js:17249
  Ext.define.doDispatchEvent sencha-touch-all-debug.js:22349
  Ext.define.dispatchEvent sencha-touch-all-debug.js:22330
  Ext.define.doFireEvent sencha-touch-all-debug.js:26577
  Ext.define.fireAction sencha-touch-all-debug.js:26566
  (anonymous function) sencha-touch-all-debug.js:27246
  Ext.define.doTabChange sencha-touch-all-debug.js:76619
  Ext.define.doFire sencha-touch-all-debug.js:17322
  Ext.define.fire sencha-touch-all-debug.js:17249
  Ext.define.doDispatchEvent sencha-touch-all-debug.js:22349
  Ext.define.dispatch sencha-touch-all-debug.js:58971
  Ext.define.publish sencha-touch-all-debug.js:59031
  Ext.define.doFire sencha-touch-all-debug.js:17322
  Ext.define.fire sencha-touch-all-debug.js:17249
  Ext.define.doDispatchEvent sencha-touch-all-debug.js:22349
  Ext.define.dispatchEvent sencha-touch-all-debug.js:22330
  Ext.define.doFireEvent sencha-touch-all-debug.js:26577
  Ext.define.fireAction sencha-touch-all-debug.js:26566
  (anonymous function) sencha-touch-all-debug.js:27246
  Ext.define.onTabTap sencha-touch-all-debug.js:76344
  Ext.define.doFire sencha-touch-all-debug.js:17322
  Ext.define.fire sencha-touch-all-debug.js:17249
  Ext.define.doDispatchEvent sencha-touch-all-debug.js:22349
  Ext.define.dispatch sencha-touch-all-debug.js:58971
  Ext.define.publish sencha-touch-all-debug.js:59031
  Ext.define.doFire sencha-touch-all-debug.js:17322
  Ext.define.fire sencha-touch-all-debug.js:17249
  Ext.define.doDispatchEvent sencha-touch-all-debug.js:22349
  Ext.define.dispatchEvent sencha-touch-all-debug.js:22330
  Ext.define.doFireEvent sencha-touch-all-debug.js:26577
  Ext.define.fireAction sencha-touch-all-debug.js:26566
  Ext.define.onTap sencha-touch-all-debug.js:56146
  Ext.define.doFire sencha-touch-all-debug.js:17322
  Ext.define.fire sencha-touch-all-debug.js:17249
  Ext.define.doDispatchEvent sencha-touch-all-debug.js:22349
  Ext.define.dispatch sencha-touch-all-debug.js:17687
  Base.implement.callParent sencha-touch-all-debug.js:4516
  Ext.define.dispatch sencha-touch-all-debug.js:23074
  Ext.define.doPublish sencha-touch-all-debug.js:23116
  Ext.define.publish sencha-touch-all-debug.js:23081
  Base.implement.callParent sencha-touch-all-debug.js:4516
  Ext.define.publish sencha-touch-all-debug.js:23473
  Ext.define.onRecognized sencha-touch-all-debug.js:23457
  Ext.define.fire sencha-touch-all-debug.js:17748
  Ext.define.onTouchEnd sencha-touch-all-debug.js:24429
  Ext.define.invokeRecognizers sencha-touch-all-debug.js:23523
  Ext.define.onTouchEnd sencha-touch-all-debug.js:23672
  override.processEvent sencha-touch-all-debug.js:23744
  Ext.define.onEvent sencha-touch-all-debug.js:23350
  Base.implement.callParent sencha-touch-all-debug.js:4516
  override.onEvent sencha-touch-all-debug.js:23740
  (anonymous function) sencha-touch-all-debug.js:3128
  </code></pre>
  
  <p>This is my tab panel</p>
  
  <pre><code>    Ext.define('myapp.view.myTab', {
      extend : 'Ext.TabPanel',
      xtype : 'mytab',
      requires : [ 'myapp.view.FirstTab', 'myapp.view.SecondTab',
              'myapp.view.ThirdTab', 'myapp.view.FourthTab' ],
      id : 'mytab',
      config : {
          fullscreen : true,
          tabBarPosition : 'bottom',
          ui: 'myUI',
          items : [ {
              xtype : 'firsttab',
              iconCls : 'broadcast',
              title : 'first tab'
          }, {
              xtype : 'secondtab',
              iconCls : 'user_fave',
              title : 'second tab'
          },{
              xtype : 'thirdtab',
              iconCls : 'user3',
              title : 'third tab'
          },{
              xtype : 'fourthtab',
              iconCls : 'address_book',
              title : 'Contacts',
              id : 'Fourth Tab'
          } ],
          listeners : {
              activeitemchange : function() {
                  var token = localStorage.token;
                  if (token == undefined || token == '') {
                      this.setActiveItem(0);
                      // this.getAt(0).setActiveItem('firsttab');
                  }
              }
          }
      }
  });
  </code></pre>