2020-08-01 03:05:43 +01:00
|
|
|
/*
|
2022-02-16 19:12:54 +01:00
|
|
|
* Copyright (c) 2020-2022, the SerenityOS developers.
|
2022-07-22 16:08:03 +01:00
|
|
|
* Copyright (c) 2022, MacDue <macdue@dueutil.tech>
|
2023-12-05 21:18:15 +01:00
|
|
|
* Copyright (c) 2023, Bastiaan van der Plaat <bastiaan.v.d.plaat@gmail.com>
|
2020-08-01 03:05:43 +01:00
|
|
|
*
|
2021-04-22 01:24:48 -07:00
|
|
|
* SPDX-License-Identifier: BSD-2-Clause
|
2020-08-01 03:05:43 +01:00
|
|
|
*/
|
|
|
|
|
2024-04-27 12:09:58 +12:00
|
|
|
#include <LibWeb/Bindings/HTMLProgressElementPrototype.h>
|
2024-12-20 11:32:17 +01:00
|
|
|
#include <LibWeb/CSS/ComputedProperties.h>
|
2025-01-02 12:59:09 +11:00
|
|
|
#include <LibWeb/CSS/StyleValues/CSSKeywordValue.h>
|
2024-11-08 20:14:37 +08:00
|
|
|
#include <LibWeb/CSS/StyleValues/DisplayStyleValue.h>
|
2022-07-22 16:08:03 +01:00
|
|
|
#include <LibWeb/DOM/Document.h>
|
2023-12-10 12:42:13 +01:00
|
|
|
#include <LibWeb/DOM/ElementFactory.h>
|
2022-07-22 16:08:03 +01:00
|
|
|
#include <LibWeb/DOM/ShadowRoot.h>
|
2020-08-01 03:05:43 +01:00
|
|
|
#include <LibWeb/HTML/HTMLProgressElement.h>
|
2023-11-15 19:54:01 +01:00
|
|
|
#include <LibWeb/HTML/Numbers.h>
|
2023-12-10 12:42:13 +01:00
|
|
|
#include <LibWeb/Namespace.h>
|
2024-07-11 17:47:25 -03:00
|
|
|
#include <LibWeb/Page/Page.h>
|
2020-08-01 03:05:43 +01:00
|
|
|
|
|
|
|
namespace Web::HTML {
|
|
|
|
|
2024-11-15 04:01:23 +13:00
|
|
|
GC_DEFINE_ALLOCATOR(HTMLProgressElement);
|
2023-11-19 19:47:52 +01:00
|
|
|
|
2022-02-18 21:00:52 +01:00
|
|
|
HTMLProgressElement::HTMLProgressElement(DOM::Document& document, DOM::QualifiedName qualified_name)
|
2021-02-07 11:20:15 +01:00
|
|
|
: HTMLElement(document, move(qualified_name))
|
2020-08-01 03:05:43 +01:00
|
|
|
{
|
|
|
|
}
|
|
|
|
|
2022-03-14 13:21:51 -06:00
|
|
|
HTMLProgressElement::~HTMLProgressElement() = default;
|
2020-08-01 03:05:43 +01:00
|
|
|
|
2023-08-07 08:41:28 +02:00
|
|
|
void HTMLProgressElement::initialize(JS::Realm& realm)
|
2023-01-10 06:28:20 -05:00
|
|
|
{
|
2023-08-07 08:41:28 +02:00
|
|
|
Base::initialize(realm);
|
2024-03-16 13:13:08 +01:00
|
|
|
WEB_SET_PROTOTYPE_FOR_INTERFACE(HTMLProgressElement);
|
2023-01-10 06:28:20 -05:00
|
|
|
}
|
|
|
|
|
2023-12-05 21:18:15 +01:00
|
|
|
void HTMLProgressElement::visit_edges(Cell::Visitor& visitor)
|
2022-02-16 19:12:54 +01:00
|
|
|
{
|
2023-12-05 21:18:15 +01:00
|
|
|
Base::visit_edges(visitor);
|
|
|
|
visitor.visit(m_progress_value_element);
|
2022-02-16 19:12:54 +01:00
|
|
|
}
|
|
|
|
|
2023-11-15 19:54:01 +01:00
|
|
|
// https://html.spec.whatwg.org/multipage/form-elements.html#dom-progress-value
|
2022-02-16 19:12:54 +01:00
|
|
|
double HTMLProgressElement::value() const
|
|
|
|
{
|
2023-12-07 18:40:54 +01:00
|
|
|
if (auto value_string = get_attribute(HTML::AttributeNames::value); value_string.has_value()) {
|
|
|
|
if (auto value = parse_floating_point_number(*value_string); value.has_value())
|
|
|
|
return clamp(*value, 0, max());
|
|
|
|
}
|
|
|
|
return 0;
|
2022-02-16 19:12:54 +01:00
|
|
|
}
|
|
|
|
|
2023-05-25 20:37:57 +01:00
|
|
|
WebIDL::ExceptionOr<void> HTMLProgressElement::set_value(double value)
|
2022-02-16 19:12:54 +01:00
|
|
|
{
|
2024-03-18 06:13:01 +00:00
|
|
|
if (value < 0)
|
2024-03-18 06:13:01 +00:00
|
|
|
value = 0;
|
2022-02-16 19:12:54 +01:00
|
|
|
|
2024-10-14 10:05:01 +02:00
|
|
|
TRY(set_attribute(HTML::AttributeNames::value, String::number(value)));
|
2023-12-05 21:18:15 +01:00
|
|
|
update_progress_value_element();
|
2023-05-25 20:37:57 +01:00
|
|
|
return {};
|
2022-02-16 19:12:54 +01:00
|
|
|
}
|
|
|
|
|
2023-11-15 19:54:01 +01:00
|
|
|
// https://html.spec.whatwg.org/multipage/form-elements.html#dom-progress-max
|
2024-11-29 12:25:22 +00:00
|
|
|
WebIDL::Double HTMLProgressElement::max() const
|
2022-02-16 19:12:54 +01:00
|
|
|
{
|
2023-12-07 18:40:54 +01:00
|
|
|
if (auto max_string = get_attribute(HTML::AttributeNames::max); max_string.has_value()) {
|
|
|
|
if (auto max = parse_floating_point_number(*max_string); max.has_value())
|
2024-08-19 07:11:01 +01:00
|
|
|
if (*max > 0)
|
|
|
|
return *max;
|
2023-12-07 18:40:54 +01:00
|
|
|
}
|
|
|
|
return 1;
|
2022-02-16 19:12:54 +01:00
|
|
|
}
|
|
|
|
|
2023-05-25 20:37:57 +01:00
|
|
|
WebIDL::ExceptionOr<void> HTMLProgressElement::set_max(double value)
|
2022-02-16 19:12:54 +01:00
|
|
|
{
|
|
|
|
if (value <= 0)
|
2024-11-29 12:25:22 +00:00
|
|
|
return {};
|
2022-02-16 19:12:54 +01:00
|
|
|
|
2024-10-14 10:05:01 +02:00
|
|
|
TRY(set_attribute(HTML::AttributeNames::max, String::number(value)));
|
2023-12-05 21:18:15 +01:00
|
|
|
update_progress_value_element();
|
2023-05-25 20:37:57 +01:00
|
|
|
return {};
|
2022-02-16 19:12:54 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
double HTMLProgressElement::position() const
|
|
|
|
{
|
|
|
|
if (!is_determinate())
|
|
|
|
return -1;
|
|
|
|
|
|
|
|
return value() / max();
|
|
|
|
}
|
|
|
|
|
2023-12-05 21:18:15 +01:00
|
|
|
void HTMLProgressElement::inserted()
|
|
|
|
{
|
2025-01-23 17:38:24 +01:00
|
|
|
Base::inserted();
|
2023-12-05 21:18:15 +01:00
|
|
|
create_shadow_tree_if_needed();
|
|
|
|
}
|
|
|
|
|
2025-01-23 17:37:18 +01:00
|
|
|
void HTMLProgressElement::removed_from(DOM::Node* old_parent, DOM::Node& old_root)
|
2023-12-05 21:18:15 +01:00
|
|
|
{
|
2025-01-23 17:37:18 +01:00
|
|
|
Base::removed_from(old_parent, old_root);
|
2023-12-05 21:18:15 +01:00
|
|
|
set_shadow_root(nullptr);
|
|
|
|
}
|
|
|
|
|
2024-12-20 11:32:17 +01:00
|
|
|
void HTMLProgressElement::adjust_computed_style(CSS::ComputedProperties& style)
|
2024-11-08 20:14:37 +08:00
|
|
|
{
|
|
|
|
// https://drafts.csswg.org/css-display-3/#unbox
|
|
|
|
if (style.display().is_contents())
|
|
|
|
style.set_property(CSS::PropertyID::Display, CSS::DisplayStyleValue::create(CSS::Display::from_short(CSS::Display::Short::None)));
|
|
|
|
}
|
|
|
|
|
2023-12-05 21:18:15 +01:00
|
|
|
void HTMLProgressElement::create_shadow_tree_if_needed()
|
|
|
|
{
|
2024-06-25 11:28:58 +02:00
|
|
|
if (shadow_root())
|
2023-12-05 21:18:15 +01:00
|
|
|
return;
|
|
|
|
|
2024-11-14 05:50:17 +13:00
|
|
|
auto shadow_root = realm().create<DOM::ShadowRoot>(document(), *this, Bindings::ShadowRootMode::Closed);
|
2023-12-05 21:18:15 +01:00
|
|
|
set_shadow_root(shadow_root);
|
|
|
|
|
2023-12-10 12:42:13 +01:00
|
|
|
auto progress_bar_element = MUST(DOM::create_element(document(), HTML::TagNames::div, Namespace::HTML));
|
2025-03-18 15:57:43 +00:00
|
|
|
progress_bar_element->set_use_pseudo_element(CSS::Selector::PseudoElement::Type::Track);
|
2023-12-05 21:18:15 +01:00
|
|
|
MUST(shadow_root->append_child(*progress_bar_element));
|
|
|
|
|
2023-12-10 12:42:13 +01:00
|
|
|
m_progress_value_element = MUST(DOM::create_element(document(), HTML::TagNames::div, Namespace::HTML));
|
2025-03-18 15:57:43 +00:00
|
|
|
m_progress_value_element->set_use_pseudo_element(CSS::Selector::PseudoElement::Type::Fill);
|
2023-12-05 21:18:15 +01:00
|
|
|
MUST(progress_bar_element->append_child(*m_progress_value_element));
|
|
|
|
update_progress_value_element();
|
|
|
|
}
|
|
|
|
|
|
|
|
void HTMLProgressElement::update_progress_value_element()
|
|
|
|
{
|
2024-03-18 06:13:01 +00:00
|
|
|
if (m_progress_value_element)
|
|
|
|
MUST(m_progress_value_element->style_for_bindings()->set_property(CSS::PropertyID::Width, MUST(String::formatted("{}%", position() * 100))));
|
2023-12-05 21:18:15 +01:00
|
|
|
}
|
|
|
|
|
2024-12-20 16:35:12 +01:00
|
|
|
void HTMLProgressElement::computed_properties_changed()
|
2024-07-11 17:47:25 -03:00
|
|
|
{
|
2025-01-02 12:59:09 +11:00
|
|
|
auto accent_color = MUST(String::from_utf8(CSS::string_from_keyword(CSS::Keyword::Accentcolor)));
|
2024-07-11 17:47:25 -03:00
|
|
|
|
2024-12-20 16:35:12 +01:00
|
|
|
auto const& accent_color_property = computed_properties()->property(CSS::PropertyID::AccentColor);
|
2024-11-03 13:20:04 +01:00
|
|
|
if (accent_color_property.has_color())
|
2024-12-07 00:59:49 +01:00
|
|
|
accent_color = accent_color_property.to_string(Web::CSS::CSSStyleValue::SerializationMode::Normal);
|
2024-07-11 17:47:25 -03:00
|
|
|
|
|
|
|
if (m_progress_value_element)
|
|
|
|
MUST(m_progress_value_element->style_for_bindings()->set_property(CSS::PropertyID::BackgroundColor, accent_color));
|
|
|
|
}
|
|
|
|
|
2020-08-01 03:05:43 +01:00
|
|
|
}
|