Элемент Canvas - паучок

function init() {
var f_canvas = document.getElementById("first");
var f_context = f_canvas.getContext("2d");
f_canvas.width = 550;
f_canvas.height = window.screen.height-350;

Spider(f_canvas.width/2,f_canvas.height/2,90);

// паучок
function Spider(x,y,r){
f_context.beginPath();
f_context.arc(x, y, r, 0, Math.PI * 2, false);
f_context.closePath();
f_context.fillStyle = "#999";
f_context.fill();
var r1 = r/3;
y -= r + r1;
f_context.beginPath();
f_context.arc(x, y, r1, 0, Math.PI * 2, false);
f_context.closePath();
f_context.fillStyle = "#666";
f_context.fill();

f_context.beginPath();
for (var i = 1; i <= 4; i += 1) {
f_context.moveTo(x,y);
f_context.lineTo(x - Math.cos(i * Math.PI / 8)*r-5,y - Math.sin(i * Math.PI / 8)*r);
f_context.lineTo(x - Math.cos(i * Math.PI / 8)*r-5 - Math.sin(i * Math.PI / 8)*r-5,y - Math.sin(i * Math.PI / 8)*r + Math.cos(i * Math.PI / 8)*r);
f_context.moveTo(x,y);
f_context.lineTo(x + Math.cos(i * Math.PI / 8)*r+5,y - Math.sin(i * Math.PI / 8)*r);
f_context.lineTo(x + Math.cos(i * Math.PI / 8)*r+5 + Math.sin(i * Math.PI / 8)*r+5,y - Math.sin(i * Math.PI / 8)*r + Math.cos(i * Math.PI / 8)*r);
}
f_context.strokeStyle = "#333";
f_context.stroke();
}

}