Changeset 273155 in webkit

Timestamp:

Feb 19, 2021 12:01:31 PM (17 months ago)

Author:

Patrick Angle

Message:

Web Inspector: Implement Grid Overlay "Show line names" drawing
​https://bugs.webkit.org/show_bug.cgi?id=222006
<rdar://problem/74409722>

Reviewed by BJ Burg.

Add support for showing line names to the grid overlay, including explicit, auto-repeated, and implicit names.

• inspector/InspectorOverlay.cpp:

(WebCore::gridLineNames):

• Gather the grid line names for a grid from the multiple possible sources.

(WebCore::InspectorOverlay::drawGridOverlay):

• Support showing grid line name labels.
• Refactored line number label drawing to share a common structure with line name label drawing.

Location:

trunk/Source/WebCore

Files:

• ChangeLog (modified) (1 diff)
• inspector/InspectorOverlay.cpp (modified) (5 diffs)

trunk/Source/WebCore/ChangeLog

@@ +1 @@
+2021-02-19  Patrick Angle  <pangle@apple.com>
+
+        Web Inspector: Implement Grid Overlay "Show line names" drawing
+        https://bugs.webkit.org/show_bug.cgi?id=222006
+        <rdar://problem/74409722>
+
+        Reviewed by BJ Burg.
+
+        Add support for showing line names to the grid overlay, including explicit, auto-repeated, and implicit names.
+
+        * inspector/InspectorOverlay.cpp:
+        (WebCore::gridLineNames):
+        - Gather the grid line names for a grid from the multiple possible sources.
+        (WebCore::InspectorOverlay::drawGridOverlay):
+        - Support showing grid line name labels.
+        - Refactored line number label drawing to share a common structure with line name label drawing.
+
 2021-02-19  Devin Rousso  <drousso@apple.com>
 

trunk/Source/WebCore/inspector/InspectorOverlay.cpp

@@ -64 +64 @@
 #include "RenderObject.h"
 #include "Settings.h"
+#include "StyleGridData.h"
 #include "StyleResolver.h"
 #include <wtf/MathExtras.h>
@@ -1332 +1333 @@
 }
 
+static OrderedNamedGridLinesMap gridLineNames(const RenderStyle* renderStyle, GridTrackSizingDirection direction, unsigned expectedLineCount)
+{
+    if (!renderStyle)
+        return { };
+    
+    OrderedNamedGridLinesMap combinedGridLineNames;
+    auto appendLineNames = [&](unsigned index, Vector<String> newNames) {
+        if (combinedGridLineNames.contains(index)) {
+            auto names = combinedGridLineNames.take(index);
+            names.appendVector(newNames);
+            combinedGridLineNames.add(index, names);
+        } else
+            combinedGridLineNames.add(index, newNames);
+    };
+    
+    auto orderedGridLineNames = direction == GridTrackSizingDirection::ForColumns ? renderStyle->orderedNamedGridColumnLines() : renderStyle->orderedNamedGridRowLines();
+    for (auto& [i, names] : orderedGridLineNames)
+        appendLineNames(i, names);
+    
+    auto autoRepeatOrderedGridLineNames = direction == GridTrackSizingDirection::ForColumns ? renderStyle->autoRepeatOrderedNamedGridColumnLines() : renderStyle->autoRepeatOrderedNamedGridRowLines();
+    auto autoRepeatInsertionPoint = direction == GridTrackSizingDirection::ForColumns ? renderStyle->gridAutoRepeatColumnsInsertionPoint() : renderStyle->gridAutoRepeatRowsInsertionPoint();
+    unsigned autoRepeatIndex = 0;
+    while (autoRepeatOrderedGridLineNames.size() && autoRepeatIndex < expectedLineCount - autoRepeatInsertionPoint) {
+        auto names = autoRepeatOrderedGridLineNames.get(autoRepeatIndex % autoRepeatOrderedGridLineNames.size());
+        auto lineIndex = autoRepeatIndex + autoRepeatInsertionPoint;
+        appendLineNames(lineIndex, names);
+        ++autoRepeatIndex;
+    }
+
+    auto implicitGridLineNames = direction == GridTrackSizingDirection::ForColumns ? renderStyle->implicitNamedGridColumnLines() : renderStyle->implicitNamedGridRowLines();
+    for (auto& [name, indexes] : implicitGridLineNames) {
+        for (auto i : indexes)
+            appendLineNames(i, {name});
+    }
+    
+    return combinedGridLineNames;
+}
+
 void InspectorOverlay::drawGridOverlay(GraphicsContext& context, const InspectorOverlay::Grid& gridOverlay)
 {
@@ -1395 +1434 @@
     // Draw columns and rows.
     auto columnWidths = renderGrid->trackSizesForComputedStyle(GridTrackSizingDirection::ForColumns);
+    auto columnLineNames = gridLineNames(node->renderStyle(), GridTrackSizingDirection::ForColumns, columnPositions.size());
     auto authoredTrackColumnSizes = authoredGridTrackSizes(node, GridTrackSizingDirection::ForColumns, columnWidths.size());
     float previousColumnX = 0;
@@ -1439 +1479 @@
         context.strokePath(columnPaths);
         
+        Vector<String> lineLabelParts;
         if (gridOverlay.config.showLineNumbers) {
+            lineLabelParts.append(String::number(i + 1));
+            lineLabelParts.append(String::number(-static_cast<int>(columnPositions.size() - i)));
+        }
+        if (gridOverlay.config.showLineNames && columnLineNames.contains(i))
+            lineLabelParts.appendVector(columnLineNames.get(i));
+        if (lineLabelParts.size()) {
+            auto lineLabel = lineLabelParts[0];
+            for (size_t i = 1; i < lineLabelParts.size(); ++i) {
+                lineLabel.append(thinSpace);
+                lineLabel.append(bullet);
+                lineLabel.append(thinSpace);
+                lineLabel.append(lineLabelParts[i]);
+            }
             // FIXME: <webkit.org/b/221972> Layout labels can be drawn outside the viewport, and a best effort should be made to keep them in the viewport while the grid is in the viewport.
-            drawLayoutLabel(context, String::number(i + 1), FloatPoint(labelX, gridBoundingBox.y()), LabelArrowDirection::Down);
-            drawLayoutLabel(context, String::number(-static_cast<int>(columnPositions.size() - i)), FloatPoint(labelX, gridBoundingBox.y() + gridBoundingBox.height()), LabelArrowDirection::Up);
+            drawLayoutLabel(context, lineLabel, FloatPoint(labelX, gridBoundingBox.y()), LabelArrowDirection::Down);
         }
     }
 
     auto rowHeights = renderGrid->trackSizesForComputedStyle(GridTrackSizingDirection::ForRows);
+    auto rowLineNames = gridLineNames(node->renderStyle(), GridTrackSizingDirection::ForRows, rowPositions.size());
     auto authoredTrackRowSizes = authoredGridTrackSizes(node, GridTrackSizingDirection::ForRows, rowHeights.size());
     float previousRowY = 0;
@@ -1490 +1544 @@
         context.strokePath(rowPaths);
         
+        Vector<String> lineLabelParts;
         if (gridOverlay.config.showLineNumbers) {
+            lineLabelParts.append(String::number(i + 1));
+            lineLabelParts.append(String::number(-static_cast<int>(rowPositions.size() - i)));
+        }
+        if (gridOverlay.config.showLineNames && rowLineNames.contains(i))
+            lineLabelParts.appendVector(rowLineNames.get(i));
+        if (lineLabelParts.size()) {
+            auto lineLabel = lineLabelParts[0];
+            for (size_t i = 1; i < lineLabelParts.size(); ++i) {
+                lineLabel.append(thinSpace);
+                lineLabel.append(bullet);
+                lineLabel.append(thinSpace);
+                lineLabel.append(lineLabelParts[i]);
+            }
             // FIXME: <webkit.org/b/221972> Layout labels can be drawn outside the viewport, and a best effort should be made to keep them in the viewport while the grid is in the viewport.
-            drawLayoutLabel(context, String::number(i + 1), FloatPoint(gridBoundingBox.x(), labelY), LabelArrowDirection::Right);
-            drawLayoutLabel(context, String::number(-static_cast<int>(rowPositions.size() - i)), FloatPoint(gridBoundingBox.x() + gridBoundingBox.width(), labelY), LabelArrowDirection::Left);
+            drawLayoutLabel(context, lineLabel, FloatPoint(gridBoundingBox.x(), labelY), LabelArrowDirection::Right);
         }
     }