<!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>[194775] 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/194775">194775</a></dd>
<dt>Author</dt> <dd>zalan@apple.com</dd>
<dt>Date</dt> <dd>2016-01-08 12:05:08 -0800 (Fri, 08 Jan 2016)</dd>
</dl>

<h3>Log Message</h3>
<pre>Hovering link on http://help.apple.com/appletv/#/ does not show text underline.
https://bugs.webkit.org/show_bug.cgi?id=152906
&lt;rdar://problem/23339617&gt;

Reviewed by Simon Fraser.

GraphicsContext::computeLineBoundsAndAntialiasingModeForText() always integral ceils the origin y position to offset underline text.
This additional visual overflow offset is not taken into account by visualOverflowForDecorations().
Unfortunately we can't compute the exact same offset value while collecting repaint rects, because
computeLineBoundsAndAntialiasingModeForText() uses CTM scaling before adjusting the offset position.
Use 1px (css) bottom offset to cover this underling overflow.

Source/WebCore:

Test: fast/css3-text/css3-text-decoration/text-underline-position/underline-visual-overflow-with-subpixel-position.html

* platform/graphics/GraphicsContext.cpp:
(WebCore::GraphicsContext::computeLineBoundsAndAntialiasingModeForText):
* rendering/SimpleLineLayoutResolver.cpp: Add visual overflow to simple line layout.
(WebCore::SimpleLineLayout::RunResolver::Run::rect):
(WebCore::SimpleLineLayout::RunResolver::RunResolver):
* rendering/SimpleLineLayoutResolver.h:
* style/InlineTextBoxStyle.cpp:
(WebCore::visualOverflowForDecorations):

LayoutTests:

* fast/css3-text/css3-text-decoration/text-underline-position/underline-visual-overflow-with-subpixel-position-expected.txt: Added.
* fast/css3-text/css3-text-decoration/text-underline-position/underline-visual-overflow-with-subpixel-position.html: 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="#trunkSourceWebCoreplatformgraphicsGraphicsContextcpp">trunk/Source/WebCore/platform/graphics/GraphicsContext.cpp</a></li>
<li><a href="#trunkSourceWebCorerenderingSimpleLineLayoutResolvercpp">trunk/Source/WebCore/rendering/SimpleLineLayoutResolver.cpp</a></li>
<li><a href="#trunkSourceWebCorerenderingSimpleLineLayoutResolverh">trunk/Source/WebCore/rendering/SimpleLineLayoutResolver.h</a></li>
<li><a href="#trunkSourceWebCorestyleInlineTextBoxStylecpp">trunk/Source/WebCore/style/InlineTextBoxStyle.cpp</a></li>
</ul>

<h3>Added Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsfastcss3textcss3textdecorationtextunderlinepositionunderlinevisualoverflowwithsubpixelpositionexpectedtxt">trunk/LayoutTests/fast/css3-text/css3-text-decoration/text-underline-position/underline-visual-overflow-with-subpixel-position-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastcss3textcss3textdecorationtextunderlinepositionunderlinevisualoverflowwithsubpixelpositionhtml">trunk/LayoutTests/fast/css3-text/css3-text-decoration/text-underline-position/underline-visual-overflow-with-subpixel-position.html</a></li>
</ul>

</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkLayoutTestsChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/ChangeLog (194774 => 194775)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/ChangeLog        2016-01-08 19:37:58 UTC (rev 194774)
+++ trunk/LayoutTests/ChangeLog        2016-01-08 20:05:08 UTC (rev 194775)
</span><span class="lines">@@ -1,3 +1,20 @@
</span><ins>+2016-01-08  Zalan Bujtas  &lt;zalan@apple.com&gt;
+
+        Hovering link on http://help.apple.com/appletv/#/ does not show text underline.
+        https://bugs.webkit.org/show_bug.cgi?id=152906
+        &lt;rdar://problem/23339617&gt;
+
+        Reviewed by Simon Fraser.
+
+        GraphicsContext::computeLineBoundsAndAntialiasingModeForText() always integral ceils the origin y position to offset underline text.
+        This additional visual overflow offset is not taken into account by visualOverflowForDecorations().
+        Unfortunately we can't compute the exact same offset value while collecting repaint rects, because
+        computeLineBoundsAndAntialiasingModeForText() uses CTM scaling before adjusting the offset position.
+        Use 1px (css) bottom offset to cover this underling overflow.
+
+        * fast/css3-text/css3-text-decoration/text-underline-position/underline-visual-overflow-with-subpixel-position-expected.txt: Added.
+        * fast/css3-text/css3-text-decoration/text-underline-position/underline-visual-overflow-with-subpixel-position.html: Added.
+
</ins><span class="cx"> 2016-01-08  Brady Eidson  &lt;beidson@apple.com&gt;
</span><span class="cx"> 
</span><span class="cx">         Modern IDB: imported/w3c/indexeddb/idbobjectstore_createIndex6-event_order.htm fails.
</span></span></pre></div>
<a id="trunkLayoutTestsfastcss3textcss3textdecorationtextunderlinepositionunderlinevisualoverflowwithsubpixelpositionexpectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/css3-text/css3-text-decoration/text-underline-position/underline-visual-overflow-with-subpixel-position-expected.txt (0 => 194775)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css3-text/css3-text-decoration/text-underline-position/underline-visual-overflow-with-subpixel-position-expected.txt                                (rev 0)
+++ trunk/LayoutTests/fast/css3-text/css3-text-decoration/text-underline-position/underline-visual-overflow-with-subpixel-position-expected.txt        2016-01-08 20:05:08 UTC (rev 194775)
</span><span class="lines">@@ -0,0 +1,7 @@
</span><ins>+PASS window.internals.repaintRectsAsText().indexOf('8 8 784 13') is not -1
+PASS window.internals.repaintRectsAsText().indexOf('8 20 784 13') is not -1
+PASS successfullyParsed is true
+
+TEST COMPLETE
+foobar
+foobar
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcss3textcss3textdecorationtextunderlinepositionunderlinevisualoverflowwithsubpixelpositionhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/css3-text/css3-text-decoration/text-underline-position/underline-visual-overflow-with-subpixel-position.html (0 => 194775)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css3-text/css3-text-decoration/text-underline-position/underline-visual-overflow-with-subpixel-position.html                                (rev 0)
+++ trunk/LayoutTests/fast/css3-text/css3-text-decoration/text-underline-position/underline-visual-overflow-with-subpixel-position.html        2016-01-08 20:05:08 UTC (rev 194775)
</span><span class="lines">@@ -0,0 +1,43 @@
</span><ins>+&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+&lt;head&gt;
+&lt;title&gt;This thats that underline is painted when the text box is on a subpixel position.&lt;/title&gt;
+&lt;script&gt;jsTestIsAsync = true;&lt;/script&gt;
+&lt;script src=&quot;../../../../resources/js-test-pre.js&quot;&gt;&lt;/script&gt;
+&lt;style&gt;
+body {
+    font-family: monospace;
+    font-size: 10px;
+}
+
+div {
+    padding-top: 0.1px;
+}
+
+.no-decoration {
+    text-decoration: none;
+}
+&lt;/style&gt;
+&lt;/head&gt;
+&lt;body&gt;
+&lt;div&gt;&lt;div&gt;&lt;a class=no-decoration href=&quot;#&quot;&gt;foobar&lt;/a&gt;&lt;/div&gt;&lt;/div&gt;
+&lt;div&gt;&lt;div class=no-decoration&gt;foobar&lt;/div&gt;&lt;/div&gt;
+&lt;script&gt;
+setTimeout(function() {
+    if (window.internals)
+            internals.startTrackingRepaints();
+    var elements = document.getElementsByClassName(&quot;no-decoration&quot;);
+    for (var i = 0; i &lt; elements.length; ++i)
+      elements[i].style.textDecoration = &quot;underline&quot;;
+    document.body.offsetHeight;
+    if (window.internals) {
+        shouldNotBe(&quot;window.internals.repaintRectsAsText().indexOf('8 8 784 13')&quot;, &quot;-1&quot;);
+        shouldNotBe(&quot;window.internals.repaintRectsAsText().indexOf('8 20 784 13')&quot;, &quot;-1&quot;);
+        internals.stopTrackingRepaints();
+    }
+    finishJSTest();
+}, 10);
+&lt;/script&gt;
+&lt;script src=&quot;../../../../resources/js-test-post.js&quot;&gt;&lt;/script&gt;
+&lt;/body&gt;
+&lt;/html&gt;
</ins></span></pre></div>
<a id="trunkSourceWebCoreChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/ChangeLog (194774 => 194775)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/ChangeLog        2016-01-08 19:37:58 UTC (rev 194774)
+++ trunk/Source/WebCore/ChangeLog        2016-01-08 20:05:08 UTC (rev 194775)
</span><span class="lines">@@ -1,3 +1,28 @@
</span><ins>+2016-01-08  Zalan Bujtas  &lt;zalan@apple.com&gt;
+
+        Hovering link on http://help.apple.com/appletv/#/ does not show text underline.
+        https://bugs.webkit.org/show_bug.cgi?id=152906
+        &lt;rdar://problem/23339617&gt;
+
+        Reviewed by Simon Fraser.
+
+        GraphicsContext::computeLineBoundsAndAntialiasingModeForText() always integral ceils the origin y position to offset underline text.
+        This additional visual overflow offset is not taken into account by visualOverflowForDecorations().
+        Unfortunately we can't compute the exact same offset value while collecting repaint rects, because
+        computeLineBoundsAndAntialiasingModeForText() uses CTM scaling before adjusting the offset position.
+        Use 1px (css) bottom offset to cover this underling overflow.
+
+        Test: fast/css3-text/css3-text-decoration/text-underline-position/underline-visual-overflow-with-subpixel-position.html
+
+        * platform/graphics/GraphicsContext.cpp:
+        (WebCore::GraphicsContext::computeLineBoundsAndAntialiasingModeForText):
+        * rendering/SimpleLineLayoutResolver.cpp: Add visual overflow to simple line layout.
+        (WebCore::SimpleLineLayout::RunResolver::Run::rect):
+        (WebCore::SimpleLineLayout::RunResolver::RunResolver):
+        * rendering/SimpleLineLayoutResolver.h:
+        * style/InlineTextBoxStyle.cpp:
+        (WebCore::visualOverflowForDecorations):
+
</ins><span class="cx"> 2016-01-08  Brady Eidson  &lt;beidson@apple.com&gt;
</span><span class="cx"> 
</span><span class="cx">         Modern IDB: imported/w3c/indexeddb/idbobjectstore_createIndex6-event_order.htm fails.
</span></span></pre></div>
<a id="trunkSourceWebCoreplatformgraphicsGraphicsContextcpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/platform/graphics/GraphicsContext.cpp (194774 => 194775)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/platform/graphics/GraphicsContext.cpp        2016-01-08 19:37:58 UTC (rev 194774)
+++ trunk/Source/WebCore/platform/graphics/GraphicsContext.cpp        2016-01-08 20:05:08 UTC (rev 194775)
</span><span class="lines">@@ -995,28 +995,28 @@
</span><span class="cx"> {
</span><span class="cx">     FloatPoint origin = point;
</span><span class="cx">     float thickness = std::max(strokeThickness(), 0.5f);
</span><ins>+    if (printing)
+        return FloatRect(origin, FloatSize(width, thickness));
</ins><span class="cx"> 
</span><del>-    if (!printing) {
-        AffineTransform transform = getCTM(GraphicsContext::DefinitelyIncludeDeviceScale);
</del><ins>+    AffineTransform transform = getCTM(GraphicsContext::DefinitelyIncludeDeviceScale);
+    // Just compute scale in x dimension, assuming x and y scales are equal.
+    float scale = transform.b() ? sqrtf(transform.a() * transform.a() + transform.b() * transform.b()) : transform.a();
+    if (scale &lt; 1.0) {
</ins><span class="cx">         // This code always draws a line that is at least one-pixel line high,
</span><span class="cx">         // which tends to visually overwhelm text at small scales. To counter this
</span><span class="cx">         // effect, an alpha is applied to the underline color when text is at small scales.
</span><ins>+        static const float minimumUnderlineAlpha = 0.4f;
+        float shade = scale &gt; minimumUnderlineAlpha ? scale : minimumUnderlineAlpha;
+        int alpha = color.alpha() * shade;
+        color = Color(color.red(), color.green(), color.blue(), alpha);
+    }
</ins><span class="cx"> 
</span><del>-        // Just compute scale in x dimension, assuming x and y scales are equal.
-        float scale = transform.b() ? sqrtf(transform.a() * transform.a() + transform.b() * transform.b()) : transform.a();
-        if (scale &lt; 1.0) {
-            static const float minimumUnderlineAlpha = 0.4f;
-            float shade = scale &gt; minimumUnderlineAlpha ? scale : minimumUnderlineAlpha;
-            int alpha = color.alpha() * shade;
-            color = Color(color.red(), color.green(), color.blue(), alpha);
-        }
-
-        FloatPoint devicePoint = transform.mapPoint(point);
-        FloatPoint deviceOrigin = FloatPoint(roundf(devicePoint.x()), ceilf(devicePoint.y()));
-        if (auto inverse = transform.inverse())
-            origin = inverse.value().mapPoint(deviceOrigin);
-    }
-    return FloatRect(origin.x(), origin.y(), width, thickness);
</del><ins>+    FloatPoint devicePoint = transform.mapPoint(point);
+    // Visual overflow might occur here due to integral roundf/ceilf. visualOverflowForDecorations adjusts the overflow value for underline decoration.
+    FloatPoint deviceOrigin = FloatPoint(roundf(devicePoint.x()), ceilf(devicePoint.y()));
+    if (auto inverse = transform.inverse())
+        origin = inverse.value().mapPoint(deviceOrigin);
+    return FloatRect(origin, FloatSize(width, thickness));
</ins><span class="cx"> }
</span><span class="cx"> 
</span><span class="cx"> }
</span></span></pre></div>
<a id="trunkSourceWebCorerenderingSimpleLineLayoutResolvercpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/rendering/SimpleLineLayoutResolver.cpp (194774 => 194775)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/rendering/SimpleLineLayoutResolver.cpp        2016-01-08 19:37:58 UTC (rev 194774)
+++ trunk/Source/WebCore/rendering/SimpleLineLayoutResolver.cpp        2016-01-08 20:05:08 UTC (rev 194775)
</span><span class="lines">@@ -26,6 +26,7 @@
</span><span class="cx"> #include &quot;config.h&quot;
</span><span class="cx"> #include &quot;SimpleLineLayoutResolver.h&quot;
</span><span class="cx"> 
</span><ins>+#include &quot;InlineTextBoxStyle.h&quot;
</ins><span class="cx"> #include &quot;RenderBlockFlow.h&quot;
</span><span class="cx"> #include &quot;RenderObject.h&quot;
</span><span class="cx"> #include &quot;SimpleLineLayoutFunctions.h&quot;
</span><span class="lines">@@ -54,7 +55,7 @@
</span><span class="cx">     auto&amp; resolver = m_iterator.resolver();
</span><span class="cx">     float baseline = computeBaselinePosition();
</span><span class="cx">     FloatPoint position = linePosition(run.logicalLeft, baseline - resolver.m_ascent);
</span><del>-    FloatSize size = lineSize(run.logicalLeft, run.logicalRight, resolver.m_ascent + resolver.m_descent);
</del><ins>+    FloatSize size = lineSize(run.logicalLeft, run.logicalRight, resolver.m_ascent + resolver.m_descent + resolver.m_visualOverflowOffset);
</ins><span class="cx">     bool moveLineBreakToBaseline = false;
</span><span class="cx">     if (run.start == run.end &amp;&amp; m_iterator != resolver.begin() &amp;&amp; m_iterator.inQuirksMode()) {
</span><span class="cx">         auto previousRun = m_iterator;
</span><span class="lines">@@ -118,6 +119,7 @@
</span><span class="cx">     , m_borderAndPaddingBefore(flow.borderAndPaddingBefore())
</span><span class="cx">     , m_ascent(flow.style().fontCascade().fontMetrics().ascent())
</span><span class="cx">     , m_descent(flow.style().fontCascade().fontMetrics().descent())
</span><ins>+    , m_visualOverflowOffset(visualOverflowForDecorations(flow.style(), nullptr).bottom)
</ins><span class="cx">     , m_inQuirksMode(flow.document().inQuirksMode())
</span><span class="cx"> {
</span><span class="cx"> }
</span></span></pre></div>
<a id="trunkSourceWebCorerenderingSimpleLineLayoutResolverh"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/rendering/SimpleLineLayoutResolver.h (194774 => 194775)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/rendering/SimpleLineLayoutResolver.h        2016-01-08 19:37:58 UTC (rev 194774)
+++ trunk/Source/WebCore/rendering/SimpleLineLayoutResolver.h        2016-01-08 20:05:08 UTC (rev 194775)
</span><span class="lines">@@ -123,6 +123,7 @@
</span><span class="cx">     const LayoutUnit m_borderAndPaddingBefore;
</span><span class="cx">     const float m_ascent;
</span><span class="cx">     const float m_descent;
</span><ins>+    const float m_visualOverflowOffset;
</ins><span class="cx">     const bool m_inQuirksMode;
</span><span class="cx"> };
</span><span class="cx"> 
</span></span></pre></div>
<a id="trunkSourceWebCorestyleInlineTextBoxStylecpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/style/InlineTextBoxStyle.cpp (194774 => 194775)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/style/InlineTextBoxStyle.cpp        2016-01-08 19:37:58 UTC (rev 194774)
+++ trunk/Source/WebCore/style/InlineTextBoxStyle.cpp        2016-01-08 20:05:08 UTC (rev 194775)
</span><span class="lines">@@ -123,7 +123,9 @@
</span><span class="cx"> 
</span><span class="cx">     // These metrics must match where underlines get drawn.
</span><span class="cx">     if (decoration &amp; TextDecorationUnderline) {
</span><del>-        float underlineOffset = computeUnderlineOffset(lineStyle.textUnderlinePosition(), lineStyle.fontMetrics(), inlineTextBox, strokeThickness);
</del><ins>+        // Compensate for the integral ceiling in GraphicsContext::computeLineBoundsAndAntialiasingModeForText()
+        int underlineOffset = 1;
+        underlineOffset += computeUnderlineOffset(lineStyle.textUnderlinePosition(), lineStyle.fontMetrics(), inlineTextBox, strokeThickness);
</ins><span class="cx">         if (decorationStyle == TextDecorationStyleWavy) {
</span><span class="cx">             extendIntToFloat(overflowResult.bottom, underlineOffset + wavyOffset + controlPointDistance + strokeThickness - height);
</span><span class="cx">             extendIntToFloat(overflowResult.top, -(underlineOffset + wavyOffset - controlPointDistance - strokeThickness));
</span></span></pre>
</div>
</div>

</body>
</html>