// --------------------------------------------------
// Pie chart
// --------------------------------------------------

var cPos;  // Canvas absolute position

// Update position of the canvas within the document
function setCanvasPos(obj) {
    
  var x = y = 0;
  if (obj.offsetParent) {
    x = obj.offsetLeft;
    y = obj.offsetTop;
    while (obj = obj.offsetParent) {
  	  x += obj.offsetLeft;
	  y += obj.offsetTop;
	}
  }
  cPos = [x,y];
	  
}

// Draw a string (Use a HTML DIV)
function drawString(parent, x, y, string) {

	var label = document.createElement('DIV');
  label.innerHTML = string;
	label.style.position = 'absolute';
	label.style.left = x + cPos[0] + "px";
	label.style.top = y + cPos[1] + "px";
  label.style.backgroundColor = 'transparent';
  label.style.visibility = 'visible';
	parent.appendChild(label);

}

// Return color pie color
function getColor(nb) {

  switch(nb % 6) {
    case 0:
      return "rgb(255,100,0)";
      break;
    case 1:
      return "rgb(255,255,0)";
      break;
    case 2:
      return "rgb(255,0,255)";
      break;
    case 3:
      return "rgb(50,50,150)";
      break;
    case 4:
      return "rgb(0,200,255)";
      break;
    case 5:
      return "rgb(0,100,200)";
      break;  
  }

}

function drawPieChart() {

  var parent = document.getElementById("all");
  var canvas = document.getElementById("piechart");
  var ctx = canvas.getContext("2d");
  setCanvasPos(canvas);
  
  // Clear background
  var cWidth  = parseInt(canvas.style.width);
  var cHeight = parseInt(canvas.style.height);
  
  ctx.fillStyle = "rgb(230,230,230)";
  ctx.fillRect (0, 0, cWidth, cHeight);
  
  // Get arguments
  var nbArg = arguments.length;
  var i = 0;
  
  var xCenter = cHeight/2 + 20;
  var yCenter = cHeight/2;
  var radius  = cHeight/2 - 30;
  var sum = 0.0;

  for (i=0; i<nbArg; i+=2) {
    sum += parseFloat(arguments[i+1]);    
  }

  var startAngle = 2.0 * Math.PI;
  
  // Draw pie chart
  for (i=0; i<nbArg; i+=2) {

    var iRatio = parseFloat(arguments[i+1]) / sum;
    var iAngle = iRatio * 2.0 * Math.PI;
    
    // Draw arc
    ctx.beginPath();
    ctx.arc(xCenter,yCenter,radius,startAngle,startAngle-iAngle,1);
    ctx.lineTo(xCenter,yCenter);
    ctx.closePath();
		ctx.fillStyle = getColor(i/2);    
    ctx.fill();      
    ctx.strokeStyle = '#000000';
    ctx.stroke();
    
    // draw text
    var tAngle = startAngle - iAngle/2.0;
    var xText = xCenter + Math.cos(tAngle)*(radius+3);
    var yText = yCenter + Math.sin(tAngle)*(radius+3);
    
    if( tAngle >= 3*Math.PI/2 ) {
      yText -= 15;
    } else if ( tAngle >= Math.PI ) {
      xText -= 38;
      yText -= 15;
    } else if ( tAngle >= Math.PI/2 ) {
      xText -= 38;
    }
    
    var roundedRatio = Math.round(iRatio*1000)/10;
    drawString(parent,xText,yText,roundedRatio + "%");
    
    // Update angle
    startAngle -= iAngle;
  
	}
  
  // Draw legend
  var hLegend = nbArg/2 * 20;
  var sLegend = (cHeight - hLegend)/2;
  
  for (i=0; i<nbArg; i+=2) {

    ctx.strokeStyle = '#000000';
    ctx.strokeRect(cHeight + 50, sLegend+5+i/2*20, 10, 10);
		ctx.fillStyle = getColor(i/2);
    ctx.fillRect(cHeight + 50, sLegend+5+i/2*20, 10, 10);      
    
    drawString(parent,cHeight + 65 ,sLegend+3+i/2*20,arguments[i]); 
				 
  }
  
  ctx.strokeRect(cHeight+40,sLegend,80,hLegend);
  ctx.strokeRect(0,0,cWidth-1,cHeight-1);
  
}