Changeset 143397 in webkit


Ignore:
Timestamp:
Feb 19, 2013, 3:34:33 PM (12 years ago)
Author:
jchaffraix@webkit.org
Message:

[CSS Grid Layout] Refactor the code in preparation of auto placement support
​https://bugs.webkit.org/show_bug.cgi?id=110244

Reviewed by Ojan Vafai.

Source/WebCore:

Test: fast/css-grid-layout/grid-auto-flow-resolution.html

In order to support auto placement, we need to iterate over the grid items with
auto row / column several times. This changes makes us do that in a very simple,
not-yet-conformant way. While touching this code, the distinction between grid-auto-flow
none and row / column was better drawn (and enforced).

  • rendering/RenderGrid.cpp:

(WebCore::RenderGrid::resolveGridPositionFromStyle):
Made it illegal to call resolveGridPositionFromStyle if the grid track is auto and
grid-auto-flow is not none. This would catch bad use of the function.

(WebCore::RenderGrid::maximumIndexInDirection):
Updated to bail out if the grid track is auto. Also improved the comment.

(WebCore::RenderGrid::placeItemsOnGrid):
Updated the function to do several iterations. Also handled the grid-auto-flow: none
case differently as it shouldn't need the extra iteration(s).

LayoutTests:

  • fast/css-grid-layout/grid-auto-flow-resolution-expected.txt: Added.
  • fast/css-grid-layout/grid-auto-flow-resolution.html: Added.
  • fast/css-grid-layout/implicit-position-dynamic-change.html:
  • fast/css-grid-layout/resources/grid.css:

(.autoRowAutoColumn):
(.firstRowAutoColumn):
(.secondRowAutoColumn):
(.thirdRowAutoColumn):
(.autoRowFirstColumn):
(.autoRowSecondColumn):
(.autoRowThirdColumn):
Added these helper classes, some will be used in a follow-up patch.

(.sizedToGridArea):
Hoisted this class into the common style.

Location:
trunk
Files:
2 added
5 edited

Legend:

Unmodified
Added
Removed

  • trunk/LayoutTests/ChangeLog

    r143395 r143397  
     12013-02-19  Julien Chaffraix  <jchaffraix@webkit.org>
     2
     3        [CSS Grid Layout] Refactor the code in preparation of auto placement support
     4        https://bugs.webkit.org/show_bug.cgi?id=110244
     5
     6        Reviewed by Ojan Vafai.
     7
     8        * fast/css-grid-layout/grid-auto-flow-resolution-expected.txt: Added.
     9        * fast/css-grid-layout/grid-auto-flow-resolution.html: Added.
     10        * fast/css-grid-layout/implicit-position-dynamic-change.html:
     11        * fast/css-grid-layout/resources/grid.css:
     12        (.autoRowAutoColumn):
     13        (.firstRowAutoColumn):
     14        (.secondRowAutoColumn):
     15        (.thirdRowAutoColumn):
     16        (.autoRowFirstColumn):
     17        (.autoRowSecondColumn):
     18        (.autoRowThirdColumn):
     19        Added these helper classes, some will be used in a follow-up patch.
     20
     21        (.sizedToGridArea):
     22        Hoisted this class into the common style.
     23
    1242013-02-19  David Hyatt  <hyatt@apple.com>
    225

  • trunk/LayoutTests/fast/css-grid-layout/implicit-position-dynamic-change.html

    r142798 r143397  
    1010    -webkit-grid-columns: 50px minmax(-webkit-min-content, 50px) minmax(-webkit-max-content, 50px) minmax(50px, -webkit-min-content);
    1111    -webkit-grid-rows: 70px minmax(-webkit-max-content, 70px) minmax(50px, -webkit-min-content) minmax(65px, -webkit-max-content);
    12 }
    13 
    14 .sizedToGridArea {
    15     font: 10px/1 Ahem;
    16     /* Make us fit our grid area. */
    17     width: 100%;
    18     height: 100%;
    1912}
    2013</style>

  • trunk/LayoutTests/fast/css-grid-layout/resources/grid.css

    r142798 r143397  
    3333}
    3434
     35/* Auto column / row. */
     36.autoRowAutoColumn {
     37    background-color: pink;
     38    -webkit-grid-column: auto;
     39    -webkit-grid-row: auto;
     40}
     41
     42.firstRowAutoColumn {
     43    background-color: blue;
     44    -webkit-grid-column: auto;
     45    -webkit-grid-row: 1;
     46}
     47
     48.secondRowAutoColumn {
     49    background-color: purple;
     50    -webkit-grid-column: auto;
     51    -webkit-grid-row: 2;
     52}
     53
     54.thirdRowAutoColumn {
     55    background-color: navy;
     56    -webkit-grid-column: auto;
     57    -webkit-grid-row: 3;
     58}
     59
     60.autoRowFirstColumn {
     61    background-color: lime;
     62    -webkit-grid-column: 1;
     63    -webkit-grid-row: auto;
     64}
     65
     66.autoRowSecondColumn {
     67    background-color: orange;
     68    -webkit-grid-column: 2;
     69    -webkit-grid-row: auto;
     70}
     71
     72.autoRowThirdColumn {
     73    background-color: magenta;
     74    -webkit-grid-column: 3;
     75    -webkit-grid-row: auto;
     76}
     77
     78/* Grid element flow. */
    3579.gridAutoFlowNone {
    3680    -webkit-grid-auto-flow: none;
    … …  
    56100}
    57101
     102.sizedToGridArea {
     103    font: 10px/1 Ahem;
     104    /* Make us fit our grid area. */
     105    width: 100%;
     106    height: 100%;
     107}
     108
    58109.verticalRL {
    59110    -webkit-writing-mode: vertical-rl;

  • trunk/Source/WebCore/ChangeLog

    r143395 r143397  
     12013-02-19  Julien Chaffraix  <jchaffraix@webkit.org>
     2
     3        [CSS Grid Layout] Refactor the code in preparation of auto placement support
     4        https://bugs.webkit.org/show_bug.cgi?id=110244
     5
     6        Reviewed by Ojan Vafai.
     7
     8        Test: fast/css-grid-layout/grid-auto-flow-resolution.html
     9
     10        In order to support auto placement, we need to iterate over the grid items with
     11        auto row / column several times. This changes makes us do that in a very simple,
     12        not-yet-conformant way. While touching this code, the distinction between grid-auto-flow
     13        none and row / column was better drawn (and enforced).
     14
     15        * rendering/RenderGrid.cpp:
     16        (WebCore::RenderGrid::resolveGridPositionFromStyle):
     17        Made it illegal to call resolveGridPositionFromStyle if the grid track is auto and
     18        grid-auto-flow is not none. This would catch bad use of the function.
     19
     20        (WebCore::RenderGrid::maximumIndexInDirection):
     21        Updated to bail out if the grid track is auto. Also improved the comment.
     22
     23        (WebCore::RenderGrid::placeItemsOnGrid):
     24        Updated the function to do several iterations. Also handled the grid-auto-flow: none
     25        case differently as it shouldn't need the extra iteration(s).
     26
    1272013-02-19  David Hyatt  <hyatt@apple.com>
    228

  • trunk/Source/WebCore/rendering/RenderGrid.cpp

    r143331 r143397  
    318318    for (RenderBox* child = firstChildBox(); child; child = child->nextSiblingBox()) {
    319319        const GridPosition& position = (direction == ForColumns) ? child->style()->gridItemColumn() : child->style()->gridItemRow();
    320         // This function bypasses the cache as it is used to build it. Also 'auto' items will need to be resolved in seperate phases anyway.
     320        // 'auto' items will need to be resolved in seperate phases anyway. Note that because maximumIndex is at least 1,
     321        // the grid-auto-flow == none case is automatically handled.
     322        if (position.isAuto())
     323            continue;
     324
     325        // This function bypasses the cache (cachedGridCoordinate()) as it is used to build it.
    321326        maximumIndex = std::max(maximumIndex, resolveGridPositionFromStyle(position) + 1);
    322327    }
    … …  
    487492        m_grid[i].grow(maximumColumnIndex);
    488493
     494    Vector<RenderBox*> autoGridItems;
     495    GridAutoFlow autoFlow = style()->gridAutoFlow();
    489496    for (RenderBox* child = firstChildBox(); child; child = child->nextSiblingBox()) {
    490         size_t columnTrack = resolveGridPositionFromStyle(child->style()->gridItemColumn());
    491         size_t rowTrack = resolveGridPositionFromStyle(child->style()->gridItemRow());
     497        const GridPosition& columnPosition = child->style()->gridItemColumn();
     498        const GridPosition& rowPosition = child->style()->gridItemRow();
     499        if (autoFlow != AutoFlowNone && (columnPosition.isAuto() || rowPosition.isAuto())) {
     500            autoGridItems.append(child);
     501            continue;
     502        }
     503        size_t columnTrack = resolveGridPositionFromStyle(columnPosition);
     504        size_t rowTrack = resolveGridPositionFromStyle(rowPosition);
    492505        insertItemIntoGrid(child, rowTrack, columnTrack);
    493506    }
    … …  
    495508    ASSERT(gridRowCount() >= style()->gridRows().size());
    496509    ASSERT(gridColumnCount() >= style()->gridColumns().size());
     510
     511    if (autoFlow == AutoFlowNone) {
     512        // If we did collect some grid items, they won't be placed thus never laid out.
     513        ASSERT(!autoGridItems.size());
     514        return;
     515    }
     516
     517    // FIXME: This should implement the auto flow algorithm (https://bugs.webkit.org/b/103316).
     518    // To keep our tests passing, we just insert them in the grid as if grid-auto-flow was none.
     519    for (size_t i = 0; i < autoGridItems.size(); ++i) {
     520        const GridPosition& columnPosition = autoGridItems[i]->style()->gridItemColumn();
     521        const GridPosition& rowPosition = autoGridItems[i]->style()->gridItemRow();
     522        size_t columnTrack = columnPosition.isAuto() ? 0 : resolveGridPositionFromStyle(columnPosition);
     523        size_t rowTrack = rowPosition.isAuto() ? 0 : resolveGridPositionFromStyle(rowPosition);
     524
     525        insertItemIntoGrid(autoGridItems[i], rowTrack, columnTrack);
     526    }
    497527}
    498528
    … …  
    567597        return position.integerPosition() - 1;
    568598    case AutoPosition:
    569         // FIXME: We should follow 'grid-auto-flow' for resolution.
    570         // Until then, we use the 'grid-auto-flow: none' behavior (which is the default)
    571         // and resolve 'auto' as the first row / column.
     599        // We cannot resolve grid positions if grid-auto-flow != none as it requires several iterations.
     600        ASSERT(style()->gridAutoFlow() == AutoFlowNone);
    572601        return 0;
    573602    }
Note: See TracChangeset for help on using the changeset viewer.