[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 1072 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::rowPositionForChild(const RenderBox* child) const
+LayoutUnit RenderGrid::endOfRowForChild(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()];
     LayoutUnit rowPosition = startOfRow + marginBeforeForChild(child);
 
-    // FIXME: This function should account for 'align-self'.
+    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);
+
+    // 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);
 
     return rowPosition;
 }
 
+LayoutUnit RenderGrid::centeredRowPositionForChild(const RenderBox* child) const
+{
+    const GridCoordinate& coordinate = cachedGridCoordinate(child);
+    LayoutUnit startOfRow = m_rowPositions[coordinate.rows.resolvedInitialPosition.toInt()];
+    LayoutUnit endOfRow = m_rowPositions[coordinate.rows.resolvedFinalPosition.next().toInt()];
+    LayoutUnit rowPosition = startOfRow + marginBeforeForChild(child);

[Julien - ping for review, 2014/05/21 14:41:38]

We should repeat the comment about shifting the grid item into the grid
container's border box.

[jfernandez, 2014/05/23 14:06:48]

Done.

+    return rowPosition + std::max<LayoutUnit>(0, endOfRow - startOfRow - child->logicalHeight()) / 2;
+}
+
+LayoutUnit RenderGrid::rowPositionForChild(const RenderBox* child) const
+{
+    bool hasOrthogonalWritingMode = child->isHorizontalWritingMode() != isHorizontalWritingMode();
+    ItemPosition childAlignSelf = child->style()->alignSelf();
+    switch (childAlignSelf) {

[Julien - ping for review, 2014/05/21 14:41:38]

No need for the |childAlignSelf| variable.

[jfernandez, 2014/05/23 14:06:48]

Done.

+    case ItemPositionSelfStart:
+        return startOfRowForChild(child);

[Julien - ping for review, 2014/05/21 14:41:38]

I think this needs a bit more logic:
- orthogonal flow are also disallowed in this case too
(http://dev.w3.org/csswg/css-align/#valuedef-self-start).
- if both alignment container and alignment subject have parallel writing-modes
but different block-flow direction, this will be wrong as the rows are measured
in the alignment container's (aka grid container) block-flow direction.

[jfernandez, 2014/05/23 14:06:48]

right, although such change is still only in the editor's draft. I've added it
to the implementation, though, with a FIXME for properly implementing the
orthogonal modes. I've been playing with them a bit and I think they don't work
very well now in grid layout. I guess it's because it's not properly described
the behavior in the specs, as you told me some days ago in the IRC.
That's good point, thanks. I've implemented it and it should be working fine.
I've added new test cases to cover this situation. 

+    case ItemPositionSelfEnd:
+        return endOfRowForChild(child);

[Julien - ping for review, 2014/05/21 14:41:38]

Same comment.

[jfernandez, 2014/05/23 14:06:48]

Done.

+
+    case ItemPositionFlexStart:
+    case ItemPositionFlexEnd:
+        // Only used in flex layout, for other layout, it's equivalent to 'start'.
+        return startOfRowForChild(child);
+
+    case ItemPositionLeft:
+    case ItemPositionRight:
+        // self-align's axis is always orthogonal to the inline axis, except in orthogonal
+        // writing-mode, so this is equivalent to ‘start’.
+        // FIXME: Properly support orthogonal writing mode.
+        if (hasOrthogonalWritingMode)
+            return 0;
+
+        return startOfRowForChild(child);
+
+    case ItemPositionCenter:
+        return centeredRowPositionForChild(child);
+    case ItemPositionStart:
+        return startOfRowForChild(child);
+    case ItemPositionEnd:
+        return endOfRowForChild(child);
+
+    case ItemPositionAuto:
+    case ItemPositionStretch:
+    case ItemPositionBaseline:
+        // FIXME: Implement the previous values. For now, we always start align the child.
+        return startOfRowForChild(child);
+    }
+
+    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.
     // FIXME: This doesn't work with grid items overflowing their grid areas and should be tested & fixed.
 
@@ skipping 109 matching lines @@
     if (isOutOfFlowPositioned())
         return "RenderGrid (positioned)";
     if (isAnonymous())
         return "RenderGrid (generated)";
     if (isRelPositioned())
         return "RenderGrid (relative positioned)";
     return "RenderGrid";
 }
 
 } // namespace WebCore