Corners

Your browser doesn't currently support HTML5 canvas Please check www.caniuse.com/#feat=canvas for information on browser support for canvas
		// canvas definition standard variables
		canvas = document.getElementById('canvasArea');
		context=canvas.getContext("2d");
		
		// a2. layout parameters
		var xPos = 25;
		var yPos = 25
		var width = 150;
		var height = 75;
		var radius = 30;

		// a3. attributes of lines and arc
		context.strokeStyle = "red";
		context.lineWidth = 20;
		context.lineCap = "square";
		context.shadowOffsetX = 3;
		context.shadowOffsetY =3;
		context.shadowBlur = 5;
		context.shadowColor = "gray";

		// a4. starting point
		context.beginPath();
		context.moveTo(xPos, yPos);

		// a5. top line path
		context.lineTo(xPos+width - radius, yPos);

		// a6. corner arc path
		context.arcTo(xPos + width, yPos, xPos+width, yPos+radius, radius);

		//a7. side line path
		context.lineTo(xPos+width, yPos+height);

		//a8. draw image
		context.stroke();