<!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>[187018] 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/187018">187018</a></dd>
<dt>Author</dt> <dd>timothy_horton@apple.com</dd>
<dt>Date</dt> <dd>2015-07-19 23:38:40 -0700 (Sun, 19 Jul 2015)</dd>
</dl>

<h3>Log Message</h3>
<pre>Make shrink-wrapping test a ref-test instead of pixel-test
https://bugs.webkit.org/show_bug.cgi?id=147081

Reviewed by Sam Weinig.

Source/WebCore:

Nobody runs pixel tests.

* svg/SVGPathUtilities.cpp:
(WebCore::pathIteratorForBuildingString):
(WebCore::buildStringFromPath):
* svg/SVGPathUtilities.h:
Add a helper that turns a Path into a SVG path string.

* testing/Internals.cpp:
(WebCore::Internals::pathStringWithShrinkWrappedRects):
* testing/Internals.h:
* testing/Internals.idl:
Have the internals shrink-wrap method return an SVG path instead of a DOMPath.

LayoutTests:

* fast/shrink-wrap/rect-shrink-wrap-expected.html: Added.
* fast/shrink-wrap/rect-shrink-wrap-expected.png: Removed.
* fast/shrink-wrap/rect-shrink-wrap-expected.txt: Removed.
* fast/shrink-wrap/rect-shrink-wrap.html:
SVG all the things.</pre>

<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsChangeLog">trunk/LayoutTests/ChangeLog</a></li>
<li><a href="#trunkLayoutTestsfastshrinkwraprectshrinkwraphtml">trunk/LayoutTests/fast/shrink-wrap/rect-shrink-wrap.html</a></li>
<li><a href="#trunkSourceWebCoreChangeLog">trunk/Source/WebCore/ChangeLog</a></li>
<li><a href="#trunkSourceWebCoresvgSVGPathUtilitiescpp">trunk/Source/WebCore/svg/SVGPathUtilities.cpp</a></li>
<li><a href="#trunkSourceWebCoresvgSVGPathUtilitiesh">trunk/Source/WebCore/svg/SVGPathUtilities.h</a></li>
<li><a href="#trunkSourceWebCoretestingInternalscpp">trunk/Source/WebCore/testing/Internals.cpp</a></li>
<li><a href="#trunkSourceWebCoretestingInternalsh">trunk/Source/WebCore/testing/Internals.h</a></li>
<li><a href="#trunkSourceWebCoretestingInternalsidl">trunk/Source/WebCore/testing/Internals.idl</a></li>
</ul>

<h3>Added Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsfastshrinkwraprectshrinkwrapexpectedhtml">trunk/LayoutTests/fast/shrink-wrap/rect-shrink-wrap-expected.html</a></li>
</ul>

<h3>Removed Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsfastshrinkwraprectshrinkwrapexpectedpng">trunk/LayoutTests/fast/shrink-wrap/rect-shrink-wrap-expected.png</a></li>
<li><a href="#trunkLayoutTestsfastshrinkwraprectshrinkwrapexpectedtxt">trunk/LayoutTests/fast/shrink-wrap/rect-shrink-wrap-expected.txt</a></li>
</ul>

</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkLayoutTestsChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/ChangeLog (187017 => 187018)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/ChangeLog        2015-07-19 23:37:45 UTC (rev 187017)
+++ trunk/LayoutTests/ChangeLog        2015-07-20 06:38:40 UTC (rev 187018)
</span><span class="lines">@@ -1,3 +1,16 @@
</span><ins>+2015-07-19  Tim Horton  &lt;timothy_horton@apple.com&gt;
+
+        Make shrink-wrapping test a ref-test instead of pixel-test
+        https://bugs.webkit.org/show_bug.cgi?id=147081
+
+        Reviewed by Sam Weinig.
+
+        * fast/shrink-wrap/rect-shrink-wrap-expected.html: Added.
+        * fast/shrink-wrap/rect-shrink-wrap-expected.png: Removed.
+        * fast/shrink-wrap/rect-shrink-wrap-expected.txt: Removed.
+        * fast/shrink-wrap/rect-shrink-wrap.html:
+        SVG all the things.
+
</ins><span class="cx"> 2015-07-19  Jordan Harband  &lt;ljharb@gmail.com&gt;
</span><span class="cx"> 
</span><span class="cx">         new Date(NaN).toJSON() must return null instead of throwing a TypeError
</span></span></pre></div>
<a id="trunkLayoutTestsfastshrinkwraprectshrinkwrapexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/shrink-wrap/rect-shrink-wrap-expected.html (0 => 187018)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/shrink-wrap/rect-shrink-wrap-expected.html                                (rev 0)
+++ trunk/LayoutTests/fast/shrink-wrap/rect-shrink-wrap-expected.html        2015-07-20 06:38:40 UTC (rev 187018)
</span><span class="lines">@@ -0,0 +1,215 @@
</span><ins>+&lt;style&gt;
+body {
+    margin: 0;
+}
+&lt;/style&gt;
+
+&lt;svg id=&quot;paths&quot; width=&quot;800&quot; height=&quot;600&quot;&gt;
+    &lt;g transform=&quot;translate(20, 20)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;50&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;20&quot; width=&quot;35&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;40&quot; width=&quot;20&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 8 L 0 8 C 5.41083e-16 3.58172 3.58172 1.50582e-15 8 1.77636e-15 L 42 0 L 42 0 C 46.4183 2.70542e-16 50 3.58172 50 8 L 50 12.5 L 50 12.5 C 50 16.6421 46.6421 20 42.5 20 L 42.5 20 L 42.5 20 C 38.3579 20 35 23.3579 35 27.5 L 35 32.5 L 35 32.5 C 35 36.6421 31.6421 40 27.5 40 L 27.5 40 L 27.5 40 C 23.3579 40 20 43.3579 20 47.5 L 20 52 L 20 52 C 20 56.4183 16.4183 60 12 60 L 8 60 L 8 60 C 3.58172 60 5.41083e-16 56.4183 0 52 L 0 48 L 8.88178e-16 40 L 0 28 L 8.88178e-16 20 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(20, 90)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;20&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;20&quot; width=&quot;35&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;40&quot; width=&quot;50&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 8 L 0 8 C 5.41083e-16 3.58172 3.58172 1.50582e-15 8 1.77636e-15 L 12 0 L 12 0 C 16.4183 2.70542e-16 20 3.58172 20 8 L 20 12.5 L 20 12.5 C 20 16.6421 23.3579 20 27.5 20 L 27.5 20 L 27.5 20 C 31.6421 20 35 23.3579 35 27.5 L 35 32.5 L 35 32.5 C 35 36.6421 38.3579 40 42.5 40 L 42.5 40 L 42.5 40 C 46.6421 40 50 43.3579 50 47.5 L 50 52 L 50 52 C 50 56.4183 46.4183 60 42 60 L 8 60 L 8 60 C 3.58172 60 5.41083e-16 56.4183 0 52 L 0 48 L 8.88178e-16 40 L 0 28 L 8.88178e-16 20 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(80, 20)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;50&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;15&quot; y=&quot;20&quot; width=&quot;35&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;30&quot; y=&quot;40&quot; width=&quot;20&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 8 L 0 8 C 5.41083e-16 3.58172 3.58172 1.50582e-15 8 1.77636e-15 L 42 0 L 42 0 C 46.4183 2.70542e-16 50 3.58172 50 8 L 50 12 L 50 20 L 50 32 L 50 40 L 50 52 L 50 52 C 50 56.4183 46.4183 60 42 60 L 38 60 L 38 60 C 33.5817 60 30 56.4183 30 52 L 30 47.5 L 30 47.5 C 30 43.3579 26.6421 40 22.5 40 L 22.5 40 L 22.5 40 C 18.3579 40 15 36.6421 15 32.5 L 15 27.5 L 15 27.5 C 15 23.3579 11.6421 20 7.5 20 L 7.5 20 L 7.5 20 C 3.35786 20 1.39544e-15 16.6421 8.88178e-16 12.5 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(80, 90)&quot;&gt;
+        &lt;rect x=&quot;30&quot; y=&quot;0&quot; width=&quot;20&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;15&quot; y=&quot;20&quot; width=&quot;35&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;40&quot; width=&quot;50&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 30 8 L 30 8 C 30 3.58172 33.5817 1.50582e-15 38 1.77636e-15 L 42 0 L 42 0 C 46.4183 2.70542e-16 50 3.58172 50 8 L 50 12 L 50 20 L 50 32 L 50 40 L 50 52 L 50 52 C 50 56.4183 46.4183 60 42 60 L 8 60 L 8 60 C 3.58172 60 5.41083e-16 56.4183 0 52 L 0 47.5 L 0 47.5 C 5.07265e-16 43.3579 3.35786 40 7.5 40 L 7.5 40 L 7.5 40 C 11.6421 40 15 36.6421 15 32.5 L 15 27.5 L 15 27.5 C 15 23.3579 18.3579 20 22.5 20 L 22.5 20 L 22.5 20 C 26.6421 20 30 16.6421 30 12.5 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(170, 20)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;100&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;20&quot; y=&quot;40&quot; width=&quot;60&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;35&quot; y=&quot;80&quot; width=&quot;30&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 8 L 0 8 C 5.41083e-16 3.58172 3.58172 1.50582e-15 8 1.77636e-15 L 92 0 L 92 0 C 96.4183 2.70542e-16 100 3.58172 100 8 L 100 32 L 100 32 C 100 36.4183 96.4183 40 92 40 L 88 40 L 88 40 C 83.5817 40 80 43.5817 80 48 L 80 72.5 L 80 72.5 C 80 76.6421 76.6421 80 72.5 80 L 72.5 80 L 72.5 80 C 68.3579 80 65 83.3579 65 87.5 L 65 112 L 65 112 C 65 116.418 61.4183 120 57 120 L 43 120 L 43 120 C 38.5817 120 35 116.418 35 112 L 35 87.5 L 35 87.5 C 35 83.3579 31.6421 80 27.5 80 L 27.5 80 L 27.5 80 C 23.3579 80 20 76.6421 20 72.5 L 20 48 L 20 48 C 20 43.5817 16.4183 40 12 40 L 8 40 L 8 40 C 3.58172 40 5.41083e-16 36.4183 0 32 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(270, 20)&quot;&gt;
+        &lt;rect x=&quot;35&quot; y=&quot;0&quot; width=&quot;30&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;20&quot; y=&quot;40&quot; width=&quot;60&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;80&quot; width=&quot;100&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 35 8 L 35 8 C 35 3.58172 38.5817 1.50582e-15 43 1.77636e-15 L 57 0 L 57 0 C 61.4183 2.70542e-16 65 3.58172 65 8 L 65 32.5 L 65 32.5 C 65 36.6421 68.3579 40 72.5 40 L 72.5 40 L 72.5 40 C 76.6421 40 80 43.3579 80 47.5 L 80 72 L 80 72 C 80 76.4183 83.5817 80 88 80 L 92 80 L 92 80 C 96.4183 80 100 83.5817 100 88 L 100 112 L 100 112 C 100 116.418 96.4183 120 92 120 L 8 120 L 8 120 C 3.58172 120 5.41083e-16 116.418 0 112 L 0 88 L 0 88 C 5.41083e-16 83.5817 3.58172 80 8 80 L 12 80 L 12 80 C 16.4183 80 20 76.4183 20 72 L 20 47.5 L 20 47.5 C 20 43.3579 23.3579 40 27.5 40 L 27.5 40 L 27.5 40 C 31.6421 40 35 36.6421 35 32.5 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(370, 20)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;100&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;35&quot; y=&quot;40&quot; width=&quot;30&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;20&quot; y=&quot;80&quot; width=&quot;60&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 8 L 0 8 C 5.41083e-16 3.58172 3.58172 1.50582e-15 8 1.77636e-15 L 92 0 L 92 0 C 96.4183 2.70542e-16 100 3.58172 100 8 L 100 32 L 100 32 C 100 36.4183 96.4183 40 92 40 L 73 40 L 73 40 C 68.5817 40 65 43.5817 65 48 L 65 72.5 L 65 72.5 C 65 76.6421 68.3579 80 72.5 80 L 72.5 80 L 72.5 80 C 76.6421 80 80 83.3579 80 87.5 L 80 112 L 80 112 C 80 116.418 76.4183 120 72 120 L 28 120 L 28 120 C 23.5817 120 20 116.418 20 112 L 20 87.5 L 20 87.5 C 20 83.3579 23.3579 80 27.5 80 L 27.5 80 L 27.5 80 C 31.6421 80 35 76.6421 35 72.5 L 35 48 L 35 48 C 35 43.5817 31.4183 40 27 40 L 8 40 L 8 40 C 3.58172 40 5.41083e-16 36.4183 0 32 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(20, 200)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;40&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;20&quot; y=&quot;20&quot; width=&quot;40&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;40&quot; y=&quot;40&quot; width=&quot;40&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 8 L 0 8 C 5.41083e-16 3.58172 3.58172 1.50582e-15 8 1.77636e-15 L 32 0 L 32 0 C 36.4183 2.70542e-16 40 3.58172 40 8 L 40 12 L 40 12 C 40 16.4183 43.5817 20 48 20 L 52 20 L 52 20 C 56.4183 20 60 23.5817 60 28 L 60 32 L 60 32 C 60 36.4183 63.5817 40 68 40 L 72 40 L 72 40 C 76.4183 40 80 43.5817 80 48 L 80 72 L 80 72 C 80 76.4183 76.4183 80 72 80 L 48 80 L 48 80 C 43.5817 80 40 76.4183 40 72 L 40 68 L 40 68 C 40 63.5817 36.4183 60 32 60 L 28 60 L 28 60 C 23.5817 60 20 56.4183 20 52 L 20 48 L 20 48 C 20 43.5817 16.4183 40 12 40 L 8 40 L 8 40 C 3.58172 40 5.41083e-16 36.4183 0 32 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(120, 200)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;40&quot; width=&quot;40&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;20&quot; y=&quot;20&quot; width=&quot;40&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;40&quot; y=&quot;0&quot; width=&quot;40&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 40 8 L 40 8 C 40 3.58172 43.5817 1.50582e-15 48 1.77636e-15 L 72 0 L 72 0 C 76.4183 2.70542e-16 80 3.58172 80 8 L 80 32 L 80 32 C 80 36.4183 76.4183 40 72 40 L 68 40 L 68 40 C 63.5817 40 60 43.5817 60 48 L 60 52 L 60 52 C 60 56.4183 56.4183 60 52 60 L 48 60 L 48 60 C 43.5817 60 40 63.5817 40 68 L 40 72 L 40 72 C 40 76.4183 36.4183 80 32 80 L 8 80 L 8 80 C 3.58172 80 5.41083e-16 76.4183 0 72 L 0 48 L 0 48 C 5.41083e-16 43.5817 3.58172 40 8 40 L 12 40 L 12 40 C 16.4183 40 20 36.4183 20 32 L 20 28 L 20 28 C 20 23.5817 23.5817 20 28 20 L 32 20 L 32 20 C 36.4183 20 40 16.4183 40 12 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(220, 200)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;40&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;40&quot; width=&quot;40&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;80&quot; width=&quot;40&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 8 L 0 8 C 5.41083e-16 3.58172 3.58172 1.50582e-15 8 1.77636e-15 L 32 0 L 32 0 C 36.4183 2.70542e-16 40 3.58172 40 8 L 40 32 L 40 40 L 40 72 L 40 80 L 40 112 L 40 112 C 40 116.418 36.4183 120 32 120 L 8 120 L 8 120 C 3.58172 120 5.41083e-16 116.418 0 112 L 0 88 L 8.88178e-16 80 L 0 48 L 8.88178e-16 40 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(200, 350)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;100&quot; height=&quot;50&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;25&quot; width=&quot;50&quot; height=&quot;50&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 8 L 0 8 C 5.41083e-16 3.58172 3.58172 1.50582e-15 8 1.77636e-15 L 92 0 L 92 0 C 96.4183 2.70542e-16 100 3.58172 100 8 L 100 42 L 100 42 C 100 46.4183 96.4183 50 92 50 L 58 50 L 58 50 C 53.5817 50 50 53.5817 50 58 L 50 67 L 50 67 C 50 71.4183 46.4183 75 42 75 L 8 75 L 8 75 C 3.58172 75 5.41083e-16 71.4183 0 67 L 0 58 L 8.88178e-16 50 L 0 33 L 8.88178e-16 25 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(20, 300)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;40&quot; height=&quot;60&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;80&quot; width=&quot;40&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 8 L 0 8 C 5.41083e-16 3.58172 3.58172 1.50582e-15 8 1.77636e-15 L 32 0 L 32 0 C 36.4183 2.70542e-16 40 3.58172 40 8 L 40 52 L 40 52 C 40 56.4183 36.4183 60 32 60 L 8 60 L 8 60 C 3.58172 60 5.41083e-16 56.4183 0 52 Z M 0 88 L 0 88 C 5.41083e-16 83.5817 3.58172 80 8 80 L 32 80 L 32 80 C 36.4183 80 40 83.5817 40 88 L 40 112 L 40 112 C 40 116.418 36.4183 120 32 120 L 8 120 L 8 120 C 3.58172 120 5.41083e-16 116.418 0 112 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(280, 200)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;30&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;80&quot; width=&quot;50&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;60&quot; y=&quot;0&quot; width=&quot;40&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;80&quot; y=&quot;40&quot; width=&quot;80&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;100&quot; y=&quot;80&quot; width=&quot;40&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;150&quot; y=&quot;0&quot; width=&quot;40&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;170&quot; y=&quot;15&quot; width=&quot;40&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;190&quot; y=&quot;30&quot; width=&quot;40&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 8 L 0 8 C 5.41083e-16 3.58172 3.58172 1.50582e-15 8 1.77636e-15 L 22 0 L 22 0 C 26.4183 2.70542e-16 30 3.58172 30 8 L 30 32 L 30 32 C 30 36.4183 26.4183 40 22 40 L 8 40 L 8 40 C 3.58172 40 5.41083e-16 36.4183 0 32 Z M 60 8 L 60 8 C 60 3.58172 63.5817 1.50582e-15 68 1.77636e-15 L 92 0 L 92 0 C 96.4183 2.70542e-16 100 3.58172 100 8 L 100 32 L 100 32 C 100 36.4183 103.582 40 108 40 L 152 40 L 152 40 C 156.418 40 160 43.5817 160 48 L 160 72 L 160 72 C 160 76.4183 156.418 80 152 80 L 148 80 L 148 80 C 143.582 80 140 83.5817 140 88 L 140 112 L 140 112 C 140 116.418 136.418 120 132 120 L 108 120 L 108 120 C 103.582 120 100 116.418 100 112 L 100 88 L 100 88 C 100 83.5817 96.4183 80 92 80 L 88 80 L 88 80 C 83.5817 80 80 76.4183 80 72 L 80 48 L 80 48 C 80 43.5817 76.4183 40 72 40 L 68 40 L 68 40 C 63.5817 40 60 36.4183 60 32 Z M 150 8 L 150 8 C 150 3.58172 153.582 1.50582e-15 158 1.77636e-15 L 182.5 0 L 182.5 0 C 186.642 2.53633e-16 190 3.35786 190 7.5 L 1
 90 7.5 L 190 7.5 C 190 11.6421 193.358 15 197.5 15 L 202.5 15 L 202.5 15 C 206.642 15 210 18.3579 210 22.5 L 210 22.5 L 210 22.5 C 210 26.6421 213.358 30 217.5 30 L 222 30 L 222 30 C 226.418 30 230 33.5817 230 38 L 230 42 L 230 42 C 230 46.4183 226.418 50 222 50 L 197.5 50 L 197.5 50 C 193.358 50 190 46.6421 190 42.5 L 190 42.5 L 190 42.5 C 190 38.3579 186.642 35 182.5 35 L 177.5 35 L 177.5 35 C 173.358 35 170 31.6421 170 27.5 L 170 27.5 L 170 27.5 C 170 23.3579 166.642 20 162.5 20 L 158 20 L 158 20 C 153.582 20 150 16.4183 150 12 Z M 0 88 L 0 88 C 5.41083e-16 83.5817 3.58172 80 8 80 L 42 80 L 42 80 C 46.4183 80 50 83.5817 50 88 L 50 112 L 50 112 C 50 116.418 46.4183 120 42 120 L 8 120 L 8 120 C 3.58172 120 5.41083e-16 116.418 0 112 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(100, 300)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;50&quot; height=&quot;50&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;10&quot; y=&quot;10&quot; width=&quot;20&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 8 L 0 8 C 5.41083e-16 3.58172 3.58172 1.50582e-15 8 1.77636e-15 L 42 0 L 42 0 C 46.4183 2.70542e-16 50 3.58172 50 8 L 50 42 L 50 42 C 50 46.4183 46.4183 50 42 50 L 8 50 L 8 50 C 3.58172 50 5.41083e-16 46.4183 0 42 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(100, 370)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;50&quot; height=&quot;50&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;10&quot; y=&quot;10&quot; width=&quot;20&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;20&quot; y=&quot;20&quot; width=&quot;20&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 8 L 0 8 C 5.41083e-16 3.58172 3.58172 1.50582e-15 8 1.77636e-15 L 42 0 L 42 0 C 46.4183 2.70542e-16 50 3.58172 50 8 L 50 42 L 50 42 C 50 46.4183 46.4183 50 42 50 L 8 50 L 8 50 C 3.58172 50 5.41083e-16 46.4183 0 42 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(500, 20)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;40&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;20&quot; y=&quot;40&quot; width=&quot;65&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;40&quot; y=&quot;80&quot; width=&quot;40&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 8 L 0 8 C 5.41083e-16 3.58172 3.58172 1.50582e-15 8 1.77636e-15 L 32 0 L 32 0 C 36.4183 2.70542e-16 40 3.58172 40 8 L 40 32 L 40 32 C 40 36.4183 43.5817 40 48 40 L 77 40 L 77 40 C 81.4183 40 85 43.5817 85 48 L 85 77.5 L 85 77.5 C 85 78.8807 83.8807 80 82.5 80 L 82.5 80 L 82.5 80 C 81.1193 80 80 81.1193 80 82.5 L 80 112 L 80 112 C 80 116.418 76.4183 120 72 120 L 48 120 L 48 120 C 43.5817 120 40 116.418 40 112 L 40 88 L 40 88 C 40 83.5817 36.4183 80 32 80 L 28 80 L 28 80 C 23.5817 80 20 76.4183 20 72 L 20 48 L 20 48 C 20 43.5817 16.4183 40 12 40 L 8 40 L 8 40 C 3.58172 40 5.41083e-16 36.4183 0 32 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(600, 20)&quot;&gt;
+        &lt;rect x=&quot;20&quot; y=&quot;0&quot; width=&quot;20&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;15&quot; y=&quot;20&quot; width=&quot;35&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;40&quot; width=&quot;50&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 20 8 L 20 8 C 20 3.58172 23.5817 1.50582e-15 28 1.77636e-15 L 32 0 L 32 0 C 36.4183 2.70542e-16 40 3.58172 40 8 L 40 15 L 40 15 C 40 17.7614 42.2386 20 45 20 L 45 20 L 45 20 C 47.7614 20 50 22.2386 50 25 L 50 32 L 50 40 L 50 52 L 50 52 C 50 56.4183 46.4183 60 42 60 L 8 60 L 8 60 C 3.58172 60 5.41083e-16 56.4183 0 52 L 0 47.5 L 0 47.5 C 5.07265e-16 43.3579 3.35786 40 7.5 40 L 7.5 40 L 7.5 40 C 11.6421 40 15 36.6421 15 32.5 L 15 22.5 L 15 22.5 C 15 21.1193 16.1193 20 17.5 20 L 17.5 20 L 17.5 20 C 18.8807 20 20 18.8807 20 17.5 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(650, 100)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;40&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;40&quot; y=&quot;0&quot; width=&quot;40&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;80&quot; y=&quot;0&quot; width=&quot;40&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 8 L 0 8 C 5.41083e-16 3.58172 3.58172 1.50582e-15 8 1.77636e-15 L 32 0 L 40 0 L 72 0 L 80 0 L 112 0 L 112 0 C 116.418 2.70542e-16 120 3.58172 120 8 L 120 32 L 120 32 C 120 36.4183 116.418 40 112 40 L 88 40 L 80 40 L 48 40 L 40 40 L 8 40 L 8 40 C 3.58172 40 5.41083e-16 36.4183 0 32 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(700, 20)&quot;&gt;
+        &lt;rect x=&quot;20&quot; y=&quot;0&quot; width=&quot;20&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;15&quot; y=&quot;20&quot; width=&quot;35&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;20&quot; width=&quot;50&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 20 8 L 20 8 C 20 3.58172 23.5817 1.50582e-15 28 1.77636e-15 L 32 0 L 32 0 C 36.4183 2.70542e-16 40 3.58172 40 8 L 40 15 L 40 15 C 40 17.7614 42.2386 20 45 20 L 45 20 L 45 20 C 47.7614 20 50 22.2386 50 25 L 50 32 L 50 32 C 50 36.4183 46.4183 40 42 40 L 8 40 L 8 40 C 3.58172 40 5.41083e-16 36.4183 0 32 L 0 28 L 0 28 C 5.41083e-16 23.5817 3.58172 20 8 20 L 12 20 L 12 20 C 16.4183 20 20 16.4183 20 12 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(600, 200)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;20&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;20&quot; y=&quot;20&quot; width=&quot;20&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;40&quot; y=&quot;0&quot; width=&quot;20&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 8 L 0 8 C 5.41083e-16 3.58172 3.58172 1.50582e-15 8 1.77636e-15 L 12 0 L 12 0 C 16.4183 2.70542e-16 20 3.58172 20 8 L 20 12 L 20 12 C 20 16.4183 23.5817 20 28 20 L 32 20 L 32 20 C 36.4183 20 40 16.4183 40 12 L 40 8 L 40 8 C 40 3.58172 43.5817 1.50582e-15 48 1.77636e-15 L 52 0 L 52 0 C 56.4183 2.70542e-16 60 3.58172 60 8 L 60 32 L 60 32 C 60 36.4183 56.4183 40 52 40 L 48 40 L 48 40 C 43.5817 40 40 43.5817 40 48 L 40 52 L 40 52 C 40 56.4183 36.4183 60 32 60 L 28 60 L 28 60 C 23.5817 60 20 56.4183 20 52 L 20 48 L 20 48 C 20 43.5817 16.4183 40 12 40 L 8 40 L 8 40 C 3.58172 40 5.41083e-16 36.4183 0 32 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(700, 200)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;20&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;20&quot; y=&quot;25&quot; width=&quot;20&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;50&quot; width=&quot;20&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 8 L 0 8 C 5.41083e-16 3.58172 3.58172 1.50582e-15 8 1.77636e-15 L 12 0 L 12 0 C 16.4183 2.70542e-16 20 3.58172 20 8 L 20 17 L 20 17 C 20 21.4183 23.5817 25 28 25 L 32 25 L 32 25 C 36.4183 25 40 28.5817 40 33 L 40 57 L 40 57 C 40 61.4183 36.4183 65 32 65 L 28 65 L 28 65 C 23.5817 65 20 68.5817 20 73 L 20 82 L 20 82 C 20 86.4183 16.4183 90 12 90 L 8 90 L 8 90 C 3.58172 90 5.41083e-16 86.4183 0 82 L 0 58 L 0 58 C 5.41083e-16 53.5817 3.58172 50 8 50 L 15 50 L 15 50 C 17.7614 50 20 47.7614 20 45 L 20 45 L 20 45 C 20 42.2386 17.7614 40 15 40 L 8 40 L 8 40 C 3.58172 40 5.41083e-16 36.4183 0 32 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(20, 450)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;50&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;20&quot; width=&quot;35&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;40&quot; width=&quot;20&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 10 L 0 10 C 6.76354e-16 4.47715 4.47715 1.43818e-15 10 1.77636e-15 L 40 0 L 40 0 C 45.5228 3.38177e-16 50 4.47715 50 10 L 50 12.5 L 50 12.5 C 50 16.6421 46.6421 20 42.5 20 L 42.5 20 L 42.5 20 C 38.3579 20 35 23.3579 35 27.5 L 35 32.5 L 35 32.5 C 35 36.6421 31.6421 40 27.5 40 L 27.5 40 L 27.5 40 C 23.3579 40 20 43.3579 20 47.5 L 20 50 L 20 50 C 20 55.5228 15.5228 60 10 60 L 10 60 L 10 60 C 4.47715 60 6.76354e-16 55.5228 0 50 L 0 50 L 0 40 L 0 30 L 0 20 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(20, 520)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;20&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;20&quot; width=&quot;35&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;40&quot; width=&quot;50&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 10 L 0 10 C 6.76354e-16 4.47715 4.47715 1.43818e-15 10 1.77636e-15 L 10 0 L 10 0 C 15.5228 3.38177e-16 20 4.47715 20 10 L 20 12.5 L 20 12.5 C 20 16.6421 23.3579 20 27.5 20 L 27.5 20 L 27.5 20 C 31.6421 20 35 23.3579 35 27.5 L 35 32.5 L 35 32.5 C 35 36.6421 38.3579 40 42.5 40 L 42.5 40 L 42.5 40 C 46.6421 40 50 43.3579 50 47.5 L 50 50 L 50 50 C 50 55.5228 45.5228 60 40 60 L 10 60 L 10 60 C 4.47715 60 6.76354e-16 55.5228 0 50 L 0 50 L 0 40 L 0 30 L 0 20 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(80, 450)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;50&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;15&quot; y=&quot;20&quot; width=&quot;35&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;30&quot; y=&quot;40&quot; width=&quot;20&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 10 L 0 10 C 6.76354e-16 4.47715 4.47715 1.43818e-15 10 1.77636e-15 L 40 0 L 40 0 C 45.5228 3.38177e-16 50 4.47715 50 10 L 50 10 L 50 20 L 50 30 L 50 40 L 50 50 L 50 50 C 50 55.5228 45.5228 60 40 60 L 40 60 L 40 60 C 34.4772 60 30 55.5228 30 50 L 30 47.5 L 30 47.5 C 30 43.3579 26.6421 40 22.5 40 L 22.5 40 L 22.5 40 C 18.3579 40 15 36.6421 15 32.5 L 15 27.5 L 15 27.5 C 15 23.3579 11.6421 20 7.5 20 L 7.5 20 L 7.5 20 C 3.35786 20 1.39544e-15 16.6421 8.88178e-16 12.5 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(80, 520)&quot;&gt;
+        &lt;rect x=&quot;30&quot; y=&quot;0&quot; width=&quot;20&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;15&quot; y=&quot;20&quot; width=&quot;35&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;40&quot; width=&quot;50&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 30 10 L 30 10 C 30 4.47715 34.4772 1.43818e-15 40 1.77636e-15 L 40 0 L 40 0 C 45.5228 3.38177e-16 50 4.47715 50 10 L 50 10 L 50 20 L 50 30 L 50 40 L 50 50 L 50 50 C 50 55.5228 45.5228 60 40 60 L 10 60 L 10 60 C 4.47715 60 6.76354e-16 55.5228 0 50 L 0 47.5 L 0 47.5 C 5.07265e-16 43.3579 3.35786 40 7.5 40 L 7.5 40 L 7.5 40 C 11.6421 40 15 36.6421 15 32.5 L 15 27.5 L 15 27.5 C 15 23.3579 18.3579 20 22.5 20 L 22.5 20 L 22.5 20 C 26.6421 20 30 16.6421 30 12.5 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(170, 450)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;100&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;20&quot; y=&quot;40&quot; width=&quot;60&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;35&quot; y=&quot;80&quot; width=&quot;30&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 20 L 0 20 C 1.35271e-15 8.9543 8.9543 2.87636e-15 20 3.55271e-15 L 80 0 L 80 0 C 91.0457 6.76354e-16 100 8.9543 100 20 L 100 30 L 100 30 C 100 35.5228 95.5229 40 90 40 L 90 40 L 90 40 C 84.4771 40 80 44.4772 80 50 L 80 72.5 L 80 72.5 C 80 76.6421 76.6421 80 72.5 80 L 72.5 80 L 72.5 80 C 68.3579 80 65 83.3579 65 87.5 L 65 105 L 65 105 C 65 113.284 58.2843 120 50 120 L 50 120 L 50 120 C 41.7157 120 35 113.284 35 105 L 35 87.5 L 35 87.5 C 35 83.3579 31.6421 80 27.5 80 L 27.5 80 L 27.5 80 C 23.3579 80 20 76.6421 20 72.5 L 20 50 L 20 50 C 20 44.4772 15.5228 40 10 40 L 10 40 L 10 40 C 4.47715 40 6.76354e-16 35.5228 0 30 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(270, 450)&quot;&gt;
+        &lt;rect x=&quot;35&quot; y=&quot;0&quot; width=&quot;30&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;20&quot; y=&quot;40&quot; width=&quot;60&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;80&quot; width=&quot;100&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 35 15 L 35 15 C 35 6.71573 41.7157 1.33221e-15 50 0 L 50 0 L 50 0 C 58.2843 5.07265e-16 65 6.71573 65 15 L 65 32.5 L 65 32.5 C 65 36.6421 68.3579 40 72.5 40 L 72.5 40 L 72.5 40 C 76.6421 40 80 43.3579 80 47.5 L 80 70 L 80 70 C 80 75.5229 84.4771 80 90 80 L 90 80 L 90 80 C 95.5229 80 100 84.4771 100 90 L 100 100 L 100 100 C 100 111.046 91.0457 120 80 120 L 20 120 L 20 120 C 8.9543 120 1.35271e-15 111.046 0 100 L 0 90 L 0 90 C 6.76354e-16 84.4771 4.47715 80 10 80 L 10 80 L 10 80 C 15.5228 80 20 75.5229 20 70 L 20 47.5 L 20 47.5 C 20 43.3579 23.3579 40 27.5 40 L 27.5 40 L 27.5 40 C 31.6421 40 35 36.6421 35 32.5 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(370, 450)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;100&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;35&quot; y=&quot;40&quot; width=&quot;30&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;20&quot; y=&quot;80&quot; width=&quot;60&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 20 L 0 20 C 1.35271e-15 8.9543 8.9543 2.87636e-15 20 3.55271e-15 L 80 0 L 80 0 C 91.0457 6.76354e-16 100 8.9543 100 20 L 100 22.5 L 100 22.5 C 100 32.165 92.165 40 82.5 40 L 82.5 40 L 82.5 40 C 72.835 40 65 47.835 65 57.5 L 65 72.5 L 65 72.5 C 65 76.6421 68.3579 80 72.5 80 L 72.5 80 L 72.5 80 C 76.6421 80 80 83.3579 80 87.5 L 80 100 L 80 100 C 80 111.046 71.0457 120 60 120 L 40 120 L 40 120 C 28.9543 120 20 111.046 20 100 L 20 87.5 L 20 87.5 C 20 83.3579 23.3579 80 27.5 80 L 27.5 80 L 27.5 80 C 31.6421 80 35 76.6421 35 72.5 L 35 57.5 L 35 57.5 C 35 47.835 27.165 40 17.5 40 L 17.5 40 L 17.5 40 C 7.83502 40 1.18362e-15 32.165 0 22.5 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(750, 500)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;20&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;20&quot; y=&quot;20&quot; width=&quot;20&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;40&quot; width=&quot;20&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 8 L 0 8 C 5.41083e-16 3.58172 3.58172 1.50582e-15 8 1.77636e-15 L 12 0 L 12 0 C 16.4183 2.70542e-16 20 3.58172 20 8 L 20 12 L 20 12 C 20 16.4183 23.5817 20 28 20 L 32 20 L 32 20 C 36.4183 20 40 23.5817 40 28 L 40 52 L 40 52 C 40 56.4183 36.4183 60 32 60 L 28 60 L 28 60 C 23.5817 60 20 63.5817 20 68 L 20 72 L 20 72 C 20 76.4183 16.4183 80 12 80 L 8 80 L 8 80 C 3.58172 80 5.41083e-16 76.4183 0 72 L 0 48 L 8.88178e-16 40 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(400, 300)&quot;&gt;
+        &lt;rect x=&quot;30&quot; y=&quot;0&quot; width=&quot;40&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;60&quot; y=&quot;40&quot; width=&quot;40&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;30&quot; y=&quot;80&quot; width=&quot;40&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;40&quot; width=&quot;40&quot; height=&quot;40&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 30 8 L 30 8 C 30 3.58172 33.5817 1.50582e-15 38 1.77636e-15 L 62 0 L 62 0 C 66.4183 2.70542e-16 70 3.58172 70 8 L 70 32 L 70 32 C 70 36.4183 73.5817 40 78 40 L 92 40 L 92 40 C 96.4183 40 100 43.5817 100 48 L 100 72 L 100 72 C 100 76.4183 96.4183 80 92 80 L 78 80 L 78 80 C 73.5817 80 70 83.5817 70 88 L 70 112 L 70 112 C 70 116.418 66.4183 120 62 120 L 38 120 L 38 120 C 33.5817 120 30 116.418 30 112 L 30 88 L 30 88 C 30 83.5817 26.4183 80 22 80 L 8 80 L 8 80 C 3.58172 80 5.41083e-16 76.4183 0 72 L 0 48 L 0 48 C 5.41083e-16 43.5817 3.58172 40 8 40 L 22 40 L 22 40 C 26.4183 40 30 36.4183 30 32 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(520, 450)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;50&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;15&quot; width=&quot;35&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;30&quot; width=&quot;20&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 7.5 L 0 7.5 C 5.07265e-16 3.35786 3.35786 6.66106e-16 7.5 0 L 42 0 L 42 0 C 46.4183 2.70542e-16 50 3.58172 50 8 L 50 12.5 L 50 12.5 C 50 16.6421 46.6421 20 42.5 20 L 42.5 20 L 42.5 20 C 38.3579 20 35 23.3579 35 27.5 L 35 27.5 L 35 27.5 C 35 31.6421 31.6421 35 27.5 35 L 27.5 35 L 27.5 35 C 23.3579 35 20 38.3579 20 42.5 L 20 42.5 L 20 42.5 C 20 46.6421 16.6421 50 12.5 50 L 7.5 50 L 7.5 50 C 3.35786 50 1.39544e-15 46.6421 8.88178e-16 42.5 L 0 37.5 L 0 35 L 0 32.5 L 0 30 L 0 22.5 L 0 20 L 0 17.5 L 0 15 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(520, 520)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;20&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;15&quot; width=&quot;35&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;30&quot; width=&quot;50&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 7.5 L 0 7.5 C 5.07265e-16 3.35786 3.35786 6.66106e-16 7.5 0 L 12.5 0 L 12.5 0 C 16.6421 2.53633e-16 20 3.35786 20 7.5 L 20 7.5 L 20 7.5 C 20 11.6421 23.3579 15 27.5 15 L 27.5 15 L 27.5 15 C 31.6421 15 35 18.3579 35 22.5 L 35 22.5 L 35 22.5 C 35 26.6421 38.3579 30 42.5 30 L 42.5 30 L 42.5 30 C 46.6421 30 50 33.3579 50 37.5 L 50 42 L 50 42 C 50 46.4183 46.4183 50 42 50 L 7.5 50 L 7.5 50 C 3.35786 50 1.39544e-15 46.6421 8.88178e-16 42.5 L 0 37.5 L 0 35 L 0 32.5 L 0 30 L 0 22.5 L 0 20 L 0 17.5 L 0 15 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(580, 450)&quot;&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;0&quot; width=&quot;50&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;15&quot; y=&quot;15&quot; width=&quot;35&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;30&quot; y=&quot;30&quot; width=&quot;20&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 0 8 L 0 8 C 5.41083e-16 3.58172 3.58172 1.50582e-15 8 1.77636e-15 L 42.5 0 L 42.5 0 C 46.6421 2.53633e-16 50 3.35786 50 7.5 L 50 12.5 L 50 15 L 50 17.5 L 50 20 L 50 27.5 L 50 30 L 50 32.5 L 50 35 L 50 42.5 L 50 42.5 C 50 46.6421 46.6421 50 42.5 50 L 37.5 50 L 37.5 50 C 33.3579 50 30 46.6421 30 42.5 L 30 42.5 L 30 42.5 C 30 38.3579 26.6421 35 22.5 35 L 22.5 35 L 22.5 35 C 18.3579 35 15 31.6421 15 27.5 L 15 27.5 L 15 27.5 C 15 23.3579 11.6421 20 7.5 20 L 7.5 20 L 7.5 20 C 3.35786 20 1.39544e-15 16.6421 8.88178e-16 12.5 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+    &lt;/g&gt;
+    &lt;g transform=&quot;translate(580, 520)&quot;&gt;
+        &lt;rect x=&quot;30&quot; y=&quot;0&quot; width=&quot;20&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;15&quot; y=&quot;15&quot; width=&quot;35&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;rect x=&quot;0&quot; y=&quot;30&quot; width=&quot;50&quot; height=&quot;20&quot; fill=&quot;rgba(0, 0, 0, 0.2)&quot; stroke=&quot;rgba(0, 0, 0, 0.5)&quot;&gt;&lt;/rect&gt;
+        &lt;path d=&quot;M 30 7.5 L 30 7.5 C 30 3.35786 33.3579 6.66106e-16 37.5 0 L 42.5 0 L 42.5 0 C 46.6421 2.53633e-16 50 3.35786 50 7.5 L 50 12.5 L 50 15 L 50 17.5 L 50 20 L 50 27.5 L 50 30 L 50 32.5 L 50 35 L 50 42.5 L 50 42.5 C 50 46.6421 46.6421 50 42.5 50 L 8 50 L 8 50 C 3.58172 50 5.41083e-16 46.4183 0 42 L 0 37.5 L 0 37.5 C 5.07265e-16 33.3579 3.35786 30 7.5 30 L 7.5 30 L 7.5 30 C 11.6421 30 15 26.6421 15 22.5 L 15 22.5 L 15 22.5 C 15 18.3579 18.3579 15 22.5 15 L 22.5 15 L 22.5 15 C 26.6421 15 30 11.6421 30 7.5 Z&quot; fill=&quot;none&quot; stroke=&quot;blue&quot; stroke-width=&quot;3&quot;&gt;&lt;/path&gt;
+&lt;/g&gt;
+&lt;/svg&gt;
</ins></span></pre></div>
<a id="trunkLayoutTestsfastshrinkwraprectshrinkwrapexpectedpng"></a>
<div class="binary"><h4>Deleted: trunk/LayoutTests/fast/shrink-wrap/rect-shrink-wrap-expected.png</h4>
<pre class="diff"><span>
<span class="cx">(Binary files differ)
</span></span></pre></div>
<a id="trunkLayoutTestsfastshrinkwraprectshrinkwrapexpectedtxt"></a>
<div class="delfile"><h4>Deleted: trunk/LayoutTests/fast/shrink-wrap/rect-shrink-wrap-expected.txt (187017 => 187018)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/shrink-wrap/rect-shrink-wrap-expected.txt        2015-07-19 23:37:45 UTC (rev 187017)
+++ trunk/LayoutTests/fast/shrink-wrap/rect-shrink-wrap-expected.txt        2015-07-20 06:38:40 UTC (rev 187018)
</span><span class="lines">@@ -1,8 +0,0 @@
</span><del>-layer at (0,0) size 800x600
-  RenderView at (0,0) size 800x600
-layer at (0,0) size 800x600
-  RenderBlock {HTML} at (0,0) size 800x600
-    RenderBody {BODY} at (0,0) size 800x600
-      RenderText {#text} at (0,0) size 0x0
-layer at (0,0) size 800x600
-  RenderHTMLCanvas {CANVAS} at (0,0) size 800x600
</del></span></pre></div>
<a id="trunkLayoutTestsfastshrinkwraprectshrinkwraphtml"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/fast/shrink-wrap/rect-shrink-wrap.html (187017 => 187018)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/shrink-wrap/rect-shrink-wrap.html        2015-07-19 23:37:45 UTC (rev 187017)
+++ trunk/LayoutTests/fast/shrink-wrap/rect-shrink-wrap.html        2015-07-20 06:38:40 UTC (rev 187018)
</span><span class="lines">@@ -1,43 +1,39 @@
</span><span class="cx"> &lt;script&gt;
</span><span class="cx"> 
</span><del>-function testRects(offset, rects, radius) {
-    if (!window.internals)
</del><ins>+if (!window.internals)
</ins><span class="cx">         document.write(&quot;This test must be run in a test runner.&quot;)
</span><span class="cx"> 
</span><ins>+function testRects(offset, rects, radius) {
</ins><span class="cx">     if (radius == undefined)
</span><span class="cx">         radius = 8;
</span><span class="cx"> 
</span><del>-    var concatRects = [];
-    for (var i in rects)
-        Array.prototype.push.apply(concatRects, rects[i]);
</del><ins>+    var gElement = document.createElementNS(&quot;http://www.w3.org/2000/svg&quot;, &quot;g&quot;);
+    gElement.setAttribute(&quot;transform&quot;, &quot;translate(&quot; + offset[0] + &quot;, &quot; + offset[1] + &quot;)&quot;);
+    document.getElementById(&quot;paths&quot;).appendChild(gElement);
</ins><span class="cx"> 
</span><del>-    var path = undefined;
-    if (window.internals)
-        path = window.internals.pathWithShrinkWrappedRects(concatRects, radius);
</del><ins>+    for (var i in rects) {
+        var rectElement = document.createElementNS(&quot;http://www.w3.org/2000/svg&quot;, &quot;rect&quot;);
+        rectElement.setAttribute(&quot;x&quot;, rects[i][0]);
+        rectElement.setAttribute(&quot;y&quot;, rects[i][1]);
+        rectElement.setAttribute(&quot;width&quot;, rects[i][2]);
+        rectElement.setAttribute(&quot;height&quot;, rects[i][3]);
+        rectElement.setAttribute(&quot;fill&quot;, &quot;rgba(0, 0, 0, 0.2)&quot;);
+        rectElement.setAttribute(&quot;stroke&quot;, &quot;rgba(0, 0, 0, 0.5)&quot;);
+        gElement.appendChild(rectElement);
+    }
</ins><span class="cx"> 
</span><del>-    var canvas = document.getElementById(&quot;shrink&quot;);
-    var ctx = canvas.getContext(&quot;2d&quot;);
-
-    ctx.save();
-
-    ctx.translate.apply(ctx, offset);
-
-    ctx.fillStyle = &quot;rgba(0,0,0,0.2)&quot;;
-
-    for (var i in rects)
-        ctx.fillRect.apply(ctx, rects[i]);
-
-    ctx.strokeStyle = &quot;rgba(0,0,0,0.5)&quot;;
-    ctx.lineWidth = 1;
-    for (var i in rects)
-        ctx.strokeRect.apply(ctx, rects[i]);
-
-    ctx.strokeStyle = &quot;blue&quot;;
-    ctx.lineWidth = 3;
-    if (path)
-        ctx.stroke(path);
-
-    ctx.restore();
</del><ins>+    if (window.internals) {
+        var concatRects = [];
+        for (var i in rects)
+            Array.prototype.push.apply(concatRects, rects[i]);
+        var pathString = window.internals.pathStringWithShrinkWrappedRects(concatRects, radius);
+        var pathElement = document.createElementNS(&quot;http://www.w3.org/2000/svg&quot;, &quot;path&quot;);
+        pathElement.setAttribute(&quot;d&quot;, pathString)
+        pathElement.setAttribute(&quot;fill&quot;, &quot;none&quot;);
+        pathElement.setAttribute(&quot;stroke&quot;, &quot;blue&quot;);
+        pathElement.setAttribute(&quot;stroke-width&quot;, &quot;3&quot;);
+        gElement.appendChild(pathElement);
+    }
</ins><span class="cx"> }
</span><span class="cx"> 
</span><span class="cx"> window.onload = function () {
</span><span class="lines">@@ -243,4 +239,4 @@
</span><span class="cx"> }
</span><span class="cx"> &lt;/style&gt;
</span><span class="cx"> 
</span><del>-&lt;canvas id=&quot;shrink&quot; width=&quot;800&quot; height=&quot;600&quot;&gt;&lt;/canvas&gt;
</del><ins>+&lt;svg id=&quot;paths&quot; width=&quot;800&quot; height=&quot;600&quot;&gt;&lt;/svg&gt;
</ins><span class="cx">\ No newline at end of file
</span></span></pre></div>
<a id="trunkSourceWebCoreChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/ChangeLog (187017 => 187018)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/ChangeLog        2015-07-19 23:37:45 UTC (rev 187017)
+++ trunk/Source/WebCore/ChangeLog        2015-07-20 06:38:40 UTC (rev 187018)
</span><span class="lines">@@ -1,3 +1,24 @@
</span><ins>+2015-07-19  Tim Horton  &lt;timothy_horton@apple.com&gt;
+
+        Make shrink-wrapping test a ref-test instead of pixel-test
+        https://bugs.webkit.org/show_bug.cgi?id=147081
+
+        Reviewed by Sam Weinig.
+
+        Nobody runs pixel tests.
+
+        * svg/SVGPathUtilities.cpp:
+        (WebCore::pathIteratorForBuildingString):
+        (WebCore::buildStringFromPath):
+        * svg/SVGPathUtilities.h:
+        Add a helper that turns a Path into a SVG path string.
+
+        * testing/Internals.cpp:
+        (WebCore::Internals::pathStringWithShrinkWrappedRects):
+        * testing/Internals.h:
+        * testing/Internals.idl:
+        Have the internals shrink-wrap method return an SVG path instead of a DOMPath.
+
</ins><span class="cx"> 2015-07-19  David Kilzer  &lt;ddkilzer@apple.com&gt;
</span><span class="cx"> 
</span><span class="cx">         REGRESSION (r187008): CGPathCreateMutableCopyByTransformingPath() is not available on Windows
</span></span></pre></div>
<a id="trunkSourceWebCoresvgSVGPathUtilitiescpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/svg/SVGPathUtilities.cpp (187017 => 187018)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/svg/SVGPathUtilities.cpp        2015-07-19 23:37:45 UTC (rev 187017)
+++ trunk/Source/WebCore/svg/SVGPathUtilities.cpp        2015-07-20 06:38:40 UTC (rev 187018)
</span><span class="lines">@@ -26,6 +26,7 @@
</span><span class="cx"> #include &quot;SVGPathBuilder.h&quot;
</span><span class="cx"> #include &quot;SVGPathByteStreamBuilder.h&quot;
</span><span class="cx"> #include &quot;SVGPathByteStreamSource.h&quot;
</span><ins>+#include &quot;SVGPathConsumer.h&quot;
</ins><span class="cx"> #include &quot;SVGPathElement.h&quot;
</span><span class="cx"> #include &quot;SVGPathParser.h&quot;
</span><span class="cx"> #include &quot;SVGPathSegListBuilder.h&quot;
</span><span class="lines">@@ -330,4 +331,44 @@
</span><span class="cx">     return ok;
</span><span class="cx"> }
</span><span class="cx"> 
</span><ins>+static void pathIteratorForBuildingString(void* info, const PathElement* pathElement)
+{
+    SVGPathConsumer* consumer = static_cast&lt;SVGPathConsumer*&gt;(info);
+
+    switch (pathElement-&gt;type) {
+    case PathElementMoveToPoint:
+        consumer-&gt;moveTo(pathElement-&gt;points[0], false, AbsoluteCoordinates);
+        break;
+    case PathElementAddLineToPoint:
+        consumer-&gt;lineTo(pathElement-&gt;points[0], AbsoluteCoordinates);
+        break;
+    case PathElementAddQuadCurveToPoint:
+        consumer-&gt;curveToQuadratic(pathElement-&gt;points[0], pathElement-&gt;points[1], AbsoluteCoordinates);
+        break;
+    case PathElementAddCurveToPoint:
+        consumer-&gt;curveToCubic(pathElement-&gt;points[0], pathElement-&gt;points[1], pathElement-&gt;points[2], AbsoluteCoordinates);
+        break;
+    case PathElementCloseSubpath:
+        consumer-&gt;closePath();
+        break;
+
+    default:
+        ASSERT_NOT_REACHED();
+        break;
+    }
</ins><span class="cx"> }
</span><ins>+
+bool buildStringFromPath(const Path&amp; path, String&amp; string)
+{
+    // Ideally we would have a SVGPathPlatformPathSource, but it's not possible to manually iterate
+    // a path, only apply a function to all path elements at once.
+
+    SVGPathStringBuilder* builder = globalSVGPathStringBuilder();
+    path.apply(builder, &amp;pathIteratorForBuildingString);
+    string = builder-&gt;result();
+    static_cast&lt;SVGPathConsumer*&gt;(builder)-&gt;cleanup();
+
+    return true;
+}
+
+}
</ins></span></pre></div>
<a id="trunkSourceWebCoresvgSVGPathUtilitiesh"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/svg/SVGPathUtilities.h (187017 => 187018)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/svg/SVGPathUtilities.h        2015-07-19 23:37:45 UTC (rev 187017)
+++ trunk/Source/WebCore/svg/SVGPathUtilities.h        2015-07-20 06:38:40 UTC (rev 187018)
</span><span class="lines">@@ -55,6 +55,9 @@
</span><span class="cx"> bool getTotalLengthOfSVGPathByteStream(SVGPathByteStream*, float&amp; totalLength);
</span><span class="cx"> bool getPointAtLengthOfSVGPathByteStream(SVGPathByteStream*, float length, SVGPoint&amp;);
</span><span class="cx"> 
</span><ins>+// Path -&gt; String
+WEBCORE_EXPORT bool buildStringFromPath(const Path&amp;, String&amp;);
+
</ins><span class="cx"> } // namespace WebCore
</span><span class="cx"> 
</span><span class="cx"> #endif // SVGPathUtilities_h
</span></span></pre></div>
<a id="trunkSourceWebCoretestingInternalscpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/testing/Internals.cpp (187017 => 187018)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/testing/Internals.cpp        2015-07-19 23:37:45 UTC (rev 187017)
+++ trunk/Source/WebCore/testing/Internals.cpp        2015-07-20 06:38:40 UTC (rev 187018)
</span><span class="lines">@@ -2982,11 +2982,11 @@
</span><span class="cx">     return testPreloadScannerViewportSupport(contextDocument());
</span><span class="cx"> }
</span><span class="cx"> 
</span><del>-PassRefPtr&lt;DOMPath&gt; Internals::pathWithShrinkWrappedRects(Vector&lt;double&gt; rectComponents, double radius, ExceptionCode&amp; ec)
</del><ins>+String Internals::pathStringWithShrinkWrappedRects(Vector&lt;double&gt; rectComponents, double radius, ExceptionCode&amp; ec)
</ins><span class="cx"> {
</span><span class="cx">     if (rectComponents.size() % 4) {
</span><span class="cx">         ec = INVALID_ACCESS_ERR;
</span><del>-        return nullptr;
</del><ins>+        return String();
</ins><span class="cx">     }
</span><span class="cx"> 
</span><span class="cx">     Vector&lt;FloatRect&gt; rects;
</span><span class="lines">@@ -3002,7 +3002,11 @@
</span><span class="cx">     rects.reverse();
</span><span class="cx"> 
</span><span class="cx">     Path path = PathUtilities::pathWithShrinkWrappedRects(rects, radius);
</span><del>-    return DOMPath::create(path);
</del><ins>+
+    String pathString;
+    buildStringFromPath(path, pathString);
+
+    return pathString;
</ins><span class="cx"> }
</span><span class="cx"> 
</span><span class="cx"> }
</span></span></pre></div>
<a id="trunkSourceWebCoretestingInternalsh"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/testing/Internals.h (187017 => 187018)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/testing/Internals.h        2015-07-19 23:37:45 UTC (rev 187017)
+++ trunk/Source/WebCore/testing/Internals.h        2015-07-20 06:38:40 UTC (rev 187018)
</span><span class="lines">@@ -424,7 +424,7 @@
</span><span class="cx">     String scrollSnapOffsets(Element*, ExceptionCode&amp;);
</span><span class="cx"> #endif
</span><span class="cx"> 
</span><del>-    PassRefPtr&lt;DOMPath&gt; pathWithShrinkWrappedRects(Vector&lt;double&gt; rectComponents, double radius, ExceptionCode&amp;);
</del><ins>+    String pathStringWithShrinkWrappedRects(Vector&lt;double&gt; rectComponents, double radius, ExceptionCode&amp;);
</ins><span class="cx"> 
</span><span class="cx"> private:
</span><span class="cx">     explicit Internals(Document*);
</span></span></pre></div>
<a id="trunkSourceWebCoretestingInternalsidl"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/testing/Internals.idl (187017 => 187018)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/testing/Internals.idl        2015-07-19 23:37:45 UTC (rev 187017)
+++ trunk/Source/WebCore/testing/Internals.idl        2015-07-20 06:38:40 UTC (rev 187018)
</span><span class="lines">@@ -387,5 +387,5 @@
</span><span class="cx">     [RaisesException] DOMString scrollSnapOffsets(Element element);
</span><span class="cx"> #endif
</span><span class="cx"> 
</span><del>-    [RaisesException] DOMPath pathWithShrinkWrappedRects(sequence&lt;double&gt; rectComponents, double radius);
</del><ins>+    [RaisesException] DOMString pathStringWithShrinkWrappedRects(sequence&lt;double&gt; rectComponents, double radius);
</ins><span class="cx"> };
</span></span></pre>
</div>
</div>

</body>
</html>