[CSS Grid Layout] Add support to place items using named grid lines

Source/core/rendering/style/GridResolvedPosition.cpp

 // Copyright 2014 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 #include "config.h"
 #include "core/rendering/style/GridResolvedPosition.h"
 
 #include "core/rendering/RenderBox.h"
 #include "core/rendering/style/GridCoordinate.h"
 
@@ skipping 62 matching lines @@
 size_t GridResolvedPosition::explicitGridRowCount(const RenderStyle& gridContainerStyle)
 {
     return gridContainerStyle.gridTemplateRows().size();
 }
 
 size_t GridResolvedPosition::explicitGridSizeForSide(const RenderStyle& gridContainerStyle, GridPositionSide side)
 {
     return (side == ColumnStartSide || side == ColumnEndSide) ? explicitGridColumnCount(gridContainerStyle) : explicitGridRowCount(gridContainerStyle);
 }
 
+static const NamedGridLinesMap& gridLinesForSide(const RenderStyle& style, GridPositionSide side)
+{
+    return (side == ColumnStartSide || side == ColumnEndSide) ? style.namedGridColumnLines() : style.namedGridRowLines();
+}
+
 GridResolvedPosition GridResolvedPosition::resolveNamedGridLinePositionFromStyle(const RenderStyle& gridContainerStyle, const GridPosition& position, GridPositionSide side)
 {
     ASSERT(!position.namedGridLine().isNull());
 
-    const NamedGridLinesMap& gridLinesNames = (side == ColumnStartSide || side == ColumnEndSide) ? gridContainerStyle.namedGridColumnLines() : gridContainerStyle.namedGridRowLines();
+    const NamedGridLinesMap& gridLinesNames = gridLinesForSide(gridContainerStyle, side);
     NamedGridLinesMap::const_iterator it = gridLinesNames.find(position.namedGridLine());
     if (it == gridLinesNames.end()) {
         if (position.isPositive())
             return GridResolvedPosition(0);
         const size_t lastLine = explicitGridSizeForSide(gridContainerStyle, side);
         return adjustGridPositionForSide(lastLine, side);
     }
 
     size_t namedGridLineIndex;
     if (position.isPositive())
         namedGridLineIndex = std::min<size_t>(position.integerPosition(), it->value.size()) - 1;
     else
         namedGridLineIndex = std::max<int>(it->value.size() - abs(position.integerPosition()), 0);
     return adjustGridPositionForSide(it->value[namedGridLineIndex], side);
 }
 
+GridResolvedPosition GridResolvedPosition::resolveExplicitPositionFromStyle(const RenderStyle& gridContainerStyle, const GridPosition& position, GridPositionSide side)
+{
+    ASSERT(position.integerPosition());
+
+    if (!position.namedGridLine().isNull())
+        return resolveNamedGridLinePositionFromStyle(gridContainerStyle, position, side);
+
+    if (position.isPositive())
+        return adjustGridPositionForSide(position.integerPosition() - 1, side);
+
+    size_t resolvedPosition = abs(position.integerPosition()) - 1;
+    const size_t endOfTrack = explicitGridSizeForSide(gridContainerStyle, side);
+
+    // Per http://lists.w3.org/Archives/Public/www-style/2013Mar/0589.html, we clamp negative value to the first line.
+    if (endOfTrack < resolvedPosition)
+        return 0;
+
+    return adjustGridPositionForSide(endOfTrack - resolvedPosition, side);
+}
+
 GridResolvedPosition GridResolvedPosition::resolveGridPositionFromStyle(const RenderStyle& gridContainerStyle, const GridPosition& position, GridPositionSide side)
 {
-    switch (position.type()) {
-    case ExplicitPosition: {
-        ASSERT(position.integerPosition());
+    // We shouldn't see any other type of position here because 'auto' and span depend on the opposite position for
+    // resolution (e.g. grid-row: auto / 1 or grid-column: span 3 / myHeader).
+    ASSERT(position.type() == NamedGridAreaPosition || position.type() == ExplicitPosition);
 
-        if (!position.namedGridLine().isNull())
-            return resolveNamedGridLinePositionFromStyle(gridContainerStyle, position, side);
+    if (position.type() == NamedGridAreaPosition) {
+        // Four implicit named grid lines are created for each grid area (areaName-{start|end} for rows and
+        // columns). Authors can either use the area names or the implicit grid line names.
+        NamedGridAreaMap::const_iterator areaIter = gridContainerStyle.namedGridArea().find(position.namedGridLine());

[Julien - ping for review, 2014/05/08 18:48:05]

I think this should be a FIXME: if we inserted grid lines for grid areas as the
specification states, we could follow the exact algorithm from the
specification, which would be less confusing.

[svillar, 2014/05/09 11:14:39]

I quite don't get this comment. We *do* insert grid lines for grid areas in the
StyleBuilder.

[Julien - ping for review, 2014/05/09 17:37:54]

OK, I missed that important piece of information.

+        if (areaIter != gridContainerStyle.namedGridArea().end()) {
+            String implicitNamedGridLine = position.namedGridLine() + ((side == ColumnStartSide || side == RowStartSide) ? "-start" : "-end");
+            const NamedGridLinesMap& gridLineNames = gridLinesForSide(gridContainerStyle, side);
+            NamedGridLinesMap::const_iterator lineIter = gridLineNames.find(implicitNamedGridLine);
 
-        // Handle <integer> explicit position.
-        if (position.isPositive())
-            return adjustGridPositionForSide(position.integerPosition() - 1, side);
+            if (lineIter != gridLineNames.end())
+                return adjustGridPositionForSide(lineIter->value[0], side);

[Julien - ping for review, 2014/05/08 18:48:05]

Shouldn't we pick the smallest between the grid-area and the found grid-line?

[svillar, 2014/05/09 11:14:39]

Indeed that's a bug

[svillar, 2014/05/09 14:40:14]

Errr, no the code is correct. The reason why is correct is because the
NamedGridLinesMap already contains the implicit grid lines, so by returning [0]
we ensure that the result is always the right one (we don't mind if it's an
implicit or an explicitly named grid line)

[Julien - ping for review, 2014/05/09 17:37:54]

I agree. Sorry for the noise.

 
-        size_t resolvedPosition = abs(position.integerPosition()) - 1;
-        const size_t endOfTrack = explicitGridSizeForSide(gridContainerStyle, side);
+            return areaIter->value.positionForSide(side);
+        }
+        // Fallback to a implicit grid line position if there is no grid area with that name.
+        GridPosition adjustedPosition;
+        adjustedPosition.setExplicitPosition(1, position.namedGridLine());
+        return resolveExplicitPositionFromStyle(gridContainerStyle, adjustedPosition, side);

[Julien - ping for review, 2014/05/08 18:48:05]

Why do we need to override the integer position? This would pick the second
line, not the first.

We don't really discriminate between <custom-ident> and <integer> &&
<custom-ident>? so it seems like we can't handle this case correctly as the
specification says to treat it differently depending on the previous cases.

[svillar, 2014/05/09 11:14:39]

We're converting a NamedGridAreaPosition into a explicit position because as
there is no named area with that name, we want to treat it as any other explicit
grid line name.

Regarding picking the second line, I am not sure why you say this, remember that
0 makes a <integer> && <custom-ident>? declaration invalid.
 
I think we properly do that, but not in this function. We handle that case in
resolveNamedGridLinePositionFromStyle() which is called by
resolveExplicitPositionFromStyle().

+    }
 

[Julien - ping for review, 2014/05/08 18:48:05]

I think we should check for the named grid line in this case too.

[svillar, 2014/05/09 11:14:39]

Again, resolveExplicitPositionFromStyle() calls
resolveNamedGridLinePositionFromStyle() for named grid lines.

[svillar, 2014/05/09 11:14:39]

Same comment as above we handle that case in
resolveNamedGridLinePositionFromStyle() which is called by
resolveExplicitPositionFromStyle(). Remember that named grid lines are also
explicit positions.

-        // Per http://lists.w3.org/Archives/Public/www-style/2013Mar/0589.html, we clamp negative value to the first line.
-        if (endOfTrack < resolvedPosition)
-            return GridResolvedPosition(0);
-
-        return adjustGridPositionForSide(endOfTrack - resolvedPosition, side);
-    }
-    case NamedGridAreaPosition:
-    {
-        NamedGridAreaMap::const_iterator it = gridContainerStyle.namedGridArea().find(position.namedGridLine());
-        // Unknown grid area should have been computed to 'auto' by now.
-        ASSERT_WITH_SECURITY_IMPLICATION(it != gridContainerStyle.namedGridArea().end());
-        const GridCoordinate& gridAreaCoordinate = it->value;
-        switch (side) {
-        case ColumnStartSide:
-            return gridAreaCoordinate.columns.resolvedInitialPosition;
-        case ColumnEndSide:
-            return gridAreaCoordinate.columns.resolvedFinalPosition;
-        case RowStartSide:
-            return gridAreaCoordinate.rows.resolvedInitialPosition;
-        case RowEndSide:
-            return GridResolvedPosition(gridAreaCoordinate.rows.resolvedFinalPosition);
-        }
-        ASSERT_NOT_REACHED();
-        return GridResolvedPosition(0);
-    }
-    case AutoPosition:
-    case SpanPosition:
-        // 'auto' and span depend on the opposite position for resolution (e.g. grid-row: auto / 1 or grid-column: span 3 / "myHeader").
-        ASSERT_NOT_REACHED();
-        return GridResolvedPosition(0);
-    }
-    ASSERT_NOT_REACHED();
-    return GridResolvedPosition(0);
+    return resolveExplicitPositionFromStyle(gridContainerStyle, position, side);
 }
 
 PassOwnPtr<GridSpan> GridResolvedPosition::resolveGridPositionAgainstOppositePosition(const RenderStyle& gridContainerStyle, const GridResolvedPosition& resolvedOppositePosition, const GridPosition& position, GridPositionSide side)
 {
     if (position.isAuto())
         return GridSpan::create(resolvedOppositePosition, resolvedOppositePosition);
 
     ASSERT(position.isSpan());
     ASSERT(position.spanPosition() > 0);
 
     if (!position.namedGridLine().isNull()) {
         // span 2 'c' -> we need to find the appropriate grid line before / after our opposite position.
         return resolveNamedGridLinePositionAgainstOppositePosition(gridContainerStyle, resolvedOppositePosition, position, side);
     }
 
     return GridSpan::createWithSpanAgainstOpposite(resolvedOppositePosition, position, side);
 }
 
 PassOwnPtr<GridSpan> GridResolvedPosition::resolveNamedGridLinePositionAgainstOppositePosition(const RenderStyle& gridContainerStyle, const GridResolvedPosition& resolvedOppositePosition, const GridPosition& position, GridPositionSide side)
 {
     ASSERT(position.isSpan());
     ASSERT(!position.namedGridLine().isNull());
     // Negative positions are not allowed per the specification and should have been handled during parsing.
     ASSERT(position.spanPosition() > 0);
 
-    const NamedGridLinesMap& gridLinesNames = (side == ColumnStartSide || side == ColumnEndSide) ? gridContainerStyle.namedGridColumnLines() : gridContainerStyle.namedGridRowLines();
+    const NamedGridLinesMap& gridLinesNames = gridLinesForSide(gridContainerStyle, side);
     NamedGridLinesMap::const_iterator it = gridLinesNames.find(position.namedGridLine());
 
     // If there is no named grid line of that name, we resolve the position to 'auto' (which is equivalent to 'span 1' in this case).
     // See http://lists.w3.org/Archives/Public/www-style/2013Jun/0394.html.
     if (it == gridLinesNames.end())
         return GridSpan::create(resolvedOppositePosition, resolvedOppositePosition);
 
     return GridSpan::createWithNamedSpanAgainstOpposite(resolvedOppositePosition, position, side, it->value);
 }
 
 } // namespace WebCore