/**
 * Main driver for laying out the gold viewer and loading gold trees
 * 
 * @author Dwight VanTuyl
 */

//setup ext
Ext.BLANK_IMAGE_URL = '/js/extjs/resources/images/default/s.gif';
Ext.state.Manager.setProvider(new Ext.state.CookieProvider());

//start when html page is fully loaded
Ext.onReady(function(){

  Ext.QuickTips.init();
  
  //apply layout to header panel in html 
  var headerPanel = new Ext.Panel({
    applyTo: 'header-panel',
    region: 'north'
  });
  
  //apply layout to center panel in html
  var centerPanel = new Ext.Panel({
    applyTo: 'center-panel',
    region: 'center',
    autoScroll: true
  }); 
  
  //setup tree panels
  //able to add more tree panels by adding a new Tree Panel to list
  var trees = [
    new TreePanel({title: "Full"}),
    new TreePanel({title: "Part Of Speech Property", root: "PartOfSpeechProperty"}),
    new TreePanel({title: "Morphosyntactic Property", root: "MorphosyntacticProperty"}),
    new TreePanel({title: "Phonetic Property", root: "PhoneticProperty"}),
    new TreePanel({title: "Morphosemantic Property", root: "MorphosemanticProperty"})
  ];
  
  //add all tree panels to right side browser tab panel
  var browserPanel = new Ext.TabPanel({
    region: 'east',
    split: true,
    activeTab: 0,
    width: 300,
    border: false,
    stateId:'tabviewerpanel',
    stateEvents:['tabchange'],
    
    //get tab state from cookie on page reload
    getState:function() {
      return {
        activeTab:this.items.indexOf(this.getActiveTab())
      };
    },
    enableTabScroll:true,
    defaults: {autoScroll:true, closable:false},
    items: trees
  });
 
  //add everything to the viewport
  var viewport = new Ext.Viewport({
    layout: 'border',
    border: false,
    items: [headerPanel, browserPanel,centerPanel]
  });
});