Ext.namespace('Ext.mainPage.controlPanel');

Ext.mainPage.controlPanel.renderControlPanel = function(){
  controlPanel = new Ext.TabPanel({
    renderTo: 'control_panel',
    width:653,
    activeTab: 0,
    frame:true,
    cls: 'ext-reset',
    defaults:{autoHeight: true},
    items:[
        {contentEl:'key_words', title: 'Hľadanie štátnych inštitúcií, škôl a firiem',id:'key_words_tab'},
        {contentEl:'streets_form', title: 'Ulice',id:'streets_tab'}
    ]
  });
  
  var layerSwitcher = new Ext.TabPanel({
    renderTo: 'switch_layer_panel',
    width:307,
    activeTab: 0,
    frame:true,
    defaults:{autoHeight: true},
    cls: 'ext-reset',
    bodyCfg:{
      cls:'.x-tab-panel-body2'
    },
    items:[
        {contentEl:'vector_layer', title: 'Vektorová mapa',id:'vector_layer'},
        {contentEl:'orto_layer', title: 'Orto-foto mapa',id:'orto_layer'},
        {contentEl:'hybrid_layer', title: 'Hybridná mapa',id:'hybrid_layer'}
    ]
  });
  
  layerSwitcher.on('tabchange',function(tabPanel,tab){
    if(tab.getItemId()=='vector_layer'){
      map.setBaseLayer(vector);
      document.getElementById("map").style.backgroundColor="#DEDED1";
    } 
    else if(tab.getItemId()=='orto_layer') {
      map.setBaseLayer(orto);
      document.getElementById("map").style.backgroundColor="white";
    }
    else if(tab.getItemId()=='hybrid_layer') {
      map.setBaseLayer(hybrid);
      document.getElementById("map").style.backgroundColor="white";
    }
  });
}