<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[180790] trunk</title>
</head>
<body>
<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; }
#msg dl a { font-weight: bold}
#msg dl a:link { color:#fc3; }
#msg dl a:active { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta">
<dt>Revision</dt> <dd><a href="http://trac.webkit.org/projects/webkit/changeset/180790">180790</a></dd>
<dt>Author</dt> <dd>dino@apple.com</dd>
<dt>Date</dt> <dd>2015-02-27 15:40:35 -0800 (Fri, 27 Feb 2015)</dd>
</dl>
<h3>Log Message</h3>
<pre>Add support for canvas ellipse method
https://bugs.webkit.org/show_bug.cgi?id=82791
<rdar://problem/11159172>
Patch by Sam Weinig <sam@webkit.org> on 2015-02-26
Reviewed by Dirk Schulze.
Source/WebCore:
Tests: fast/canvas/canvas-ellipse-360-winding.html
fast/canvas/canvas-ellipse-circumference-fill.html
fast/canvas/canvas-ellipse-circumference.html
fast/canvas/canvas-ellipse-connecting-line.html
fast/canvas/canvas-ellipse-negative-radius.html
fast/canvas/canvas-ellipse-zero-lineto.html
fast/canvas/canvas-ellipse.html
* html/canvas/CanvasPathMethods.h:
* html/canvas/CanvasPathMethods.cpp:
(WebCore::CanvasPathMethods::lineTo):
Convenience for passing a FloatPoint instead of two floats.
(WebCore::normalizeAngles):
Normalizes the angles as described in the HTML spec. Ensuring the startAngle
is greater than 0 and less than 2pi, and the the endAngle is at most 2pi
from the start angle.
(WebCore::CanvasPathMethods::arc):
- Renames some of the parameters to be clearer.
- Normalizes the angles for consistency with ellipse.
- Moves hasInvertibleTransform() higher in the function for consistency.
(WebCore::CanvasPathMethods::ellipse): Added.
* html/canvas/CanvasRenderingContext2D.idl:
* html/canvas/DOMPath.idl:
Add ellipse(...).
* platform/graphics/Path.h:
* platform/graphics/cg/PathCG.cpp:
(WebCore::Path::addArc):
Rename parameters for clarity and use a nullptr.
(WebCore::Path::addEllipse):
Added. Constructs an ellipse via a transformed arc.
LayoutTests:
* fast/canvas/canvas-ellipse-360-winding-expected.txt: Added.
* fast/canvas/canvas-ellipse-360-winding.html: Added.
* fast/canvas/canvas-ellipse-circumference-expected.txt: Added.
* fast/canvas/canvas-ellipse-circumference-fill-expected.txt: Added.
* fast/canvas/canvas-ellipse-circumference-fill.html: Added.
* fast/canvas/canvas-ellipse-circumference.html: Added.
* fast/canvas/canvas-ellipse-connecting-line-expected.html: Added.
* fast/canvas/canvas-ellipse-connecting-line.html: Added.
* fast/canvas/canvas-ellipse-expected.txt: Added.
* fast/canvas/canvas-ellipse-negative-radius-expected.txt: Added.
* fast/canvas/canvas-ellipse-negative-radius.html: Added.
* fast/canvas/canvas-ellipse-zero-lineto-expected.txt: Added.
* fast/canvas/canvas-ellipse-zero-lineto.html: Added.
* fast/canvas/canvas-ellipse.html: Added.
* fast/canvas/script-tests/canvas-ellipse-360-winding.js: Added.
* fast/canvas/script-tests/canvas-ellipse.js: Added.
* fast/canvas/script-tests/js-ellipse-implementation.js: Added.
* platform/mac/fast/canvas/canvas-ellipse-circumference-expected.png: Added.
* platform/mac/fast/canvas/canvas-ellipse-circumference-fill-expected.png: Added.</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsChangeLog">trunk/LayoutTests/ChangeLog</a></li>
<li><a href="#trunkSourceWebCoreChangeLog">trunk/Source/WebCore/ChangeLog</a></li>
<li><a href="#trunkSourceWebCorehtmlcanvasCanvasPathMethodscpp">trunk/Source/WebCore/html/canvas/CanvasPathMethods.cpp</a></li>
<li><a href="#trunkSourceWebCorehtmlcanvasCanvasPathMethodsh">trunk/Source/WebCore/html/canvas/CanvasPathMethods.h</a></li>
<li><a href="#trunkSourceWebCorehtmlcanvasCanvasRenderingContext2Didl">trunk/Source/WebCore/html/canvas/CanvasRenderingContext2D.idl</a></li>
<li><a href="#trunkSourceWebCorehtmlcanvasDOMPathidl">trunk/Source/WebCore/html/canvas/DOMPath.idl</a></li>
<li><a href="#trunkSourceWebCoreplatformgraphicsPathh">trunk/Source/WebCore/platform/graphics/Path.h</a></li>
<li><a href="#trunkSourceWebCoreplatformgraphicscgPathCGcpp">trunk/Source/WebCore/platform/graphics/cg/PathCG.cpp</a></li>
</ul>
<h3>Added Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsfastcanvascanvasellipse360windingexpectedtxt">trunk/LayoutTests/fast/canvas/canvas-ellipse-360-winding-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastcanvascanvasellipse360windinghtml">trunk/LayoutTests/fast/canvas/canvas-ellipse-360-winding.html</a></li>
<li><a href="#trunkLayoutTestsfastcanvascanvasellipsecircumferenceexpectedtxt">trunk/LayoutTests/fast/canvas/canvas-ellipse-circumference-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastcanvascanvasellipsecircumferencefillexpectedtxt">trunk/LayoutTests/fast/canvas/canvas-ellipse-circumference-fill-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastcanvascanvasellipsecircumferencefillhtml">trunk/LayoutTests/fast/canvas/canvas-ellipse-circumference-fill.html</a></li>
<li><a href="#trunkLayoutTestsfastcanvascanvasellipsecircumferencehtml">trunk/LayoutTests/fast/canvas/canvas-ellipse-circumference.html</a></li>
<li><a href="#trunkLayoutTestsfastcanvascanvasellipseconnectinglineexpectedhtml">trunk/LayoutTests/fast/canvas/canvas-ellipse-connecting-line-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastcanvascanvasellipseconnectinglinehtml">trunk/LayoutTests/fast/canvas/canvas-ellipse-connecting-line.html</a></li>
<li><a href="#trunkLayoutTestsfastcanvascanvasellipseexpectedtxt">trunk/LayoutTests/fast/canvas/canvas-ellipse-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastcanvascanvasellipsenegativeradiusexpectedtxt">trunk/LayoutTests/fast/canvas/canvas-ellipse-negative-radius-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastcanvascanvasellipsenegativeradiushtml">trunk/LayoutTests/fast/canvas/canvas-ellipse-negative-radius.html</a></li>
<li><a href="#trunkLayoutTestsfastcanvascanvasellipsezerolinetoexpectedtxt">trunk/LayoutTests/fast/canvas/canvas-ellipse-zero-lineto-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastcanvascanvasellipsezerolinetohtml">trunk/LayoutTests/fast/canvas/canvas-ellipse-zero-lineto.html</a></li>
<li><a href="#trunkLayoutTestsfastcanvascanvasellipsehtml">trunk/LayoutTests/fast/canvas/canvas-ellipse.html</a></li>
<li><a href="#trunkLayoutTestsfastcanvasscripttestscanvasellipse360windingjs">trunk/LayoutTests/fast/canvas/script-tests/canvas-ellipse-360-winding.js</a></li>
<li><a href="#trunkLayoutTestsfastcanvasscripttestscanvasellipsejs">trunk/LayoutTests/fast/canvas/script-tests/canvas-ellipse.js</a></li>
<li><a href="#trunkLayoutTestsfastcanvasscripttestsjsellipseimplementationjs">trunk/LayoutTests/fast/canvas/script-tests/js-ellipse-implementation.js</a></li>
<li><a href="#trunkLayoutTestsplatformmacfastcanvascanvasellipsecircumferenceexpectedpng">trunk/LayoutTests/platform/mac/fast/canvas/canvas-ellipse-circumference-expected.png</a></li>
<li><a href="#trunkLayoutTestsplatformmacfastcanvascanvasellipsecircumferencefillexpectedpng">trunk/LayoutTests/platform/mac/fast/canvas/canvas-ellipse-circumference-fill-expected.png</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkLayoutTestsChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/ChangeLog (180789 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/ChangeLog        2015-02-27 23:37:07 UTC (rev 180789)
+++ trunk/LayoutTests/ChangeLog        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -1,3 +1,31 @@
</span><ins>+2015-02-26 Sam Weinig <sam@webkit.org>
+
+ Add support for canvas ellipse method
+ https://bugs.webkit.org/show_bug.cgi?id=82791
+ <rdar://problem/11159172>
+
+ Reviewed by Dirk Schulze.
+
+ * fast/canvas/canvas-ellipse-360-winding-expected.txt: Added.
+ * fast/canvas/canvas-ellipse-360-winding.html: Added.
+ * fast/canvas/canvas-ellipse-circumference-expected.txt: Added.
+ * fast/canvas/canvas-ellipse-circumference-fill-expected.txt: Added.
+ * fast/canvas/canvas-ellipse-circumference-fill.html: Added.
+ * fast/canvas/canvas-ellipse-circumference.html: Added.
+ * fast/canvas/canvas-ellipse-connecting-line-expected.html: Added.
+ * fast/canvas/canvas-ellipse-connecting-line.html: Added.
+ * fast/canvas/canvas-ellipse-expected.txt: Added.
+ * fast/canvas/canvas-ellipse-negative-radius-expected.txt: Added.
+ * fast/canvas/canvas-ellipse-negative-radius.html: Added.
+ * fast/canvas/canvas-ellipse-zero-lineto-expected.txt: Added.
+ * fast/canvas/canvas-ellipse-zero-lineto.html: Added.
+ * fast/canvas/canvas-ellipse.html: Added.
+ * fast/canvas/script-tests/canvas-ellipse-360-winding.js: Added.
+ * fast/canvas/script-tests/canvas-ellipse.js: Added.
+ * fast/canvas/script-tests/js-ellipse-implementation.js: Added.
+ * platform/mac/fast/canvas/canvas-ellipse-circumference-expected.png: Added.
+ * platform/mac/fast/canvas/canvas-ellipse-circumference-fill-expected.png: Added.
+
</ins><span class="cx"> 2015-02-27 Alex Christensen <achristensen@webkit.org>
</span><span class="cx">
</span><span class="cx"> Test more features of content extensions.
</span></span></pre></div>
<a id="trunkLayoutTestsfastcanvascanvasellipse360windingexpectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/canvas-ellipse-360-winding-expected.txt (0 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/canvas-ellipse-360-winding-expected.txt         (rev 0)
+++ trunk/LayoutTests/fast/canvas/canvas-ellipse-360-winding-expected.txt        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -0,0 +1,15 @@
</span><ins>+This tests canvas full arc fill with nonzero winding rule. Eight green concentric thick circumferences should be displayed.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+PASS data[1] is 0
+PASS data[1] is 255
+PASS data[1] is 255
+PASS data[1] is 0
+PASS data[1] is 0
+PASS data[1] is 255
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
</ins><span class="cx">Property changes on: trunk/LayoutTests/fast/canvas/canvas-ellipse-360-winding-expected.txt
</span><span class="cx">___________________________________________________________________
</span></span></pre></div>
<a id="svnmimetype"></a>
<div class="addfile"><h4>Added: svn:mime-type</h4></div>
<a id="svnkeywords"></a>
<div class="addfile"><h4>Added: svn:keywords</h4></div>
<a id="svneolstyle"></a>
<div class="addfile"><h4>Added: svn:eol-style</h4></div>
<a id="trunkLayoutTestsfastcanvascanvasellipse360windinghtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/canvas-ellipse-360-winding.html (0 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/canvas-ellipse-360-winding.html         (rev 0)
+++ trunk/LayoutTests/fast/canvas/canvas-ellipse-360-winding.html        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -0,0 +1,9 @@
</span><ins>+<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
+<html>
+<head>
+<script src="../../resources/js-test.js"></script>
+</head>
+<body>
+<script src="script-tests/canvas-ellipse-360-winding.js"></script>
+</body>
+</html>
</ins><span class="cx">Property changes on: trunk/LayoutTests/fast/canvas/canvas-ellipse-360-winding.html
</span><span class="cx">___________________________________________________________________
</span></span></pre></div>
<a id="svnmimetype"></a>
<div class="addfile"><h4>Added: svn:mime-type</h4></div>
<a id="svnkeywords"></a>
<div class="addfile"><h4>Added: svn:keywords</h4></div>
<a id="svneolstyle"></a>
<div class="addfile"><h4>Added: svn:eol-style</h4></div>
<a id="trunkLayoutTestsfastcanvascanvasellipsecircumferenceexpectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/canvas-ellipse-circumference-expected.txt (0 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/canvas-ellipse-circumference-expected.txt         (rev 0)
+++ trunk/LayoutTests/fast/canvas/canvas-ellipse-circumference-expected.txt        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -0,0 +1 @@
</span><ins>+
</ins><span class="cx">Property changes on: trunk/LayoutTests/fast/canvas/canvas-ellipse-circumference-expected.txt
</span><span class="cx">___________________________________________________________________
</span></span></pre></div>
<a id="svnmimetype"></a>
<div class="addfile"><h4>Added: svn:mime-type</h4></div>
<a id="svnkeywords"></a>
<div class="addfile"><h4>Added: svn:keywords</h4></div>
<a id="svneolstyle"></a>
<div class="addfile"><h4>Added: svn:eol-style</h4></div>
<a id="trunkLayoutTestsfastcanvascanvasellipsecircumferencefillexpectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/canvas-ellipse-circumference-fill-expected.txt (0 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/canvas-ellipse-circumference-fill-expected.txt         (rev 0)
+++ trunk/LayoutTests/fast/canvas/canvas-ellipse-circumference-fill-expected.txt        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -0,0 +1 @@
</span><ins>+
</ins><span class="cx">Property changes on: trunk/LayoutTests/fast/canvas/canvas-ellipse-circumference-fill-expected.txt
</span><span class="cx">___________________________________________________________________
</span></span></pre></div>
<a id="svnmimetype"></a>
<div class="addfile"><h4>Added: svn:mime-type</h4></div>
<a id="svnkeywords"></a>
<div class="addfile"><h4>Added: svn:keywords</h4></div>
<a id="svneolstyle"></a>
<div class="addfile"><h4>Added: svn:eol-style</h4></div>
<a id="trunkLayoutTestsfastcanvascanvasellipsecircumferencefillhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/canvas-ellipse-circumference-fill.html (0 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/canvas-ellipse-circumference-fill.html         (rev 0)
+++ trunk/LayoutTests/fast/canvas/canvas-ellipse-circumference-fill.html        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -0,0 +1,67 @@
</span><ins>+<!DOCTYPE html>
+<html>
+<head></head>
+<body>
+<canvas id="mycanvas" width="600" height="480"></canvas>
+<script>
+if (window.testRunner)
+ testRunner.dumpAsText(true);
+
+var canvas = document.getElementById('mycanvas');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = 'rgba(0, 0, 0, 0.5)';
+
+// 20 angles.
+var sweepAngles = [
+ -123.7, -2.3, -2, -1, -0.3, -0.000001, 0, 0.000001, 0.3, 0.7,
+ 1, 1.3, 1.5, 1.7, 1.99999, 2, 2.00001, 2.3, 4.3, 3934723942837.3
+];
+for (var i = 0; i < sweepAngles.length; i++) {
+ sweepAngles[i] = sweepAngles[i] * Math.PI;
+}
+
+var startAngles = [
+ -1, -0.5, 0, 0.5
+]
+for (var i = 0; i < startAngles.length; i++) {
+ startAngles[i] = startAngles[i] * Math.PI;
+}
+
+var rotations = [
+ Math.PI / 4, 0
+]
+
+var startAngle = 0;
+var anticlockwise = false;
+var sign = 1;
+var height = 30;
+for (var r = 0; r < rotations.length; r++) {
+ ctx.save();
+ for (var i = 0; i < startAngles.length * 2; i++) {
+ if (i == startAngles.length) {
+ anticlockwise = true;
+ sign = -1;
+ }
+ startAngle = startAngles[i % startAngles.length] * sign;
+ ctx.save();
+ for (var j = 0; j < sweepAngles.length; j++) {
+ ctx.save();
+ ctx.beginPath();
+ ctx.moveTo(0, 2);
+ ctx.ellipse(18, 15, 8, 12, rotations[r], startAngle, startAngle + (sweepAngles[j] * sign), anticlockwise);
+ ctx.lineTo(0, 28);
+ ctx.fill();
+ ctx.restore();
+ ctx.translate(30, 0);
+ }
+ ctx.restore();
+ ctx.translate(0, height);
+ }
+ ctx.restore();
+ ctx.translate(0, height * startAngles.length * 2);
+}
+
+</script>
+</body>
+</html>
</ins><span class="cx">Property changes on: trunk/LayoutTests/fast/canvas/canvas-ellipse-circumference-fill.html
</span><span class="cx">___________________________________________________________________
</span></span></pre></div>
<a id="svnmimetype"></a>
<div class="addfile"><h4>Added: svn:mime-type</h4></div>
<a id="svnkeywords"></a>
<div class="addfile"><h4>Added: svn:keywords</h4></div>
<a id="svneolstyle"></a>
<div class="addfile"><h4>Added: svn:eol-style</h4></div>
<a id="trunkLayoutTestsfastcanvascanvasellipsecircumferencehtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/canvas-ellipse-circumference.html (0 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/canvas-ellipse-circumference.html         (rev 0)
+++ trunk/LayoutTests/fast/canvas/canvas-ellipse-circumference.html        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -0,0 +1,68 @@
</span><ins>+<!DOCTYPE html>
+<html>
+<head></head>
+<body>
+<canvas id="mycanvas" width="600" height="480"></canvas>
+<script>
+if (window.testRunner)
+ testRunner.dumpAsText(true);
+
+var canvas = document.getElementById('mycanvas');
+var ctx = canvas.getContext('2d');
+
+ctx.lineWidth = 3;
+ctx.strokeStyle = 'rgba(0, 0, 0, 0.5)';
+
+// 20 angles.
+var sweepAngles = [
+ -123.7, -2.3, -2, -1, -0.3, -0.000001, 0, 0.000001, 0.3, 0.7,
+ 1, 1.3, 1.5, 1.7, 1.99999, 2, 2.00001, 2.3, 4.3, 3934723942837.3
+];
+for (var i = 0; i < sweepAngles.length; i++) {
+ sweepAngles[i] = sweepAngles[i] * Math.PI;
+}
+
+var startAngles = [
+ -1, -0.5, 0, 0.5
+]
+for (var i = 0; i < startAngles.length; i++) {
+ startAngles[i] = startAngles[i] * Math.PI;
+}
+
+var rotations = [
+ Math.PI / 4, 0
+]
+
+var startAngle = 0;
+var anticlockwise = false;
+var sign = 1;
+var height = 30;
+for (var r = 0; r < rotations.length; r++) {
+ ctx.save();
+ for (var i = 0; i < startAngles.length * 2; i++) {
+ if (i == startAngles.length) {
+ anticlockwise = true;
+ sign = -1;
+ }
+ startAngle = startAngles[i % startAngles.length] * sign;
+ ctx.save();
+ for (var j = 0; j < sweepAngles.length; j++) {
+ ctx.save();
+ ctx.beginPath();
+ ctx.moveTo(0, 2);
+ ctx.ellipse(18, 15, 8, 12, rotations[r], startAngle, startAngle + (sweepAngles[j] * sign), anticlockwise);
+ ctx.lineTo(0, 28);
+ ctx.stroke();
+ ctx.restore();
+ ctx.translate(30, 0);
+ }
+ ctx.restore();
+ ctx.translate(0, height);
+ }
+ ctx.restore();
+ ctx.translate(0, height * startAngles.length * 2);
+}
+
+</script>
+</body>
+</html>
</ins><span class="cx">Property changes on: trunk/LayoutTests/fast/canvas/canvas-ellipse-circumference.html
</span><span class="cx">___________________________________________________________________
</span></span></pre></div>
<a id="svnmimetype"></a>
<div class="addfile"><h4>Added: svn:mime-type</h4></div>
<a id="svnkeywords"></a>
<div class="addfile"><h4>Added: svn:keywords</h4></div>
<a id="svneolstyle"></a>
<div class="addfile"><h4>Added: svn:eol-style</h4></div>
<a id="trunkLayoutTestsfastcanvascanvasellipseconnectinglineexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/canvas-ellipse-connecting-line-expected.html (0 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/canvas-ellipse-connecting-line-expected.html         (rev 0)
+++ trunk/LayoutTests/fast/canvas/canvas-ellipse-connecting-line-expected.html        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -0,0 +1,21 @@
</span><ins>+<!DOCTYPE html>
+<html>
+<head></head>
+<body>
+<canvas id="mycanvas" width="300" height="300"></canvas>
+<script src="script-tests/js-ellipse-implementation.js"></script>
+<script>
+var canvas = document.getElementById('mycanvas');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, canvas.width, canvas.height);
+ctx.lineJoin = 'bevel';
+ctx.lineWidth = 12;
+ctx.beginPath();
+ellipseUsingArc(ctx, 200, 150, 40, 80, -Math.PI / 6, Math.PI / 2, -Math.PI / 2, false);
+ellipseUsingArc(ctx, 100, 150, 40, 80, Math.PI / 6, Math.PI / 2, -Math.PI / 2, false);
+ctx.stroke();
+</script>
+</body>
+</html>
</ins><span class="cx">\ No newline at end of file
</span><span class="cx">Property changes on: trunk/LayoutTests/fast/canvas/canvas-ellipse-connecting-line-expected.html
</span><span class="cx">___________________________________________________________________
</span></span></pre></div>
<a id="svnmimetype"></a>
<div class="addfile"><h4>Added: svn:mime-type</h4></div>
<a id="svnkeywords"></a>
<div class="addfile"><h4>Added: svn:keywords</h4></div>
<a id="svneolstyle"></a>
<div class="addfile"><h4>Added: svn:eol-style</h4></div>
<a id="trunkLayoutTestsfastcanvascanvasellipseconnectinglinehtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/canvas-ellipse-connecting-line.html (0 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/canvas-ellipse-connecting-line.html         (rev 0)
+++ trunk/LayoutTests/fast/canvas/canvas-ellipse-connecting-line.html        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -0,0 +1,20 @@
</span><ins>+<!DOCTYPE html>
+<html>
+<head></head>
+<body>
+<canvas id="mycanvas" width="300" height="300"></canvas>
+<script>
+var canvas = document.getElementById('mycanvas');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, canvas.width, canvas.height);
+ctx.lineJoin = 'bevel';
+ctx.lineWidth = 12;
+ctx.beginPath();
+ctx.ellipse(200, 150, 40, 80, -Math.PI / 6, Math.PI / 2, -Math.PI / 2, false);
+ctx.ellipse(100, 150, 40, 80, Math.PI / 6, Math.PI / 2, -Math.PI / 2, false);
+ctx.stroke();
+</script>
+</body>
+</html>
</ins><span class="cx">\ No newline at end of file
</span><span class="cx">Property changes on: trunk/LayoutTests/fast/canvas/canvas-ellipse-connecting-line.html
</span><span class="cx">___________________________________________________________________
</span></span></pre></div>
<a id="svnmimetype"></a>
<div class="addfile"><h4>Added: svn:mime-type</h4></div>
<a id="svnkeywords"></a>
<div class="addfile"><h4>Added: svn:keywords</h4></div>
<a id="svneolstyle"></a>
<div class="addfile"><h4>Added: svn:eol-style</h4></div>
<a id="trunkLayoutTestsfastcanvascanvasellipseexpectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/canvas-ellipse-expected.txt (0 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/canvas-ellipse-expected.txt         (rev 0)
+++ trunk/LayoutTests/fast/canvas/canvas-ellipse-expected.txt        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -0,0 +1,24 @@
</span><ins>+This test checks ellipse API in canvas v5
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+PASS data[0] is 0
+PASS data[0] is 0
+PASS data[0] is 0
+PASS data[0] is 255
+PASS data[0] is 255
+PASS data[0] is 0
+PASS data[0] is 0
+PASS data[0] is 0
+PASS data[0] is 0
+PASS data[0] is 0
+PASS data[0] is 255
+PASS data[0] is 0
+PASS data[0] is 0
+PASS data[0] is 0
+PASS data[0] is 255
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
</ins><span class="cx">Property changes on: trunk/LayoutTests/fast/canvas/canvas-ellipse-expected.txt
</span><span class="cx">___________________________________________________________________
</span></span></pre></div>
<a id="svnmimetype"></a>
<div class="addfile"><h4>Added: svn:mime-type</h4></div>
<a id="svnkeywords"></a>
<div class="addfile"><h4>Added: svn:keywords</h4></div>
<a id="svneolstyle"></a>
<div class="addfile"><h4>Added: svn:eol-style</h4></div>
<a id="trunkLayoutTestsfastcanvascanvasellipsenegativeradiusexpectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/canvas-ellipse-negative-radius-expected.txt (0 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/canvas-ellipse-negative-radius-expected.txt         (rev 0)
+++ trunk/LayoutTests/fast/canvas/canvas-ellipse-negative-radius-expected.txt        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -0,0 +1,15 @@
</span><ins>+Tests CanvasPathMethods ellipse with negative radii.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+PASS ctx.ellipse(10, 10, 10, 5, 0, 0, 1, false) did not throw exception.
+PASS ctx.ellipse(10, 10, 10, 0, 0, 0, 1, false) did not throw exception.
+PASS ctx.ellipse(10, 10, -0, 5, 0, 0, 1, false) did not throw exception.
+PASS ctx.ellipse(10, 10, -2, 5, 0, 0, 1, false) threw exception Error: IndexSizeError: DOM Exception 1.
+PASS ctx.ellipse(10, 10, 0, -1.5, 0, 0, 1, false) threw exception Error: IndexSizeError: DOM Exception 1.
+PASS ctx.ellipse(10, 10, -2, -5, 0, 0, 1, false) threw exception Error: IndexSizeError: DOM Exception 1.
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
</ins><span class="cx">Property changes on: trunk/LayoutTests/fast/canvas/canvas-ellipse-negative-radius-expected.txt
</span><span class="cx">___________________________________________________________________
</span></span></pre></div>
<a id="svnmimetype"></a>
<div class="addfile"><h4>Added: svn:mime-type</h4></div>
<a id="svnkeywords"></a>
<div class="addfile"><h4>Added: svn:keywords</h4></div>
<a id="svneolstyle"></a>
<div class="addfile"><h4>Added: svn:eol-style</h4></div>
<a id="trunkLayoutTestsfastcanvascanvasellipsenegativeradiushtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/canvas-ellipse-negative-radius.html (0 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/canvas-ellipse-negative-radius.html         (rev 0)
+++ trunk/LayoutTests/fast/canvas/canvas-ellipse-negative-radius.html        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -0,0 +1,27 @@
</span><ins>+<!DOCTYPE html>
+<html>
+<head>
+<script src="../../resources/js-test.js"></script>
+</head>
+<body>
+<p id="description"></p>
+<div id="console"></div>
+
+<script>
+description("Tests CanvasPathMethods ellipse with negative radii.");
+
+var canvas = document.createElement("canvas");
+var ctx = canvas.getContext('2d');
+
+shouldNotThrow("ctx.ellipse(10, 10, 10, 5, 0, 0, 1, false)");
+shouldNotThrow("ctx.ellipse(10, 10, 10, 0, 0, 0, 1, false)");
+shouldNotThrow("ctx.ellipse(10, 10, -0, 5, 0, 0, 1, false)");
+
+shouldThrow("ctx.ellipse(10, 10, -2, 5, 0, 0, 1, false)");
+shouldThrow("ctx.ellipse(10, 10, 0, -1.5, 0, 0, 1, false)");
+shouldThrow("ctx.ellipse(10, 10, -2, -5, 0, 0, 1, false)");
+
+// FIXME: When this is exposed on Path as well as CanvasRenderingContext2D, add tests for Path as well.
+</script>
+</body>
+</html>
</ins><span class="cx">Property changes on: trunk/LayoutTests/fast/canvas/canvas-ellipse-negative-radius.html
</span><span class="cx">___________________________________________________________________
</span></span></pre></div>
<a id="svnmimetype"></a>
<div class="addfile"><h4>Added: svn:mime-type</h4></div>
<a id="svnkeywords"></a>
<div class="addfile"><h4>Added: svn:keywords</h4></div>
<a id="svneolstyle"></a>
<div class="addfile"><h4>Added: svn:eol-style</h4></div>
<a id="trunkLayoutTestsfastcanvascanvasellipsezerolinetoexpectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/canvas-ellipse-zero-lineto-expected.txt (0 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/canvas-ellipse-zero-lineto-expected.txt         (rev 0)
+++ trunk/LayoutTests/fast/canvas/canvas-ellipse-zero-lineto-expected.txt        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -0,0 +1,82 @@
</span><ins>+This tests checks that ellipse can draw lines correctly in edge cases.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+PASS imageData.data[1] is 255
+moveTo + empty ellipse (swing == 0)
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+moveTo + empty ellipse (radiusX == 0)
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+moveTo + empty ellipse (radiusY == 0)
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+empty ellipse (swing == 0) + lineTo
+PASS imageData.data[1] is 255
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+empty ellipse (radiusX == 0) + lineTo
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+empty ellipse (radiusY == 0) + lineTo
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+lineTo + empty ellipse (radiusX == 0) + lineTo
+ 1. sweepAngle < PI / 2
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+ 2. sweepAngle < PI
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+ 3. sweepAngle < 2PI
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+ 4. sweepAngle < 4PI
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 255
+ 5. sweepAngle > 4PI
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 255
+lineTo + empty ellipse (radiusY == 0) + lineTo
+ 1. sweepAngle < PI / 2
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+ 2. sweepAngle < PI
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 255
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+ 3. sweepAngle < 2PI
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+ 4. sweepAngle < 4PI
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+ 5. sweepAngle > 4PI
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+PASS imageData.data[1] is 0
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
</ins><span class="cx">Property changes on: trunk/LayoutTests/fast/canvas/canvas-ellipse-zero-lineto-expected.txt
</span><span class="cx">___________________________________________________________________
</span></span></pre></div>
<a id="svnmimetype"></a>
<div class="addfile"><h4>Added: svn:mime-type</h4></div>
<a id="svnkeywords"></a>
<div class="addfile"><h4>Added: svn:keywords</h4></div>
<a id="svneolstyle"></a>
<div class="addfile"><h4>Added: svn:eol-style</h4></div>
<a id="trunkLayoutTestsfastcanvascanvasellipsezerolinetohtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/canvas-ellipse-zero-lineto.html (0 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/canvas-ellipse-zero-lineto.html         (rev 0)
+++ trunk/LayoutTests/fast/canvas/canvas-ellipse-zero-lineto.html        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -0,0 +1,313 @@
</span><ins>+<!DOCTYPE html>
+<html>
+<head></head>
+<body>
+<canvas id="mycanvas" width="400" height="400"></canvas>
+<script src="../../resources/js-test.js"></script>
+<script>
+description("This tests checks that ellipse can draw lines correctly in edge cases.");
+var canvas = document.getElementById('mycanvas');
+var ctx = canvas.getContext('2d');
+
+var zero = 0;
+ctx.lineWidth = 5;
+ctx.fillStyle = 'rgb(255, 255, 255)';
+ctx.strokeStyle = 'rgb(0, 0, 0)';
+ctx.fillRect(0, 0, canvas.width, canvas.height);
+
+var imageData = ctx.getImageData(1, 1, 1, 1);
+var data = imageData.data;
+shouldBe("imageData.data[1]", "255");
+
+ctx.save();
+debug("moveTo + empty ellipse (swing == 0)");
+ctx.translate(0, 30);
+ctx.save();
+ctx.beginPath();
+ctx.moveTo(20, 0);
+ctx.ellipse(80, 0, 10, 20, Math.PI / 6, -Math.PI / 2, -Math.PI / 2 + zero, false);
+ctx.stroke();
+ctx.restore();
+
+imageData = ctx.getImageData(23, 29, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(85, 14, 1, 1);
+shouldBe("imageData.data[1]", "0");
+
+debug("moveTo + empty ellipse (radiusX == 0)");
+ctx.translate(0, 30);
+ctx.save();
+ctx.beginPath();
+ctx.moveTo(20, 0);
+ctx.ellipse(80, 0, zero, 20, Math.PI / 6, -Math.PI / 2, Math.PI / 2, false);
+ctx.stroke();
+ctx.restore();
+
+imageData = ctx.getImageData(22, 60, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(86, 43, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(71, 73, 1, 1);
+shouldBe("imageData.data[1]", "0");
+
+debug("moveTo + empty ellipse (radiusY == 0)");
+ctx.translate(0, 30);
+ctx.save();
+ctx.beginPath();
+ctx.moveTo(20, 0);
+ctx.ellipse(80, 0, 10, zero, Math.PI / 6, -Math.PI / 2, Math.PI / 2, false);
+ctx.stroke();
+ctx.restore();
+
+imageData = ctx.getImageData(22, 90, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(79, 90, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(87, 94, 1, 1);
+shouldBe("imageData.data[1]", "0");
+
+debug("empty ellipse (swing == 0) + lineTo");
+ctx.translate(0, 30);
+ctx.save();
+ctx.beginPath();
+ctx.ellipse(20, 0, 10, 20, Math.PI / 6, -Math.PI / 2, -Math.PI / 2 + zero, false);
+ctx.lineTo(80, 0);
+ctx.stroke();
+ctx.restore();
+
+imageData = ctx.getImageData(26, 101, 1, 1);
+shouldBe("imageData.data[1]", "255");
+imageData = ctx.getImageData(32, 103, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(77, 119, 1, 1);
+shouldBe("imageData.data[1]", "0");
+
+debug("empty ellipse (radiusX == 0) + lineTo");
+ctx.translate(0, 30);
+ctx.save();
+ctx.beginPath();
+ctx.ellipse(20, 0, zero, 20, Math.PI / 6, -Math.PI / 2, Math.PI / 2, false);
+ctx.lineTo(80, 0);
+ctx.stroke();
+ctx.restore();
+
+imageData = ctx.getImageData(28, 135, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(11, 166, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(76, 151, 1, 1);
+shouldBe("imageData.data[1]", "0");
+
+debug("empty ellipse (radiusY == 0) + lineTo");
+ctx.translate(0, 30);
+ctx.save();
+ctx.beginPath();
+ctx.ellipse(20, 0, 10, zero, Math.PI / 6, -Math.PI / 2, Math.PI / 2, false);
+ctx.lineTo(80, 0);
+ctx.stroke();
+ctx.restore();
+
+imageData = ctx.getImageData(27, 183, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(21, 179, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(77, 180, 1, 1);
+shouldBe("imageData.data[1]", "0");
+
+ctx.restore();
+
+ctx.translate(100, 0);
+ctx.save();
+debug("lineTo + empty ellipse (radiusX == 0) + lineTo");
+debug(" 1. sweepAngle < PI / 2");
+ctx.translate(0, 30);
+ctx.save();
+ctx.beginPath();
+ctx.lineTo(10, 0);
+ctx.ellipse(20, 0, zero, 20, Math.PI / 6, -Math.PI / 4, Math.PI / 4, false);
+ctx.lineTo(80, 0);
+ctx.stroke();
+ctx.restore();
+
+imageData = ctx.getImageData(110, 29, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(122, 22, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(113, 42, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(143, 38, 1, 1);
+shouldBe("imageData.data[1]", "0");
+
+debug(" 2. sweepAngle < PI");
+ctx.translate(0, 30);
+ctx.save();
+ctx.beginPath();
+ctx.lineTo(10, 0);
+ctx.ellipse(20, 0, zero, 20, Math.PI / 6, -Math.PI / 4, Math.PI / 2, false);
+ctx.lineTo(80, 0);
+ctx.stroke();
+ctx.restore();
+
+imageData = ctx.getImageData(122, 54, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(112, 76, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(142, 70, 1, 1);
+shouldBe("imageData.data[1]", "0");
+
+debug(" 3. sweepAngle < 2PI");
+ctx.translate(0, 30);
+ctx.save();
+ctx.beginPath();
+ctx.lineTo(10, 0);
+ctx.ellipse(20, 0, zero, 20, Math.PI / 6, -Math.PI / 4, Math.PI * 3 / 2, false);
+ctx.lineTo(80, 0);
+ctx.stroke();
+ctx.restore();
+
+imageData = ctx.getImageData(115, 86, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(110, 104, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(138, 77, 1, 1);
+shouldBe("imageData.data[1]", "0");
+
+debug(" 4. sweepAngle < 4PI");
+ctx.translate(0, 30);
+ctx.save();
+ctx.beginPath();
+ctx.lineTo(10, 0);
+ctx.ellipse(20, 0, zero, 20, Math.PI / 6, -Math.PI / 4, Math.PI * 2, false);
+ctx.lineTo(80, 0);
+ctx.stroke();
+ctx.restore();
+
+imageData = ctx.getImageData(115, 116, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(111, 136, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(127, 106, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(127, 121, 1, 1);
+shouldBe("imageData.data[1]", "255");
+
+debug(" 5. sweepAngle > 4PI");
+ctx.translate(0, 30);
+ctx.save();
+ctx.beginPath();
+ctx.lineTo(10, 0);
+ctx.ellipse(20, 0, zero, 20, Math.PI / 6, -Math.PI / 4, Math.PI * 16, false);
+ctx.lineTo(80, 0);
+ctx.stroke();
+ctx.restore();
+
+imageData = ctx.getImageData(115, 146, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(111, 166, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(127, 136, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(127, 151, 1, 1);
+shouldBe("imageData.data[1]", "255");
+
+ctx.restore();
+
+ctx.translate(100, 0);
+ctx.save();
+debug("lineTo + empty ellipse (radiusY == 0) + lineTo");
+debug(" 1. sweepAngle < PI / 2");
+ctx.translate(0, 30);
+ctx.save();
+ctx.beginPath();
+ctx.lineTo(10, 0);
+ctx.ellipse(20, 0, 20, zero, Math.PI / 6, -Math.PI / 4, Math.PI / 4, false);
+ctx.lineTo(80, 0);
+ctx.stroke();
+ctx.restore();
+
+imageData = ctx.getImageData(213, 32, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(234, 39, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(240, 36, 1, 1);
+shouldBe("imageData.data[1]", "0");
+
+debug(" 2. sweepAngle < PI");
+ctx.translate(0, 30);
+ctx.save();
+ctx.beginPath();
+ctx.lineTo(10, 0);
+ctx.ellipse(20, 0, 20, zero, Math.PI / 6, -Math.PI / 4, Math.PI / 2, false);
+ctx.lineTo(80, 0);
+ctx.stroke();
+ctx.restore();
+
+imageData = ctx.getImageData(232, 69, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(238, 72, 1, 1);
+shouldBe("imageData.data[1]", "255");
+imageData = ctx.getImageData(228, 65, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(242, 61, 1, 1);
+shouldBe("imageData.data[1]", "0");
+
+debug(" 3. sweepAngle < 2PI");
+ctx.translate(0, 30);
+ctx.save();
+ctx.beginPath();
+ctx.lineTo(10, 0);
+ctx.ellipse(20, 0, 20, zero, Math.PI / 6, -Math.PI / 4, Math.PI * 3 / 2, false);
+ctx.lineTo(80, 0);
+ctx.stroke();
+ctx.restore();
+
+imageData = ctx.getImageData(204, 82, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(234, 100, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(212, 92, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(240, 90, 1, 1);
+shouldBe("imageData.data[1]", "0");
+
+debug(" 4. sweepAngle < 4PI");
+ctx.translate(0, 30);
+ctx.save();
+ctx.beginPath();
+ctx.lineTo(10, 0);
+ctx.ellipse(20, 0, 20, zero, Math.PI / 6, -Math.PI / 4, Math.PI * 2, false);
+ctx.lineTo(80, 0);
+ctx.stroke();
+ctx.restore();
+
+imageData = ctx.getImageData(208, 114, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(235, 130, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(210, 120, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(252, 124, 1, 1);
+shouldBe("imageData.data[1]", "0");
+
+debug(" 5. sweepAngle > 4PI");
+ctx.translate(0, 30);
+ctx.save();
+ctx.beginPath();
+ctx.lineTo(10, 0);
+ctx.ellipse(20, 0, 20, zero, Math.PI / 6, -Math.PI / 4, Math.PI * 16, false);
+ctx.lineTo(80, 0);
+ctx.stroke();
+ctx.restore();
+
+imageData = ctx.getImageData(208, 144, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(235, 160, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(210, 150, 1, 1);
+shouldBe("imageData.data[1]", "0");
+imageData = ctx.getImageData(252, 154, 1, 1);
+shouldBe("imageData.data[1]", "0");
+
+</script>
+</body>
+</html>
</ins><span class="cx">\ No newline at end of file
</span><span class="cx">Property changes on: trunk/LayoutTests/fast/canvas/canvas-ellipse-zero-lineto.html
</span><span class="cx">___________________________________________________________________
</span></span></pre></div>
<a id="svnmimetype"></a>
<div class="addfile"><h4>Added: svn:mime-type</h4></div>
<a id="svnkeywords"></a>
<div class="addfile"><h4>Added: svn:keywords</h4></div>
<a id="svneolstyle"></a>
<div class="addfile"><h4>Added: svn:eol-style</h4></div>
<a id="trunkLayoutTestsfastcanvascanvasellipsehtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/canvas-ellipse.html (0 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/canvas-ellipse.html         (rev 0)
+++ trunk/LayoutTests/fast/canvas/canvas-ellipse.html        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -0,0 +1,9 @@
</span><ins>+<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
+<html>
+<head>
+<script src="../../resources/js-test.js"></script>
+</head>
+<body>
+<script src="script-tests/canvas-ellipse.js"></script>
+</body>
+</html>
</ins><span class="cx">Property changes on: trunk/LayoutTests/fast/canvas/canvas-ellipse.html
</span><span class="cx">___________________________________________________________________
</span></span></pre></div>
<a id="svnmimetype"></a>
<div class="addfile"><h4>Added: svn:mime-type</h4></div>
<a id="svnkeywords"></a>
<div class="addfile"><h4>Added: svn:keywords</h4></div>
<a id="svneolstyle"></a>
<div class="addfile"><h4>Added: svn:eol-style</h4></div>
<a id="trunkLayoutTestsfastcanvasscripttestscanvasellipse360windingjs"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/script-tests/canvas-ellipse-360-winding.js (0 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/script-tests/canvas-ellipse-360-winding.js         (rev 0)
+++ trunk/LayoutTests/fast/canvas/script-tests/canvas-ellipse-360-winding.js        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -0,0 +1,50 @@
</span><ins>+description("This tests canvas full arc fill with nonzero winding rule. Eight green concentric thick circumferences should be displayed.");
+
+var canvas = document.createElement('canvas');
+document.body.appendChild(canvas)
+canvas.setAttribute('width', '300');
+canvas.setAttribute('height', '150');
+var ctx = canvas.getContext('2d');
+
+var r;
+var anticlockwise = true;
+ctx.beginPath();
+for (r = 200; r >= 10; r -= 10) {
+ ctx.moveTo(150 + r, 75);
+ // Test that anticlockwise is both optional and defaults to false.
+ if (anticlockwise) {
+ ctx.ellipse(150, 75, r, r * 1.2, 0, 0, Math.PI * 2, anticlockwise);
+ } else {
+ ctx.ellipse(150, 75, r, r * 1.2, 0, 0, Math.PI * 2);
+ }
+ ctx.closePath();
+ anticlockwise = !anticlockwise;
+}
+ctx.fillStyle = 'rgba(0, 255, 0, 1)';
+ctx.strokeStyle = 'rgba(0, 255, 0, 1)';
+ctx.fill();
+ctx.stroke();
+
+var imageData = ctx.getImageData(297, 75, 1, 1);
+var data = imageData.data;
+shouldBe("data[1]", "0");
+
+imageData = ctx.getImageData(295, 144, 1, 1);
+data = imageData.data;
+shouldBe("data[1]", "255");
+
+imageData = ctx.getImageData(272, 144, 1, 1);
+data = imageData.data;
+shouldBe("data[1]", "255");
+
+imageData = ctx.getImageData(262, 144, 1, 1);
+data = imageData.data;
+shouldBe("data[1]", "0");
+
+imageData = ctx.getImageData(239, 144, 1, 1);
+data = imageData.data;
+shouldBe("data[1]", "0");
+
+imageData = ctx.getImageData(228, 144, 1, 1);
+data = imageData.data;
+shouldBe("data[1]", "255");
</ins><span class="cx">Property changes on: trunk/LayoutTests/fast/canvas/script-tests/canvas-ellipse-360-winding.js
</span><span class="cx">___________________________________________________________________
</span></span></pre></div>
<a id="svnmimetype"></a>
<div class="addfile"><h4>Added: svn:mime-type</h4></div>
<a id="svnkeywords"></a>
<div class="addfile"><h4>Added: svn:keywords</h4></div>
<a id="svneolstyle"></a>
<div class="addfile"><h4>Added: svn:eol-style</h4></div>
<a id="trunkLayoutTestsfastcanvasscripttestscanvasellipsejs"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/script-tests/canvas-ellipse.js (0 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/script-tests/canvas-ellipse.js         (rev 0)
+++ trunk/LayoutTests/fast/canvas/script-tests/canvas-ellipse.js        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -0,0 +1,85 @@
</span><ins>+description("This test checks ellipse API in canvas v5");
+
+var canvas = document.createElement('canvas');
+document.body.appendChild(canvas);
+canvas.setAttribute('width', '400');
+canvas.setAttribute('height', '400');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle="rgba(255, 255, 255, 1.0)";
+ctx.fillRect(0, 0, 400, 400);
+
+ctx.strokeStyle="rgba(0, 0, 0, 1.0)";
+ctx.lineWidth = 10;
+ctx.beginPath();
+ctx.moveTo(0, 100);
+ctx.ellipse(200, 200, 100, 150, Math.PI / 9, -Math.PI, Math.PI * 5 / 9, false);
+ctx.lineTo(0, 300);
+ctx.stroke();
+
+var imageData, data;
+
+// Verify the method must add a straight line from the last point in the subpath
+// to the start point of the ellipse.
+imageData = ctx.getImageData(5, 103, 1, 1);
+data = imageData.data;
+shouldBe('data[0]', '0');
+
+imageData = ctx.getImageData(49, 130, 1, 1);
+data = imageData.data;
+shouldBe('data[0]', '0');
+
+imageData = ctx.getImageData(103, 163, 1, 1);
+data = imageData.data;
+shouldBe('data[0]', '0');
+
+imageData = ctx.getImageData(36, 108, 1, 1);
+data = imageData.data;
+shouldBe('data[0]', '255');
+
+// Verify ellipse API draws well.
+imageData = ctx.getImageData(101, 179, 1, 1);
+data = imageData.data;
+shouldBe('data[0]', '255');
+
+imageData = ctx.getImageData(119, 132, 1, 1);
+data = imageData.data;
+shouldBe('data[0]', '0');
+
+imageData = ctx.getImageData(260, 62, 1, 1);
+data = imageData.data;
+shouldBe('data[0]', '0');
+
+imageData = ctx.getImageData(301, 122, 1, 1);
+data = imageData.data;
+shouldBe('data[0]', '0');
+
+imageData = ctx.getImageData(273, 272, 1, 1);
+data = imageData.data;
+shouldBe('data[0]', '0');
+
+imageData = ctx.getImageData(169, 344, 1, 1);
+data = imageData.data;
+shouldBe('data[0]', '0');
+
+imageData = ctx.getImageData(196, 362, 1, 1);
+data = imageData.data;
+shouldBe('data[0]', '255');
+
+// Verify the last point of ellipse is the start point of the next subpath.
+imageData = ctx.getImageData(128, 331, 1, 1);
+data = imageData.data;
+shouldBe('data[0]', '0');
+
+imageData = ctx.getImageData(65, 315, 1, 1);
+data = imageData.data;
+shouldBe('data[0]', '0');
+
+imageData = ctx.getImageData(9, 302, 1, 1);
+data = imageData.data;
+shouldBe('data[0]', '0');
+
+imageData = ctx.getImageData(58, 300, 1, 1);
+data = imageData.data;
+shouldBe('data[0]', '255');
+
</ins><span class="cx">Property changes on: trunk/LayoutTests/fast/canvas/script-tests/canvas-ellipse.js
</span><span class="cx">___________________________________________________________________
</span></span></pre></div>
<a id="svnmimetype"></a>
<div class="addfile"><h4>Added: svn:mime-type</h4></div>
<a id="svnkeywords"></a>
<div class="addfile"><h4>Added: svn:keywords</h4></div>
<a id="svneolstyle"></a>
<div class="addfile"><h4>Added: svn:eol-style</h4></div>
<a id="trunkLayoutTestsfastcanvasscripttestsjsellipseimplementationjs"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/canvas/script-tests/js-ellipse-implementation.js (0 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/canvas/script-tests/js-ellipse-implementation.js         (rev 0)
+++ trunk/LayoutTests/fast/canvas/script-tests/js-ellipse-implementation.js        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -0,0 +1,24 @@
</span><ins>+function rad2deg(x) {
+ return x * 180 / Math.PI;
+}
+
+function ellipseUsingArc(context, x, y, radiusX, radiusY, rotation, startAngle, endAngle, anticlockwise)
+{
+ var transform = new WebKitCSSMatrix();
+ transform = transform.translate(x, y);
+ transform = transform.rotate(rad2deg(rotation));
+ transform = transform.scale(radiusX, radiusY);
+
+ /*
+ Use WebKitCSSMatrix instead of as follows, because using WebKitCSSMatrix computes float values more precisely.
+ It is because we don't want to fail pixel comparison due to float precision.
+ context.translate(x, y);
+ context.rotate(rotation);
+ context.scale(radiusX, radiusY);
+ */
+ context.save();
+ context.transform(transform.a, transform.b, transform.c, transform.d, transform.e, transform.f);
+ context.arc(0, 0, 1, startAngle, endAngle, anticlockwise);
+ context.restore();
+}
+
</ins><span class="cx">Property changes on: trunk/LayoutTests/fast/canvas/script-tests/js-ellipse-implementation.js
</span><span class="cx">___________________________________________________________________
</span></span></pre></div>
<a id="svnmimetype"></a>
<div class="addfile"><h4>Added: svn:mime-type</h4></div>
<a id="svnkeywords"></a>
<div class="addfile"><h4>Added: svn:keywords</h4></div>
<a id="svneolstyle"></a>
<div class="addfile"><h4>Added: svn:eol-style</h4></div>
<a id="trunkLayoutTestsplatformmacfastcanvascanvasellipsecircumferenceexpectedpng"></a>
<div class="binary"><h4>Added: trunk/LayoutTests/platform/mac/fast/canvas/canvas-ellipse-circumference-expected.png</h4>
<pre class="diff"><span>
<span class="cx">(Binary files differ)
</span></span></pre></div>
<span class="cx">Property changes on: trunk/LayoutTests/platform/mac/fast/canvas/canvas-ellipse-circumference-expected.png
</span><span class="cx">___________________________________________________________________
</span><a id="svnmimetype"></a>
<div class="addfile"><h4>Added: svn:mime-type</h4></div>
<a id="trunkLayoutTestsplatformmacfastcanvascanvasellipsecircumferencefillexpectedpng"></a>
<div class="binary"><h4>Added: trunk/LayoutTests/platform/mac/fast/canvas/canvas-ellipse-circumference-fill-expected.png</h4>
<pre class="diff"><span>
<span class="cx">(Binary files differ)
</span></span></pre></div>
<span class="cx">Property changes on: trunk/LayoutTests/platform/mac/fast/canvas/canvas-ellipse-circumference-fill-expected.png
</span><span class="cx">___________________________________________________________________
</span><a id="svnmimetype"></a>
<div class="addfile"><h4>Added: svn:mime-type</h4></div>
<a id="trunkSourceWebCoreChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/ChangeLog (180789 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/ChangeLog        2015-02-27 23:37:07 UTC (rev 180789)
+++ trunk/Source/WebCore/ChangeLog        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -1,3 +1,48 @@
</span><ins>+2015-02-26 Sam Weinig <sam@webkit.org>
+
+ Add support for canvas ellipse method
+ https://bugs.webkit.org/show_bug.cgi?id=82791
+ <rdar://problem/11159172>
+
+ Reviewed by Dirk Schulze.
+
+ Tests: fast/canvas/canvas-ellipse-360-winding.html
+ fast/canvas/canvas-ellipse-circumference-fill.html
+ fast/canvas/canvas-ellipse-circumference.html
+ fast/canvas/canvas-ellipse-connecting-line.html
+ fast/canvas/canvas-ellipse-negative-radius.html
+ fast/canvas/canvas-ellipse-zero-lineto.html
+ fast/canvas/canvas-ellipse.html
+
+ * html/canvas/CanvasPathMethods.h:
+ * html/canvas/CanvasPathMethods.cpp:
+ (WebCore::CanvasPathMethods::lineTo):
+ Convenience for passing a FloatPoint instead of two floats.
+
+ (WebCore::normalizeAngles):
+ Normalizes the angles as described in the HTML spec. Ensuring the startAngle
+ is greater than 0 and less than 2pi, and the the endAngle is at most 2pi
+ from the start angle.
+
+ (WebCore::CanvasPathMethods::arc):
+ - Renames some of the parameters to be clearer.
+ - Normalizes the angles for consistency with ellipse.
+ - Moves hasInvertibleTransform() higher in the function for consistency.
+
+ (WebCore::CanvasPathMethods::ellipse): Added.
+
+ * html/canvas/CanvasRenderingContext2D.idl:
+ * html/canvas/DOMPath.idl:
+ Add ellipse(...).
+
+ * platform/graphics/Path.h:
+ * platform/graphics/cg/PathCG.cpp:
+ (WebCore::Path::addArc):
+ Rename parameters for clarity and use a nullptr.
+
+ (WebCore::Path::addEllipse):
+ Added. Constructs an ellipse via a transformed arc.
+
</ins><span class="cx"> 2015-02-27 Enrica Casucci <enrica@apple.com>
</span><span class="cx">
</span><span class="cx"> Adding support for serializing HTMLAttachment elements.
</span></span></pre></div>
<a id="trunkSourceWebCorehtmlcanvasCanvasPathMethodscpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/html/canvas/CanvasPathMethods.cpp (180789 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/html/canvas/CanvasPathMethods.cpp        2015-02-27 23:37:07 UTC (rev 180789)
+++ trunk/Source/WebCore/html/canvas/CanvasPathMethods.cpp        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -35,6 +35,7 @@
</span><span class="cx"> #include "config.h"
</span><span class="cx"> #include "CanvasPathMethods.h"
</span><span class="cx">
</span><ins>+#include "AffineTransform.h"
</ins><span class="cx"> #include "ExceptionCode.h"
</span><span class="cx"> #include "FloatRect.h"
</span><span class="cx"> #include <wtf/MathExtras.h>
</span><span class="lines">@@ -60,6 +61,11 @@
</span><span class="cx"> m_path.moveTo(FloatPoint(x, y));
</span><span class="cx"> }
</span><span class="cx">
</span><ins>+void CanvasPathMethods::lineTo(FloatPoint point)
+{
+ lineTo(point.x(), point.y());
+}
+
</ins><span class="cx"> void CanvasPathMethods::lineTo(float x, float y)
</span><span class="cx"> {
</span><span class="cx"> if (!std::isfinite(x) || !std::isfinite(y))
</span><span class="lines">@@ -130,37 +136,91 @@
</span><span class="cx"> m_path.addArcTo(p1, p2, r);
</span><span class="cx"> }
</span><span class="cx">
</span><del>-void CanvasPathMethods::arc(float x, float y, float r, float sa, float ea, bool anticlockwise, ExceptionCode& ec)
</del><ins>+static void normalizeAngles(float& startAngle, float& endAngle, bool anticlockwise)
</ins><span class="cx"> {
</span><del>- ec = 0;
- if (!std::isfinite(x) || !std::isfinite(y) || !std::isfinite(r) || !std::isfinite(sa) || !std::isfinite(ea))
</del><ins>+ float newStartAngle = startAngle;
+ if (newStartAngle < 0)
+ newStartAngle = (2 * piFloat) + fmodf(newStartAngle, -(2 * piFloat));
+ else
+ newStartAngle = fmodf(newStartAngle, 2 * piFloat);
+
+ float delta = newStartAngle - startAngle;
+ startAngle = newStartAngle;
+ endAngle = endAngle + delta;
+ ASSERT(newStartAngle >= 0 && newStartAngle < 2 * piFloat);
+
+ if (anticlockwise && startAngle - endAngle >= 2 * piFloat)
+ endAngle = startAngle - 2 * piFloat;
+ else if (!anticlockwise && endAngle - startAngle >= 2 * piFloat)
+ endAngle = startAngle + 2 * piFloat;
+}
+
+void CanvasPathMethods::arc(float x, float y, float radius, float startAngle, float endAngle, bool anticlockwise, ExceptionCode& ec)
+{
+ if (!std::isfinite(x) || !std::isfinite(y) || !std::isfinite(radius) || !std::isfinite(startAngle) || !std::isfinite(endAngle))
</ins><span class="cx"> return;
</span><span class="cx">
</span><del>- if (r < 0) {
</del><ins>+ if (radius < 0) {
</ins><span class="cx"> ec = INDEX_SIZE_ERR;
</span><span class="cx"> return;
</span><span class="cx"> }
</span><span class="cx">
</span><del>- if (!r || sa == ea) {
</del><ins>+ if (!hasInvertibleTransform())
+ return;
+
+ normalizeAngles(startAngle, endAngle, anticlockwise);
+
+ if (!radius || startAngle == endAngle) {
</ins><span class="cx"> // The arc is empty but we still need to draw the connecting line.
</span><del>- lineTo(x + r * cosf(sa), y + r * sinf(sa));
</del><ins>+ lineTo(x + radius * cosf(startAngle), y + radius * sinf(startAngle));
</ins><span class="cx"> return;
</span><span class="cx"> }
</span><span class="cx">
</span><ins>+ m_path.addArc(FloatPoint(x, y), radius, startAngle, endAngle, anticlockwise);
+}
+
+void CanvasPathMethods::ellipse(float x, float y, float radiusX, float radiusY, float rotation, float startAngle, float endAngle, bool anticlockwise, ExceptionCode& ec)
+{
+ if (!std::isfinite(x) || !std::isfinite(y) || !std::isfinite(radiusX) || !std::isfinite(radiusY) || !std::isfinite(rotation) || !std::isfinite(startAngle) || !std::isfinite(endAngle))
+ return;
+
+ if (radiusX < 0 || radiusY < 0) {
+ ec = INDEX_SIZE_ERR;
+ return;
+ }
+
</ins><span class="cx"> if (!hasInvertibleTransform())
</span><span class="cx"> return;
</span><span class="cx">
</span><del>- // If 'sa' and 'ea' differ by more than 2Pi, just add a circle starting/ending at 'sa'.
- if (anticlockwise && sa - ea >= 2 * piFloat) {
- m_path.addArc(FloatPoint(x, y), r, sa, sa - 2 * piFloat, anticlockwise);
</del><ins>+ normalizeAngles(startAngle, endAngle, anticlockwise);
+
+ if ((!radiusX && !radiusY) || startAngle == endAngle) {
+ AffineTransform transform;
+ transform.translate(x, y).rotate(rad2deg(rotation));
+
+ lineTo(transform.mapPoint(FloatPoint(radiusX * cosf(startAngle), radiusY * sinf(startAngle))));
</ins><span class="cx"> return;
</span><span class="cx"> }
</span><del>- if (!anticlockwise && ea - sa >= 2 * piFloat) {
- m_path.addArc(FloatPoint(x, y), r, sa, sa + 2 * piFloat, anticlockwise);
</del><ins>+
+ if (!radiusX || !radiusY) {
+ AffineTransform transform;
+ transform.translate(x, y).rotate(rad2deg(rotation));
+
+ lineTo(transform.mapPoint(FloatPoint(radiusX * cosf(startAngle), radiusY * sinf(startAngle))));
+
+ if (!anticlockwise) {
+ for (float angle = startAngle - fmodf(startAngle, piOverTwoFloat) + piOverTwoFloat; angle < endAngle; angle += piOverTwoFloat)
+ lineTo(transform.mapPoint(FloatPoint(radiusX * cosf(angle), radiusY * sinf(angle))));
+ } else {
+ for (float angle = startAngle - fmodf(startAngle, piOverTwoFloat); angle > endAngle; angle -= piOverTwoFloat)
+ lineTo(transform.mapPoint(FloatPoint(radiusX * cosf(angle), radiusY * sinf(angle))));
+ }
+
+ lineTo(transform.mapPoint(FloatPoint(radiusX * cosf(endAngle), radiusY * sinf(endAngle))));
</ins><span class="cx"> return;
</span><span class="cx"> }
</span><span class="cx">
</span><del>- m_path.addArc(FloatPoint(x, y), r, sa, ea, anticlockwise);
</del><ins>+ m_path.addEllipse(FloatPoint(x, y), radiusX, radiusY, rotation, startAngle, endAngle, anticlockwise);
</ins><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> void CanvasPathMethods::rect(float x, float y, float width, float height)
</span></span></pre></div>
<a id="trunkSourceWebCorehtmlcanvasCanvasPathMethodsh"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/html/canvas/CanvasPathMethods.h (180789 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/html/canvas/CanvasPathMethods.h        2015-02-27 23:37:07 UTC (rev 180789)
+++ trunk/Source/WebCore/html/canvas/CanvasPathMethods.h        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -48,6 +48,7 @@
</span><span class="cx"> void bezierCurveTo(float cp1x, float cp1y, float cp2x, float cp2y, float x, float y);
</span><span class="cx"> void arcTo(float x0, float y0, float x1, float y1, float radius, ExceptionCode&);
</span><span class="cx"> void arc(float x, float y, float r, float sa, float ea, bool anticlockwise, ExceptionCode&);
</span><ins>+ void ellipse(float x, float y, float radiusX, float radiusY, float rotation, float startAngle, float endAngled, bool anticlockwise, ExceptionCode&);
</ins><span class="cx"> void rect(float x, float y, float width, float height);
</span><span class="cx">
</span><span class="cx"> protected:
</span><span class="lines">@@ -56,6 +57,8 @@
</span><span class="cx">
</span><span class="cx"> virtual bool hasInvertibleTransform() const { return true; }
</span><span class="cx">
</span><ins>+ void lineTo(FloatPoint);
+
</ins><span class="cx"> Path m_path;
</span><span class="cx"> };
</span><span class="cx">
</span></span></pre></div>
<a id="trunkSourceWebCorehtmlcanvasCanvasRenderingContext2Didl"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/html/canvas/CanvasRenderingContext2D.idl (180789 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/html/canvas/CanvasRenderingContext2D.idl        2015-02-27 23:37:07 UTC (rev 180789)
+++ trunk/Source/WebCore/html/canvas/CanvasRenderingContext2D.idl        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -78,6 +78,7 @@
</span><span class="cx"> void rect(unrestricted float x, unrestricted float y, unrestricted float width, unrestricted float height);
</span><span class="cx"> [RaisesException] void arc(unrestricted float x, unrestricted float y, unrestricted float radius, unrestricted float startAngle,
</span><span class="cx"> unrestricted float endAngle, [Default=Undefined] optional boolean anticlockwise);
</span><ins>+ [RaisesException] void ellipse(unrestricted float x, unrestricted float y, unrestricted float radiusX, unrestricted float radiusY, unrestricted float rotation, unrestricted float startAngle, unrestricted float endAngle, [Default=Undefined] optional boolean anticlockwise);
</ins><span class="cx">
</span><span class="cx"> void fill(DOMPath path, optional CanvasWindingRule winding);
</span><span class="cx"> void stroke(DOMPath path);
</span></span></pre></div>
<a id="trunkSourceWebCorehtmlcanvasDOMPathidl"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/html/canvas/DOMPath.idl (180789 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/html/canvas/DOMPath.idl        2015-02-27 23:37:07 UTC (rev 180789)
+++ trunk/Source/WebCore/html/canvas/DOMPath.idl        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -63,9 +63,11 @@
</span><span class="cx"> [Default=Undefined] optional float width,
</span><span class="cx"> [Default=Undefined] optional float height);
</span><span class="cx"> [RaisesException] void arc([Default=Undefined] optional float x,
</span><del>- [Default=Undefined] optional float y,
- [Default=Undefined] optional float radius,
- [Default=Undefined] optional float startAngle,
- [Default=Undefined] optional float endAngle,
- [Default=Undefined] optional boolean anticlockwise);
</del><ins>+ [Default=Undefined] optional float y,
+ [Default=Undefined] optional float radius,
+ [Default=Undefined] optional float startAngle,
+ [Default=Undefined] optional float endAngle,
+ [Default=Undefined] optional boolean anticlockwise);
+ [RaisesException] void ellipse(unrestricted float x, unrestricted float y, unrestricted float radiusX, unrestricted float radiusY, unrestricted float rotation, unrestricted float startAngle, unrestricted float endAngle, [Default=Undefined] optional boolean anticlockwise);
+
</ins><span class="cx"> };
</span></span></pre></div>
<a id="trunkSourceWebCoreplatformgraphicsPathh"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/platform/graphics/Path.h (180789 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/platform/graphics/Path.h        2015-02-27 23:37:07 UTC (rev 180789)
+++ trunk/Source/WebCore/platform/graphics/Path.h        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -122,6 +122,7 @@
</span><span class="cx">
</span><span class="cx"> void addArc(const FloatPoint&, float radius, float startAngle, float endAngle, bool anticlockwise);
</span><span class="cx"> void addRect(const FloatRect&);
</span><ins>+ void addEllipse(FloatPoint, float radiusX, float radiusY, float rotation, float startAngle, float endAngle, bool anticlockwise);
</ins><span class="cx"> void addEllipse(const FloatRect&);
</span><span class="cx">
</span><span class="cx"> enum RoundedRectStrategy {
</span></span></pre></div>
<a id="trunkSourceWebCoreplatformgraphicscgPathCGcpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/platform/graphics/cg/PathCG.cpp (180789 => 180790)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/platform/graphics/cg/PathCG.cpp        2015-02-27 23:37:07 UTC (rev 180789)
+++ trunk/Source/WebCore/platform/graphics/cg/PathCG.cpp        2015-02-27 23:40:35 UTC (rev 180790)
</span><span class="lines">@@ -292,11 +292,11 @@
</span><span class="cx"> CGPathCloseSubpath(m_path);
</span><span class="cx"> }
</span><span class="cx">
</span><del>-void Path::addArc(const FloatPoint& p, float r, float sa, float ea, bool clockwise)
</del><ins>+void Path::addArc(const FloatPoint& p, float radius, float startAngle, float endAngle, bool clockwise)
</ins><span class="cx"> {
</span><span class="cx"> // Workaround for <rdar://problem/5189233> CGPathAddArc hangs or crashes when passed inf as start or end angle
</span><del>- if (std::isfinite(sa) && std::isfinite(ea))
- CGPathAddArc(ensurePlatformPath(), 0, p.x(), p.y(), r, sa, ea, clockwise);
</del><ins>+ if (std::isfinite(startAngle) && std::isfinite(endAngle))
+ CGPathAddArc(ensurePlatformPath(), nullptr, p.x(), p.y(), radius, startAngle, endAngle, clockwise);
</ins><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> void Path::addRect(const FloatRect& r)
</span><span class="lines">@@ -304,6 +304,15 @@
</span><span class="cx"> CGPathAddRect(ensurePlatformPath(), 0, r);
</span><span class="cx"> }
</span><span class="cx">
</span><ins>+void Path::addEllipse(FloatPoint p, float radiusX, float radiusY, float rotation, float startAngle, float endAngle, bool anticlockwise)
+{
+ AffineTransform transform;
+ transform.translate(p.x(), p.y()).rotate(rad2deg(rotation)).scale(radiusX, radiusY);
+
+ CGAffineTransform cgTransform = transform;
+ CGPathAddArc(ensurePlatformPath(), &cgTransform, 0, 0, 1, startAngle, endAngle, anticlockwise);
+}
+
</ins><span class="cx"> void Path::addEllipse(const FloatRect& r)
</span><span class="cx"> {
</span><span class="cx"> CGPathAddEllipseInRect(ensurePlatformPath(), 0, r);
</span></span></pre>
</div>
</div>
</body>
</html>