[CSS Grid Layout] Partial implementation of justify-content for Grid.

Source/core/rendering/RenderGrid.cpp

 /*
  * Copyright (C) 2011 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  * 1. Redistributions of source code must retain the above copyright
  *    notice, this list of conditions and the following disclaimer.
  * 2. Redistributions in binary form must reproduce the above copyright
  *    notice, this list of conditions and the following disclaimer in the
@@ skipping 489 matching lines @@
             }
         }
     }
 
     for (size_t i = 0; i < flexibleSizedTracksIndex.size(); ++i) {
         const size_t trackIndex = flexibleSizedTracksIndex[i];
         GridTrackSize trackSize = gridTrackSize(direction, trackIndex);
 
         tracks[trackIndex].m_usedBreadth = std::max<LayoutUnit>(tracks[trackIndex].m_usedBreadth, normalizedFractionBreadth * trackSize.maxTrackBreadth().flex());
     }
+
+    // Flexible tracks will exhaust the availableLogicalSpace.

[Julien - ping for review, 2014/11/18 16:14:36]

You're making one assumption here, which is that our rounding isn't off, which
is a big one. RenderTable has a similar logic and I am glad we have some ASSERT
to check this out.

On top of it, it seems really artificial to unconditionally override this value
instead of letting the grid items take their share of it.

[jfernandez, 2014/11/20 11:59:39]

Acknowledged.

+    availableLogicalSpace = 0;
 }
 
 LayoutUnit RenderGrid::computeUsedBreadthOfMinLength(GridTrackSizingDirection direction, const GridLength& gridLength) const
 {
     if (gridLength.isFlex())
         return 0;
 
     const Length& trackLength = gridLength.length();
     ASSERT(!trackLength.isAuto());
     if (trackLength.isSpecified())
@@ skipping 560 matching lines @@
     m_gridItemCoordinate.clear();
     m_gridIsDirty = true;
     m_gridItemsOverflowingGridArea.resize(0);
     m_gridItemsIndexesMap.clear();
 }
 
 void RenderGrid::layoutGridItems()
 {
     placeItemsOnGrid();
 
+    LayoutUnit availableSpaceForColumns = availableLogicalWidth();
+    LayoutUnit availableSpaceForRows = availableLogicalHeight(IncludeMarginBorderPadding);
     GridSizingData sizingData(gridColumnCount(), gridRowCount());
-    computeUsedBreadthOfGridTracks(ForColumns, sizingData);
+    computeUsedBreadthOfGridTracks(ForColumns, sizingData, availableSpaceForColumns);
     ASSERT(tracksAreWiderThanMinTrackBreadth(ForColumns, sizingData.columnTracks));
-    computeUsedBreadthOfGridTracks(ForRows, sizingData);
+    computeUsedBreadthOfGridTracks(ForRows, sizingData, availableSpaceForRows);
     ASSERT(tracksAreWiderThanMinTrackBreadth(ForRows, sizingData.rowTracks));
 
-    populateGridPositions(sizingData);
+    populateGridPositions(sizingData, availableSpaceForColumns, availableSpaceForRows);
     m_gridItemsOverflowingGridArea.resize(0);
 
     for (RenderBox* child = firstChildBox(); child; child = child->nextSiblingBox()) {
         if (child->isOutOfFlowPositioned()) {
             // FIXME: Absolute positioned grid items should have a special
             // behavior as described in the spec (crbug.com/273898):
             // http://www.w3.org/TR/css-grid-1/#abspos-items
             child->containingBlock()->insertPositionedObject(child);
         }
 
@@ skipping 47 matching lines @@
 LayoutUnit RenderGrid::gridAreaBreadthForChild(const RenderBox& child, GridTrackSizingDirection direction, const Vector<GridTrack>& tracks) const
 {
     const GridCoordinate& coordinate = cachedGridCoordinate(child);
     const GridSpan& span = (direction == ForColumns) ? coordinate.columns : coordinate.rows;
     LayoutUnit gridAreaBreadth = 0;
     for (GridSpan::iterator trackPosition = span.begin(); trackPosition != span.end(); ++trackPosition)
         gridAreaBreadth += tracks[trackPosition.toInt()].m_usedBreadth;
     return gridAreaBreadth;
 }
 
-void RenderGrid::populateGridPositions(const GridSizingData& sizingData)
+void RenderGrid::populateGridPositions(const GridSizingData& sizingData, LayoutUnit availableSpaceForColumns, LayoutUnit availableSpaceForRows)
 {
-    m_columnPositions.resize(sizingData.columnTracks.size() + 1);
-    m_columnPositions[0] = borderAndPaddingStart();
+    unsigned numberOfColumnTracks = sizingData.columnTracks.size();
+    LayoutUnit columnOffset = contentPositionAndDistributionOffset(availableSpaceForColumns, style()->justifyContent(), style()->justifyContentDistribution(), numberOfColumnTracks);
+
+    m_columnPositions.resize(numberOfColumnTracks + 1);
+    m_columnPositions[0] = borderAndPaddingStart() + columnOffset;
     for (size_t i = 0; i < m_columnPositions.size() - 1; ++i)
         m_columnPositions[i + 1] = m_columnPositions[i] + sizingData.columnTracks[i].m_usedBreadth;
 
     m_rowPositions.resize(sizingData.rowTracks.size() + 1);
     m_rowPositions[0] = borderAndPaddingBefore();
     for (size_t i = 0; i < m_rowPositions.size() - 1; ++i)
         m_rowPositions[i + 1] = m_rowPositions[i] + sizingData.rowTracks[i].m_usedBreadth;
 }
 
 static LayoutUnit computeOverflowAlignmentOffset(OverflowAlignment overflow, LayoutUnit startOfTrack, LayoutUnit endOfTrack, LayoutUnit childBreadth)
@@ skipping 311 matching lines @@
         // FIXME: Implement the ItemPositionBaseline value. For now, we always start align the child.
         return startOfRowForChild(child);
     case ItemPositionAuto:
         break;
     }
 
     ASSERT_NOT_REACHED();
     return 0;
 }
 
+ContentPosition static resolveContentDistributionFallback(ContentDistributionType distribution)
+{
+    switch (distribution) {
+    case ContentDistributionSpaceBetween:
+        return ContentPositionStart;
+    case ContentDistributionSpaceAround:
+        return ContentPositionCenter;
+    case ContentDistributionSpaceEvenly:
+        return ContentPositionCenter;
+    case ContentDistributionStretch:
+        return ContentPositionStart;
+    case ContentDistributionDefault:
+        return ContentPositionAuto;
+    default:

[Julien - ping for review, 2014/11/18 16:14:36]

Why do we need a default? Your reflex should be to omit default as much as
possible and explicitly state the cases (unless there is way too many cases).

[jfernandez, 2014/11/20 11:59:39]

My idea of the default option in these cases was to explicitly stating that any
other option will be invalid, crashing in debug because of the assert and let it
safely fallback in release mode.

Anyway, I agree that I'd be simpler to just omit it.

+        ASSERT_NOT_REACHED();
+    }
+
+    return ContentPositionAuto;
+}
+
+LayoutUnit static contentDistributionOffset(LayoutUnit availableFreeSpace, ContentPosition& fallbackPosition, ContentDistributionType distribution, unsigned numberOfGridTracks)
+{
+    ASSERT(numberOfGridTracks > 0);
+
+    if (fallbackPosition == ContentPositionAuto)
+        fallbackPosition = resolveContentDistributionFallback(distribution);
+
+    switch (distribution) {
+    case ContentDistributionSpaceBetween:
+        // FIXME: for the time being, spec states that it will always fallback for Grids, but
+        // discussion is ongoing.
+        return -1;
+    case ContentDistributionSpaceAround:
+        // FIXME: for the time being, spec states that it will always fallback for Grids, but
+        // discussion is ongoing.
+        return -1;
+    case ContentDistributionSpaceEvenly:
+        // FIXME: for the time being, spec states that it will always fallback for Grids, but
+        // discussion is ongoing.
+        return -1;
+    case ContentDistributionStretch:
+        // FIXME: for the time being, spec states that it will always fallback for Grids, but
+        // discussion is ongoing.
+        return -1;
+    case ContentDistributionDefault:
+        return -1;
+    default:
+        ASSERT_NOT_REACHED();
+    }
+
+    return -1;
+}

[Julien - ping for review, 2014/11/18 16:14:36]

This function is really artificial as I pointed out in a previous review. It
would be way more natural to introduce the minimal amount of code and then
refactor to introduce the extra scaffolding once you need it.

[jfernandez, 2014/11/20 11:59:39]

Acknowledged.

+
+LayoutUnit RenderGrid::contentPositionAndDistributionOffset(LayoutUnit availableFreeSpace, ContentPosition position, ContentDistributionType distribution, unsigned numberOfGridTracks) const
+{
+    if (availableFreeSpace <= 0)
+        return 0;
+
+    LayoutUnit offset = contentDistributionOffset(availableFreeSpace, position, distribution, numberOfGridTracks);
+    if (offset >= 0)
+        return offset;
+
+    switch (position) {
+    case ContentPositionLeft:
+        // If the property's axis is not parallel with the inline axis, this is equivalent to ‘start’.
+        if (!isHorizontalWritingMode())
+            return 0;
+        if (style()->isLeftToRightDirection())
+            return 0;
+        return availableFreeSpace;
+    case ContentPositionRight:
+        // If the property's axis is not parallel with the inline axis, this is equivalent to ‘start’.
+        if (!isHorizontalWritingMode())
+            return 0;
+        if (style()->isLeftToRightDirection())
+            return availableFreeSpace;
+        return 0;
+    case ContentPositionCenter:
+        return availableFreeSpace / 2;
+    case ContentPositionFlexEnd:
+        // Only used in flex layout, for other layout, it's equivalent to 'End'.
+    case ContentPositionEnd:
+        return availableFreeSpace;
+    case ContentPositionFlexStart:
+        // Only used in flex layout, for other layout, it's equivalent to 'Start'.
+    case ContentPositionStart:
+        return 0;
+    case ContentPositionBaseline:
+    case ContentPositionLastBaseline:
+        // FIXME: Implement the previous values. For now, we always start align.
+        return 0;
+    case ContentPositionAuto:
+    default:

[Julien - ping for review, 2014/11/18 16:14:36]

I have not seen an explanation for keeping the 'default' case.

[jfernandez, 2014/11/20 11:59:39]

Done.

+        ASSERT_NOT_REACHED();
+    }
+
+    return 0;
+}
+
 LayoutPoint RenderGrid::findChildLogicalPosition(const RenderBox& child) const
 {
     return LayoutPoint(columnPositionForChild(child), rowPositionForChild(child));
 }
 
 void RenderGrid::paintChildren(PaintInfo& paintInfo, const LayoutPoint& paintOffset)
 {
     GridPainter(*this).paintChildren(paintInfo, paintOffset);
 }
 
 const char* RenderGrid::renderName() const
 {
     if (isFloating())
         return "RenderGrid (floating)";
     if (isOutOfFlowPositioned())
         return "RenderGrid (positioned)";
     if (isAnonymous())
         return "RenderGrid (generated)";
     if (isRelPositioned())
         return "RenderGrid (relative positioned)";
     return "RenderGrid";
 }
 
 } // namespace blink