Commit graph

27 commits

Author SHA1 Message Date
Andreas Kling
684fa0f99b LibWeb: Make selection state recomputation implicit
Add a LayoutDocument API for modifying the selection and make clients
call that so we can recompute selection states automatically.
2020-08-21 17:57:24 +02:00
Andreas Kling
d47f77169f LibWeb: Remember the selection state of each LayoutNode
Instead of computing it on the fly while painting each layout node,
they now remember their selection state. This avoids a whole bunch
of tree traversal while painting with anything selected.
2020-08-21 17:57:24 +02:00
Andreas Kling
2614ef550c LibWeb: Only paint focus outline when browser window has focus
This is communicated through the PaintContext::has_focus() flag.
2020-08-15 00:05:45 +02:00
Andreas Kling
01022eb5d6 LibWeb: Allow focusing individual (focusable) elements with Tab key
You can now cycle through focusable elements (currently only hyperlinks
are focusable) with the Tab key.

The focus outline is rendered in a new FocusOutline paint phase.
2020-08-15 00:05:45 +02:00
Andreas Kling
e2b4fef6c7 LibWeb: Specialize hit testing for text cursor purposes
The text cursor follows slightly different "intuitive" rules than the
regular hit testing. Clicking past the right edge of a text box should
still "hit" the text box, and place the cursor at its end, for example.

We solve this by adding a HitTestType enum that is passed to hit_test()
and determines whether past-the-edge candidates are considered.
2020-08-05 16:57:51 +02:00
Andreas Kling
ef711f501e LibWeb: Move the Page/Frame/EventHandler classes into Page/ 2020-07-28 19:28:29 +02:00
Andreas Kling
1f008c95b6 LibWeb: Move CSS classes into the Web::CSS namespace 2020-07-26 20:05:15 +02:00
Andreas Kling
11ff9d0f17 LibWeb: Move DOM classes into the Web::DOM namespace
LibWeb keeps growing and the Web namespace is filling up fast.
Let's put DOM stuff into Web::DOM, just like we already started doing
with SVG stuff in Web::SVG.
2020-07-26 20:05:15 +02:00
Andreas Kling
71556e39a4 LibWeb: Switch to using AK::is and AK::downcast 2020-07-26 17:51:00 +02:00
Andreas Kling
392b055806 LibWeb: Use the StackingContext tree for hit testing
This makes it possible to click links that are above other content due
to stacking context order (e.g via CSS z-index.)
2020-07-01 19:10:58 +02:00
Andreas Kling
440b4ece22 LibWeb: Move border width and color into LayoutStyle
To make this possible, I also had to give each LayoutNode a Document&
so it can resolve document-specific colors correctly. There's probably
ways to avoid having this extra member by resolving colors later, but
this works for now.
2020-06-24 19:43:27 +02:00
Andreas Kling
995d93c9d9 LibWeb: Move StackingContext from Layout/ to Painting/
The stacking context tree doesn't affect layout at all, so let's move
it into the Painting/ directory. I'm not sure yet if it's worth going
for a fullly separate painting tree. So far I'm thinking a stacking
context tree with pointers into the layout tree might be enough.
2020-06-18 21:42:19 +02:00
Andreas Kling
8c82d26668 LibWeb: Rename LayoutNode::render() to paint()
"Paint" matches what we call this in the rest of the system. Let's not
confuse things by mixing paint/render/draw all the time. I'm guilty of
this in more places..

Also rename RenderingContext => PaintContext.
2020-06-18 21:37:20 +02:00
Andreas Kling
cfab53903f LibWeb: Separate layout tree rendering into phases
CSS defines a very specific paint order. This patch starts steering us
towards respecting that by introducing the PaintPhase enum with values:

- Background
- Border
- Foreground
- Overlay (internal overlays used by inspector)

Basically, to get the right visual result, we have to render the page
multiple times, going one phase at a time.
2020-06-18 18:57:35 +02:00
Andreas Kling
96da15a8a4 LibWeb: Respect CSS z-index property while painting
To support z-ordering when painting, the layout tree now has a parallel
sparse tree of stacking contexts. The rules for which layout boxes
establish a stacking context are a bit complex, but the intent is to
encapsulate the decision making into establishes_stacking_context().

When we paint, we start from the ICB (LayoutDocument) who always has a
StackingContext and then paint the tree of StackingContexts where each
node has its children sorted by z-index.

This is pretty crude, but gets the basic job done. Note that this does
not yet support hit testing; hit testing is still done using a naive
treewalk from the root.
2020-06-15 17:56:00 +02:00
Andreas Kling
73c9f7ebf4 LibWeb: Move "visible in viewport" state tracking to ImageLoader
This should technically apply to any LayoutImage, so let's just move
it to ImageLoader.
2020-06-14 19:32:23 +02:00
Andreas Kling
62615dfc31 LibWeb: Add LayoutNode::frame() reference getter
Any live layout tree always has a corresponding live Frame, as we will
never create a layout tree for a frameless document.
2020-06-14 16:45:45 +02:00
Andreas Kling
95d70addd8 LibWeb: Split out image loading logic from HTMLImageElement
Since more DOM nodes are going to want to load images (<object>, ...)
this patch splits out the image loading logic into an ImageLoader class
and then HTMLImageElement simply has an ImageLoader.

LayoutImage is then given a const ImageLoader& at construction and can
then provide layout and rendering for many kinds of DOM nodes.
2020-06-13 22:22:54 +02:00
Andreas Kling
137f6d44ec LibWeb: Add basic support for position:fixed
Fixed position elements have the ICB as their containing block.
The magic of fixed positioning is implemented at the rendering stage,
where we temporarily translate painting by the current scroll offset.

Note that "absolutely positioned" includes both position:absolute
and position:fixed.
2020-06-12 14:20:07 +02:00
Andreas Kling
260427f0ad LibWeb: Some improvements to absolute positioning
Absolutely positioned blocks now register themselves with their
containing block (and note that the containing block of an absolutely
positioned box is the nearest non-statically positioned block ancestor
or the ICB as fallback.)

Containing blocks then drive the layout of their tracked absolutely
positioned descendants as a separate layout pass.

This is very far from perfect but the general direction seems good.
2020-06-12 13:43:46 +02:00
Andreas Kling
116cf92156 LibGfx: Rename Rect,Point,Size => IntRect,IntPoint,IntSize
This fits nicer with FloatRect,FloatPoint,FloatSize and gives a much
better visual clue about what type of metric is being used.
2020-06-10 10:59:04 +02:00
Andreas Kling
656b01eb0f LibWeb: Rework the layout engine to use relative offsets
The box tree and line boxes now all store a relative offset from their
containing block, instead of an absolute (document-relative) position.

This removes a huge pain point from the layout system which was having
to adjust offsets recursively when something moved. It also makes some
layout logic significantly simpler.

Every box can still find its absolute position by walking its chain
of containing blocks and accumulating the translation from the root.
This is currently what we do both for rendering and hit testing.
2020-06-10 10:46:57 +02:00
Andreas Kling
896db187e5 LibWeb: Move Frame.{cpp,h} into a new Frame/ directory 2020-06-07 10:14:41 +02:00
Andreas Kling
d4ddb0013c LibWeb: Share decoded images at the Resource level :^)
This patch adds ImageResource as a subclass of Resource. This new class
also keeps a Gfx::ImageDecoder so that we can share decoded bitmaps
between all clients of an image resource inside LibWeb.

With this, we now share both encoded and decoded data for images. :^)

I had to change how the purgeable-volatile flag is updated to keep the
volatile-images-outside-the-visible-viewport optimization working.
HTMLImageElement now inherits from ImageResourceClient (a subclass of
ResourceClient with additional image-specific stuff) and informs its
ImageResource about whether it's inside the viewport or outside.

This is pretty awesome! :^)
2020-06-02 20:32:38 +02:00
Andreas Kling
35040dd2c4 LibWeb: LayoutMode line_break_policy => LayoutMode layout_mode 2020-05-27 19:52:18 +02:00
Andreas Kling
f01af62313 LibWeb: Basic support for display:inline-block with width:auto
We now implement the somewhat fuzzy shrink-to-fit algorithm when laying
out inline-block elements with both block and inline children.

Shrink-to-fit works by doing two speculative layouts of the entire
subtree inside the current block, to compute two things:

1. Preferred minimum width: If we made a line break at every chance we
   had, how wide would the widest line be?
2. Preferred width: We break only when explicitly told to (e.g "<br>")
   How wide would the widest line be?

We then shrink the width of the inline-block element to an appropriate
value based on the above, taking the available width in the containing
block into consideration (sans all the box model fluff.)

To make the speculative layouts possible, plumb a LayoutMode enum
throughout the layout system since it needs to be respected in various
places.

Note that this is quite hackish and I'm sure there are smarter ways to
do a lot of this. But it does kinda work! :^)
2020-05-26 22:02:27 +02:00
Andreas Kling
830a57c6b2 LibWeb: Rename directory LibHTML => LibWeb
Let's rename this to LibWeb since it aims to provide more parts of the
web platform than just HTML. :^)
2020-03-07 10:32:51 +01:00
Renamed from Libraries/LibHTML/Layout/LayoutDocument.cpp (Browse further)