include('flowplayer/flowplayer-3.1.4.min.js');
include('js/vdslide.js');

activemenu = 2;

Ext.namespace('VD');

VD.CenterPanel = Ext.extend(Ext.Panel, {
	initComponent: function (){		
		var config = {	
			layout: 'table',
			id: 'explore-table',
			layoutConfig: {	        
		        columns: 2
		    },
		    items: [{
		    	xtype: 'vd_slide',
	        	id: 'center-img',
	        	cellId: 'explore-center',
	        	slides: [
	        	         'http://d33yedrtgjxwfm.cloudfront.net/visualdomains/img/img/explore_1.png',
	        	         'http://d33yedrtgjxwfm.cloudfront.net/visualdomains/img/img/explore_2.png',
	        	         'http://d33yedrtgjxwfm.cloudfront.net/visualdomains/img/img/explore_3.png',
	        	         'http://d33yedrtgjxwfm.cloudfront.net/visualdomains/img/img/explore_4.png',
	        	         'http://d33yedrtgjxwfm.cloudfront.net/visualdomains/img/img/explore_5.png'
	        	         ]
		    },{
				xtype: 'container',
				id: 'explore-side',
				contentEl: 'content-side'	      
			},{
				xtype: 'container',
		        contentEl: 'thumbs-left'
			},{		        
				xtype: 'container',
		        contentEl: 'thumbs-right'
			}]
		};
		Ext.apply(this, config);
		Ext.apply(this.initialConfig, config);
		VD.CenterPanel.superclass.initComponent.call(this);
	},
	afterlayout: function() {
		VD.CenterPanel.superclass.afterlayout.call(this);
		Ext.get('center-img').on({
			load: {
	            fn: function(e) {
	                alert('loaded');
	            },
	            scope: this
	        }
		});
	}
});

Ext.reg('vd_center', VD.CenterPanel);

function setThumb(num){
	var slider = Ext.getCmp('center-img'); 
	slider.setSlide(num);
	var el = Ext.get('center-img'); 
	//dom.src = 'img/explore_' + num + '.png';
}