"Paskalevskaya graphics on HTML5" or "What did Opera do with Rainbow Dash"

I saw a Turbo Pascal code on the theme site dedicated to the My Little Pony TV series, using the old Graph module and drawing several characters.

The code contained only function calls and comments, javascript perfectly pars it. It remains only to add their graphical functions.

Final version

var colors = ["#000000", "#0000AA", "#00AA00", "#00AAAA", "#AA0000", "#AA00AA", "#AA5500", "#AAAAAA", "#555555", "#5555FF", "#55FF55", "#55FFFF", "#FF5555", "#FF55FF", "#FFFF55", "#FFFFFF"]; function setcolor(colorIndex) { ctx.strokeStyle = colors[colorIndex]; } function line(x1, y1, x2, y2) { ctx.beginPath(); ctx.moveTo(x1, y1); ctx.lineTo(x2, y2); ctx.stroke(); ctx.closePath(); } function setlinestyle(p, t, width) { ctx.lineWidth = width; } function setfillstyle(t, colorIndex) { ctx.fillStyle = colors[colorIndex]; } function ellipse(x, y, st, end, xrad, yrad) { ctx.save(); ctx.translate(x, y); ctx.scale(xrad, -yrad); ctx.beginPath(); ctx.arc(0, 0, 1, st * Math.PI / 180.0, end * Math.PI / 180.0, false); ctx.restore(); ctx.stroke(); } function fillellipse(x, y, xrad, yrad) { ctx.save(); ctx.translate(x, y); ctx.scale(xrad, yrad); ctx.beginPath(); ctx.arc(0, 0, 1, 0, Math.PI * 2, true); ctx.fill(); ctx.closePath(); ctx.restore(); } 

')
That's what happened
Opera reacted poorly to my implementation of the ellipse () function:


Bug zafortili.

But I did not stop at this, and the result can be seen here .



At the moment I think how all this can be accelerated. Ideas?