Ext.namespace('SilverMapper');

SilverMapper = function( config ) {
	
	var details = new SilverMapper.Detail();
	var clusterGrid = new SilverMapper.ClusterGrid();
	this.layers = new SilverMapper.Layers();
	this.map = new SilverMapper.Map();
	this.help = new SilverMapper.Help();
	var specimenGrid = new SilverMapper.SpecimenGrid();

	var header = new Ext.Panel({
			id: 'sm-header'
		,	title: Lang.Get('Core','general','title')
		,	border: false
		, bodyStyle: 'display: none'
		,	region: 'north'
	});

	var recordsCard = new Ext.Panel({
			layout:'card'
		,	id: 'sm-recordsCard'
		,	title: Lang.Get('Core','general','records_title')
  	,	activeItem: 0
		,	border: false
		,	items: [ clusterGrid, specimenGrid ]
	});

	var tabs = new Ext.TabPanel({
			activeTab: 0
		,	id: 'sm-tabs'
		,	split: true
		,	minWidth: 150
		,	frame: true
		,	region: 'east'
		,	minTabWidth: 115
		,	tabWidth: 135
		,	enableTabScroll: true
		,	width: 325
		,	border: false
 		,	deferredRender: false
		,	items: [ recordsCard, this.layers, { xtype: 'sm-filter' }, this.help ]
	});
	
	this.timeline = new SilverMapper.Timeline({ region: 'south', height: 175 });

	var mapContainer = new Ext.Panel({
			border: false
		, layout: 'border'
		,	region: 'center'
		, items: [ 
					this.map
				, this.timeline 
			]
	});

	Ext.apply(this, config, {
			layout:'border'
		,	id: 'sm'
		,	showTimeline: true
		,	items: [ header, details, mapContainer, tabs ]
		,	listeners: {
				'render': function() {
					var task = new Ext.util.DelayedTask();
  	      task.delay( 1500, this.map.getMarkers, this.map, [ 0 ] );
				}
			}
	});

	SilverMapper.superclass.constructor.apply(this, arguments);

	this.on('afterlayout', function() {
	}, this, {single: true, delay: 1 });

};

Ext.extend( SilverMapper, Ext.Viewport, {
						 
});