var homeIndexChart = {
	code : "",
	name : "HSI",
	period : "",
	container : "",
	chart:null,
	init : function(code, period, callback){
		var self = this;
		if (code != ""){
			self.code = code;
			self.name = code.toUpperCase();
			self.name = (self.name == "AT")?"FHSI(AT)":((self.name == "FUR")?"FHSI":((self.name == "CEI")?"HSCEI":self.name));
		}
		self.period = period;
		$.getJSON('/'+lang+'/data/chart/homeIndexChart?_='+Math.random()+'&code='+self.code+'&period='+period, function(_data) {
			var data = self.decode(_data);
			self.container = (self.container=='')?'#homeIndexChartContainer':'#'+self.container.replace("#","");
			$(self.container).highcharts('StockChart', self.getJSON(data), function(chart){
				self.chart = chart;
				if (callback!==undefined){
					callback(chart,data);
				}
				//******************
				if($(self.container).find(".link_table_a").length == 0){
					$(self.container).find(".highcharts-container").attr("aria-hidden","true");
					var _text = [];
					if (lang == "tc"){
						_text[0] = "查看圖表指數數據";
						_text[1] = "於表單查看指數數據";
					}else if (lang == "sc"){
						_text[0] = "查看图表指数数据";
						_text[1] = "於表单查看指数数据";					
					}else{
						_text[0] = "View detailed data";
						_text[1] = "View Index chart detail from table";	
					}
					$(self.container).append('<a href="/'+lang+'/data/text-data/homeIndexChart?code='+self.code+'&period='+period+'" class="link_table_a" >'+_text[1]+'</a>');
				}
				//******************
			});
		});
	},
	decode : function(_data){
		return _data;
	},
	getJSON : function(_data){
		var dp = 0;
		var close = [];
		var turnover = [];
		var data = _data.mainData;
		var fdata = _data.furtherData;
		var groupingUnits = [['minute',[5]], ['hour',[1]]];
		for (i = 0; i < data.length; i++) {
			close.push([data[i][0], data[i][1]]);
			turnover.push([data[i][0], data[i][2]]);
		}
		var self = this;
		return {
				chart:{
					spacing: [0, 0, 10, 0],
					marginLeft: 0,
					marginRight: 50,
					marginTop: 0,
				},
				tooltip: {
					backgroundColor: 'none',
					borderWidth: 0,
					shadow: false,
					useHTML: true,
					padding: 0,
					formatter: function() {
						var stime;
						var last = addcomma(this.points[0].y);
						if (self.period == "month"){
							stime = Highcharts.dateFormat('%Y-%m-%d', this.points[0].x);
						}else{
							stime = Highcharts.dateFormat('%Y-%m-%d %H:%M', this.points[0].x);
						}
						var html = '<div class="charttooltip"><div class="stime">'+stime+'</div>';
						
						var _name = self.name;
						if (self.name == "HSI"){
							_name = self.labels()[lang].hsi;
						}else if (self.name == "HSCEI"){
							_name = self.labels()[lang].hscei;
						}else if (self.name == "FHSI"){	
							_name = self.labels()[lang].fhsi;
						}
							
						
						
						html +=  '<div class="val1"><span class="name"><div class="legend" style="background-color:#00716C"></div>'+_name+'</span><span class="value">'+last+"</span></div>";
						if (this.points[1] && this.points[1].y>0){
							var turnover = addcomma(this.points[1].y/1000000)+ self.labels()[lang].unit_M;
							html +=  '<div class="val2"><span class="name"><div class="legend" style="background-color:#E9A115"></div>'+self.labels()[lang].turnover+'</span><span class="value">'+turnover+"</span></div>";
						}
						
						if ((self.code == "at" || self.code == "fur") && (self.period == "day")){
							var p4change = this.points[0].y - ($("#indices_last4_val").text().replace(",","")*1);
							if (!isNaN(p4change)){
								html +=  '<div class="val2"><span class="name">'+self.labels()[lang].last4+'</span><span class="value">'+((p4change>0)?"+":"")+addcomma(p4change)+"pts</span></div>";
							}
						}
						html += '</div>';
						return html;
					}
				},
				rangeSelector: {
					enabled: false,
				},
				plotOptions: {
					series: {
						events: {
							mouseOver: function() { 
								if (this.name=="ulast"){
									this.graph.attr('stroke', '#005E59');
								}
							},
							mouseOut: function() {
								if (this.name=="ulast"){
									this.graph.attr('stroke', '#00716C');
								}
							}
						}			
					}
				},
				xAxis: {
					tickLength:3,
					gridLineWidth: 0,
					lineWidth: 0,
					tickColor: "#D7D8D6",
					lineColor: '#00000000',
					events: {
						setExtremes: function(e) {
							if(typeof(e.rangeSelectorButton)!== 'undefined'){
								if (e.rangeSelectorButton.type == "all"){
								
								}else{
								
								}
							}
						}
					},
					labels: {   
						formatter : function() {
							if (self.period == "month"){
								return Highcharts.dateFormat('%d/%m', this.value);
							}else if (self.period == "week"){
								return Highcharts.dateFormat('%d/%m', this.value);
							}else{
								return Highcharts.dateFormat('%H:%M', this.value);
							}
						}
					},
					tickPositioner: function () {
						var positions = [];
						var lastday = 0;
						var msec;
						
						if (self.period == "month"){
							msec = 60*60*24*7*1000;
							lastday = 0;
						}else if (self.period == "week"){
							msec = 60*60*24*1000;
							lastday = Math.floor(close[0][0]/msec)*msec;
						}else{
							msec = 60*60*2*1000;
							lastday = Math.floor(close[0][0]/msec)*msec;
						}
						for (i=0;i<close.length;i++){
							if (self.period == "month"){
								if (i%5==(close.length-1)%5){
									positions.push(close[i][0]);
								}
							}else{
								var _today = Math.floor(close[i][0]/msec)*msec;
								if (lastday != _today){
									lastday = _today;
									positions.push(close[i][0]);
								}
							}
						}
						return positions;
					},
				},
				yAxis: [
				{
					title: {
						text: null
					},
					labels:{
						align:'left',
						x:5,
						y:5,
						formatter: function () {
							return (this.isLast)?"":addcomma(this.value);					
						},
					},
					top:0,
					offset:0,
					height: (self.code == 'fur' || self.code == 'at')?170:130,
					tickPixelInterval:40,
					tickAmount : 5,			
					showFirstLabel: false,	
					showLastLabel: true,	
					
					
					plotLines: [{
						value: fdata.lastc,
						color: 'black',
						width: 1,
					}]
				},
				{
					title: {
						text: null
					},
					labels:{
						align:'left',
						x:5,
						y:5,
					},
					top:131,
					offset:0,
					height: 40,
					min: 0,        
					tickAmount : 3,	
					tickPixelInterval:40,
					showFirstLabel: false,	
					showLastLabel: true,						
				}],
				navigator : {
					enabled : false
				},
				scrollbar : {
					enabled : false
				},
				series : [{
					name : "ulast",
					data : close,
					tooltip: {
						valueDecimals: dp
					},
					dataGrouping:  {
						approximation: "close",
						enabled: true,
						forced: true,
						units: groupingUnits,
						groupPixelWidth: 10
					},
					lineWidth: 2,
					color: '#00716C',
				},{
					id: 'turnover',
					type: 'column',
					data: turnover,
					visible: (self.code == 'fur' || self.code == 'at')?false:true,
					yAxis: 1,
					dataGrouping:  {
						approximation: "sum",
						enabled: true,
						forced: true,
						units: groupingUnits,
						groupPixelWidth: 10
					},
					lineWidth: 2,
					color: '#E9A115',
					states: {
						hover: {
							color: '#D19012',
						}
					}
				}],
				exporting: {
					enabled: false
				}
			};
	},
	labels : function (){
		return {
			tc :{
				hsi : "恒生指數",
				hscei : "國企指數",
				fhsi : "恒指期貨",
				turnover : "成交額",
				last4 : "上一個4時變化",
				unit_M: "百萬",
			},
			sc :{
				hsi : "恒生指数",
				hscei : "国企指数",
				fhsi : "恒指期货",
				turnover : "成交额",
				last4 : "上一个4时变化",
				unit_M: "百万",
			},
			en :{
				hsi : "HSI",
				hscei : "HSCEI",
				fhsi : "FHSI",
				turnover : "Turnover",
				last4 : "Prev. 4pm change",
				unit_M: "M",
			},
		};
	}	
}