$(function() {
	function gatherData($graph, palette) {
		var data = [];
		$graph.find(".chart-bar-values").each(function(idx, barValues) {
			data.push({
				color: palette.color(),
				name: $(barValues).data("name"),
				data: $(barValues).find(".chart-bar-value").map(function(idx, barValue) {
					return {
						x: parseInt($(barValue).data("index")),
						y: parseInt($(barValue).data("value"))
					};
				}).toArray(),

				labels: $(barValues).find(".chart-bar-labels").map(function(idx, barLabels) {
					return {
						x: parseInt($(barLabels).data("index")),
						name: $(barLabels).data("name"),
						parameters: $(barLabels).data("parameters")
					};
				}).toArray()

			})
		});
		return data;
	}

	function indexToLabel(graph, index) {

		//return "";
		
		//if ((index + 0.5) % 1 === 0) {
			return $(graph).find(".chart-bar-labels[data-index=" + Math.floor(index) + "]").data("name");
		//} else {
		//	return "XXX";
		//}
		
	}

	$(".chart-bar").each(function(idx, element) {
		var palette = new Rickshaw.Color.Palette( { scheme: "spectrum14" } );

		var graph = new Rickshaw.Graph({
			element: $(element).find(".chart")[0],
			renderer: 'scatterplot',
			//renderer: 'bar',
			series: gatherData($(element), palette)
		});

		var y_axis = new Rickshaw.Graph.Axis.Y({
			graph: graph,
			orientation: 'left',
			element: $(element).find(".chart-y-axis")[0],
		});
		y_axis.render();

		var x_axis = new Rickshaw.Graph.Axis.X({
			graph: graph,
			orientation: 'bottom',
			tickFormat: function(idx) {
				return indexToLabel(element, idx);
			},					
			tickTransformation: function(svg) {	
				svg.style("text-anchor", "end")
     		 		.attr("dx", "-0.8em")
         		.attr("dy", "-0.3em")
         		.attr("transform", 'rotate(-90)');            		
			},
			pixelsPerTick: 37,
			element: $(element).find(".chart-x-axis")[0],
		});



		x_axis.render();

		var legend = new Rickshaw.Graph.Legend({
			graph: graph,
			element: $(element).find(".chart-legend")[0]
		});

		/*
		var highlighter = new Rickshaw.Graph.Behavior.Series.Highlight({
			graph: graph,
			legend: legend
		});
    */


		
		var hoverDetail = new Rickshaw.Graph.HoverDetail( {
			graph: graph,
			xFormatter: function(x) { 
				//return graph.series[0].labels[x].name
				return ""; 
			},
			formatter: function(series, x, y) { 				
				var params = series.labels[x].parameters;
				var table = "";
				var i;
				if (params.lenth != 0) {
					for (i = 0; i < params.length; i++) {
						table += "<tr><td>" + params[i].name + ":</td><td>" + params[i].value + "</td></tr>"
					}
					table = "<table>" + table + "</table>"
				}
				return (y + " [ms]<br/>" 
					+ series.labels[x].name + "<br/>"
					+ table
					+ series.name);
			},
		} );


		var shelving = new Rickshaw.Graph.Behavior.Series.Toggle( {
			graph: graph,
			legend: legend
		} );

		var order = new Rickshaw.Graph.Behavior.Series.Order( {
			graph: graph,
			legend: legend
		} );

		var highlight = new Rickshaw.Graph.Behavior.Series.Highlight( {
			graph: graph,
			legend: legend
		} );


		graph.renderer.unstack = true;
		//graph.renderer.gapSize = 0.3;
		graph.render();
	});
});