var chart_strip;
$(document).ready(
	function(){
		var options_trackrecord = {
			chart: {
				animation: true, // need to disable animation for IE if you want zoom function
				defaultSeriesType: 'column',
				height: 180,
				//marginTop: 20,
				renderTo: 'chart-container-trackrecord',
				style: {
					fontFamily: '"Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif',
					fontSize: '10px' },
				backgroundColor: 'rgba(0,0,0,0)',
				spacingLeft: 0,
				spacingRight: 10,
				animation: false
			},
			colors: ['rgba(25,65,35,0.8)', 'rgba(85,155,35,0.8)', 'rgba(167,25,59,0.8)'],
			credits: { enabled: false },
			exporting: { enabled: false },
			legend: {
				enabled: false,
				margin: 5, 
				borderWidth: 0
			},
			plotOptions: {
				column: {
					groupPadding: 0,
					pointPadding: 0.15,
					borderWidth: 0 
				}
			},
			series: [],
			title: { text: null },
			tooltip: { 
				enabled: (navigator.appName == 'Microsoft Internet Explorer') ? true : false, 
				formatter: function() {
					var s = '<b>' + this.series.name + '</b>: ' + (Math.round(this.y)).toFixed(0) + '%';
					return s;
				}
			},
			xAxis: {
				labels: { enabled: false },
				tickLength: 0,
				lineWidth: 0
			},
			yAxis: {
				gridLineColor: '#E8E8E8',
				labels: {
					formatter: function() { 
						return this.value + '%'; 
					},
					style: { fontSize: '10px' }
				},
				tickInterval: 10,
				title: { text: null }}
			}
		var date = new Date();
		$.ajax({ // need to use this method instead of getJSON because of crappy IE
			cache: false,
			contentType: 'application/json', // need to specify explicitly for IE
			dataType: 'json',
			url: '/index.php?module=data&action=TrackRecord&timestamp='+date.getTime(), //timestamping for IE caching issues 
			success: function(returnData) {
				var series;
				for(var i=0; i< returnData.legend.length;i++) {
					series = {
						name : returnData.legend[i],
						data : parseFloat(returnData.values[i]),
						dataLabels: {
							enabled: (navigator.appName == 'Microsoft Internet Explorer') ? false : true,
							formatter: function() { 
								return '<b>' + this.series.name + '</b>: ' + (Math.round(this.y)).toFixed(0) + '%'; 
							}
						}
					}
					options_trackrecord.series.push(series); }
				var chart = new Highcharts.Chart(options_trackrecord);
			},
			error: function(xhr, status, error) { alert(xhr.status); }});

	}
);
