function Piechart(){
	return new PiechartClass();
}

function PiechartClass(){

	DomNodeInterface(this);  
	this.items=[];
	this.ytitle="";
	this._title="";

	this.titleBox=null;
	
	this.barrgb=[0,122,122];
	this.gradients=false;
	this.showpercentage=false;//Indicate if the percentage i shown or no in the legend box.
	
	//The initial font of the title of the plot
	this.titleFont={
		size:'18px'
		,name:'verdana'
		,color:'#000000'
	};
	
	this.legendFont={
		size: '14px'
		,name: 'verdana'
	};
	this.backgroundStyle={color:"rgba(0,0,0,0)"};
	
	this.innerCircleInPercent=0;
}

PiechartClass.prototype.prepare = function(value){
	//The initial style of the border.
	this.borderStyle=this.canvas.createStyle();
	this.borderStyle.lineWidth=1;
	
	//The initial style of the legendBox.
	this.legendBox={borderStyle:this.canvas.createStyle(),backgroundStyle:this.canvas.createStyle(),width:0,height:0,padding:3};
	this.legendBox.borderStyle.lineWidth=1;
	this.legendBox.backgroundStyle.a=0;
	//The initial style of the background.
	this.backgroundStyle=this.canvas.createStyle();
	this.backgroundStyle.r=0;
	this.backgroundStyle.g=0;
	this.backgroundStyle.b=0;		
	this.backgroundStyle.a=0;	
	
	if(this._title!=""){
		this.canvas.oFont(this.titleFont);
		this.titleBox=this.canvas.textBox(this._title);		
	}
};
/*!
 * Sets _title and calculates the titleBox if canvas is set.
 */
PiechartClass.prototype.title = function(title){
	this._title=title;
	this.canvas.oFont(this.titleFont);
	if(this.canvas!=null){
		this.titleBox=this.canvas.textBox(this._title);
	}
};

PiechartClass.prototype.borderThickness = function(value){
	this.borderStyle.lineWidth=value;
};
PiechartClass.prototype.draw=function(){
	var x=this.offsetAbsoluteLeft();
	var y=this.offsetAbsoluteTop();
	var h=this.getHeight();
	var w=this.getWidth();
	var state=this.canvas.save();
	this.canvas.clipRect(x,y,w,h);
	var lx=x+this.borderStyle.lineWidth;
	var hx=lx+w-this.borderStyle.lineWidth;	
	//var w=hx-lx;

	var ly=y+this.borderStyle.lineWidth;
	var hy=ly+h-this.borderStyle.lineWidth;	

	//var h=hy-ly;
	this.canvas.oFillStyle(this.backgroundStyle);	

	this.canvas.fillRect(x, y, w,h );		
	if (this.borderStyle.lineWidth>0){	
		this.canvas.oStrokeStyle(this.borderStyle);		
		var ht=Math.ceil(this.borderStyle.lineWidth/2);		
		this.canvas.strokeRect(x+ht, y+ht, w-ht, h-ht);
	}
	
	
	//Draws the title of the plot and get the title box dimensions.
	if (this._title != "") {
		this.canvas.oFont(this.titleFont);		
		this.canvas.context.textBaseline="top";
		this.canvas.fillStyle(this.titleFont.color);
		this.canvas.fillText(this._title,lx+(w-this.titleBox.width)/2,ly);
	}
	
	
	//Find circle radius and center:
	var y_radius=(h-this.titleBox.height)/2;
	var x_radius=(w-this.legendBox.width-this.legendBox.padding*2)/2;	
	var circle_radius=Math.min(x_radius,y_radius);
	var circle_x=lx+x_radius;
	var circle_y=ly+this.titleBox.height+y_radius;	
	
	
	
	this.canvas.oFont(this.legendFont);
	var percentage_width=0;
	if(this.showpercentage){
		percentage_min_width=this.canvas.textBox("(%)").width;
		percentage_char0_width=this.canvas.textBox("0").width;
		percentage_char1_width=this.canvas.textBox("1").width;		
		percentage_width=percentage_char0_width*2+percentage_char1_width+percentage_min_width+2;
	}
	
	
	//Draw Legend Box	
	this.canvas.oFillStyle(this.legendBox.backgroundStyle);		
	this.canvas.fillRect(
		hx-8-this.legendBox.width-percentage_width,
		ly+this.titleBox.height,
		this.legendBox.width+6+percentage_width,
		this.legendBox.height+6);			
		
	if(this.legendBox.borderStyle.lineWidth>0){
		this.canvas.oStrokeStyle(this.legendBox.borderStyle);
		var ht=Math.floor(this.legendBox.borderStyle.lineWidth/2);		
		this.canvas.strokeRect(
			hx+ht-8-this.legendBox.width-percentage_width,
			ly+ht+this.titleBox.height,
			this.legendBox.width+6+percentage_width-ht,
			this.legendBox.height+6-ht
		);
	}
	var legendTextX=hx-(this.legendBox.width)-5;
	var legendTextY=ly+3+this.titleBox.height;	
	var total=0; 
	
	for(index in this.items){
		//Draw Legend Texts.
		total+=this.items[index].value;
		this.canvas.fillStyle(this.items[index].color);
		this.canvas.oText({style:'fill',baseline:'top',text:this.items[index].name,x:legendTextX,y:legendTextY});
		legendTextY+=this.items[index].labelBox.height;		
	}
	at_angle=0;
	var legendTextY=ly+3+this.titleBox.height;	
	var max_extrude=0;
	for(index in this.items){
		max_extrude=Math.max(this.items[index].extrude,max_extrude);
	}
	if(max_extrude!=0){
		circle_radius=circle_radius/100*(100-max_extrude);
	}
	for(index in this.items){
		var percentage01=this.items[index].value/total;
		var angle=360*percentage01;
		var c=this.items[index].color;
		var cx=circle_x;
		var cy=circle_y;
		if(this.items[index].extrude>0){
			var r=(at_angle+angle/2)*(Math.PI/180);
			cx=cx+(circle_radius/(100-max_extrude)*this.items[index].extrude)*Math.cos(r);
			cy=cy+(circle_radius/(100-max_extrude)*this.items[index].extrude)*Math.sin(r);

		}
        if(this.gradients){
			c=this.canvas.createRadialGradient(cx,cy,0,cx,cy,circle_radius);
			if(this.innerCircleInPercent>0){
				var percent=this.innerCircleInPercent/100;				
				c.addColorStop(0,"rgba(0,0,0,0)");
				c.addColorStop(percent,"rgba(0,0,0,0)");
				c.addColorStop(percent+0.1,this.items[index].dark);
				c.addColorStop(percent+0.2,this.items[index].color);				
			}
			c.addColorStop(0.8,this.items[index].color);
			c.addColorStop(1,this.items[index].dark);
		}

		this.canvas.oFillPie({
			x: cx,
			y: cy,
			from_angle:at_angle,
			to_angle:at_angle+angle,
			radius: circle_radius,
			rgb:c
		});
		if (this.showpercentage) {
			var percentage=Math.floor(percentage01 * 100);
			var x_offset=legendTextX-2-percentage_min_width;
			if(percentage<10){
				x_offset-=percentage_char0_width;
			}else{
				x_offset-=percentage_char0_width*2;
				if(percentage==100){
					x_offset-=percentage_char1_width;
				}
			}
			this.canvas.oText({
				style: 'fill',
				baseline: 'top',
				text: "(" +percentage+ "%)",
				//This I could not figure out how to emulate in VML
				//textalign: 'right',				
				//x: legendTextX-2,
				x: x_offset,
				y: legendTextY
			});
			legendTextY += this.items[index].labelBox.height;
		}				
		at_angle+=angle;		
	}
	this.canvas.restore(state);
};
PiechartClass.prototype.Item=function(){
	this.barrgb[2]+=10000;
	if(this.barrgb[2]>255){
		var d=Math.floor(this.barrgb[2]/255);
	    this.barrgb[1]+=d;
	    this.barrgb[2]=this.barrgb[2]%255;
		if (this.barrgb[1] > 255) {
			var d=Math.floor(this.barrgb[1]/255);
			this.barrgb[0] += d;
			this.barrgb[1] = this.barrgb[1]%255;
		}		
	}
	
    var dark='rgb('+Math.floor(this.barrgb[0]*0.30)+","+Math.floor(this.barrgb[1]*0.30)+","+Math.floor(this.barrgb[2]*0.30)+")";
	return {value:0,extrude:0,name:'',color:"rgb("+Math.floor(this.barrgb[0]*.5)+","+Math.floor(this.barrgb[1]*.5)+","+Math.floor(this.barrgb[2]*.5)+")",dark:dark};	
};

PiechartClass.prototype.addItem=function(bar){
	this.canvas.oFont(this.legendFont);		
	var box=this.canvas.textBox(bar.name);
	this.legendBox.width=Math.max(box.width,this.legendBox.width);
	this.legendBox.height+=box.height+2;
	bar.labelBox=box;
	this.items.push(bar);
};

if(typeof(JCanvasDSLClass)=='function'){
	JCanvasDSLClass.prototype.rootNode.piechart=function(self,node){
		var ele=Piechart();
		self.canvas.appendChild(ele);	
		ele.prepare();
		
		self.mapAttributes(node,ele,[
				['x','x',parseInt]
				,['y','y',parseInt]
				,['color','rgb',self.colorSolver]
				,['width','width',parseInt]
				,['height','height',parseInt]	
				,['ytitle','ytitle']		
				,['title','title']			
				,['borderThickness','borderThickness',parseInt]		
				,['showpercentage',"showpercentage",self.parseBoolean]		
				,['gradients',"gradients",self.parseBoolean]		
				,['innerCircle','innerCircleInPercent',parseInt]
				]
		);	
		var c=self.firstChild(node);
		while(c){
			switch(c.nodeName){
				case 'border':
					var border=ele.borderStyle;
					self.mapAttributes(c,border,[
							['color','rgba',self.colorSolverRGBA]
							,['borderThickness','lineWidth',parseInt]						
							]);				
				break;
				case 'legend':
					var border=ele.legendBox.borderStyle;
					self.mapAttributes(c,border,[
							['color','rgba',self.colorSolverRGBA]
							,['borderThickness','lineWidth',parseInt]						
							]);		
					var border=ele.legendBox.backgroundStyle;							
					self.mapAttributes(c,border,[
							['background-color','rgba',self.colorSolverRGBA]					
							]);		
				break;				
				case 'background':
					var border=ele.backgroundStyle;
					self.mapAttributes(c,border,[
							['color','rgba',self.colorSolverRGBA]					
							]);			
				break;							
				case 'item':
					var item=ele.Item();
					self.mapAttributes(c,item,[
							['value','value',parseInt]
							,['color','color',self.colorSolver]
							,['extrude','extrude',parseFloat]
							,['name','name']						
							]);
					ele.addItem(item);				
				break;
			}
			c=self.nextSibling(c);
		}
		
	};
}
