function getWindowSize(w) {
	//returns the document size. Is comptabile with all browsers

	  var myWidth = 0, myHeight = 0;
	  //get width
	  myWidth = w.offsetWidth;
	  

	  //get height
          myHeight = Math.max(w.offsetHeight, window.innerHeight);
	  




	  return [myWidth, myHeight];
}


function draw(color, fill_percentage, center_x, center_y, number_of_lines) {
	var canvas = document.getElementById("canvas");
	var page = document.getElementById("all");

	//do this only if it is supported by the browser		
	if (canvas.getContext){
		
		var ctx = canvas.getContext("2d");

		//var center_x = 300;
		//var center_y = 80;
		//var number_of_lines = 20;
		//var fill_percentage = 0.5;

		//set size of canvas


		var size = getWindowSize(page);
		canvas.width = size[0];
		canvas.height = size[1];
		
		ctx.fillStyle = color;

		delta = (Math.PI*2) / (number_of_lines);
		//select a very big length that exceeds the size of the canvas
		line_length = canvas.width + canvas.height;

		for (i=0;i<number_of_lines;i++)
		{
			//do some calculations first
				//angles, starting from 0
				theta1 = delta * i;	//ray starts here
				theta2 = theta1 + delta*fill_percentage;   //ray ends here, the rest is background color
	
				//calculate ending point of line1(x1,y1) and line2(x2,y2) with line_length
				x1 = line_length * Math.sin(theta1) + center_x;
				y1 = line_length * Math.cos(theta1) + center_y;

				x2 = line_length * Math.sin(theta2) + center_x;
				y2 = line_length * Math.cos(theta2) + center_y;

			
			

	   		ctx.beginPath();
			ctx.moveTo(center_x,center_y);
			ctx.lineTo(x1,y1);
			ctx.lineTo(x2,y2);
			ctx.lineTo(center_x,center_y);
			ctx.fill();			
		}
	}

}