//*BEGIN MODULES.COM CORE*/
com = {
		esignalprod: {
          env: {},
          modules: {}
     }
}

//*END futuresource.COM CORE*/

//*Begin Base Module Class*/
com.esignalprod.modules.Base = Class.create({

	initialize: function() {
		document.observe("dom:loaded", this.observeElements.bind(this));////since this is an anonymous function we need to bind it to this
	},

	observeElements: function() {
		//alert("parent observe");
	},
	
	evalHtmlJavaScript:function(id){
		var tagId = $(id);
		
		var JScripts = tagId.getElementsByTagName("script");    
				for (var i = 0; i < JScripts.length; i++)   {       
						eval(JScripts[i].text);   
				}
	}
});
	
com.esignalprod.modules.BaseModule = Class.create(com.esignalprod.modules.Base, {
		
	initialize: function($super) {
		$super();
	},
	
	addLoadingImage: function(elementId, loadingStyle, loadingClass) {
		
    	if ($(elementId) != null && $(elementId + 'loadingImage') == null) {
			var src="/esignalprod/images/ajax-loader.gif";
	    	var imgElement = new Element('img', {'src': src, 'style':'border:0px;'});
			loadImageDivElement = new Element('div', {'id':elementId+'loadingImage', 'class': loadingClass, 'style': loadingStyle}).insert(imgElement).insert(' Loading...');
			$(elementId).insert(loadImageDivElement);
    	}
    },
    
	addLoadingImageOnly: function(elementId, loadingStyle, loadingClass) {
    	
    	if ($(elementId) != null && $(elementId + 'loadingImage') == null) {
			var src="/esignalprod/images/ajax-loader.gif";
	    	var imgElement = new Element('img', {'src': src, 'style':'border:0px; ' + loadingStyle, 'id':elementId+'loadingImage'});
			$(elementId).insert(imgElement);
		}
    },
    
    removeLoadingImage: function(elementId) {
    	if ($(elementId) != null && $(elementId + 'loadingImage') != null) $(elementId + 'loadingImage').remove();
    }
});

/**
 * Events that will be listened:
 * While writing (keypress) on 'symbol_id' update 'topsyms_id', 'topsyms_year_id', 'topsyms_months_id'
 * While writing (keypress) on 'compareto_id' update 'topsyms_id', 'topsyms_year_id', 'topsyms_months_id'
 * On select of contract, update the "Contract or CompareTo" whichever is focused.  Append Month and/year Year if selected
 * Default:Not defined, On select of Month, update the value if contract is selected else do nothing.
 * Default:Current Year, On select of Year, update the value (could be 0,1,2 or 2008,2007 compare dates) if contract is selected else do nothing.
 * 
 * @base com.esignalprod.modules.BaseModule
 * @extends com.esignalprod.modules.BaseModule
 */

com.esignalprod.modules.ChartPageModule = Class.create ( com.esignalprod.modules.BaseModule, {
	CONTRACT_CONVERTER : "contract",
 	YEAR_CONVERTER : "year",
 	MONTH_CONVERTER : "month",
 	EXCHANGE_CONVERTER : "exchange",
 	SESSION_CONVERTER : "session",
 	chartStyle : "chart_style_id",
	initialize: function($super) {
		$super();
		this.today = new Date();
	},
	observeElements : function($super) {
     	$super();
		
		this.aggregationEle = $('chart_aggregation_id');
		this.minutesEle = $('chart_minutes_id');
			
		//Remember the last minutes element selected 5,15,30,60 minutes
		if (this.aggregationEle.value != 'V') {
			this.minutesEle.disabled = true;
			this.minutesEle.value = '';
		}
		if (this.minutesEle.value != null && this.minutesEle.value != '') {
			this.minutesEle.oldValue = this.minutesEle.value;
		} 

		//If the aggregation value is Intraday then set the appropriate minutes
		Event.observe(this.aggregationEle, 'change', function(){
			if (this.aggregationEle.value == 'V') {
				this.minutesEle.disabled = false;
				if (this.minutesEle.oldValue != null && this.minutesEle.oldValue != '') {
					this.minutesEle.value = this.minutesEle.oldValue;
				} else {
					this.minutesEle.value = 15;
				}
			} else {
				this.minutesEle.disabled = true;
				this.minutesEle.value = '';
			}
			if (this.aggregationEle.value == 'T') {
				this.updateAggregationForTick();
			}
		}.bind(this));
		
     	this.updateAggregationForTick();
	},
	updateAggregationForTick : function () {
		if (this.aggregationEle.value == 'T') {
			if ($(this.chartStyle).value == 'BAR' || $(this.chartStyle).value == 'CANDLE') {
				$(this.chartStyle).value = 'LINE';
			}
		}
	}
	
});

com.esignalprod.modules.ChartOHLCModule = Class.create ( com.esignalprod.modules.BaseModule, {
	chartLinkUrl:'',
	mapName:'',
	chartImageId: '',
	initialize: function($super, chartBaseUrl, instanceName, chartImageId, mapName, chartLinkUrl) {
		$super();
		
		if (instanceName == null || instanceName == 'undefined') {
			this.instanceName = 'chartOHLCModule';
		} else {
			 this.instanceName = instanceName;
		}
		if (!(mapName) || mapName == null || mapName == 'undefined') {
			this.mapName = 'ohlcmap';
		} else {
			 this.mapName = mapName;
		}
				
		if (chartBaseUrl == null || chartBaseUrl == 'undefined') {
			this.chartBaseUrl = 'http://charts.quote.com/';//Adding this to prevent "Invalid Character" error in IE7
		} else {
			 this.chartBaseUrl = chartBaseUrl;
		}
		if (chartLinkUrl != null && chartLinkUrl != 'undefined' && chartLinkUrl != '') {
			this.chartLinkUrl = chartLinkUrl;
		}
		if (chartImageId != null || chartImageId != undefined && chartImageId != '') {
			this.chartImageId = chartImageId;
		}
			
	},
	observeElements : function($super) {
     	$super();
     	var scriptElement = document.createElement("script");
     	scriptElement.setAttribute("type", "text/javascript");
     	scriptElement.setAttribute("src", this.chartBaseUrl + "&chartdatastudies=true&callback=" + this.instanceName + ".chartCallback");
     	document.body.appendChild(scriptElement);
     	eval(scriptElement.text);
	},
	chartCallback: function(ohlcData) {
		var mapElement = new Element("map", {id:this.mapName + '_id', name: this.mapName});
		for(var i = 0; i < ohlcData.chartDataStudiesProps.length; i++) {
			var layerProps = ohlcData.chartDataStudiesProps[i];
			xstart = layerProps.xy.xstart;
			xend = layerProps.xy.xend;
			ystart = layerProps.xy.ystart;
			yend = layerProps.xy.yend;
			colorList = layerProps.colors;
			fieldsList = layerProps.names;
			fieldLabelsList = new Array();
			for(var l = 0; l < fieldsList.length; l++) {
				var field = fieldsList[l];
				var fieldLabel = field;
				if (field != undefined) {
					//var idxFieldStart = field.indexOf(field.match(/\.[a-zA-Z]/));
					var idxFieldStart = field.indexOf(field.match(/\)\./));
					if(idxFieldStart > 0) {
						var fieldLabel = field.substring(idxFieldStart+2);
					}
				}
				fieldLabelsList[l] = fieldLabel;
				
			}

			var layerData = ohlcData.chartDataStudiesValues;		

			var xcoord = xstart;
			var ycoord = ystart;
			var prevOhlcMsg = "";
			for(var v = 0; v < layerData[fieldsList[0]].length; v++) {
				ohlcMsg = "";
				for(var f = 0; f < fieldsList.length; f++) {
					var field = fieldsList[f];
					if(layerData[field] != undefined) {
						value = layerData[field][v];
						ohlcMsg += "<span style=\"color:" + colorList[f] + ";\">"+ fieldLabelsList[f] + ": "  + value + "</span>";
						if(f < (fieldsList.length -1) && fieldLabelsList[f+1] != "Time")
							ohlcMsg += "<br/>";
					}
				}

				ohlcMsg = ohlcMsg.replace("Date: ", "").replace("Time: ", " ");
				if ((prevOhlcMsg != "" && prevOhlcMsg != ohlcMsg) || v == layerData[fieldsList[0]].length-1 ) {
					mapElement.appendChild(
							new Element("area", {
								shape:"rect",
								coords:xcoord + ',' +  ystart + ','+ v + ',' + yend
								}
							)
							.observe('mouseover', this.showOHLCMessage.bind(prevOhlcMsg, this.mapName, this.chartImageId))
							.observe('mouseout', this.hideOHLCMessage.bind(this))
						);
						
						xcoord =  parseInt(v) + parseInt(xstart);
				}
				prevOhlcMsg = ohlcMsg;
			}
		}
		$(document.body).insert(mapElement); 
		Event.observe(mapElement, 'click', function() {
		}.bind(this));
	},
	showOHLCMessage: function(mapName, chartImageId, e) {
		Event.extend(e);
		
		var el = $('ohlc_' + mapName);
		var chartEl = $(chartImageId);
		
		if (!el) {
			el = new Element('div', {'id': 'ohlc_' + mapName});
			$(document.body).insert(el);
			el.addClassName("ohlcinfo");
		}
		var ohlcMsg = el.innerHTML = this;
		
		var brCount = ohlcMsg.match(/<br>*/gi).length + 1;
		var msgHeight = brCount * 14;
		el.absolutize();
		xPos = e.pointerX();
		if (chartEl) {
			chartPosMiddle = chartEl.viewportOffset().left + (chartEl.getWidth() / 2); 
			if (xPos > chartPosMiddle)
				xPos = e.pointerX() - 10 - el.getWidth();
			else
				xPos = e.pointerX() + 10;
		}
		el.setStyle({	
			backgroundColor: '#FFFFCC',
			left: xPos + 'px',
			top: e.pointerY() + 'px',
			height: msgHeight + 'px',
			width:'auto'
		});
		el.show();
	},
	hideOHLCMessage: function() {
		var el = $('ohlc_' + this.mapName); 
		if (el) el.hide();
	}
});

com.esignalprod.modules.ChartStudiesSelectModule = Class.create ( com.esignalprod.modules.BaseModule, {
	userStudies : 'userStudies_id',
    chartForm : 'chart_form_id',
	availableStudies : 'available_studies_id',
	addButton : 'add_studies_id',
	removeButton : 'remove_studies_id',
	selectedStudies : 'selected_studies_id',
	resetButton : 'studies_reset_id',
	parameters : 'studyParams',
	initialize: function($super) {
		$super();
	},
	observeElements : function($super) {
		
     	$super();
		this.clickedOption = null;
		
		this.initializeStudiesOptions();
		
		Event.observe($(this.addButton), 'click', this.addAction.bind(this));
		Event.observe($(this.removeButton), 'click', this.removeAction.bind(this));
		Event.observe($(this.resetButton), 'click', this.resetStudies.bind(this));
		//Double click event on adding the available studies
		//Option 1:
//		$A($(this.availableStudies).options).each(function(option,i){  
//			Event.observe(option, 'dblclick', this.addAction.bind(this));
//		}.bind(this));
		//Option 2: IE can only observe on double click of select not option ....?
		//$(this.availableStudies).observe('dblclick', this.addAction.bind(this));
		//Initialize the parameters text input with blur event and disabled
		$(this.chartForm).getInputs('text', this.parameters).each (function (input, index) {
			Event.observe(input, 'blur', this.updateParameterValue.bind(this));
			input.value = "";
			input.disabled = true;
		}.bind(this));
	},
	initializeStudiesOptions : function() {
		
		var userStudiesHash = charts.esignal.com.StudyUtil.toUserStudiesHash($(this.userStudies).value);
		new Hash(charts.esignal.com.Studies).each(function(studyPair) {
			var study = studyPair.value;
			study.setCode(studyPair.key);
			var optionElement = new Element('option', {'value': study.getCode()});
			if (userStudiesHash.get(study.getCode()) != null && userStudiesHash.get(study.getCode()) != 'undefined') {
				study.setUserParameters(userStudiesHash.get(study.getCode()).split(","));
				optionElement.selected = true;
			}
			optionElement.update(study.getFullDescription());
			$(this.availableStudies).appendChild(optionElement);
		}.bind(this));
		//Add all the option elements that are saved by user preferences (in the cookie/account)
		this.addAction();
	},
	addAction : function(event) {
		var movedOptions = symbols.esignal.com.FormInputUtils.moveOptions ($(this.availableStudies), $(this.selectedStudies));
		//Sort both select options
		symbols.esignal.com.FormInputUtils.sortOptions($(this.availableStudies));
		symbols.esignal.com.FormInputUtils.sortOptions($(this.selectedStudies));

		//After adding selection, change appropriate event behavior
		//IE only listens on the select and not on option
		$(this.selectedStudies).stopObserving('dblclick');
		$(this.selectedStudies).observe('dblclick', this.removeAction.bind(this));
		$(this.selectedStudies).observe('click', this.loadParameters.bind(this));

		$(this.availableStudies).stopObserving('dblclick');
		$(this.availableStudies).observe('dblclick', this.removeAction.bind(this));
		$(this.availableStudies).observe('click', this.loadParameters.bind(this));
		//Update the user studies values after the changes on the selected studies
		movedOptions.each(function(option,i){
			//Event.stopObserving(option, 'dblclick');
			//Event.observe(option, 'dblclick', this.removeAction.bind(this));
			//Event.observe(option, 'click', this.loadParameters.bind(this, option));
			$(this.userStudies).value = charts.esignal.com.StudyUtil.updateUserStudies($(this.userStudies).value, option.value);
		}.bind(this));

		//Empty out the parameters
		$(this.chartForm).getInputs('text', this.parameters).each (function (input, index) {
			input.value = "";
			input.disabled = true;
		});
	},
	removeAction : function (event) {
		var movedOptions = symbols.esignal.com.FormInputUtils.moveOptions ($(this.selectedStudies), $(this.availableStudies));
		//Sort both select options
		symbols.esignal.com.FormInputUtils.sortOptions($(this.availableStudies));
		symbols.esignal.com.FormInputUtils.sortOptions($(this.selectedStudies));
						
		//Update the user studies values after the changes on the selected studies
		movedOptions.each (function(option, index) {
//			Event.stopObserving(option, 'dblclick');
//			Event.observe(option, 'dblclick', this.addAction.bind(this));
//			Event.stopObserving(option, 'click');
			$(this.userStudies).value = charts.esignal.com.StudyUtil.updateUserStudies($(this.userStudies).value, option.value, true);
		}.bind(this));

		//Empty out the parameters
		$(this.chartForm).getInputs('text', this.parameters).each (function (input, index) {
			input.value = "";
			input.disabled = true;
		});
	},
	/**
	 * Updates the parameters of the studies here by reading the option id.
	 */
	loadParameters : function (event) {
		//TODO: Find a proper solution on how to get an option properly from an event
		var select = $(Event.element(event));//IE
		var option = $(Event.element(event));//FF
		if (select.selectedIndex != null && select.selectedIndex != 'undefined' && select.selectedIndex >= 0) {
			option = select.options[select.selectedIndex];
		}

		if (option.value != null && option.value != 'undefined' && option.value != '') {
			//remember the last option that was clicked, so that we can update the parameter value accordingly
			this.clickedOption = option;
			$(this.chartForm).getInputs('text', this.parameters).each (function (input, index) {
				var inputValue = charts.esignal.com.Studies[option.value].getUserParameter(index);
				if (inputValue != null && inputValue != 'undefined') {
					input.value = inputValue;
					input.disabled = false;
				} else {
					input.value = "";
					input.disabled = true;
				}
			}.bind(this));
		}
	},
	updateParameterValue : function (event) {
//		$A($(this.selectedStudies).options).each(function(option,i){
			//if (option.selected && option.value == this.clickedOption.value) {
				var study = charts.esignal.com.Studies[this.clickedOption.value];
				var i = 0;
				var value = '';
				$(this.chartForm).getInputs('text', this.parameters).each (function (input, index) {
					if (input == Event.element(event)) {
						i = index;
						value = input.value;
					}
				});
				study.setUserParameter(i, value);
				$(this.userStudies).value = charts.esignal.com.StudyUtil.updateUserStudies($(this.userStudies).value, this.clickedOption.value);
				this.clickedOption.text = study.getFullDescription();
			//}
		//}.bind(this));
	},
	resetStudies : function (event) {
		$A($(this.selectedStudies).options).each(function(option,i){
			if (option.selected) {
				var study = charts.esignal.com.Studies[option.value];
				$(this.chartForm).getInputs('text', this.parameters).each (function (input, index) {
					var resetValue = study.getParameter(index);
					if (resetValue != null && resetValue != 'undefined') {
						input.value = resetValue;
					}
				});
				study.setUserParameters(study.getParameters());
				$(this.userStudies).value = charts.esignal.com.StudyUtil.updateUserStudies($(this.userStudies).value, option.value);
				option.text = study.getFullDescription();
			}
		}.bind(this));
	}
});




com.esignalprod.modules.MarketOverview = Class.create ( com.esignalprod.modules.BaseModule, {
	preloadCharts : false,
	chartAnchorId : 'market_overview_chart',
	chartCellId : 'market_overview_chart_cell_id',
	rowId : 'market_overview_row',
	preloadedChartsDivId : 'market_overview_chart_hidden_id',
	initialize: function($super, chartMouseOverIds, preloadCharts) {
		$super();
		this.preloadCharts = preloadCharts;
		$$(chartMouseOverIds).each (function(rowEle) {
     		Event.observe(rowEle, 'mouseover', this.updateChart.bind(this, rowEle));
     	}.bind(this));
	},
	updateChart : function (rowEle, event) {
		if (this.preloadCharts) {
			var symbol = rowEle.identify().substring(this.rowId.length+1);
					
			if ($(this.chartCellId).firstDescendant() != $(this.chartAnchorId+"_"+symbol)) {
				$(this.preloadedChartsDivId).appendChild($(this.chartCellId).firstDescendant());
				$(this.chartCellId).appendChild($(this.chartAnchorId+"_"+symbol));
			}
			
		} else {
			var symbol = rowEle.identify().substring(this.rowId.length+1);
			var chartEle = $(this.chartCellId).childElements()[0];
			chartEle.src = chartEle.src.replace(/([?&]cont=)[^&]*/, "$1" + escape(symbol));
			chartEle.alt = "Chart of " + symbol;
			$(this.chartAnchorId).writeAttribute('title', rowEle.firstDescendant().firstDescendant().title + " Chart");
			$(this.chartAnchorId).href = $(this.chartAnchorId).href.replace(/([?&]s=)[^&]*/, "$1" + escape(symbol));
		}
	}
});

com.esignalprod.modules.MarketOverviewModule = Class.create ( com.esignalprod.modules.BaseModule, {
	initialize: function($super, tabIndex, tabDiv) {
		
		$super();
		this.tabIndex = tabIndex;
		this.tabDiv = tabDiv;
	},
	observeElements : function($super) {
		this.addLoadingImageOnly(this.tabDiv, 'width: 10px; height: 10px;');
		
		$j('#marketoverview_tabs_id').tabs({
			
			selected : this.tabIndex,
			ajaxOptions: { async: true },
			cache: true,
			select : function (event, ui) {
				if ($j.trim($j(ui.panel).html()).length == 0) {
					
					this.addLoadingImageOnly(ui.tab.id, 'width: 10px; height: 10px;');
				}
				
			}.bind(this),//bind to this in order to access this object inside function.
			load : function (event, ui) {
				//this.tabIndex = ui.index;
				//this.tabDiv = ui.tab.id;
				//new com.futuresource.modules.MarketOverview(true);
				this.removeLoadingImage(ui.tab.id);
			}.bind(this)
		}).extend(this);//Extended with this so that the this objects can be utilized inside of jQuery plugins.
	}
});
com.esignalprod.modules.ChartAggregationModule = Class.create ( com.esignalprod.modules.BaseModule, {
	chartImageId: 'chart_image_id',
	aggregationUlId : 'aggregation_ul_id',
	aggregations:'',
	periodElementName:'chart.period',
	minutesElementName:'chart.minutes',
	initialize: function($super, chartImageId, aggregationUlId, aggregations) {		
		$super();
		this.chartImageId = chartImageId;
		this.aggregationUlId = aggregationUlId;
		new Hash(aggregations).each (function(aggregationPair) {	
			var key = aggregationPair.key;
			keyValueArray = key.split(':');
			var period = keyValueArray[0];
			var minutes = keyValueArray[1];
			
			var aElement = new Element('a').update(aggregationPair.value)
			var liElement = new Element('li').insert(aElement);
			$(aggregationUlId).appendChild(liElement);
			var chartUrl = $(chartImageId).src;
			var fixedSpaceContract = chartUrl.match(/([?]cont=)[^&]*/).slice(0,1).toString().replace(/\+/g, "%20");
			chartUrl = chartUrl.replace(/([?&]cont=)[^&]*/, fixedSpaceContract);
			var params = new Hash(chartUrl.toQueryParams());
			if (params.get('period') == period && params.get('varminutes') == minutes) {
				liElement.setAttribute('class','current');
			}
			
			params.set('period',period);
			params.set('varminutes',minutes);
			var newChartUrl = chartUrl.substring(0, chartUrl.indexOf("?")+1);
			newChartUrl += params.toQueryString();
     		Event.observe(aElement, 'click', this.switchChart.bind(this, aElement, newChartUrl, period, minutes));
     	}.bind(this));		
	},
	switchChart : function(aElement, charturl, period, minutes) {
		$j('#'+this.chartImageId).attr('src', charturl);
		var clickElement = $j(aElement);
		var parentElement = clickElement.parent();
		parentElement.siblings().removeClass('current');
		parentElement.addClass('current');
		clickElement.blur();
		var periodElement = $j('[name='+this.periodElementName+']');
		var minuteElement = $j('[name='+this.minutesElementName+']');
		if (periodElement) {
			periodElement.val(period);			
		}
		if (minuteElement) {
			if (period == 'V') {
				minuteElement.removeAttr('disabled');
				minuteElement.val(minutes);
			} else {
				minuteElement.val('');
				minuteElement.attr('disabled', 'disabled');
			}
		}
		
		//Update chart ohlcmap accordingly
		if (typeof(ohlcModule) != "undefined") {
			if (minutes == null) minutes = '';
			var chartusemapkey = 'ohlcmap' + period + minutes;
			$(this.chartImageId).writeAttribute('usemap','#' + chartusemapkey);
			if ($(chartusemapkey+'_id') == null) {
				ohlcModule.chartBaseUrl = charturl;
				ohlcModule.mapName = chartusemapkey;
				ohlcModule.observeElements();
			}
		}
		return false;
	}
	
});

com.esignalprod.modules.UserSettingsModule = Class.create ( com.esignalprod.modules.BaseModule, {
	
	chartFormId:'chart_form_id',
	chartFormFields:['symbol','chart.overlay', 'chart.period',
					 'chart.minutes', 'chart.bartype', 'chart.bardensity', 'chart.studies' ], // field names
	
	initialize: function($super) {
		$super();
	},
	
	observeElements : function($super) {
     	$super();
	},
	
	saveChartSettings : function() {
		
		var chartSettings = '';
		var chartForm = $(this.chartFormId); 
		
		for (var c = 0; c < this.chartFormFields.length; c++) {
			
			var fieldId = chartForm[this.chartFormFields[c]]; 
			
			var fieldValue = $(fieldId).getValue();
			if (c !=0)
				chartSettings += "&"; 
			chartSettings += this.chartFormFields[c] + '=' + encodeURIComponent(String.interpret(fieldValue));
		}
		this.saveSetting('chartSettings', chartSettings);
		alert('Your preferences have been saved.');
	},
	
	saveSetting : function(setingType, settingValue) {
		var expires = new Date();
		var hostname = self.location.hostname;
		expires.setFullYear(expires.getFullYear()+1);
		var cookieOptions = { 
			domain: hostname, 
			path: '/', 
			expiresAt: expires, 
			secure: false 
		}
		$j.cookies.set(setingType, settingValue, cookieOptions);
	},
	
	getSetting : function(settingType) {
		return $j.cookies.get(settingType);
	}

});

com.esignalprod.modules.AccordionSettingsModule = Class.create ( com.esignalprod.modules.UserSettingsModule, {
	settingType:'wPanel',
	defaultPanelIndex: 1, // default panel 0 doesn't works
	initialize: function($super, settingType, defaultPanelIndex) {
		$super();
		if(settingType != null && settingType != '' && settingType != 'undefined') {
			this.settingType = settingType;
		}
		settingType = this.settingType;
		if(defaultPanelIndex != null && defaultPanelIndex != '' && defaultPanelIndex != 'undefined') {
			this.defaultPanelIndex = defaultPanelIndex;
		}
		this.loadDefaultPanel();
		var sType = this.settingType;
		$j("#accordion_id").bind("accordionchange", function(event, ui) {
			var setModule = new com.esignalprod.modules.UserSettingsModule();
     		var currentSettingValue = setModule.getSetting(this.settingType);
     		var panelClass = $j(event.target).parent().attr('class');
			var panelEle = ui.newHeader.parent();
			var panelEleId = ui.newHeader.parent().attr('id');
			if(panelEle.hasClass('AccordionPanelOpen')) {
				setModule.saveSetting(this.settingType, panelEleId);
			} else {
				setModule.saveSetting(this.settingType, "");
			}
		}.bind(this));
	},
		
	observeElements : function($super) {
     	$super();
	},
	
	loadDefaultPanel : function() {
		var currentValue = new com.esignalprod.modules.UserSettingsModule().getSetting(this.settingType);
		var panelElementIndex = this.defaultPanelIndex;
		if (currentValue != undefined && currentValue != null && currentValue != '') {
			var panelElement = $j('#'+currentValue);
			var panelElementIndex = $j('#accordion_id .AccordionPanel').index(panelElement);
		} 
		$j("#accordion_id").accordion(
				"activate", panelElementIndex
			);
		$j("#accordion_id").accordion("resize");
	}
	
});

com.esignalprod.modules.ChartShowHideImg = Class.create({
	currentHighlightedEle : null,
	initialize: function(mysettings) {
		var defaults = {
			selector : null,
			imageTitleId : null,
			imageDescriptionId : null,
			imageId : null,
			legendId : null,
			showSpinner : false,
			styleSpinner : '',
			classSpinner : '',
			event : 'mouseover',
			highlighter : 'current',
			highlighterOn : false,
			imgHasLink : false
		};
		this.settings = $H(defaults).merge(mysettings).toObject();
		document.observe("dom:loaded", this.observeElements.bind(this));////since this is an anonymous function we need to bind it to this
	},

	observeElements: function() {
		$A(this.settings.selector).each(function(li,i) {
			li.observe(this.settings.event, this.updateContents.bind(this));
			if (li.hasClassName(this.settings.highlighter)) {
				currentHighlightedEle = li;
			}
		}.bind(this));
	},

	updateContents:function(event) {
	
		var anchorEle = Event.element(event);
		
		if (!anchorEle.match('a')) {
			
			anchorEle = Event.element(event).select('a')[0];
		}
		
		if ($(this.settings.imageId).src.endsWith(anchorEle.rel)) return;//skip if image is same as hover
		
		if (this.settings.highlighterOn) {
			var newHighlightedEle = anchorEle.up(currentHighlightedEle.nodeName);
			currentHighlightedEle.removeClassName(this.settings.highlighter);
			newHighlightedEle.addClassName(this.settings.highlighter);
			currentHighlightedEle = newHighlightedEle;
		}

		var title = anchorEle.rev;
		
		if (title.indexOf("|") > 0) {
			$(this.settings.imageTitleId).update(title.substr(0, title.indexOf("|")));
			$(this.settings.imageDescriptionId).update(title.substr(title.indexOf("|")+1, title.length));
		} else {
			$(this.settings.imageTitleId).update(title);
		}
		
		if (this.settings.showSpinner) {
			this.showSpinnerInImage($(this.settings.imageId), anchorEle.rel);
			$(this.settings.legendId).src = anchorEle.id;
			$(this.settings.imageId).alt = title;
		} else {
			
			$(this.settings.imageId).src = anchorEle.rel;
			$(this.settings.legendId).src = anchorEle.rel;
			$(this.settings.imageId).alt = title;
		}
			
		if (this.settings.imgHasLink) {
			var parentAnchorEle = $(this.settings.imageId).parentNode;
			parentAnchorEle.href = anchorEle.href;
			parentAnchorEle.title = anchorEle.title;
		}
	},
	showSpinnerInImage: function(imgEle, newImgSrc) {
			
			var customStyle = this.settings.styleSpinner;
			var customClass = (this.settings.classSpinner != null && this.settings.classSpinner.length > 0) ? this.settings.classSpinner : imgEle.readAttribute('class');
			var src="/esignalprod/images/ajax-loader.gif";
			var customText = " Loading...";
			
			var loaderId = "loader_img_div_" + imgEle.id;
	    	var loader = new Element('img', {'src': src, 'style':'border:0px;'});
			var loaderDivEle = new Element('div', {'id' : loaderId,'style': 'width: ' + imgEle.width + 'px; height: ' + imgEle.height + 'px; ' + customStyle, 'class' : customClass}).insert(loader).insert(customText);
			
			var parent = imgEle.parentNode;

			if ($(loaderId) == null) {
				parent.appendChild(loaderDivEle);
			} else {
				$(loaderId).show();
			}
			imgEle.hide();
			
			imgEle.src = newImgSrc;

			imgEle.observe('load', function(){
				if ($(loaderId) != null) $(loaderId).hide();
				imgEle.show();
			}.bind(this));
	}
});