/********************************************************************

	FOREX.COM - CHART VIEWER
	
	=========================================
	Author: Chris Erwin (chris@teehanlax.com)
	Agency: teehan+lax
	Date: July 7, 2008
	=========================================
	
	Properties
	-------------------------------------------------------------
	fundListTable - the HTML element for the fund list table
	fundListTableRows - the rows in the table
	currChartRow - the HTML element of the currently selected table row
	chartInterval - the interval sent to the server side script (only used as a sample)
	pageID - the pageid that gets sent to the server side script (only used as a sample)
	
	
	Public Methods
	-------------------------------------------------------------
	init
		Arguments:
			- pageID (string) : this gets passed in the HTTP Request Object for use on the server side
	
	
	Internal 'Private' Methods
	-------------------------------------------------------------
	setHover
		Arguments: none		
		Returns: null
	
	clearHover
		Arguments: none		
		Returns: null
	
	requestChart
		Arguments: none		
		Returns: false
		
	updateChart
		Arguments: none		
		Returns: false
	
	
	Dependencies
	-------------------------------------------------------------
	- MooTools 1.2
	
	
	HTML Markup Sample
	-------------------------------------------------------------
	_widget_samples/chart_viewer.html
	
	
	Response Sample
	-------------------------------------------------------------
	{
		"name" : "CAD/USD",
		"link" : "something.html?id=whatever",
		"chart_img": "/resources/images/_samples/chart_homepage_cad_usd.jpg"
	}
	
	Notes
	-------------------------------------------------------------
	- the HTTP Request is formatted as JSON in the requestChart method, feel free to modify this request to meet your needs.
		- JSON FORMAT:
			{
				'key':'value',
				'key2':'value2',
				'key3':'value3'
			}
		- the request can be sent as either get (jsonRequest.get) or post (jsonRequest.post)
		- the JSON gets sent as normal get or post key/value pairs
		
	
*********************************************************************/
var chartViewer = {
	fundListTable : null,
	fundListTableRows : null,
	currChartRow : null,
	chartInterval : 30,
	pageID : 'homepage',
	
	init : function(pageID) {
		// Pass in the page id
		chartViewer.pageID = pageID;
		
		chartViewer.fundListTable = $('fund_list_table');
		chartViewer.fundListTableRows = $('fund_list_table').getElements('tr');
		
		defaultChartRow = chartViewer.fundListTableRows[1];
		
		defaultChartRow.addClass('active');
		
		chartViewer.currChartRow = defaultChartRow;
		
		chartViewer.fundListTableRows.addEvent('mouseover', chartViewer.setHover);
		chartViewer.fundListTableRows.addEvent('mouseout', chartViewer.clearHover);
		chartViewer.fundListTableRows.addEvent('click', chartViewer.requestChart);
	},
	
	setHover : function() {
		if(! this.hasClass('headings')) {
			this.addClass('hover');
		}
	},
	
	clearHover : function() {
		if(! this.hasClass('headings')) {
			this.removeClass('hover');
		}
	},
	
	requestChart : function() {
		if(! this.hasClass('headings')) {
			var chartRowID = this.id;
			var chartRow = $(chartRowID);
			
			chartIDs = chartRowID.split('_');
			
			BaseID = chartIDs[0];
			QuoteID = chartIDs[1];
			
			var jsonRequest = new Request.JSON({url: "/_pair_chart_request.php", onComplete: function(jsonResponse){
				chartViewer.updateChart(jsonResponse);
				chartViewer.currChartRow.removeClass('active');
				chartRow.addClass('active');
				chartViewer.currChartRow = chartRow;
			}})

			jsonRequest.get({'base': BaseID, 'quote': QuoteID, 'interval': chartViewer.chartInterval, 'pageid': chartViewer.pageID});
		}
	},
	
	updateChart : function(jsonResponse) {		
		var chartNameLink = $('pair_chart_view').getElement('a.title');
		var chartImage = $$('.chart_image')	[0];	/*$('pair_chart_view').getElement('.chart_image');*/
		
		chartNameLink.href = jsonResponse.link;
		chartNameLink.set('html', jsonResponse.name);
		chartImage.src = jsonResponse.chart_img;
	}
}