diff --git a/Userland/Libraries/LibWeb/Layout/InlineFormattingContext.cpp b/Userland/Libraries/LibWeb/Layout/InlineFormattingContext.cpp index 716f37d9e90..6f2e686d56e 100644 --- a/Userland/Libraries/LibWeb/Layout/InlineFormattingContext.cpp +++ b/Userland/Libraries/LibWeb/Layout/InlineFormattingContext.cpp @@ -41,7 +41,7 @@ BlockFormattingContext const& InlineFormattingContext::parent() const return static_cast(*FormattingContext::parent()); } -CSSPixels InlineFormattingContext::leftmost_x_offset_at(CSSPixels y) const +CSSPixels InlineFormattingContext::leftmost_inline_offset_at(CSSPixels y) const { // NOTE: Floats are relative to the BFC root box, not necessarily the containing block of this IFC. auto box_in_root_rect = content_box_rect_in_ancestor_coordinate_space(m_containing_block_used_values, parent().root()); @@ -216,13 +216,13 @@ void InlineFormattingContext::apply_justification_to_fragments(CSS::TextJustify if (is_last_line || line_box.m_has_forced_break) return; - CSSPixels excess_horizontal_space = line_box.original_available_width().to_px_or_zero() - line_box.width(); + CSSPixels excess_horizontal_space = line_box.original_available_width().to_px_or_zero() - line_box.inline_length(); CSSPixels excess_horizontal_space_including_whitespace = excess_horizontal_space; size_t whitespace_count = 0; for (auto& fragment : line_box.fragments()) { if (fragment.is_justifiable_whitespace()) { ++whitespace_count; - excess_horizontal_space_including_whitespace += fragment.width(); + excess_horizontal_space_including_whitespace += fragment.inline_length(); } } @@ -234,15 +234,12 @@ void InlineFormattingContext::apply_justification_to_fragments(CSS::TextJustify CSSPixels running_diff = 0; for (size_t i = 0; i < line_box.fragments().size(); ++i) { auto& fragment = line_box.fragments()[i]; - - auto offset = fragment.offset(); - offset.translate_by(running_diff, 0); - fragment.set_offset(offset); + fragment.set_inline_offset(fragment.inline_offset() + running_diff); if (fragment.is_justifiable_whitespace() - && fragment.width() != justified_space_width) { - running_diff += justified_space_width - fragment.width(); - fragment.set_width(justified_space_width); + && fragment.inline_length() != justified_space_width) { + running_diff += justified_space_width - fragment.inline_length(); + fragment.set_inline_length(justified_space_width); } } } @@ -421,18 +418,21 @@ void InlineFormattingContext::generate_line_boxes() } } -bool InlineFormattingContext::any_floats_intrude_at_y(CSSPixels y) const +bool InlineFormattingContext::any_floats_intrude_at_block_offset(CSSPixels block_offset) const { auto box_in_root_rect = content_box_rect_in_ancestor_coordinate_space(m_containing_block_used_values, parent().root()); - CSSPixels y_in_root = box_in_root_rect.y() + y; + // FIXME: Respect inline direction. + CSSPixels y_in_root = box_in_root_rect.y() + block_offset; auto space_and_containing_margin = parent().space_used_and_containing_margin_for_floats(y_in_root); return space_and_containing_margin.left_used_space > 0 || space_and_containing_margin.right_used_space > 0; } -bool InlineFormattingContext::can_fit_new_line_at_y(CSSPixels y) const +bool InlineFormattingContext::can_fit_new_line_at_block_offset(CSSPixels block_offset) const { - auto top_intrusions = parent().intrusion_by_floats_into_box(m_containing_block_used_values, y); - auto bottom_intrusions = parent().intrusion_by_floats_into_box(m_containing_block_used_values, y + containing_block().computed_values().line_height() - 1); + // FIXME: Respect inline direction. + + auto top_intrusions = parent().intrusion_by_floats_into_box(m_containing_block_used_values, block_offset); + auto bottom_intrusions = parent().intrusion_by_floats_into_box(m_containing_block_used_values, block_offset + containing_block().computed_values().line_height() - 1); auto left_edge = [](auto& space) -> CSSPixels { return space.left; diff --git a/Userland/Libraries/LibWeb/Layout/InlineFormattingContext.h b/Userland/Libraries/LibWeb/Layout/InlineFormattingContext.h index 4cd7f4fd882..e072f07e012 100644 --- a/Userland/Libraries/LibWeb/Layout/InlineFormattingContext.h +++ b/Userland/Libraries/LibWeb/Layout/InlineFormattingContext.h @@ -30,10 +30,10 @@ public: void dimension_box_on_line(Box const&, LayoutMode); - CSSPixels leftmost_x_offset_at(CSSPixels y) const; + CSSPixels leftmost_inline_offset_at(CSSPixels y) const; AvailableSize available_space_for_line(CSSPixels y) const; - bool any_floats_intrude_at_y(CSSPixels y) const; - bool can_fit_new_line_at_y(CSSPixels y) const; + bool any_floats_intrude_at_block_offset(CSSPixels block_offset) const; + bool can_fit_new_line_at_block_offset(CSSPixels block_offset) const; CSSPixels vertical_float_clearance() const; void set_vertical_float_clearance(CSSPixels); diff --git a/Userland/Libraries/LibWeb/Layout/LineBox.cpp b/Userland/Libraries/LibWeb/Layout/LineBox.cpp index 545783f08e3..4a5823b3076 100644 --- a/Userland/Libraries/LibWeb/Layout/LineBox.cpp +++ b/Userland/Libraries/LibWeb/Layout/LineBox.cpp @@ -25,12 +25,12 @@ void LineBox::add_fragment(Node const& layout_node, int start, int length, CSSPi m_fragments.last().m_length = (start - m_fragments.last().m_start) + length; m_fragments.last().append_glyph_run(glyph_run, content_width); } else { - CSSPixels x_offset = leading_margin + leading_size + m_width; - CSSPixels y_offset = 0; - m_fragments.append(LineBoxFragment { layout_node, start, length, CSSPixelPoint(x_offset, y_offset), CSSPixelSize(content_width, content_height), border_box_top, m_direction, move(glyph_run) }); + CSSPixels inline_offset = leading_margin + leading_size + m_inline_length; + CSSPixels block_offset = 0; + m_fragments.append(LineBoxFragment { layout_node, start, length, inline_offset, block_offset, content_width, content_height, border_box_top, m_direction, move(glyph_run) }); } - m_width += leading_margin + leading_size + content_width + trailing_size + trailing_margin; - m_height = max(m_height, content_height + border_box_top + border_box_bottom); + m_inline_length += leading_margin + leading_size + content_width + trailing_size + trailing_margin; + m_block_length = max(m_block_length, content_height + border_box_top + border_box_bottom); } void LineBox::trim_trailing_whitespace() @@ -55,7 +55,7 @@ void LineBox::trim_trailing_whitespace() if (!should_trim(last_fragment)) return; if (last_fragment->is_justifiable_whitespace()) { - m_width -= last_fragment->width(); + m_inline_length -= last_fragment->inline_length(); m_fragments.remove(m_fragments.size() - 1); } else { break; @@ -74,8 +74,8 @@ void LineBox::trim_trailing_whitespace() // FIXME: Use fragment's glyph run to determine the width of the last character. int last_character_width = last_fragment->layout_node().first_available_font().glyph_width(last_character); last_fragment->m_length -= 1; - last_fragment->set_width(last_fragment->width() - last_character_width); - m_width -= last_character_width; + last_fragment->set_inline_length(last_fragment->inline_length() - last_character_width); + m_inline_length -= last_character_width; } } diff --git a/Userland/Libraries/LibWeb/Layout/LineBox.h b/Userland/Libraries/LibWeb/Layout/LineBox.h index 8ef2d59f954..7d063fed4b6 100644 --- a/Userland/Libraries/LibWeb/Layout/LineBox.h +++ b/Userland/Libraries/LibWeb/Layout/LineBox.h @@ -18,9 +18,12 @@ public: { } - CSSPixels width() const { return m_width; } - CSSPixels height() const { return m_height; } + CSSPixels width() const { return m_inline_length; } + CSSPixels height() const { return m_block_length; } CSSPixels bottom() const { return m_bottom; } + + CSSPixels inline_length() const { return m_inline_length; } + CSSPixels block_length() const { return m_block_length; } CSSPixels baseline() const { return m_baseline; } void add_fragment(Node const& layout_node, int start, int length, CSSPixels leading_size, CSSPixels trailing_size, CSSPixels leading_margin, CSSPixels trailing_margin, CSSPixels content_width, CSSPixels content_height, CSSPixels border_box_top, CSSPixels border_box_bottom, RefPtr glyph_run = {}); @@ -41,8 +44,8 @@ private: friend class LineBuilder; Vector m_fragments; - CSSPixels m_width { 0 }; - CSSPixels m_height { 0 }; + CSSPixels m_inline_length { 0 }; + CSSPixels m_block_length { 0 }; CSSPixels m_bottom { 0 }; CSSPixels m_baseline { 0 }; CSS::Direction m_direction { CSS::Direction::Ltr }; diff --git a/Userland/Libraries/LibWeb/Layout/LineBoxFragment.cpp b/Userland/Libraries/LibWeb/Layout/LineBoxFragment.cpp index c37ffdb9544..3002c565735 100644 --- a/Userland/Libraries/LibWeb/Layout/LineBoxFragment.cpp +++ b/Userland/Libraries/LibWeb/Layout/LineBoxFragment.cpp @@ -13,12 +13,14 @@ namespace Web::Layout { -LineBoxFragment::LineBoxFragment(Node const& layout_node, int start, int length, CSSPixelPoint offset, CSSPixelSize size, CSSPixels border_box_top, CSS::Direction direction, RefPtr glyph_run) +LineBoxFragment::LineBoxFragment(Node const& layout_node, int start, int length, CSSPixels inline_offset, CSSPixels block_offset, CSSPixels inline_length, CSSPixels block_length, CSSPixels border_box_top, CSS::Direction direction, RefPtr glyph_run) : m_layout_node(layout_node) , m_start(start) , m_length(length) - , m_offset(offset) - , m_size(size) + , m_inline_offset(inline_offset) + , m_block_offset(block_offset) + , m_inline_length(inline_length) + , m_block_length(block_length) , m_border_box_top(border_box_top) , m_direction(direction) , m_glyph_run(move(glyph_run)) @@ -26,10 +28,20 @@ LineBoxFragment::LineBoxFragment(Node const& layout_node, int start, int length, if (m_glyph_run) { m_current_insert_direction = resolve_glyph_run_direction(m_glyph_run->text_type()); if (m_direction == CSS::Direction::Rtl) - m_insert_position = m_size.width().to_float(); + m_insert_position = m_inline_length.to_float(); } } +CSSPixelPoint LineBoxFragment::offset() const +{ + return { m_inline_offset, m_block_offset }; +} + +CSSPixelSize LineBoxFragment::size() const +{ + return { m_inline_length, m_block_length }; +} + bool LineBoxFragment::ends_in_whitespace() const { auto text = this->text(); @@ -97,14 +109,14 @@ void LineBoxFragment::append_glyph_run_ltr(RefPtr const& glyph_ru if (m_current_insert_direction != run_direction) { if (run_direction == CSS::Direction::Rtl) - m_insert_position = width().to_float(); + m_insert_position = m_inline_length.to_float(); m_current_insert_direction = run_direction; } switch (run_direction) { case CSS::Direction::Ltr: for (auto& glyph : glyph_run->glyphs()) { - glyph.position.translate_by(width().to_float(), 0); + glyph.position.translate_by(m_inline_length.to_float(), 0); m_glyph_run->append(glyph); } break; @@ -120,7 +132,7 @@ void LineBoxFragment::append_glyph_run_ltr(RefPtr const& glyph_ru break; } - m_size.set_width(width() + run_width); + m_inline_length += run_width; } void LineBoxFragment::append_glyph_run_rtl(RefPtr const& glyph_run, CSSPixels run_width) @@ -156,7 +168,7 @@ void LineBoxFragment::append_glyph_run_rtl(RefPtr const& glyph_ru break; } - m_size.set_width(width() + run_width); + m_inline_length += run_width; m_insert_position += run_width.to_float(); } diff --git a/Userland/Libraries/LibWeb/Layout/LineBoxFragment.h b/Userland/Libraries/LibWeb/Layout/LineBoxFragment.h index 631984bfba0..32a7e7a8916 100644 --- a/Userland/Libraries/LibWeb/Layout/LineBoxFragment.h +++ b/Userland/Libraries/LibWeb/Layout/LineBoxFragment.h @@ -19,28 +19,30 @@ class LineBoxFragment { friend class LineBox; public: - LineBoxFragment(Node const& layout_node, int start, int length, CSSPixelPoint offset, CSSPixelSize size, CSSPixels border_box_top, CSS::Direction, RefPtr); + LineBoxFragment(Node const& layout_node, int start, int length, CSSPixels inline_offset, CSSPixels block_offset, CSSPixels inline_length, CSSPixels block_length, CSSPixels border_box_top, CSS::Direction, RefPtr); Node const& layout_node() const { return m_layout_node; } int start() const { return m_start; } int length() const { return m_length; } CSSPixelRect const absolute_rect() const; - CSSPixelPoint offset() const { return m_offset; } - void set_offset(CSSPixelPoint offset) { m_offset = offset; } + CSSPixelPoint offset() const; + CSSPixels inline_offset() const { return m_inline_offset; } + CSSPixels block_offset() const { return m_block_offset; } + void set_inline_offset(CSSPixels inline_offset) { m_inline_offset = inline_offset; } + void set_block_offset(CSSPixels block_offset) { m_block_offset = block_offset; } // The baseline of a fragment is the number of pixels from the top to the text baseline. void set_baseline(CSSPixels y) { m_baseline = y; } CSSPixels baseline() const { return m_baseline; } - CSSPixelSize size() const - { - return m_size; - } - void set_width(CSSPixels width) { m_size.set_width(width); } - void set_height(CSSPixels height) { m_size.set_height(height); } - CSSPixels width() const { return m_size.width(); } - CSSPixels height() const { return m_size.height(); } + CSSPixelSize size() const; + CSSPixels width() const { return size().width(); } + CSSPixels height() const { return size().height(); } + CSSPixels inline_length() const { return m_inline_length; } + CSSPixels block_length() const { return m_block_length; } + void set_inline_length(CSSPixels inline_length) { m_inline_length = inline_length; } + void set_block_length(CSSPixels block_length) { m_block_length = block_length; } CSSPixels border_box_top() const { return m_border_box_top; } @@ -61,8 +63,10 @@ private: JS::NonnullGCPtr m_layout_node; int m_start { 0 }; int m_length { 0 }; - CSSPixelPoint m_offset; - CSSPixelSize m_size; + CSSPixels m_inline_offset; + CSSPixels m_block_offset; + CSSPixels m_inline_length; + CSSPixels m_block_length; CSSPixels m_border_box_top { 0 }; CSSPixels m_baseline { 0 }; CSS::Direction m_direction { CSS::Direction::Ltr }; diff --git a/Userland/Libraries/LibWeb/Layout/LineBuilder.cpp b/Userland/Libraries/LibWeb/Layout/LineBuilder.cpp index d2b55b045a9..3afb82b570c 100644 --- a/Userland/Libraries/LibWeb/Layout/LineBuilder.cpp +++ b/Userland/Libraries/LibWeb/Layout/LineBuilder.cpp @@ -28,6 +28,8 @@ LineBuilder::~LineBuilder() void LineBuilder::break_line(ForcedBreak forced_break, Optional next_item_width) { + // FIXME: Respect inline direction. + auto& last_line_box = ensure_last_line_box(); last_line_box.m_has_break = true; last_line_box.m_has_forced_break = forced_break == ForcedBreak::Yes; @@ -39,8 +41,8 @@ void LineBuilder::break_line(ForcedBreak forced_break, Optional next_ m_containing_block_used_values.line_boxes.append(LineBox(m_direction)); begin_new_line(true, break_count == 0); break_count++; - floats_intrude_at_current_y = m_context.any_floats_intrude_at_y(m_current_y); - } while ((floats_intrude_at_current_y && !m_context.can_fit_new_line_at_y(m_current_y)) + floats_intrude_at_current_y = m_context.any_floats_intrude_at_block_offset(m_current_block_offset); + } while ((floats_intrude_at_current_y && !m_context.can_fit_new_line_at_block_offset(m_current_block_offset)) || (next_item_width.has_value() && next_item_width.value() > m_available_width_for_current_line && floats_intrude_at_current_y)); @@ -51,19 +53,19 @@ void LineBuilder::begin_new_line(bool increment_y, bool is_first_break_in_sequen if (increment_y) { if (is_first_break_in_sequence) { // First break is simple, just go to the start of the next line. - m_current_y += max(m_max_height_on_current_line, m_context.containing_block().computed_values().line_height()); + m_current_block_offset += max(m_max_height_on_current_line, m_context.containing_block().computed_values().line_height()); } else { // We're doing more than one break in a row. // This means we're trying to squeeze past intruding floats. // Scan 1px at a time until we find a Y value where a new line can fit. // FIXME: This is super dumb and inefficient. - CSSPixels candidate_y = m_current_y + 1; + CSSPixels candidate_block_offset = m_current_block_offset + 1; while (true) { - if (m_context.can_fit_new_line_at_y(candidate_y)) + if (m_context.can_fit_new_line_at_block_offset(candidate_block_offset)) break; - ++candidate_y; + ++candidate_block_offset; } - m_current_y = candidate_y; + m_current_block_offset = candidate_block_offset; } } recalculate_available_space(); @@ -73,7 +75,7 @@ void LineBuilder::begin_new_line(bool increment_y, bool is_first_break_in_sequen // FIXME: Support text-indent with "each-line". if (m_containing_block_used_values.line_boxes.size() <= 1) { - ensure_last_line_box().m_width += m_text_indent; + ensure_last_line_box().m_inline_length += m_text_indent; } } @@ -100,8 +102,10 @@ void LineBuilder::append_box(Box const& box, CSSPixels leading_size, CSSPixels t void LineBuilder::append_text_chunk(TextNode const& text_node, size_t offset_in_node, size_t length_in_node, CSSPixels leading_size, CSSPixels trailing_size, CSSPixels leading_margin, CSSPixels trailing_margin, CSSPixels content_width, CSSPixels content_height, RefPtr glyph_run) { - ensure_last_line_box().add_fragment(text_node, offset_in_node, length_in_node, leading_size, trailing_size, leading_margin, trailing_margin, content_width, content_height, 0, 0, move(glyph_run)); - m_max_height_on_current_line = max(m_max_height_on_current_line, content_height); + auto& line_box = ensure_last_line_box(); + line_box.add_fragment(text_node, offset_in_node, length_in_node, leading_size, trailing_size, leading_margin, trailing_margin, content_width, content_height, 0, 0, move(glyph_run)); + + m_max_height_on_current_line = max(m_max_height_on_current_line, line_box.block_length()); } CSSPixels LineBuilder::y_for_float_to_be_inserted_here(Box const& box) @@ -110,28 +114,28 @@ CSSPixels LineBuilder::y_for_float_to_be_inserted_here(Box const& box) CSSPixels const width = box_state.margin_box_width(); CSSPixels const height = box_state.margin_box_height(); - CSSPixels candidate_y = m_current_y; + CSSPixels candidate_block_offset = m_current_block_offset; auto const& current_line = ensure_last_line_box(); // If there's already inline content on the current line, check if the new float can fit // alongside the content. If not, place it on the next line. if (current_line.width() > 0 && (current_line.width() + width) > m_available_width_for_current_line) - candidate_y += current_line.height(); + candidate_block_offset += current_line.height(); // Then, look for the next Y position where we can fit the new float. // FIXME: This is super dumb, we move 1px downwards per iteration and stop // when we find an Y value where we don't collide with other floats. while (true) { - auto space_at_y_top = m_context.available_space_for_line(candidate_y); - auto space_at_y_bottom = m_context.available_space_for_line(candidate_y + height); + auto space_at_y_top = m_context.available_space_for_line(candidate_block_offset); + auto space_at_y_bottom = m_context.available_space_for_line(candidate_block_offset + height); if (width > space_at_y_top || width > space_at_y_bottom) { - if (!m_context.any_floats_intrude_at_y(candidate_y) && !m_context.any_floats_intrude_at_y(candidate_y + height)) { - return candidate_y; + if (!m_context.any_floats_intrude_at_block_offset(candidate_block_offset) && !m_context.any_floats_intrude_at_block_offset(candidate_block_offset + height)) { + return candidate_block_offset; } } else { - return candidate_y; + return candidate_block_offset; } - candidate_y += 1; + candidate_block_offset += 1; } } @@ -144,9 +148,9 @@ bool LineBuilder::should_break(CSSPixels next_item_width) if (line_boxes.is_empty() || line_boxes.last().is_empty()) { // If we don't have a single line box yet *and* there are no floats intruding // at this Y coordinate, we don't need to break before inserting anything. - if (!m_context.any_floats_intrude_at_y(m_current_y)) + if (!m_context.any_floats_intrude_at_block_offset(m_current_block_offset)) return false; - if (!m_context.any_floats_intrude_at_y(m_current_y + m_context.containing_block().computed_values().line_height())) + if (!m_context.any_floats_intrude_at_block_offset(m_current_block_offset + m_context.containing_block().computed_values().line_height())) return false; } auto current_line_width = ensure_last_line_box().width(); @@ -167,31 +171,33 @@ void LineBuilder::update_last_line() auto direction = m_context.containing_block().computed_values().direction(); auto current_line_height = max(m_max_height_on_current_line, m_context.containing_block().computed_values().line_height()); - CSSPixels x_offset_top = m_context.leftmost_x_offset_at(m_current_y); - CSSPixels x_offset_bottom = m_context.leftmost_x_offset_at(m_current_y + current_line_height - 1); - CSSPixels x_offset = max(x_offset_top, x_offset_bottom); + CSSPixels inline_offset_top = m_context.leftmost_inline_offset_at(m_current_block_offset); + CSSPixels inline_offset_bottom = m_context.leftmost_inline_offset_at(m_current_block_offset + current_line_height - 1); + CSSPixels inline_offset = max(inline_offset_top, inline_offset_bottom); + CSSPixels block_offset = 0; - CSSPixels excess_horizontal_space = m_available_width_for_current_line.to_px_or_zero() - line_box.width(); + // FIXME: Respect inline direction. + CSSPixels excess_inline_space = m_available_width_for_current_line.to_px_or_zero() - line_box.inline_length(); // If (after justification, if any) the inline contents of a line box are too long to fit within it, // then the contents are start-aligned: any content that doesn't fit overflows the line box’s end edge. - if (excess_horizontal_space > 0) { + if (excess_inline_space > 0) { switch (text_align) { case CSS::TextAlign::Center: case CSS::TextAlign::LibwebCenter: - x_offset += excess_horizontal_space / 2; + inline_offset += excess_inline_space / 2; break; case CSS::TextAlign::Start: if (direction == CSS::Direction::Rtl) - x_offset += excess_horizontal_space; + inline_offset += excess_inline_space; break; case CSS::TextAlign::End: if (direction == CSS::Direction::Ltr) - x_offset += excess_horizontal_space; + inline_offset += excess_inline_space; break; case CSS::TextAlign::Right: case CSS::TextAlign::LibwebRight: - x_offset += excess_horizontal_space; + inline_offset += excess_inline_space; break; case CSS::TextAlign::Left: case CSS::TextAlign::LibwebLeft: @@ -249,8 +255,8 @@ void LineBuilder::update_last_line() }(); // Start with the "strut", an imaginary zero-width box at the start of each line box. - auto strut_top = m_current_y; - auto strut_bottom = m_current_y + m_context.containing_block().computed_values().line_height(); + auto strut_top = m_current_block_offset; + auto strut_bottom = m_current_block_offset + m_context.containing_block().computed_values().line_height(); CSSPixels uppermost_box_top = strut_top; CSSPixels lowermost_box_bottom = strut_bottom; @@ -258,10 +264,10 @@ void LineBuilder::update_last_line() for (size_t i = 0; i < line_box.fragments().size(); ++i) { auto& fragment = line_box.fragments()[i]; - CSSPixels new_fragment_x = round(x_offset + fragment.offset().x()); - CSSPixels new_fragment_y = 0; + CSSPixels new_fragment_inline_offset = round(inline_offset + fragment.inline_offset()); + CSSPixels new_fragment_block_offset = 0; - auto y_value_for_alignment = [&](CSS::VerticalAlign vertical_align) { + auto block_offset_value_for_alignment = [&](CSS::VerticalAlign vertical_align) { CSSPixels effective_box_top_offset = fragment.border_box_top(); CSSPixels effective_box_bottom_offset = fragment.border_box_top(); if (fragment.is_atomic_inline()) { @@ -272,14 +278,14 @@ void LineBuilder::update_last_line() switch (vertical_align) { case CSS::VerticalAlign::Baseline: - return m_current_y + line_box_baseline - fragment.baseline() + effective_box_top_offset; + return m_current_block_offset + line_box_baseline - fragment.baseline() + effective_box_top_offset; case CSS::VerticalAlign::Top: - return m_current_y + effective_box_top_offset; + return m_current_block_offset + effective_box_top_offset; case CSS::VerticalAlign::Middle: { // Align the vertical midpoint of the box with the baseline of the parent box // plus half the x-height of the parent. auto const x_height = CSSPixels::nearest_value_for(m_context.containing_block().first_available_font().pixel_metrics().x_height); - return m_current_y + line_box_baseline + ((effective_box_top_offset - effective_box_bottom_offset - x_height - fragment.height()) / 2); + return m_current_block_offset + line_box_baseline + ((effective_box_top_offset - effective_box_bottom_offset - x_height - fragment.height()) / 2); } case CSS::VerticalAlign::Bottom: case CSS::VerticalAlign::Sub: @@ -287,27 +293,28 @@ void LineBuilder::update_last_line() case CSS::VerticalAlign::TextBottom: case CSS::VerticalAlign::TextTop: // FIXME: These are all 'baseline' - return m_current_y + line_box_baseline - fragment.baseline() + effective_box_top_offset; + return m_current_block_offset + line_box_baseline - fragment.baseline() + effective_box_top_offset; } VERIFY_NOT_REACHED(); }; auto const& vertical_align = fragment.layout_node().computed_values().vertical_align(); if (vertical_align.has()) { - new_fragment_y = y_value_for_alignment(vertical_align.get()); + new_fragment_block_offset = block_offset_value_for_alignment(vertical_align.get()); } else { if (auto const* length_percentage = vertical_align.get_pointer()) { if (length_percentage->is_length()) { auto vertical_align_amount = length_percentage->length().to_px(fragment.layout_node()); - new_fragment_y = y_value_for_alignment(CSS::VerticalAlign::Baseline) - vertical_align_amount; + new_fragment_block_offset = block_offset_value_for_alignment(CSS::VerticalAlign::Baseline) - vertical_align_amount; } else if (length_percentage->is_percentage()) { auto vertical_align_amount = m_context.containing_block().computed_values().line_height().scaled(length_percentage->percentage().as_fraction()); - new_fragment_y = y_value_for_alignment(CSS::VerticalAlign::Baseline) - vertical_align_amount; + new_fragment_block_offset = block_offset_value_for_alignment(CSS::VerticalAlign::Baseline) - vertical_align_amount; } } } - fragment.set_offset({ new_fragment_x, floor(new_fragment_y) }); + fragment.set_inline_offset(new_fragment_inline_offset); + fragment.set_block_offset(floor(new_fragment_block_offset) + block_offset); CSSPixels top_of_inline_box = 0; CSSPixels bottom_of_inline_box = 0; @@ -315,15 +322,15 @@ void LineBuilder::update_last_line() // FIXME: Support inline-table elements. if (fragment.is_atomic_inline()) { auto const& fragment_box_state = m_layout_state.get(static_cast(fragment.layout_node())); - top_of_inline_box = (fragment.offset().y() - fragment_box_state.margin_box_top()); - bottom_of_inline_box = (fragment.offset().y() + fragment_box_state.content_height() + fragment_box_state.margin_box_bottom()); + top_of_inline_box = (fragment.block_offset() - fragment_box_state.margin_box_top()); + bottom_of_inline_box = (fragment.block_offset() + fragment_box_state.content_height() + fragment_box_state.margin_box_bottom()); } else { auto font_metrics = fragment.layout_node().first_available_font().pixel_metrics(); auto typographic_height = CSSPixels::nearest_value_for(font_metrics.ascent + font_metrics.descent); auto leading = fragment.layout_node().computed_values().line_height() - typographic_height; auto half_leading = leading / 2; - top_of_inline_box = (fragment.offset().y() + fragment.baseline() - CSSPixels::nearest_value_for(font_metrics.ascent) - half_leading); - bottom_of_inline_box = (fragment.offset().y() + fragment.baseline() + CSSPixels::nearest_value_for(font_metrics.descent) + half_leading); + top_of_inline_box = (fragment.block_offset() + fragment.baseline() - CSSPixels::nearest_value_for(font_metrics.ascent) - half_leading); + bottom_of_inline_box = (fragment.block_offset() + fragment.baseline() + CSSPixels::nearest_value_for(font_metrics.descent) + half_leading); } if (auto const* length_percentage = fragment.layout_node().computed_values().vertical_align().get_pointer()) { if (length_percentage->is_length()) @@ -338,9 +345,9 @@ void LineBuilder::update_last_line() } // 3. The line box height is the distance between the uppermost box top and the lowermost box bottom. - line_box.m_height = lowermost_box_bottom - uppermost_box_top; + line_box.m_block_length = lowermost_box_bottom - uppermost_box_top; - line_box.m_bottom = m_current_y + line_box.m_height; + line_box.m_bottom = m_current_block_offset + line_box.m_block_length; line_box.m_baseline = line_box_baseline; } @@ -357,8 +364,8 @@ void LineBuilder::remove_last_line_if_empty() void LineBuilder::recalculate_available_space() { auto current_line_height = max(m_max_height_on_current_line, m_context.containing_block().computed_values().line_height()); - auto available_at_top_of_line_box = m_context.available_space_for_line(m_current_y); - auto available_at_bottom_of_line_box = m_context.available_space_for_line(m_current_y + current_line_height - 1); + auto available_at_top_of_line_box = m_context.available_space_for_line(m_current_block_offset); + auto available_at_bottom_of_line_box = m_context.available_space_for_line(m_current_block_offset + current_line_height - 1); m_available_width_for_current_line = min(available_at_bottom_of_line_box, available_at_top_of_line_box); if (!m_containing_block_used_values.line_boxes.is_empty()) m_containing_block_used_values.line_boxes.last().m_original_available_width = m_available_width_for_current_line; diff --git a/Userland/Libraries/LibWeb/Layout/LineBuilder.h b/Userland/Libraries/LibWeb/Layout/LineBuilder.h index 9672bc47351..8c96ed86da9 100644 --- a/Userland/Libraries/LibWeb/Layout/LineBuilder.h +++ b/Userland/Libraries/LibWeb/Layout/LineBuilder.h @@ -41,8 +41,8 @@ public: void remove_last_line_if_empty(); - CSSPixels current_y() const { return m_current_y; } - void set_current_y(CSSPixels y) { m_current_y = y; } + CSSPixels current_block_offset() const { return m_current_block_offset; } + void set_current_block_offset(CSSPixels block_offset) { m_current_block_offset = block_offset; } void recalculate_available_space(); CSSPixels y_for_float_to_be_inserted_here(Box const&); @@ -60,7 +60,7 @@ private: LayoutState& m_layout_state; LayoutState::UsedValues& m_containing_block_used_values; AvailableSize m_available_width_for_current_line { AvailableSize::make_indefinite() }; - CSSPixels m_current_y { 0 }; + CSSPixels m_current_block_offset { 0 }; CSSPixels m_max_height_on_current_line { 0 }; CSSPixels m_text_indent { 0 }; CSS::Direction m_direction { CSS::Direction::Ltr };