/**
*	This file holds the logic for visualizing the chart and its JS controls.
*	It works with the Ext JS library, so it must be included in the script path of the current page.
*/
	Ext.onReady(function() {
		
		var obsPanel = new Ext.Panel({			
			autoLoad: "/chart/observations/DJI/MAX/",
			renderTo: "chart_footer"
		});
		
		new Ext.Panel({
			autoLoad: "/chart/fullTable/",
			renderTo: "cognity_table"
		});		
				
		var indexStore = new Ext.data.Store({			
				autoLoad:true,				
					// url: '/chart/indices/',					
					listeners: {
						loadexception: function(a, b, c, d) {
							debugger;
							Ext.Msg.alert('Status',"Load Exception");
						}
					},
					reader: new Ext.data.JsonReader({				
						// totalProperty: 'total',
						root: 'indices',
						id:   'code'           						
					}, [
						{name: 'flag'},
						{name: 'code'},
						{name: 'display'}					
					])				
					, data: {"indices": [
	 {"flag": "US", "code": "DJI", "display": "Dow Jones Ind."},
	 {"flag": "Germany", "code": "DE.R-EUR", "display": "MSCI Germany"},
	 {"flag": "US", "code": "GSPC", "display": "S&P 500"},
	 {"flag": "France", "code": "FR.R-EUR", "display": "MSCI France"},
	 {"flag": "UK", "code": "GB.R-GBP", "display": "MSCI UK"},	 
	 {"flag": "Japan", "code": "JP.R-JPY", "display": "MSCI Japan"},
	 {"flag": "Russia", "code": "RU.R-USD", "display": "MSCI Russia"},
	 {"flag": "US", "code": "RUT", "display": "Russell 2000"}]}					
			});
			
			var indexCombo = new Ext.form.ComboBox({
				id: "indexCombo",
				store: indexStore,
				displayField:'display',
				fieldLabel: 'Select: ',
				disableKeyFilter: true,
				typeAhead: false,
				//mode: 'remote',
				mode: 'local',
				editable: false,
				triggerAction: 'all',
				value: "S&P 500",
				valueField: 'display',
				emptyText:'Select a name...',
				selectOnFocus: true,
				width: 135,				
				height: 25,
				style: "margin-top:2px"
			});	
				
			var	twCombo = new Ext.form.ComboBox({
				id: "twCombo",
				store: new Ext.data.Store ({							
					reader: new Ext.data.ArrayReader(
						{idIndex: 0},
						[{name: 'timeWindow', type: 'int'}] 
					),
					data : [[5],[8],[10],[15],[20],[25],[30]]
				}),
				displayField: 'timeWindow',
				fieldLabel: 'Time Window: ',
				typeAhead: true,
				mode: 'local',
				forceSelection: true,
				triggerAction: 'all',
				emptyText: 'Select Time Window',
				value: 10,
				selectOnFocus: true,
				width: 50,
				height: 25
				,style: "margin-top:2px"
			});
			
			var tb = new Ext.Toolbar({
				renderTo: 'chart_toolbar',
				height: 29,
				// defaults: {
					// style: "padding-left: 5px; padding-right: 2px"
				// },
				items: [
					{
						text: " Index: ",
						xtype: "label"
						,style: "padding-left: 5px; padding-right: 2px;"
					},
					indexCombo,
					{
						text: " Time Window: ",
						xtype: "label"
						,style: "padding-left: 5px; padding-right: 2px;"
					},
					twCombo, 
					{
						xtype: "button",
						cls: "x-btn-text",
						text: " Pop Out",
						style: "padding-left: 5px; padding-right: 2px;",
						handler: popOut.createDelegate(indexCombo)
				}]			
			});		
					
			indexCombo.on("select", redrawAmstock.createDelegate(indexCombo));		
			twCombo.on("select", redrawAmstock.createDelegate(indexCombo));						
			
			//indexCombo.getStore().load();		
			
			function redrawAmstock () {				
				
				var selectionIndex = (this.selectedIndex == -1) ? 0 : this.selectedIndex; 
				var indx =  this.store.data.items[selectionIndex].data.code;	
				url = "/chart/dailyVarStats/" + indx + "/" + Ext.get("twCombo").getValue() + "/900/800/";
				
				var amStockFrame = document.getElementById("amStockFrame");
				if (amStockFrame) amStockFrame.src = url;
				
				url = "/chart/dailyVarSettings/" + indx + "/" + Ext.get("twCombo").getValue();
				var theSWF  = findSWF("amstock");
				if (theSWF != null) {
					theSWF.reloadSettings(url);
				}
				
				obsPanel.load({
					url: "/chart/observations/" +indx+"/MAX/",					
					text: "Loading..."
				});		
			}
	});
	
function popOut() {
	//var indexes = document.getElementById("indexes");
	var browserWidth = 0, browserHeight = 0;
	if( typeof( window.innerWidth ) == 'number' ) {
	//Non-IE
	browserWidth = window.innerWidth;
	browserHeight = window.innerHeight;
	} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
	//IE 6+ in 'standards compliant mode'
	browserWidth = document.documentElement.clientWidth;
	browserHeight = document.documentElement.clientHeight;
	} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
	//IE 4 compatible
	browserWidth = document.body.clientWidth;
	browserHeight = document.body.clientHeight;
	}
	//window.alert( 'Width = ' + browserWidth );
	//window.alert( 'Height = ' + browserHeight );
	browserWidth = browserWidth - 100;
	browserHeight = browserHeight - 100;	
	var selectionIndex = (this.selectedIndex == -1) ? 0 : this.selectedIndex; 
	var indx =  this.store.data.items[selectionIndex].data.code;			
	var url = "/chart/dailyVarStats/"+indx+"/"+Ext.get("twCombo").getValue()+"/"+browserWidth+"/"+browserHeight;
	window.open(url, indx + "_Id", "location=0, status=0,resizable=1, scrollbars=1, width="+browserWidth + ", height=" + browserHeight);
}	
	
function addCopyrightText(cpr) {
	cpr.innerHTML = "<span style='font-size:9px;text-align:center;width:100%'>Copyright &copy; 2008 FinAnalytica Inc. Provided for informational purposes only and not intended for trading or 	advice.</span>";
}

function createButton(btnConf, defConf) {
	Ext.applyIf(btnConf, defConf);
	return btnConf;
}

function findSWF(movieName) {
	return document.getElementById(movieName);
}