TableFormattingContext.cpp 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284
  1. /*
  2. * Copyright (c) 2020, Andreas Kling <kling@serenityos.org>
  3. *
  4. * SPDX-License-Identifier: BSD-2-Clause
  5. */
  6. #include <LibWeb/DOM/Node.h>
  7. #include <LibWeb/HTML/BrowsingContext.h>
  8. #include <LibWeb/Layout/Box.h>
  9. #include <LibWeb/Layout/InlineFormattingContext.h>
  10. #include <LibWeb/Layout/TableBox.h>
  11. #include <LibWeb/Layout/TableCellBox.h>
  12. #include <LibWeb/Layout/TableFormattingContext.h>
  13. #include <LibWeb/Layout/TableRowBox.h>
  14. #include <LibWeb/Layout/TableRowGroupBox.h>
  15. struct GridPosition {
  16. size_t x;
  17. size_t y;
  18. };
  19. inline bool operator==(GridPosition const& a, GridPosition const& b)
  20. {
  21. return a.x == b.x && a.y == b.y;
  22. }
  23. namespace AK {
  24. template<>
  25. struct Traits<GridPosition> : public GenericTraits<GridPosition> {
  26. static unsigned hash(GridPosition const& key)
  27. {
  28. return pair_int_hash(key.x, key.y);
  29. }
  30. };
  31. }
  32. namespace Web::Layout {
  33. TableFormattingContext::TableFormattingContext(LayoutState& state, BlockContainer const& block_container, FormattingContext* parent)
  34. : BlockFormattingContext(state, block_container, parent)
  35. {
  36. }
  37. TableFormattingContext::~TableFormattingContext() = default;
  38. void TableFormattingContext::calculate_row_column_grid(Box const& box)
  39. {
  40. // Implements https://html.spec.whatwg.org/multipage/tables.html#forming-a-table
  41. HashMap<GridPosition, bool> grid;
  42. size_t x_width = 0, y_height = 0;
  43. size_t x_current = 0, y_current = 0;
  44. auto process_row = [&](auto& row) {
  45. if (y_height == y_current)
  46. y_height++;
  47. x_current = 0;
  48. while (x_current < x_width && grid.contains(GridPosition { x_current, y_current }))
  49. x_current++;
  50. for (auto* child = row.first_child(); child; child = child->next_sibling()) {
  51. if (is<TableCellBox>(*child)) {
  52. Box* box = static_cast<Box*>(child);
  53. if (x_current == x_width)
  54. x_width++;
  55. const size_t colspan = static_cast<TableCellBox*>(child)->colspan();
  56. const size_t rowspan = 1;
  57. if (x_width < x_current + colspan)
  58. x_width = x_current + colspan;
  59. if (y_height < y_current + rowspan)
  60. y_height = y_current + rowspan;
  61. for (size_t y = y_current; y < y_current + rowspan; y++)
  62. for (size_t x = x_current; x < x_current + colspan; x++)
  63. grid.set(GridPosition { x, y }, true);
  64. m_cells.append(Cell { *box, x_current, y_current, colspan, rowspan });
  65. x_current += colspan;
  66. }
  67. }
  68. m_rows.append(Row { row });
  69. y_current++;
  70. };
  71. box.template for_each_child_of_type<TableRowGroupBox>([&](auto& row_group_box) {
  72. row_group_box.template for_each_child_of_type<TableRowBox>([&](auto& row) {
  73. process_row(row);
  74. return IterationDecision::Continue;
  75. });
  76. });
  77. m_columns.resize(x_width);
  78. }
  79. void TableFormattingContext::compute_table_measures()
  80. {
  81. for (auto& cell : m_cells) {
  82. auto width_of_containing_block = m_state.get(*cell.box.containing_block()).content_width();
  83. auto width_of_containing_block_as_length = CSS::Length::make_px(width_of_containing_block);
  84. float padding_left = cell.box.computed_values().padding().left().resolved(cell.box, width_of_containing_block_as_length).to_px(cell.box);
  85. float padding_right = cell.box.computed_values().padding().right().resolved(cell.box, width_of_containing_block_as_length).to_px(cell.box);
  86. float border_left = cell.box.computed_values().border_left().width;
  87. float border_right = cell.box.computed_values().border_right().width;
  88. auto min_width = calculate_min_content_width(cell.box) + padding_left + padding_right + border_left + border_right;
  89. auto max_width = calculate_max_content_width(cell.box) + padding_left + padding_right + border_left + border_right;
  90. m_columns[cell.column_index].min_width = max(m_columns[cell.column_index].min_width, min_width);
  91. m_columns[cell.column_index].max_width = max(m_columns[cell.column_index].max_width, max_width);
  92. }
  93. for (auto& column : m_columns) {
  94. column.used_width = column.min_width;
  95. }
  96. }
  97. void TableFormattingContext::compute_table_width(float& extra_width)
  98. {
  99. auto const& table_box = context_box();
  100. auto& table_box_state = m_state.get_mutable(table_box);
  101. auto& computed_values = table_box.computed_values();
  102. float width_of_table_containing_block = m_state.get(*table_box.containing_block()).content_width();
  103. // The row/column-grid width minimum (GRIDMIN) width is the sum of the min-content width
  104. // of all the columns plus cell spacing or borders.
  105. float grid_min = 0.0f;
  106. for (auto& column : m_columns) {
  107. grid_min += column.min_width;
  108. }
  109. // The row/column-grid width maximum (GRIDMAX) width is the sum of the max-content width
  110. // of all the columns plus cell spacing or borders.
  111. float grid_max = 0.0f;
  112. for (auto& column : m_columns) {
  113. grid_max += column.max_width;
  114. }
  115. // The used min-width of a table is the greater of the resolved min-width, CAPMIN, and GRIDMIN.
  116. float used_min_width = grid_min;
  117. if (!computed_values.min_width().is_auto()) {
  118. used_min_width = max(used_min_width, computed_values.min_width().resolved(table_box, CSS::Length::make_px(width_of_table_containing_block)).to_px(table_box));
  119. }
  120. float used_width;
  121. if (computed_values.width().is_auto()) {
  122. // If the table-root has 'width: auto', the used width is the greater of
  123. // min(GRIDMAX, the table’s containing block width), the used min-width of the table.
  124. used_width = max(min(grid_max, width_of_table_containing_block), used_min_width);
  125. table_box_state.set_content_width(used_width);
  126. } else {
  127. // If the table-root’s width property has a computed value (resolving to
  128. // resolved-table-width) other than auto, the used width is the greater
  129. // of resolved-table-width, and the used min-width of the table.
  130. float resolved_table_width = computed_values.width().resolved(table_box, CSS::Length::make_px(width_of_table_containing_block)).to_px(table_box);
  131. used_width = max(resolved_table_width, used_min_width);
  132. table_box_state.set_content_width(used_width);
  133. }
  134. if (used_width > grid_min) {
  135. extra_width = used_width - grid_min;
  136. }
  137. }
  138. void TableFormattingContext::distribute_width_to_columns(float extra_width)
  139. {
  140. float grid_max = 0.0f;
  141. for (auto& column : m_columns)
  142. grid_max += column.max_width - column.min_width;
  143. for (auto& column : m_columns)
  144. column.used_width += ((column.max_width - column.min_width) / grid_max) * extra_width;
  145. }
  146. void TableFormattingContext::run(Box const& box, LayoutMode, AvailableSpace const& available_space)
  147. {
  148. float total_content_height = 0;
  149. // Determine the number of rows/columns the table requires.
  150. calculate_row_column_grid(box);
  151. // Compute the minimum width of each column.
  152. compute_table_measures();
  153. // Compute the width of the table.
  154. float extra_width = 0;
  155. compute_table_width(extra_width);
  156. // Distribute the width of the table among columns.
  157. distribute_width_to_columns(extra_width);
  158. float left_column_offset = 0;
  159. for (auto& column : m_columns) {
  160. column.left_offset = left_column_offset;
  161. left_column_offset += column.used_width;
  162. }
  163. for (auto& cell : m_cells) {
  164. auto& cell_state = m_state.get_mutable(cell.box);
  165. float span_width = 0;
  166. for (size_t i = 0; i < cell.column_span; ++i)
  167. span_width += m_columns[cell.column_index + i].used_width;
  168. auto width_of_containing_block = m_state.get(*cell.box.containing_block()).content_width();
  169. auto width_of_containing_block_as_length = CSS::Length::make_px(width_of_containing_block);
  170. cell_state.padding_top = cell.box.computed_values().padding().top().resolved(cell.box, width_of_containing_block_as_length).to_px(cell.box);
  171. cell_state.padding_bottom = cell.box.computed_values().padding().bottom().resolved(cell.box, width_of_containing_block_as_length).to_px(cell.box);
  172. cell_state.padding_left = cell.box.computed_values().padding().left().resolved(cell.box, width_of_containing_block_as_length).to_px(cell.box);
  173. cell_state.padding_right = cell.box.computed_values().padding().right().resolved(cell.box, width_of_containing_block_as_length).to_px(cell.box);
  174. cell_state.border_top = cell.box.computed_values().border_top().width;
  175. cell_state.border_bottom = cell.box.computed_values().border_bottom().width;
  176. cell_state.border_left = cell.box.computed_values().border_left().width;
  177. cell_state.border_right = cell.box.computed_values().border_right().width;
  178. cell_state.set_content_width(span_width - cell_state.border_box_left() - cell_state.border_box_right());
  179. if (auto independent_formatting_context = layout_inside(cell.box, LayoutMode::Normal, cell_state.available_inner_space_or_constraints_from(available_space)))
  180. independent_formatting_context->parent_context_did_dimension_child_root_box();
  181. BlockFormattingContext::compute_height(cell.box, AvailableSpace(AvailableSize::make_indefinite(), AvailableSize::make_indefinite()));
  182. Row& row = m_rows[cell.row_index];
  183. row.used_width = max(row.used_width, cell_state.border_box_height());
  184. }
  185. for (size_t y = 0; y < m_rows.size(); y++) {
  186. auto& row = m_rows[y];
  187. auto& row_state = m_state.get_mutable(row.box);
  188. float row_width = 0.0f;
  189. for (auto& column : m_columns) {
  190. row_width += column.used_width;
  191. }
  192. row_state.set_content_height(row.used_width);
  193. row_state.set_content_width(row_width);
  194. }
  195. float row_group_top_offset = 0.0f;
  196. box.for_each_child_of_type<TableRowGroupBox>([&](auto& row_group_box) {
  197. float row_group_height = 0.0f;
  198. float row_group_width = 0.0f;
  199. auto& row_group_box_state = m_state.get_mutable(row_group_box);
  200. row_group_box_state.set_content_y(row_group_top_offset);
  201. float row_top_offset = 0.0f;
  202. row_group_box.template for_each_child_of_type<TableRowBox>([&](auto& row) {
  203. auto& row_state = m_state.get_mutable(row);
  204. row_state.set_content_y(row_top_offset);
  205. row_group_height += row_state.border_box_height();
  206. row_group_width = max(row_group_width, row_state.border_box_width());
  207. row_top_offset += row_state.border_box_height();
  208. });
  209. row_group_top_offset += row_top_offset;
  210. row_group_box_state.set_content_height(row_group_height);
  211. row_group_box_state.set_content_width(row_group_width);
  212. });
  213. for (auto& cell : m_cells) {
  214. auto& cell_state = m_state.get_mutable(cell.box);
  215. auto& row_state = m_state.get(m_rows[cell.row_index].box);
  216. cell_state.set_content_height(row_state.content_height() - cell_state.border_box_top() - cell_state.border_box_bottom());
  217. cell_state.offset = row_state.offset.translated(cell_state.border_box_left() + m_columns[cell.column_index].left_offset, cell_state.border_box_top());
  218. }
  219. m_state.get_mutable(context_box()).set_content_height(total_content_height);
  220. // FIXME: This is a total hack, we should respect the 'height' property.
  221. m_automatic_content_height = total_content_height;
  222. }
  223. float TableFormattingContext::automatic_content_height() const
  224. {
  225. return m_automatic_content_height;
  226. }
  227. }