/**
 * @author romeosa.com
 * 
 * this simple function uses Google exCanvas to make rounded corners around a div element.
 * The background of the element will be a gradient of the color.
 * Just pass the div id to the function.
 * If you don't like gradient color, just specify true after the id.
 */
function makeDivRounded(id,noGradient) {
	var cd = $(id);
	var cdc = cd.clone(true,true);
	if ($(id+'_content')) {
		$(id+'_content').destroy();
	}
	cdc.setProperty('id',id+'_content');
	cdc.removeProperty('class');

	var color = cd.getStyle('background-color');
	cd.setStyle('width',cd.getSize().x-20);// poprawic
	cd.setStyle('height',cd.getSize().y);
	cd.setStyle('margin-bottom',16);
	cd.setStyle('background-color','transparent');
	cd.setStyle('position','relative'); // Children will absolute position to this element
	cd.setStyle('zoom',1); // Fix IE6 absolute positioning
//	$E('span',cd).setOpacity(0);
	cd.set('html','');

	cdc.inject(id,'top');
	//cdc.setStyle('padding-right',18);
	cdc.setStyles({
		top : $(id).getStyle('padding-top').toInt()+8,
		right: $(id).getStyle('padding-right').toInt()+10,
		left : $(id).getStyle('padding-left').toInt()+10,
		bottom: $(id).getStyle('padding-bottom').toInt()+10,
		width: $(id).getStyle('width').toInt(),
		height: $(id).getStyle('height').toInt()+12,
//		top: cd.getPosition().y+5,
//		left: cd.getPosition().x+5,
		position:'absolute'
	});
	cdc.setStyle('z-index',1);
	cdc.setStyle('font-weight','');
	
	var x = cdc.getPosition().x;
	var y = cdc.getPosition().y;
	var width = cd.getCoordinates().width+12;
	var height = cd.getCoordinates().height+8;
	
	if(!color || color=='transparent')
		color = "#000";
	
	cdc.setStyle('background-color','transparent');
	
	if ($(id+'_canvas')) {
		$(id+'_canvas').destroy();
	}
	
//	var canvas = new Canvas({'id':id+'_canvas','width':width+16,'height':height+16});
	var canvas = new Element("canvas", {'id':id+'_canvas','width':width,'height':height});
	canvas.setStyles({
		display:'inline-block',
		overflow:'hidden',
//		bottom: 10,
//		top:y-5,
//		left:x-5
		position: 'absolute'
	});
//	canvas.setStyle('z-index',1);
	canvas.inject(id+'_content','after');
	

	var ctx;

	if(Browser.ie)
		ctx = G_vmlCanvasManager.initElement(canvas).getContext('2d');
	else
		ctx = canvas.getContext('2d');
	
	var lingrad = ctx.createLinearGradient(0,0,0,height/1.4);
	lingrad.addColorStop(0, color);
	var inerm = new Color('#fff');
	var color2 = inerm.mix(color,58);
	lingrad.addColorStop(1, color2.rgbToHex());
	
	ctx.fillStyle = lingrad;
	if(noGradient)	
		ctx.fillStyle = color;
	
	ctx.moveTo(0,8);
	ctx.quadraticCurveTo(0,0,8,0);
	ctx.lineTo(width-8,0);
	ctx.quadraticCurveTo(width,0,width,8);
	ctx.lineTo(width,height-8);
	ctx.quadraticCurveTo(width,height,width-8,height);
	ctx.lineTo(8,height);
	ctx.quadraticCurveTo(0,height,0,height-8);
	ctx.closePath();
	ctx.fill();
/*
	delete ctx;
	delete cdc;
	delete canvas;
	delete cd;
	delete color;
	delete x;
	delete y;
	delete width;
	delete height;
	delete lingrad;
	delete inerm;
	delete color2;
*/
}