Skip to content

Commit f558fd9

Browse files
martinfalisseawesomekling
authored andcommitted
LibWeb: Calculate sizes of FlexibleLength grid tracks
1 parent fbe703e commit f558fd9

File tree

1 file changed

+124
-0
lines changed

1 file changed

+124
-0
lines changed

Userland/Libraries/LibWeb/Layout/GridFormattingContext.cpp

Lines changed: 124 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -799,6 +799,130 @@ void GridFormattingContext::run(Box const& box, LayoutMode)
799799
// max-width/height, then redo this step, treating the available grid space as equal to the grid
800800
// container’s inner size when it’s sized to its max-width/height.
801801
// FIXME: Do later as at the moment all growth limits are equal to base sizes.
802+
803+
// https://drafts.csswg.org/css-grid/#algo-flex-tracks
804+
// 12.7. Expand Flexible Tracks
805+
// This step sizes flexible tracks using the largest value it can assign to an fr without exceeding
806+
// the available space.
807+
808+
// First, find the grid’s used flex fraction:
809+
auto column_flex_factor_sum = 0;
810+
for (auto& grid_column : grid_columns) {
811+
if (grid_column.min_track_sizing_function.is_flexible_length())
812+
column_flex_factor_sum++;
813+
}
814+
// See 12.7.1.
815+
// Let flex factor sum be the sum of the flex factors of the flexible tracks. If this value is less
816+
// than 1, set it to 1 instead.
817+
if (column_flex_factor_sum < 1)
818+
column_flex_factor_sum = 1;
819+
820+
// See 12.7.1.
821+
float sized_column_widths = 0;
822+
for (auto& grid_column : grid_columns) {
823+
if (!grid_column.min_track_sizing_function.is_flexible_length())
824+
sized_column_widths += grid_column.base_size;
825+
}
826+
// Let leftover space be the space to fill minus the base sizes of the non-flexible grid tracks.
827+
double free_horizontal_space = box_state.content_width() - sized_column_widths;
828+
829+
// If the free space is zero or if sizing the grid container under a min-content constraint:
830+
// The used flex fraction is zero.
831+
// FIXME: Add min-content constraint check.
832+
833+
// Otherwise, if the free space is a definite length:
834+
// The used flex fraction is the result of finding the size of an fr using all of the grid tracks
835+
// and a space to fill of the available grid space.
836+
if (free_horizontal_space > 0) {
837+
for (auto& grid_column : grid_columns) {
838+
if (grid_column.min_track_sizing_function.is_flexible_length()) {
839+
// See 12.7.1.
840+
// Let the hypothetical fr size be the leftover space divided by the flex factor sum.
841+
auto hypothetical_fr_size = static_cast<double>(1.0 / column_flex_factor_sum) * free_horizontal_space;
842+
// For each flexible track, if the product of the used flex fraction and the track’s flex factor is
843+
// greater than the track’s base size, set its base size to that product.
844+
grid_column.base_size = max(grid_column.base_size, hypothetical_fr_size);
845+
}
846+
}
847+
}
848+
849+
// First, find the grid’s used flex fraction:
850+
auto row_flex_factor_sum = 0;
851+
for (auto& grid_row : grid_rows) {
852+
if (grid_row.min_track_sizing_function.is_flexible_length())
853+
row_flex_factor_sum++;
854+
}
855+
// See 12.7.1.
856+
// Let flex factor sum be the sum of the flex factors of the flexible tracks. If this value is less
857+
// than 1, set it to 1 instead.
858+
if (row_flex_factor_sum < 1)
859+
row_flex_factor_sum = 1;
860+
861+
// See 12.7.1.
862+
float sized_row_heights = 0;
863+
for (auto& grid_row : grid_rows) {
864+
if (!grid_row.min_track_sizing_function.is_flexible_length())
865+
sized_row_heights += grid_row.base_size;
866+
}
867+
// Let leftover space be the space to fill minus the base sizes of the non-flexible grid tracks.
868+
double free_vertical_space = box_state.content_height() - sized_row_heights;
869+
870+
// If the free space is zero or if sizing the grid container under a min-content constraint:
871+
// The used flex fraction is zero.
872+
// FIXME: Add min-content constraint check.
873+
874+
// Otherwise, if the free space is a definite length:
875+
// The used flex fraction is the result of finding the size of an fr using all of the grid tracks
876+
// and a space to fill of the available grid space.
877+
if (free_vertical_space > 0) {
878+
for (auto& grid_row : grid_rows) {
879+
if (grid_row.min_track_sizing_function.is_flexible_length()) {
880+
// See 12.7.1.
881+
// Let the hypothetical fr size be the leftover space divided by the flex factor sum.
882+
auto hypothetical_fr_size = static_cast<double>(1.0 / row_flex_factor_sum) * free_vertical_space;
883+
// For each flexible track, if the product of the used flex fraction and the track’s flex factor is
884+
// greater than the track’s base size, set its base size to that product.
885+
grid_row.base_size = max(grid_row.base_size, hypothetical_fr_size);
886+
}
887+
}
888+
}
889+
890+
// Otherwise, if the free space is an indefinite length:
891+
// FIXME: No tracks will have indefinite length as per current implementation.
892+
893+
// The used flex fraction is the maximum of:
894+
// For each flexible track, if the flexible track’s flex factor is greater than one, the result of
895+
// dividing the track’s base size by its flex factor; otherwise, the track’s base size.
896+
897+
// For each grid item that crosses a flexible track, the result of finding the size of an fr using
898+
// all the grid tracks that the item crosses and a space to fill of the item’s max-content
899+
// contribution.
900+
901+
// If using this flex fraction would cause the grid to be smaller than the grid container’s
902+
// min-width/height (or larger than the grid container’s max-width/height), then redo this step,
903+
// treating the free space as definite and the available grid space as equal to the grid container’s
904+
// inner size when it’s sized to its min-width/height (max-width/height).
905+
906+
// For each flexible track, if the product of the used flex fraction and the track’s flex factor is
907+
// greater than the track’s base size, set its base size to that product.
908+
909+
// https://drafts.csswg.org/css-grid/#algo-find-fr-size
910+
// 12.7.1. Find the Size of an fr
911+
912+
// This algorithm finds the largest size that an fr unit can be without exceeding the target size.
913+
// It must be called with a set of grid tracks and some quantity of space to fill.
914+
915+
// 1. Let leftover space be the space to fill minus the base sizes of the non-flexible grid tracks.
916+
917+
// 2. Let flex factor sum be the sum of the flex factors of the flexible tracks. If this value is less
918+
// than 1, set it to 1 instead.
919+
920+
// 3. Let the hypothetical fr size be the leftover space divided by the flex factor sum.
921+
922+
// FIXME: 4. If the product of the hypothetical fr size and a flexible track’s flex factor is less than the
923+
// track’s base size, restart this algorithm treating all such tracks as inflexible.
924+
925+
// 5. Return the hypothetical fr size.
802926
}
803927

804928
}

0 commit comments

Comments
 (0)