Stowage/ladybird
2
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2026-06-28 12:10:28 +00:00
Code Issues Projects Releases Packages Wiki Activity
ladybird/Libraries/LibWeb/Layout/AudioBox.cpp

40 lines
978 B
C++
Raw Normal View History

LibWeb: Begin implementing the HTMLAudioElement for audio playback This uses LibAudio to attempt to decode resoures downloaded with <audio> elements, and draws some basic media controls for the element.
2023-06-12 13:55:43 -04:00
/*
* Copyright (c) 2023, Tim Flynn <trflynn89@serenityos.org>
*
* SPDX-License-Identifier: BSD-2-Clause
*/
#include <LibWeb/HTML/HTMLAudioElement.h>
#include <LibWeb/Layout/AudioBox.h>
LibWeb: Use UA shadow DOM for media elements' controls Instead of using a custom paintable to draw the controls for video and audio elements, we build them out of plain old HTML elements within a shadow root. This required a few hacks in the previous commits in order to allow a replaced element to host children within a shadow root, but it's fairly self-contained. A big benefit is that we can drive all the UI updates off of plain old DOM events (except the play button overlay on videos, which uses the video element representation), so we can test our media and input event handling more thoroughly. :^) The control bar visibility is now more similar to how other browsers handle it. It will show upon hovering over the element, but if the cursor is kept still for more than a second, it will hide again. While dragging, the controls remain visible, and will then hide after the mouse button is released. The icons have been redesigned from scratch, and the mute icon now visualizes the volume level along with indicating the mute state.
2026-02-21 00:14:45 -06:00
#include <LibWeb/Painting/PaintableBox.h>
LibWeb: Begin implementing the HTMLAudioElement for audio playback This uses LibAudio to attempt to decode resoures downloaded with <audio> elements, and draws some basic media controls for the element.
2023-06-12 13:55:43 -04:00
namespace Web::Layout {
LibWeb: Make computed style data refcounted Move ComputedProperties and CascadedProperties out of the GC. They no longer contain strong references to GC-managed data. Keep computed styles alive from DOM elements and animation updates with RefPtr. Pass style into layout constructors by reference, since layout only copies the values it needs while building nodes. Use GC::Weak for cascade source links, so entries no longer keep the style declaration or shadow root alive.
2026-06-06 14:03:41 +02:00
AudioBox::AudioBox(DOM::Document& document, DOM::Element& element, CSS::ComputedProperties const& style)
LibWeb: Remove useless moves of computed styles in AudioBox/VideoBox Fixes a clang-tidy warning.
2026-02-20 19:54:03 -06:00
: ReplacedBox(document, element, style)
LibWeb: Begin implementing the HTMLAudioElement for audio playback This uses LibAudio to attempt to decode resoures downloaded with <audio> elements, and draws some basic media controls for the element.
2023-06-12 13:55:43 -04:00
{
}
HTML::HTMLAudioElement& AudioBox::dom_node()
{
LibWeb: Allow Layout::ImageBox to be anonymous This is prep work for CSS content:image, which means pseudo-elements can be used to generate images without a corresponding DOM node.
2025-07-26 14:22:50 +02:00
return static_cast<HTML::HTMLAudioElement&>(*ReplacedBox::dom_node());
LibWeb: Begin implementing the HTMLAudioElement for audio playback This uses LibAudio to attempt to decode resoures downloaded with <audio> elements, and draws some basic media controls for the element.
2023-06-12 13:55:43 -04:00
}
HTML::HTMLAudioElement const& AudioBox::dom_node() const
{
LibWeb: Allow Layout::ImageBox to be anonymous This is prep work for CSS content:image, which means pseudo-elements can be used to generate images without a corresponding DOM node.
2025-07-26 14:22:50 +02:00
return static_cast<HTML::HTMLAudioElement const&>(*ReplacedBox::dom_node());
LibWeb: Begin implementing the HTMLAudioElement for audio playback This uses LibAudio to attempt to decode resoures downloaded with <audio> elements, and draws some basic media controls for the element.
2023-06-12 13:55:43 -04:00
}
LibWeb: Use UA shadow DOM for media elements' controls Instead of using a custom paintable to draw the controls for video and audio elements, we build them out of plain old HTML elements within a shadow root. This required a few hacks in the previous commits in order to allow a replaced element to host children within a shadow root, but it's fairly self-contained. A big benefit is that we can drive all the UI updates off of plain old DOM events (except the play button overlay on videos, which uses the video element representation), so we can test our media and input event handling more thoroughly. :^) The control bar visibility is now more similar to how other browsers handle it. It will show upon hovering over the element, but if the cursor is kept still for more than a second, it will hide again. While dragging, the controls remain visible, and will then hide after the mouse button is released. The icons have been redesigned from scratch, and the mute icon now visualizes the volume level along with indicating the mute state.
2026-02-21 00:14:45 -06:00
bool AudioBox::can_have_children() const
LibWeb: Begin implementing the HTMLAudioElement for audio playback This uses LibAudio to attempt to decode resoures downloaded with <audio> elements, and draws some basic media controls for the element.
2023-06-12 13:55:43 -04:00
{
LibWeb: Use UA shadow DOM for media elements' controls Instead of using a custom paintable to draw the controls for video and audio elements, we build them out of plain old HTML elements within a shadow root. This required a few hacks in the previous commits in order to allow a replaced element to host children within a shadow root, but it's fairly self-contained. A big benefit is that we can drive all the UI updates off of plain old DOM events (except the play button overlay on videos, which uses the video element representation), so we can test our media and input event handling more thoroughly. :^) The control bar visibility is now more similar to how other browsers handle it. It will show upon hovering over the element, but if the cursor is kept still for more than a second, it will hide again. While dragging, the controls remain visible, and will then hide after the mouse button is released. The icons have been redesigned from scratch, and the mute icon now visualizes the volume level along with indicating the mute state.
2026-02-21 00:14:45 -06:00
// If we allow children when controls are disabled, innerText may be non-empty.
return dom_node().shadow_root() != nullptr;
LibWeb: Begin implementing the HTMLAudioElement for audio playback This uses LibAudio to attempt to decode resoures downloaded with <audio> elements, and draws some basic media controls for the element.
2023-06-12 13:55:43 -04:00
}
LibWeb: Make Paintable tree ref-counted The Paintable tree and its supplemental painting data structures were GC allocated because that was the easiest way to manage it and avoid leaks introduced by ref cycles. This included the Paintable subclasses themselves plus StackingContext, ChromeWidget, Scrollbar, ResizeHandle, and scroll-frame state. We are now trying to reduce GC allocation churn on layout and painting updates, so keeping this short-lived rendering tree outside the JS heap is a better fit. Move Paintable to RefCountedTreeNode, make painting helpers ref-counted or weakly reference Paintables, and update the layout and event-handler call sites to use RefPtr/WeakPtr ownership.
2026-05-07 13:38:05 +02:00
RefPtr<Painting::Paintable> AudioBox::create_paintable() const
LibWeb: Hide audio element when controls is not set When an audio element has no controls attribute, it should not render at all and take up no space.
2025-01-04 12:13:40 +01:00
{
LibWeb: Use UA shadow DOM for media elements' controls Instead of using a custom paintable to draw the controls for video and audio elements, we build them out of plain old HTML elements within a shadow root. This required a few hacks in the previous commits in order to allow a replaced element to host children within a shadow root, but it's fairly self-contained. A big benefit is that we can drive all the UI updates off of plain old DOM events (except the play button overlay on videos, which uses the video element representation), so we can test our media and input event handling more thoroughly. :^) The control bar visibility is now more similar to how other browsers handle it. It will show upon hovering over the element, but if the cursor is kept still for more than a second, it will hide again. While dragging, the controls remain visible, and will then hide after the mouse button is released. The icons have been redesigned from scratch, and the mute icon now visualizes the volume level along with indicating the mute state.
2026-02-21 00:14:45 -06:00
return Painting::PaintableBox::create(*this);
LibWeb: Hide audio element when controls is not set When an audio element has no controls attribute, it should not render at all and take up no space.
2025-01-04 12:13:40 +01:00
}
LibWeb: Begin implementing the HTMLAudioElement for audio playback This uses LibAudio to attempt to decode resoures downloaded with <audio> elements, and draws some basic media controls for the element.
2023-06-12 13:55:43 -04:00
}
Reference in a new issue Copy permalink