<!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>[245728] trunk/Source/WebCore</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/245728">245728</a></dd>
<dt>Author</dt> <dd>drousso@apple.com</dd>
<dt>Date</dt> <dd>2019-05-23 17:10:09 -0700 (Thu, 23 May 2019)</dd>
</dl>

<h3>Log Message</h3>
<pre>Web Inspector: Overlay: rulers should switch sides if they intersect the highlighted node(s) so they don't obstruct any content
https://bugs.webkit.org/show_bug.cgi?id=198165

Reviewed by Timothy Hatcher.

If the highlighted node is against the top edge of the screen, the top ruler should shift to
the bottom, unless the highlighted node is also against the bottom edge of the screen.

If the highlighted node is against the left edge of the screen, the left ruler should shift
to the right, unless the highlighted node is also against the right edge of the screen.

This way, unless the node is very wide/tall, the rulers won't be drawn on top of anything
being highlighted.

* inspector/InspectorOverlay.h:
* inspector/InspectorOverlay.cpp:
(WebCore::InspectorOverlay::paint):
(WebCore::InspectorOverlay::drawNodeHighlight):
(WebCore::InspectorOverlay::drawQuadHighlight):
(WebCore::InspectorOverlay::drawBounds):
(WebCore::InspectorOverlay::drawRulers):
Drive-by: create an alias for the type (`FloatRect`) used when calculating the bounds of
          everything that's highlighted.</pre>

<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkSourceWebCoreChangeLog">trunk/Source/WebCore/ChangeLog</a></li>
<li><a href="#trunkSourceWebCoreinspectorInspectorOverlaycpp">trunk/Source/WebCore/inspector/InspectorOverlay.cpp</a></li>
<li><a href="#trunkSourceWebCoreinspectorInspectorOverlayh">trunk/Source/WebCore/inspector/InspectorOverlay.h</a></li>
</ul>

</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkSourceWebCoreChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/ChangeLog (245727 => 245728)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/ChangeLog   2019-05-23 23:41:56 UTC (rev 245727)
+++ trunk/Source/WebCore/ChangeLog      2019-05-24 00:10:09 UTC (rev 245728)
</span><span class="lines">@@ -1,3 +1,29 @@
</span><ins>+2019-05-23  Devin Rousso  <drousso@apple.com>
+
+        Web Inspector: Overlay: rulers should switch sides if they intersect the highlighted node(s) so they don't obstruct any content
+        https://bugs.webkit.org/show_bug.cgi?id=198165
+
+        Reviewed by Timothy Hatcher.
+
+        If the highlighted node is against the top edge of the screen, the top ruler should shift to
+        the bottom, unless the highlighted node is also against the bottom edge of the screen.
+
+        If the highlighted node is against the left edge of the screen, the left ruler should shift
+        to the right, unless the highlighted node is also against the right edge of the screen.
+
+        This way, unless the node is very wide/tall, the rulers won't be drawn on top of anything
+        being highlighted.
+
+        * inspector/InspectorOverlay.h:
+        * inspector/InspectorOverlay.cpp:
+        (WebCore::InspectorOverlay::paint):
+        (WebCore::InspectorOverlay::drawNodeHighlight):
+        (WebCore::InspectorOverlay::drawQuadHighlight):
+        (WebCore::InspectorOverlay::drawBounds):
+        (WebCore::InspectorOverlay::drawRulers):
+        Drive-by: create an alias for the type (`FloatRect`) used when calculating the bounds of
+                  everything that's highlighted.
+
</ins><span class="cx"> 2019-05-23  Saam barati  <sbarati@apple.com>
</span><span class="cx"> 
</span><span class="cx">         [WHLSL] Make the AST dumper disambiguate expressions using parenthesis to represent AST construction
</span></span></pre></div>
<a id="trunkSourceWebCoreinspectorInspectorOverlaycpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/inspector/InspectorOverlay.cpp (245727 => 245728)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/inspector/InspectorOverlay.cpp      2019-05-23 23:41:56 UTC (rev 245727)
+++ trunk/Source/WebCore/inspector/InspectorOverlay.cpp 2019-05-24 00:10:09 UTC (rev 245728)
</span><span class="lines">@@ -198,7 +198,7 @@
</span><span class="cx">     highlight.quads.append(quad);
</span><span class="cx"> }
</span><span class="cx"> 
</span><del>-static Path quadToPath(const FloatQuad& quad, FloatRect& bounds)
</del><ins>+static Path quadToPath(const FloatQuad& quad, Highlight::Bounds& bounds)
</ins><span class="cx"> {
</span><span class="cx">     Path path;
</span><span class="cx">     path.moveTo(quad.p1());
</span><span class="lines">@@ -212,7 +212,7 @@
</span><span class="cx">     return path;
</span><span class="cx"> }
</span><span class="cx"> 
</span><del>-static void drawOutlinedQuadWithClip(GraphicsContext& context, const FloatQuad& quad, const FloatQuad& clipQuad, const Color& fillColor, FloatRect& bounds)
</del><ins>+static void drawOutlinedQuadWithClip(GraphicsContext& context, const FloatQuad& quad, const FloatQuad& clipQuad, const Color& fillColor, Highlight::Bounds& bounds)
</ins><span class="cx"> {
</span><span class="cx">     GraphicsContextStateSaver stateSaver(context);
</span><span class="cx"> 
</span><span class="lines">@@ -225,7 +225,7 @@
</span><span class="cx">     context.fillPath(quadToPath(clipQuad, bounds));
</span><span class="cx"> }
</span><span class="cx"> 
</span><del>-static void drawOutlinedQuad(GraphicsContext& context, const FloatQuad& quad, const Color& fillColor, const Color& outlineColor, FloatRect& bounds)
</del><ins>+static void drawOutlinedQuad(GraphicsContext& context, const FloatQuad& quad, const Color& fillColor, const Color& outlineColor, Highlight::Bounds& bounds)
</ins><span class="cx"> {
</span><span class="cx">     Path path = quadToPath(quad, bounds);
</span><span class="cx"> 
</span><span class="lines">@@ -242,7 +242,7 @@
</span><span class="cx">     context.strokePath(path);
</span><span class="cx"> }
</span><span class="cx"> 
</span><del>-static void drawFragmentHighlight(GraphicsContext& context, Node& node, const HighlightConfig& highlightConfig, FloatRect& bounds)
</del><ins>+static void drawFragmentHighlight(GraphicsContext& context, Node& node, const HighlightConfig& highlightConfig, Highlight::Bounds& bounds)
</ins><span class="cx"> {
</span><span class="cx">     Highlight highlight;
</span><span class="cx">     buildNodeHighlight(node, highlightConfig, highlight, InspectorOverlay::CoordinateSystem::Document);
</span><span class="lines">@@ -275,7 +275,7 @@
</span><span class="cx">         drawOutlinedQuad(context, contentQuad, highlight.contentColor, highlight.contentOutlineColor, bounds);
</span><span class="cx"> }
</span><span class="cx"> 
</span><del>-static void drawShapeHighlight(GraphicsContext& context, Node& node, FloatRect& bounds)
</del><ins>+static void drawShapeHighlight(GraphicsContext& context, Node& node, Highlight::Bounds& bounds)
</ins><span class="cx"> {
</span><span class="cx">     Element* element = effectiveElementForNode(node);
</span><span class="cx">     if (!element)
</span><span class="lines">@@ -387,24 +387,32 @@
</span><span class="cx">         context.fillRect({ FloatPoint::zero(), viewportSize });
</span><span class="cx">     }
</span><span class="cx"> 
</span><del>-    if (m_highlightQuad)
-        drawQuadHighlight(context, *m_highlightQuad);
</del><ins>+    Highlight::Bounds bounds;
</ins><span class="cx"> 
</span><ins>+    if (m_highlightQuad) {
+        auto quadBounds = drawQuadHighlight(context, *m_highlightQuad);
+        bounds.unite(quadBounds);
+    }
+
</ins><span class="cx">     if (m_highlightNodeList) {
</span><span class="cx">         for (unsigned i = 0; i < m_highlightNodeList->length(); ++i) {
</span><del>-            if (Node* node = m_highlightNodeList->item(i))
-                drawNodeHighlight(context, *node);
</del><ins>+            if (Node* node = m_highlightNodeList->item(i)) {
+                auto nodeBounds = drawNodeHighlight(context, *node);
+                bounds.unite(nodeBounds);
+            }
</ins><span class="cx">         }
</span><span class="cx">     }
</span><span class="cx"> 
</span><del>-    if (m_highlightNode)
-        drawNodeHighlight(context, *m_highlightNode);
</del><ins>+    if (m_highlightNode) {
+        auto nodeBounds = drawNodeHighlight(context, *m_highlightNode);
+        bounds.unite(nodeBounds);
+    }
</ins><span class="cx"> 
</span><span class="cx">     if (!m_paintRects.isEmpty())
</span><span class="cx">         drawPaintRects(context, m_paintRects);
</span><span class="cx"> 
</span><span class="cx">     if (m_showRulers)
</span><del>-        drawRulers(context);
</del><ins>+        drawRulers(context, bounds);
</ins><span class="cx"> }
</span><span class="cx"> 
</span><span class="cx"> void InspectorOverlay::getHighlight(Highlight& highlight, InspectorOverlay::CoordinateSystem coordinateSystem) const
</span><span class="lines">@@ -560,9 +568,9 @@
</span><span class="cx">         update();
</span><span class="cx"> }
</span><span class="cx"> 
</span><del>-void InspectorOverlay::drawNodeHighlight(GraphicsContext& context, Node& node)
</del><ins>+Highlight::Bounds InspectorOverlay::drawNodeHighlight(GraphicsContext& context, Node& node)
</ins><span class="cx"> {
</span><del>-    FloatRect bounds;
</del><ins>+    Highlight::Bounds bounds;
</ins><span class="cx"> 
</span><span class="cx">     drawFragmentHighlight(context, node, m_nodeHighlightConfig, bounds);
</span><span class="cx"> 
</span><span class="lines">@@ -575,21 +583,25 @@
</span><span class="cx">     // Ensure that the title information is drawn after the bounds.
</span><span class="cx">     if (m_nodeHighlightConfig.showInfo)
</span><span class="cx">         drawElementTitle(context, node, bounds);
</span><ins>+
+    return bounds;
</ins><span class="cx"> }
</span><span class="cx"> 
</span><del>-void InspectorOverlay::drawQuadHighlight(GraphicsContext& context, const FloatQuad& quad)
</del><ins>+Highlight::Bounds InspectorOverlay::drawQuadHighlight(GraphicsContext& context, const FloatQuad& quad)
</ins><span class="cx"> {
</span><ins>+    Highlight::Bounds bounds;
+
</ins><span class="cx">     Highlight highlight;
</span><span class="cx">     buildQuadHighlight(quad, m_quadHighlightConfig, highlight);
</span><span class="cx"> 
</span><span class="cx">     if (highlight.quads.size() >= 1) {
</span><del>-        FloatRect bounds;
-
</del><span class="cx">         drawOutlinedQuad(context, highlight.quads[0], highlight.contentColor, highlight.contentOutlineColor, bounds);
</span><span class="cx"> 
</span><span class="cx">         if (m_showRulers)
</span><span class="cx">             drawBounds(context, bounds);
</span><span class="cx">     }
</span><ins>+
+    return bounds;
</ins><span class="cx"> }
</span><span class="cx"> 
</span><span class="cx"> void InspectorOverlay::drawPaintRects(GraphicsContext& context, const Deque<TimeRectPair>& paintRects)
</span><span class="lines">@@ -603,7 +615,7 @@
</span><span class="cx">         context.fillRect(pair.second);
</span><span class="cx"> }
</span><span class="cx"> 
</span><del>-void InspectorOverlay::drawBounds(GraphicsContext& context, const FloatRect& bounds)
</del><ins>+void InspectorOverlay::drawBounds(GraphicsContext& context, const Highlight::Bounds& bounds)
</ins><span class="cx"> {
</span><span class="cx">     FrameView* pageView = m_page.mainFrame().view();
</span><span class="cx">     FloatSize viewportSize = pageView->sizeForVisibleContent();
</span><span class="lines">@@ -653,7 +665,7 @@
</span><span class="cx">     context.strokePath(path);
</span><span class="cx"> }
</span><span class="cx"> 
</span><del>-void InspectorOverlay::drawRulers(GraphicsContext& context)
</del><ins>+void InspectorOverlay::drawRulers(GraphicsContext& context, const Highlight::Bounds& bounds)
</ins><span class="cx"> {
</span><span class="cx">     const Color rulerBackgroundColor(1.0f, 1.0f, 1.0f, 0.6f);
</span><span class="cx">     const Color lightRulerColor(0.0f, 0.0f, 0.0f, 0.2f);
</span><span class="lines">@@ -693,21 +705,51 @@
</span><span class="cx">     float maxX = minX + width;
</span><span class="cx">     float maxY = minY + height;
</span><span class="cx"> 
</span><ins>+    bool drawTopEdge = true;
+    bool drawLeftEdge = true;
+
+    // Determine which side (top/bottom and left/right) to draw the rulers.
+    {
+        FloatRect topEdge(contentInset.width(), contentInset.height(), zoom(width) - contentInset.width(), rulerSize);
+        FloatRect bottomEdge(contentInset.width(), zoom(height) - rulerSize, zoom(width) - contentInset.width(), rulerSize);
+        drawTopEdge = !bounds.intersects(topEdge) || bounds.intersects(bottomEdge);
+
+        FloatRect rightEdge(zoom(width) - rulerSize, contentInset.height(), rulerSize, zoom(height) - contentInset.height());
+        FloatRect leftEdge(contentInset.width(), contentInset.height(), rulerSize, zoom(height) - contentInset.height());
+        drawLeftEdge = !bounds.intersects(leftEdge) || bounds.intersects(rightEdge);
+    }
+
+    float cornerX = drawLeftEdge ? contentInset.width() : zoom(width) - rulerSize;
+    float cornerY = drawTopEdge ? contentInset.height() : zoom(height) - rulerSize;
+
</ins><span class="cx">     // Draw backgrounds.
</span><span class="cx">     {
</span><span class="cx">         GraphicsContextStateSaver backgroundStateSaver(context);
</span><span class="cx"> 
</span><del>-        float offsetX = contentInset.width() + rulerSize;
-        float offsetY = contentInset.height() + rulerSize;
</del><ins>+        context.setFillColor(rulerBackgroundColor);
</ins><span class="cx"> 
</span><del>-        context.setFillColor(rulerBackgroundColor);
-        context.fillRect({ contentInset.width(), contentInset.height(), rulerSize, rulerSize });
-        context.fillRect({ offsetX, contentInset.height(), zoom(width) - offsetX, rulerSize });
-        context.fillRect({ contentInset.width(), offsetY, rulerSize, zoom(height) - offsetY });
</del><ins>+        context.fillRect({ cornerX, cornerY, rulerSize, rulerSize });
+
+        if (drawLeftEdge)
+            context.fillRect({ cornerX + rulerSize, cornerY, zoom(width) - cornerX - rulerSize, rulerSize });
+        else
+            context.fillRect({ contentInset.width(), cornerY, cornerX - contentInset.width(), rulerSize });
+
+        if (drawTopEdge)
+            context.fillRect({ cornerX, cornerY + rulerSize, rulerSize, zoom(height) - cornerY - rulerSize });  
+        else
+            context.fillRect({ cornerX, contentInset.height(), rulerSize, cornerY - contentInset.height() });
</ins><span class="cx">     }
</span><span class="cx"> 
</span><span class="cx">     // Draw lines.
</span><span class="cx">     {
</span><ins>+        FontCascadeDescription fontDescription;
+        fontDescription.setOneFamily(m_page.settings().sansSerifFontFamily());
+        fontDescription.setComputedSize(10);
+
+        FontCascade font(WTFMove(fontDescription), 0, 0);
+        font.update(nullptr);
+
</ins><span class="cx">         GraphicsContextStateSaver lineStateSaver(context);
</span><span class="cx"> 
</span><span class="cx">         context.setFillColor(darkRulerColor);
</span><span class="lines">@@ -717,7 +759,7 @@
</span><span class="cx">         {
</span><span class="cx">             GraphicsContextStateSaver horizontalRulerStateSaver(context);
</span><span class="cx"> 
</span><del>-            context.translate(contentInset.width() - scrollX + 0.5f, contentInset.height() - scrollY);
</del><ins>+            context.translate(contentInset.width() - scrollX + 0.5f, cornerY - scrollY);
</ins><span class="cx"> 
</span><span class="cx">             for (float x = multipleBelow(minX, rulerSubStepIncrement); x < maxX; x += rulerSubStepIncrement) {
</span><span class="cx">                 if (!x && !scrollX)
</span><span class="lines">@@ -724,18 +766,30 @@
</span><span class="cx">                     continue;
</span><span class="cx"> 
</span><span class="cx">                 Path path;
</span><del>-                path.moveTo({ zoom(x), scrollY });
</del><ins>+                path.moveTo({ zoom(x), drawTopEdge ? scrollY : scrollY + rulerSize });
</ins><span class="cx"> 
</span><ins>+                float lineLength = 0.0f;
</ins><span class="cx">                 if (std::fmod(x, rulerStepIncrement)) {
</span><ins>+                    lineLength = rulerSubStepLength;
</ins><span class="cx">                     context.setStrokeColor(lightRulerColor);
</span><del>-                    path.addLineTo({ zoom(x), scrollY + rulerSubStepLength });
</del><span class="cx">                 } else {
</span><ins>+                    lineLength = std::fmod(x, rulerStepIncrement * 2) ? rulerSubStepLength : rulerStepLength;
</ins><span class="cx">                     context.setStrokeColor(darkRulerColor);
</span><del>-                    path.addLineTo({ zoom(x), scrollY + (std::fmod(x, rulerStepIncrement * 2) ? rulerSubStepLength : rulerStepLength) });
</del><span class="cx">                 }
</span><ins>+                path.addLineTo({ zoom(x), scrollY + (drawTopEdge ? lineLength : rulerSize - lineLength) });
</ins><span class="cx"> 
</span><span class="cx">                 context.strokePath(path);
</span><span class="cx">             }
</span><ins>+
+            // Draw labels.
+            for (float x = multipleBelow(minX, rulerStepIncrement * 2); x < maxX; x += rulerStepIncrement * 2) {
+                if (!x && !scrollX)
+                    continue;
+
+                GraphicsContextStateSaver verticalLabelStateSaver(context);
+                context.translate(zoom(x) + 0.5f, scrollY);
+                context.drawText(font, TextRun(String::numberToStringFixedPrecision(x)), { 2, drawTopEdge ? rulerLabelSize : rulerLabelSize - rulerSize + font.fontMetrics().height() - 1.0f });
+            }
</ins><span class="cx">         }
</span><span class="cx"> 
</span><span class="cx">         // Draw vertical ruler.
</span><span class="lines">@@ -742,7 +796,7 @@
</span><span class="cx">         {
</span><span class="cx">             GraphicsContextStateSaver veritcalRulerStateSaver(context);
</span><span class="cx"> 
</span><del>-            context.translate(contentInset.width() - scrollX, contentInset.height() - scrollY + 0.5f);
</del><ins>+            context.translate(cornerX - scrollX, contentInset.height() - scrollY + 0.5f);
</ins><span class="cx"> 
</span><span class="cx">             for (float y = multipleBelow(minY, rulerSubStepIncrement); y < maxY; y += rulerSubStepIncrement) {
</span><span class="cx">                 if (!y && !scrollY)
</span><span class="lines">@@ -749,42 +803,22 @@
</span><span class="cx">                     continue;
</span><span class="cx"> 
</span><span class="cx">                 Path path;
</span><del>-                path.moveTo({ scrollX, zoom(y) });
</del><ins>+                path.moveTo({ drawLeftEdge ? scrollX : scrollX + rulerSize, zoom(y) });
</ins><span class="cx"> 
</span><ins>+                float lineLength = 0.0f;
</ins><span class="cx">                 if (std::fmod(y, rulerStepIncrement)) {
</span><ins>+                    lineLength = rulerSubStepLength;
</ins><span class="cx">                     context.setStrokeColor(lightRulerColor);
</span><del>-                    path.addLineTo({ scrollX + rulerSubStepLength, zoom(y) });
</del><span class="cx">                 } else {
</span><ins>+                    lineLength = std::fmod(y, rulerStepIncrement * 2) ? rulerSubStepLength : rulerStepLength;
</ins><span class="cx">                     context.setStrokeColor(darkRulerColor);
</span><del>-                    path.addLineTo({ scrollX + (std::fmod(y, rulerStepIncrement * 2) ? rulerSubStepLength : rulerStepLength), zoom(y) });
</del><span class="cx">                 }
</span><ins>+                path.addLineTo({ scrollX + (drawLeftEdge ? lineLength : rulerSize - lineLength), zoom(y) });
</ins><span class="cx"> 
</span><span class="cx">                 context.strokePath(path);
</span><span class="cx">             }
</span><del>-        }
</del><span class="cx"> 
</span><del>-        // Draw labels.
-        {
-            GraphicsContextStateSaver labelStateSaver(context);
-
-            FontCascadeDescription fontDescription;
-            fontDescription.setOneFamily(m_page.settings().sansSerifFontFamily());
-            fontDescription.setComputedSize(10);
-
-            FontCascade font(WTFMove(fontDescription), 0, 0);
-            font.update(nullptr);
-
-            context.translate(contentInset.width() - scrollX, contentInset.height() - scrollY);
-
-            for (float x = multipleBelow(minX, rulerStepIncrement * 2); x < maxX; x += rulerStepIncrement * 2) {
-                if (!x && !scrollX)
-                    continue;
-
-                GraphicsContextStateSaver verticalLabelStateSaver(context);
-                context.translate(zoom(x) + 0.5f, scrollY);
-                context.drawText(font, TextRun(String::numberToStringFixedPrecision(x)), { 2, rulerLabelSize });
-            }
-
</del><ins>+            // Draw labels.
</ins><span class="cx">             for (float y = multipleBelow(minY, rulerStepIncrement * 2); y < maxY; y += rulerStepIncrement * 2) {
</span><span class="cx">                 if (!y && !scrollY)
</span><span class="cx">                     continue;
</span><span class="lines">@@ -791,14 +825,14 @@
</span><span class="cx"> 
</span><span class="cx">                 GraphicsContextStateSaver horizontalLabelStateSaver(context);
</span><span class="cx">                 context.translate(scrollX, zoom(y) + 0.5f);
</span><del>-                context.rotate(-piOverTwoFloat);
-                context.drawText(font, TextRun(String::numberToStringFixedPrecision(y)), { 2, rulerLabelSize });
</del><ins>+                context.rotate(drawLeftEdge ? -piOverTwoFloat : piOverTwoFloat);
+                context.drawText(font, TextRun(String::numberToStringFixedPrecision(y)), { 2, drawLeftEdge ? rulerLabelSize : rulerLabelSize - rulerSize });
</ins><span class="cx">             }
</span><span class="cx">         }
</span><span class="cx">     }
</span><span class="cx"> }
</span><span class="cx"> 
</span><del>-void InspectorOverlay::drawElementTitle(GraphicsContext& context, Node& node, const FloatRect& bounds)
</del><ins>+void InspectorOverlay::drawElementTitle(GraphicsContext& context, Node& node, const Highlight::Bounds& bounds)
</ins><span class="cx"> {
</span><span class="cx">     if (bounds.isEmpty())
</span><span class="cx">         return;
</span></span></pre></div>
<a id="trunkSourceWebCoreinspectorInspectorOverlayh"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/inspector/InspectorOverlay.h (245727 => 245728)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/inspector/InspectorOverlay.h        2019-05-23 23:41:56 UTC (rev 245727)
+++ trunk/Source/WebCore/inspector/InspectorOverlay.h   2019-05-24 00:10:09 UTC (rev 245728)
</span><span class="lines">@@ -87,6 +87,8 @@
</span><span class="cx">     HighlightType type {HighlightType::Node};
</span><span class="cx">     Vector<FloatQuad> quads;
</span><span class="cx">     bool usePageCoordinates {true};
</span><ins>+
+    using Bounds = FloatRect;
</ins><span class="cx"> };
</span><span class="cx"> 
</span><span class="cx"> class InspectorOverlay {
</span><span class="lines">@@ -125,13 +127,13 @@
</span><span class="cx"> 
</span><span class="cx">     bool shouldShowOverlay() const;
</span><span class="cx"> 
</span><del>-    void drawNodeHighlight(GraphicsContext&, Node&);
-    void drawQuadHighlight(GraphicsContext&, const FloatQuad&);
</del><ins>+    Highlight::Bounds drawNodeHighlight(GraphicsContext&, Node&);
+    Highlight::Bounds drawQuadHighlight(GraphicsContext&, const FloatQuad&);
</ins><span class="cx">     void drawPaintRects(GraphicsContext&, const Deque<TimeRectPair>&);
</span><del>-    void drawBounds(GraphicsContext&, const FloatRect&);
-    void drawRulers(GraphicsContext&);
</del><ins>+    void drawBounds(GraphicsContext&, const Highlight::Bounds&);
+    void drawRulers(GraphicsContext&, const Highlight::Bounds&);
</ins><span class="cx"> 
</span><del>-    void drawElementTitle(GraphicsContext&, Node&, const FloatRect& bounds);
</del><ins>+    void drawElementTitle(GraphicsContext&, Node&, const Highlight::Bounds&);
</ins><span class="cx"> 
</span><span class="cx">     void updatePaintRectsTimerFired();
</span><span class="cx"> 
</span></span></pre>
</div>
</div>

</body>
</html>