[CSS Grid Layout] Implementation of the align-self property in 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 1088 matching lines @@
 
     return endOfColumnForChild(child);
 }
 
 LayoutUnit RenderGrid::centeredColumnPositionForChild(const RenderBox* child) const
 {
     const GridCoordinate& coordinate = cachedGridCoordinate(child);
     LayoutUnit startOfColumn = m_columnPositions[coordinate.columns.resolvedInitialPosition.toInt()];
     LayoutUnit endOfColumn = m_columnPositions[coordinate.columns.resolvedFinalPosition.next().toInt()];
     LayoutUnit columnPosition = startOfColumn + marginStartForChild(child);
+    // FIXME: This should account for the grid item's <overflow-position>.
     return columnPosition + std::max<LayoutUnit>(0, endOfColumn - startOfColumn - child->logicalWidth()) / 2;
 }
 
 LayoutUnit RenderGrid::columnPositionForChild(const RenderBox* child) const
 {
     ItemPosition childJustifySelf = child->style()->justifySelf();
     switch (childJustifySelf) {
     case ItemPositionSelfStart:
         // self-start is based on the child's direction. That's why we need to check against the grid container's direction.
         if (child->style()->direction() != style()->direction())
@@ skipping 42 matching lines @@
     case ItemPositionStretch:
     case ItemPositionBaseline:
         // FIXME: Implement the previous values. For now, we always start align the child.
         return startOfColumnForChild(child);
     }
 
     ASSERT_NOT_REACHED();
     return 0;
 }
 
+LayoutUnit RenderGrid::endOfRowForChild(const RenderBox* child) const
+{
+    const GridCoordinate& coordinate = cachedGridCoordinate(child);
+
+    LayoutUnit startOfRow = m_rowPositions[coordinate.rows.resolvedInitialPosition.toInt()];
+    // The grid items should be inside the grid container's border box, that's why they need to be shifted.
+    LayoutUnit rowPosition = startOfRow + marginBeforeForChild(child);
+
+    LayoutUnit endOfRow = m_rowPositions[coordinate.rows.resolvedFinalPosition.next().toInt()];
+    // FIXME: This should account for the grid item's <overflow-position>.
+    return rowPosition + std::max<LayoutUnit>(0, endOfRow - startOfRow - child->logicalHeight());
+}
+
+LayoutUnit RenderGrid::startOfRowForChild(const RenderBox* child) const
+{
+    const GridCoordinate& coordinate = cachedGridCoordinate(child);
+
+    LayoutUnit startOfRow = m_rowPositions[coordinate.rows.resolvedInitialPosition.toInt()];
+    // The grid items should be inside the grid container's border box, that's why they need to be shifted.
+    // FIXME: This should account for the grid item's <overflow-position>.
+    LayoutUnit rowPosition = startOfRow + marginBeforeForChild(child);
+
+    return rowPosition;
+}
+
+LayoutUnit RenderGrid::centeredRowPositionForChild(const RenderBox* child) const
+{
+    const GridCoordinate& coordinate = cachedGridCoordinate(child);
+
+    // The grid items should be inside the grid container's border box, that's why they need to be shifted.
+    LayoutUnit startOfRow = m_rowPositions[coordinate.rows.resolvedInitialPosition.toInt()] + marginBeforeForChild(child);
+    LayoutUnit endOfRow = m_rowPositions[coordinate.rows.resolvedFinalPosition.next().toInt()];
+
+    // FIXME: This should account for the grid item's <overflow-position>.
+    return startOfRow + std::max<LayoutUnit>(0, endOfRow - startOfRow - child->logicalHeight()) / 2;
+}
+
+static ItemPosition resolveAlignment(const RenderStyle* parentStyle, const RenderStyle* childStyle)
+{
+    ItemPosition align = childStyle->alignSelf();
+    // The auto keyword computes to the computed value of align-items on the parent.
+    if (align == ItemPositionAuto)
+        align = (parentStyle->alignItems() == ItemPositionAuto) ? ItemPositionStretch : parentStyle->alignItems();
+    return align;
+}

[Julien - ping for review, 2014/07/10 22:59:59]

I assume this code is temporary as we talked about moving this to style
resolution / adjustment.

[jfernandez, 2014/07/12 22:29:48]

Yes, still have to reach an agreement on issue 363133003, though. 
I've added a FIXME about it.

+
 LayoutUnit RenderGrid::rowPositionForChild(const RenderBox* child) const
 {
-    const GridCoordinate& coordinate = cachedGridCoordinate(child);
+    bool hasOrthogonalWritingMode = child->isHorizontalWritingMode() != isHorizontalWritingMode();
+    ItemPosition alignSelf = resolveAlignment(style(), child->style());
 
-    // The grid items should be inside the grid container's border box, that's why they need to be shifted.
-    LayoutUnit startOfRow = m_rowPositions[coordinate.rows.resolvedInitialPosition.toInt()];
-    LayoutUnit rowPosition = startOfRow + marginBeforeForChild(child);
+    switch (alignSelf) {
+    case ItemPositionSelfStart:
+        // If orthogonal writing-modes, this computes to 'Start'.
+        // FIXME: grid track sizing and positioning does not support orthogonal modes yet.
+        if (hasOrthogonalWritingMode)
+            return startOfRowForChild(child);
 
-    // FIXME: This function should account for 'align-self'.
+        // self-start is based on the child's direction. That's why we need to check against the grid container's direction.

[Julien - ping for review, 2014/07/10 22:59:59]

s/direction/block axis direction/

direction has a different meaning (inline 'direction'), that's no coherent with
your use.

[jfernandez, 2014/07/12 22:29:48]

Done.

+        if (child->style()->writingMode() != style()->writingMode())
+            return endOfRowForChild(child);
 
-    return rowPosition;
+        return startOfRowForChild(child);
+    case ItemPositionSelfEnd:
+        // If orthogonal writing-modes, this computes to 'End'.
+        // FIXME: grid track sizing and positioning does not support orthogonal modes yet.
+        if (hasOrthogonalWritingMode)
+            return endOfRowForChild(child);
+
+        // self-end is based on the child's direction. That's why we need to check against the grid container's direction.

[Julien - ping for review, 2014/07/10 22:59:59]

Same comment.

[jfernandez, 2014/07/12 22:29:48]

Done.

+        if (child->style()->writingMode() != style()->writingMode())
+            return startOfRowForChild(child);
+
+        return endOfRowForChild(child);
+
+    case ItemPositionLeft:
+        // orthogonal modes make property and inline axes to be parallel, but in any case
+        // this is always equivalent to 'Start'.
+        //
+        // self-align's axis is never parallel to the inline axis, except in orthogonal
+        // writing-mode, so this is equivalent to 'Start’.
+        return startOfRowForChild(child);
+
+    case ItemPositionRight:
+        // orthogonal modes make property and inline axes to be parallel.
+        // FIXME: grid track sizing and positioning does not support orthogonal modes yet.
+        if (hasOrthogonalWritingMode)
+            return endOfRowForChild(child);
+
+        // self-align's axis is never parallel to the inline axis, except in orthogonal
+        // writing-mode, so this is equivalent to 'Start'.
+        return startOfRowForChild(child);
+
+    case ItemPositionCenter:
+        return centeredRowPositionForChild(child);
+        // Only used in flex layout, for other layout, it's equivalent to 'Start'.
+    case ItemPositionFlexStart:
+    case ItemPositionStart:
+        return startOfRowForChild(child);
+        // Only used in flex layout, for other layout, it's equivalent to 'End'.
+    case ItemPositionFlexEnd:
+    case ItemPositionEnd:
+        return endOfRowForChild(child);
+    case ItemPositionStretch:
+        // FIXME: Implement the Stretch value. For now, we always start align the child.
+        return startOfRowForChild(child);
+    case ItemPositionBaseline:
+        // FIXME: Implement the ItemPositionBaseline value. For now, we always start align the child.
+        return startOfRowForChild(child);
+    case ItemPositionAuto:
+        break;
+    }
+
+    ASSERT_NOT_REACHED();
+    return 0;
 }
 
 LayoutPoint RenderGrid::findChildLogicalPosition(const RenderBox* child) const
 {
     return LayoutPoint(columnPositionForChild(child), rowPositionForChild(child));
 }
 
 static GridSpan dirtiedGridAreas(const Vector<LayoutUnit>& coordinates, LayoutUnit start, LayoutUnit end)
 {
     // This function does a binary search over the coordinates.
@@ skipping 70 matching lines @@
     if (isOutOfFlowPositioned())
         return "RenderGrid (positioned)";
     if (isAnonymous())
         return "RenderGrid (generated)";
     if (isRelPositioned())
         return "RenderGrid (relative positioned)";
     return "RenderGrid";
 }
 
 } // namespace WebCore