Ext.onReady(function(){	
	Ext.BLANK_IMAGE_URL = "./img/inv.gif"
	
	var centerpanelId = Ext.id();
	var southpanelId = Ext.id();
	var ueberunsButtonId = Ext.id();
	var unternehmenTabId = Ext.id();
	var treePanelId = Ext.id();
	var refCenterPanelId = Ext.id();
	
	
	var myWindowPanel = new Ext.Panel({	
		layout: 'accordion',
		layoutConfig:{
			animate:true
		},
		border: false,
		bodyBorder: false,		
		items: [{
      		title: 'Geschäftsführung',
      		autoLoad: { url:'ueberuns_gf.html', scripts:true}	
		},{
      		title: 'Softwareentwicklung',
      		autoLoad: { url:'ueberuns_se.html', scripts:true}	
		},{
			title: 'Buchhaltung',
      		autoLoad: { url:'ueberuns_bh.html', scripts:true}			
		},
		{
			title: 'Auszubildende',
      		autoLoad: { url:'ueberuns_azb.html', scripts:true}
		}]
	});
	
	var myWindow = new Ext.Window({
		title: 'Über uns',
		layout: 'fit',
		modal: true,
		maximizable: false,
		bodyBorder: false,
		height: 600,
		width: 800,
		closeAction: 'hide',
		buttonAlign: 'center',
		items:[myWindowPanel],
		buttons:[{
			text: 'Schließen',
			handler: function(){
				myWindow.hide();
			}
		}]
	});
	
	var myImpressumPanel = new Ext.Panel({	
		layout: 'fit',		
		border: false,
		bodyBorder: false,
		autoLoad: {url:'impressum.html',scripts:true}				
	});
	
	var myImpressum = new Ext.Window({
		title: 'Impressum',
		layout: 'fit',
		modal: true,
		maximizable: false,
		bodyBorder: false,
		height: 360,
		width: 340,
		closeAction: 'hide',
		buttonAlign: 'center',
		items:[myImpressumPanel],
		buttons:[{
			text: 'Schließen',
			handler: function(){
				myImpressum.hide();
			}
		}]
	});
	
	var myTabPanel = new Ext.TabPanel({
		border: false,
		items: [
			{
				title: 'Das Unternehmen',
				id: unternehmenTabId,
				layout: 'fit',
				border: false,					
				items: [
					{		 						
						xtype: 'panel',
						layout: 'border',
						border: false,						
						items: [
							{
								id: centerpanelId,
								region: 'center',
								border: false,
								autoLoad: 'unternehmen.html',								
								cls: 'inhalt'/*,		
								bbar:[{
										xtype: 'button',
										text: 'Über uns',
										style: 'float: left;',
										handler: function(){																						
											myWindow.show();																						
										} //Handler zu																																																																																					 																														
									},'->', //Items zu
									{
										xtype: 'button',
										style: 'float: right;',
										text: 'Impressum',
										handler: function(){																						
											myImpressum.show();																						
										}										
									}]	*/													
							},
							{
								region: 'north',
								border: false,		
								height: 45,								
								html: '<br>&nbsp;&nbsp;&nbsp;' +
										'<img src="./img/Ueberschrift_DasUnternehmen.gif">' 							
							},
							{
								id: southpanelId,
								region: 'south',
								border: false,		
								height: 60/*,
								tbar:[{
										xtype: 'button',
										text: 'Über uns',
										style: 'float: left;',
										handler: function(){																						
											myWindow.show();																						
										} //Handler zu																																																																																					 																														
									},'->', //Items zu
									{
										xtype: 'button',
										style: 'float: right;',
										text: 'Impressum',
										handler: function(){																						
											myImpressum.show();																						
										}										
									}]		*/												
							}]															
					}]						
			},
			{
			  	title: 'Leistungen',
			  	layout: 'fit',
			  	border: false,
				items: [
					{		 						
						xtype: 'panel',
						layout: 'border',
						border: false,						
						items: [
							{
								region: 'center',
								border: false,
								autoLoad: 'leistungen_beratung.html',
								cls: 'inhalt_klein'
							},
							{
								region: 'west',
								border: false,
								width: 266,
								autoLoad: 'leistungen_entwicklung.html',
								cls: 'inhalt_klein'
							},
							{
								region: 'east',
								border: false,
								width: 266,
								autoLoad: 'leistungen_hosting.html',
								cls: 'inhalt_klein'									
							},
							{
								region: 'north',
								border: false,
								height: 45,
								html: '<br>&nbsp;&nbsp;&nbsp;' +
										'<img src="./img/Ueberschrift_Leistungen.gif">'
							}]
					}]				  			    
			},
			{
			   	title: 'Referenzen',			   	
			   	layout: 'fit',
			   	border: false,
			   						
				items: [
					{		 						
						xtype: 'panel',
						layout: 'border',						
						border: false,																		
						items: [
							{
								region: 'center',
								id: refCenterPanelId,
								border: false,
								bodyBorder: false,
								autoScroll: true,
								width: 250,
								height: 250,
								activeItem: 0,
								layout: 'card',
//								autoLoad: 'referenzen.html',
								cls: 'inhalt_klein',
								items: [
									{
										id: 'faw',
										autoLoad: 'ref_faw.html',
										border: false
									},
									{
										id: 'plakatunion2010',
										autoLoad: 'ref_plakatunion2010.html',
										border: false
									},
									{
										id: 'hagenerfeinstahl2010',
										autoLoad: 'ref_hagenerfeinstahl2010.html',
										border: false
									},
									{
										id: 'telekomDigital',
										autoLoad: 'ref_telekomDigital.html',
										border: false
									},
									{
										id: 'telekomClassic',
										autoLoad: 'ref_telekomClassic.html',
										border: false
									},
									{
										id: 'plakatunion2009',
										autoLoad: 'ref_plakatunion2009.html',
										border: false
									},
									{
										id: 'itworks2009',
										autoLoad: 'ref_itworks2009.html',
										border: false
									},
									{
										id: 'mediashop2008',
										autoLoad: 'ref_mediashop2008.html',
										border: false
									},                  
									{
								            id: 'selectMedia',
            								autoLoad: 'ref_selectmedia.html',
            								border: false										
									},
									{
								            id: 'planus',
            								autoLoad: 'ref_planus.html',
            								border: false										
									},
									{
								            id: 'joker',
            								autoLoad: 'ref_joker.html',
            								border: false										
									},
									{
								            id: 'crescendo',
            								autoLoad: 'ref_crescendo.html',
            								border: false										
									},
																		{
								            id: 'auktibus',
            								autoLoad: 'ref_auktibus.html',
            								border: false										
									},
									{
								            id: 'beloxx',
            								autoLoad: 'ref_beloxx.html',
            								border: false										
									},
									{
								            id: 'contrast',
            								autoLoad: 'ref_contrast.html',
            								border: false										
									},
									{
								            id: 'lueling',
            								autoLoad: 'ref_lueling.html',
            								border: false										
									},
																		{
								            id: 'wetter',
            								autoLoad: 'ref_wetter.html',
            								border: false										
									},
									{
								            id: 'ploon',
            								autoLoad: 'ref_ploon.html',
            								border: false										
									},
									{
								            id: 'reika',
            								autoLoad: 'ref_reika.html',
            								border: false										
									}
								]
							},
							{
								region: 'north',
								border: false,
								height: 65,
								html: '<br>&nbsp;&nbsp;&nbsp;' +
										'<img src="./img/Ueberschrift_Referenzen.gif">' +
										'<div class="ref_trennlinie"><hr></div>'
							},{
								region: 'west',
								xtype: 'treepanel',
								id: treePanelId,
								autoScroll: true,
								width: 200,
								collapsible: false,
								border: false,
								rootVisible: false       
							}]															
					}] 								    
			},
			{
			  	title: 'Kontakt',
			  	layout: 'fit',
			  	border: false,					
				items: [					
						{		 						
						xtype: 'panel',
						layout: 'border',
						border: false,						
						items: [
							{
								region: 'center',
								border: false,
								autoLoad: 'kontakt.html'
							},
							{
								region: 'north',
								border: false,
								height: 45,
								html:  '<br>&nbsp;&nbsp;&nbsp;' +
										'<img src="./img/Ueberschrift_Kontakt.gif">'
							}]															
					}]				
			}		
		],
		activeTab: 0,
		bbar:[{
			xtype: 'button',
			id: ueberunsButtonId,
			text: 'Über uns',
			style: 'float: left;',
			handler: function(){																						
				myWindow.show();																						
			} //Handler zu																																																																																					 																														
		},'->', //Items zu
		{
			xtype: 'button',
			style: 'float: right;',
			text: 'Impressum',
			handler: function(){																						
				myImpressum.show();																						
			}										
		}]				
	});
	
  /*
	myTabPanel.on('tabchange',function(Panel, tab){
		if (tab.id == unternehmenTabId){
			Ext.getCmp(ueberunsButtonId).show();
		}
		else{
			Ext.getCmp(ueberunsButtonId).hide();
		}
	});
  */
	
	var layerRoot = new Ext.tree.TreeNode({
        text: 'Referenzen',
        collapsible: false,
        expanded: true
    });
	
    Ext.getCmp(treePanelId).setRootNode(layerRoot);

//++++++++++Referenzen 2010++++++++++++++++++++++++++++++++++++++++++++++++++++++
    Root2010 = new Ext.tree.TreeNode({
          text: '2010', 
          allowDrag:false,
          leaf: false,
          expanded: true,
          iconCls: 'ref_main_icon'
      });

   layerRoot.appendChild(Root2010);

    var LeafNode2010_1 = new Ext.tree.TreeNode({
        text: 'FAW',
        allowDrag:false,
        leaf: true,
        iconCls: 'ref_sub_icon',
        listeners: {
                  'click': function(node){
                  	Ext.getCmp(refCenterPanelId).getLayout().setActiveItem('faw');
                  }
      	}
     }); 
    Root2010.appendChild(LeafNode2010_1);

    var LeafNode2010_2 = new Ext.tree.TreeNode({
        text: 'PLAKATUNION',
        allowDrag:false,
        leaf: true,
        iconCls: 'ref_sub_icon',
        listeners: {
                  'click': function(node){
                  	Ext.getCmp(refCenterPanelId).getLayout().setActiveItem('plakatunion2010');
                  }
      	}
     }); 
    Root2010.appendChild(LeafNode2010_2);

    var LeafNode2010_3 = new Ext.tree.TreeNode({
        text: 'Heinrich Stamm GmbH',
        allowDrag:false,
        leaf: true,
        iconCls: 'ref_sub_icon',
        listeners: {
                  'click': function(node){
                  	Ext.getCmp(refCenterPanelId).getLayout().setActiveItem('hagenerfeinstahl2010');
                  }
      	}
     }); 
    Root2010.appendChild(LeafNode2010_3);
        
//++++++++++Referenzen 2009++++++++++++++++++++++++++++++++++++++++++++++++++++++
    Root2009 = new Ext.tree.TreeNode({
          text: '2009', 
          allowDrag:false,
          leaf: false,
          expanded: true,
          iconCls: 'ref_main_icon'
      });

   layerRoot.appendChild(Root2009);

    var LeafNode2009_1 = new Ext.tree.TreeNode({
        text: 'Deutsche Telekom AG',
        allowDrag:false,
        leaf: true,
        iconCls: 'ref_sub_icon',
        listeners: {
                  'click': function(node){
                  	Ext.getCmp(refCenterPanelId).getLayout().setActiveItem('telekomDigital');
                  }
      	}
     }); 
    Root2009.appendChild(LeafNode2009_1);
	
    var LeafNode2009_2 = new Ext.tree.TreeNode({
        text: 'PLAKATUNION',
        allowDrag:false,
        leaf: true,
        iconCls: 'ref_sub_icon',
        listeners: {
                  'click': function(node){
                  	Ext.getCmp(refCenterPanelId).getLayout().setActiveItem('plakatunion2009');
                  }
      	}
     }); 
    Root2009.appendChild(LeafNode2009_2);
		
    var LeafNode2009_3 = new Ext.tree.TreeNode({
        text: 'It Works GmbH',
        allowDrag:false,
        leaf: true,
        iconCls: 'ref_sub_icon',
        listeners: {
                  'click': function(node){
                  	Ext.getCmp(refCenterPanelId).getLayout().setActiveItem('itworks2009');
                  }
      	}
     }); 
    Root2009.appendChild(LeafNode2009_3);
	
//++++++++++Referenzen 2008++++++++++++++++++++++++++++++++++++++++++++++++++++++
    Root2008 = new Ext.tree.TreeNode({
          text: '2008', 
          allowDrag:false,
          leaf: false,
          expanded: true,
          iconCls: 'ref_main_icon'
      });

   layerRoot.appendChild(Root2008);

    var LeafNode2008_1 = new Ext.tree.TreeNode({
        text: 'Deutsche Telekom AG',
        allowDrag:false,
        leaf: true,
        iconCls: 'ref_sub_icon',
        listeners: {
                  'click': function(node){
                  	Ext.getCmp(refCenterPanelId).getLayout().setActiveItem('telekomClassic');
                  }
      	}
     }); 
    Root2008.appendChild(LeafNode2008_1);
	
    var LeafNode2008_2 = new Ext.tree.TreeNode({
        text: 'planus media GmbH',
        allowDrag:false,
        leaf: true,
        iconCls: 'ref_sub_icon',
        listeners: {
                  'click': function(node){
                  	Ext.getCmp(refCenterPanelId).getLayout().setActiveItem('mediashop2008');
                  }
      	}
     }); 
    Root2008.appendChild(LeafNode2008_2);
	
//++++++++++Referenzen 2007++++++++++++++++++++++++++++++++++++++++++++++++++++++
    Root2007 = new Ext.tree.TreeNode({
          text: '2007', 
          allowDrag:false,
          leaf: false,
          expanded: true,
          iconCls: 'ref_main_icon'
      });

   layerRoot.appendChild(Root2007);

    var LeafNode2007_1 = new Ext.tree.TreeNode({
        text: 'select it media GmbH',
        allowDrag:false,
        leaf: true,
        iconCls: 'ref_sub_icon',
        listeners: {
                  'click': function(node){
                  	Ext.getCmp(refCenterPanelId).getLayout().setActiveItem('selectMedia');
                  }
      	}
     }); 
    Root2007.appendChild(LeafNode2007_1);

//++++++++++Referenzen 2006++++++++++++++++++++++++++++++++++++++++++++++++++++++    
    Root2006 = new Ext.tree.TreeNode({
          text: '2006', 
          allowDrag:false,
          leaf: false,
          expanded: true,
          iconCls: 'ref_main_icon'
      });
   layerRoot.appendChild(Root2006);

    var LeafNode2006_1 = new Ext.tree.TreeNode({
        text: 'planus media GmbH',
        allowDrag:false,
        iconCls: 'ref_sub_icon',
        leaf: true,
        listeners: {
                  'click': function(node){
                  	Ext.getCmp(refCenterPanelId).getLayout().setActiveItem('planus');
                  }
      	}
     }); 
    Root2006.appendChild(LeafNode2006_1);	
	
	var LeafNode2006_2 = new Ext.tree.TreeNode({
        text: 'Joker Online Computer',
        allowDrag:false,
        iconCls: 'ref_sub_icon',
        leaf: true,
        listeners: {
                  'click': function(node){
                  	Ext.getCmp(refCenterPanelId).getLayout().setActiveItem('joker');
                  }
      	}
     }); 
    Root2006.appendChild(LeafNode2006_2);	

//++++++++++Referenzen 2005++++++++++++++++++++++++++++++++++++++++++++++++++++++	
	Root2005 = new Ext.tree.TreeNode({
		text: '2005', 
		allowDrag:false,
		leaf: false,
		expanded: true,
		iconCls: 'ref_main_icon'
	});
	layerRoot.appendChild(Root2005);
	
	var LeafNode2005_1 = new Ext.tree.TreeNode({
		text: 'Crescendo Award',
		allowDrag:false,
		iconCls: 'ref_sub_icon',
		leaf: true,
		listeners: {
          'click': function(node){
              	Ext.getCmp(refCenterPanelId).getLayout().setActiveItem('crescendo');
              }
  		}
 	}); 
	Root2005.appendChild(LeafNode2005_1);	

	var LeafNode2005_2 = new Ext.tree.TreeNode({
    	text: 'Auktibus GmbH',
		allowDrag:false,
		iconCls: 'ref_sub_icon',
		leaf: true,
		listeners: {
          'click': function(node){
              	Ext.getCmp(refCenterPanelId).getLayout().setActiveItem('auktibus');
              }
  		}
 	}); 
	Root2005.appendChild(LeafNode2005_2);
	
//++++++++++Referenzen 2004++++++++++++++++++++++++++++++++++++++++++++++++++++++	
	Root2004 = new Ext.tree.TreeNode({
		text: '2004', 
		allowDrag:false,
		leaf: false,
		expanded: true,
		iconCls: 'ref_main_icon'
	});
	layerRoot.appendChild(Root2004);
	
	var LeafNode2004_1 = new Ext.tree.TreeNode({
		text: 'Beloxx GmbH & Co. KG',
		allowDrag:false,
		iconCls: 'ref_sub_icon',
		leaf: true,
		listeners: {
          'click': function(node){
              	Ext.getCmp(refCenterPanelId).getLayout().setActiveItem('beloxx');
              }
  		}
 	}); 
	Root2004.appendChild(LeafNode2004_1);
	
//++++++++++Referenzen 2003++++++++++++++++++++++++++++++++++++++++++++++++++++++
	Root2003 = new Ext.tree.TreeNode({
		text: '2003', 
		allowDrag:false,
		leaf: false,
		expanded: true,
		iconCls: 'ref_main_icon'
	});
	layerRoot.appendChild(Root2003);
	
	var LeafNode2003_1 = new Ext.tree.TreeNode({
		text: 'CONTRAST AG',
		allowDrag:false,
		iconCls: 'ref_sub_icon',
		leaf: true,
		listeners: {
          'click': function(node){
              	Ext.getCmp(refCenterPanelId).getLayout().setActiveItem('contrast');
              }
  		}
 	}); 
	Root2003.appendChild(LeafNode2003_1);	

//++++++++++Referenzen 2002++++++++++++++++++++++++++++++++++++++++++++++++++++++

	Root2002 = new Ext.tree.TreeNode({
		text: '2002', 
		allowDrag:false,
		leaf: false,
		expanded: true,
		iconCls: 'ref_main_icon'
	});
	layerRoot.appendChild(Root2002);
	
	var LeafNode2002_1 = new Ext.tree.TreeNode({
		text: 'BURG F.W. Lüling KG',
		allowDrag:false,
		iconCls: 'ref_sub_icon',
		leaf: true,
		listeners: {
          'click': function(node){
              	Ext.getCmp(refCenterPanelId).getLayout().setActiveItem('lueling');
              }
  		}
 	}); 
	Root2002.appendChild(LeafNode2002_1);	

	var LeafNode2002_2 = new Ext.tree.TreeNode({
    	text: 'Stadt Wetter',
		allowDrag:false,
		iconCls: 'ref_sub_icon',
		leaf: true,
		listeners: {
          'click': function(node){
              	Ext.getCmp(refCenterPanelId).getLayout().setActiveItem('wetter');
              }
  		}
 	}); 
	Root2002.appendChild(LeafNode2002_2);
	
//++++++++++Referenzen 2001++++++++++++++++++++++++++++++++++++++++++++++++++++++	
	Root2001 = new Ext.tree.TreeNode({
		text: '2001', 
		allowDrag:false,
		leaf: false,
		expanded: true,
		iconCls: 'ref_main_icon'
	});
	layerRoot.appendChild(Root2001);
	
	var LeafNode2001_1 = new Ext.tree.TreeNode({
		text: 'Ploon GmbH',
		allowDrag:false,
		iconCls: 'ref_sub_icon',
		leaf: true,
		listeners: {
          'click': function(node){
              	Ext.getCmp(refCenterPanelId).getLayout().setActiveItem('ploon');
              }
  		}
 	}); 
	Root2001.appendChild(LeafNode2001_1);	
	
//++++++++++Referenzen 2000++++++++++++++++++++++++++++++++++++++++++++++++++++++
	Root2000 = new Ext.tree.TreeNode({
		text: '2000', 
		allowDrag:false,
		leaf: false,
		expanded: true,
		iconCls: 'ref_main_icon'
	});
	layerRoot.appendChild(Root2000);
	
	var LeafNode2000_1 = new Ext.tree.TreeNode({
		text: 'Reika Werk GmbH ',
		allowDrag:false,
		iconCls: 'ref_sub_icon',
		leaf: true,
		listeners: {
          'click': function(node){
              	Ext.getCmp(refCenterPanelId).getLayout().setActiveItem('reika');
              }
  		}
 	}); 
	Root2000.appendChild(LeafNode2000_1);
	
//++++++++++Referenzen ENDE++++++++++++++++++++++++++++++++++++++++++++++++++++++	
//  		
	var mycenterPanel = new Ext.Panel({	
		region: 'center',
		layout: 'fit',
		items:  [
			myTabPanel
		],
		border: false
	});
	
	var mynorthPanel = new Ext.Panel({
		region: 'north',					
		height: 100,
		html: '<div style="margin-right:12px;">' +
				'<img src="./img/Logo_MGGM.gif" align="right">' +
				'</div>',		
		border: false
	});		
		
	var myBorderPanel = new Ext.Panel({
		layout: 'border',
		items:[mycenterPanel, mynorthPanel],
		renderTo: 'seite',
		width: 800,
		height: 640,
		border: false
	});
});