Ext.BLANK_IMAGE_URL = "Images/Empty.gif";
Ext.namespace('LRFIndex');

LRFIndex.Main = {
	
	showArticle : function(iId) {
		Ext.select('div[id*=BOX_FULL]').addClass('x-hidden');
		Ext.get( iId + '_FULL').removeClass('x-hidden');
	},
			
	init : function() 
	{
		Ext.state.Manager.setProvider(new Ext.state.CookieProvider());

    var tools = [{
        id:'right',
        handler: function(iClick, iDom, iConf){
					LRFIndex.Main.showArticle(iConf.id);
        }
    }];

		var lPanel = new Ext.Panel({
			layout:'column',
			renderTo:'ContentId',
			baseCls:'x-plain',
			items:[ new Ext.ux.Portal({
				width:550,
				renderTo:'ContentId',
				baseCls:'x-plain',
	      items:[{
						width:150,
	          style:'padding:10px 0 10px 20px',
						baseCls:'x-plain',
	          items:[{
							id:'ARTICLE1_BOX',
							title:'Warlock DPS',
							contentEl: 'Article1',
							tools:tools
	          }]
	      },{
	          width:140,
	          style:'padding:10px 0 10px 10px',
						baseCls:'x-plain',
	          items:[{
								id:'ARTICLE2_BOX',
	              title: 'Site Translate',
	              contentEl: 'Article2',
								tools:tools
	          }]
	      },{
	          width:140,
	          style:'padding:10px 0 10px 10px',
						baseCls:'x-plain',
	          items:[{
								id:'ARTICLE3_BOX',
	              title: 'Wire to Solid',
	              contentEl: 'Article3',
								tools:tools
	          }]						
	      }]
    	}),{
				width:350,
	      style:'padding:10px 10px 10px 0',
				baseCls:'x-plain',
				items:[{
					id:'SELECTED_ARTICLE_BOX',
					title:'Selected Article',
					draggable:false,
					contentEl:'SelectedArticle'
				}]
    	}]
		});

		// Menus !
		var lMenu = Ext.get('MENU_TAB_HOME');
		var lBlog = Ext.get('MENU_TAB_BLOG');
		var lContact = Ext.get('MENU_TAB_CONTACT');
		var lOptions = {duration:0.1, easing: 'easeNone'};

		var lTest = Ext.select('div[id*=MENU_TAB]');
   
		lMenu.on({
	    'mouseover' : function() {lTest.stopFx(); lBlog.setWidth(95,lOptions); lContact.setWidth(110,lOptions); lMenu.setWidth( 170, lOptions );},
	    'mouseout' : function() {lTest.setWidth( 125, lOptions );}
		});
		lBlog.on({
	    'mouseover' : function() {lTest.stopFx(); lBlog.setWidth(170,lOptions); lContact.setWidth(110,lOptions); lMenu.setWidth( 95, lOptions );},
	    'mouseout' : function() {lTest.setWidth( 125, lOptions );}
		});		
		lContact.on({
	    'mouseover' : function() {lTest.stopFx(); lBlog.setWidth(95,lOptions); lContact.setWidth(170,lOptions); lMenu.setWidth( 110, lOptions );},
	    'mouseout' : function() {lTest.setWidth( 125, lOptions );}
		});		
		
	}
}

Ext.onReady(LRFIndex.Main.init, LRFIndex.Main, true);