mirror of
https://github.com/RGBCube/serenity
synced 2025-07-26 03:07:44 +00:00
LibWeb: Add support for animated images to HTMLImageElement
Uses a Core::Timer (similar to HTMLBlinkElement) to transition between frames of an animated image. Also keeps track of the number of animation loops.
This commit is contained in:
parent
d22bb92764
commit
b8f5b81019
2 changed files with 44 additions and 0 deletions
|
@ -24,6 +24,7 @@
|
||||||
* OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
|
* OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
#include <LibCore/Timer.h>
|
||||||
#include <LibGfx/Bitmap.h>
|
#include <LibGfx/Bitmap.h>
|
||||||
#include <LibGfx/ImageDecoder.h>
|
#include <LibGfx/ImageDecoder.h>
|
||||||
#include <LibWeb/CSS/StyleResolver.h>
|
#include <LibWeb/CSS/StyleResolver.h>
|
||||||
|
@ -37,6 +38,7 @@ namespace Web {
|
||||||
|
|
||||||
HTMLImageElement::HTMLImageElement(Document& document, const FlyString& tag_name)
|
HTMLImageElement::HTMLImageElement(Document& document, const FlyString& tag_name)
|
||||||
: HTMLElement(document, tag_name)
|
: HTMLElement(document, tag_name)
|
||||||
|
, m_timer(Core::Timer::construct())
|
||||||
{
|
{
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -66,12 +68,42 @@ void HTMLImageElement::load_image(const String& src)
|
||||||
m_encoded_data = data;
|
m_encoded_data = data;
|
||||||
m_image_decoder = Gfx::ImageDecoder::create(m_encoded_data.data(), m_encoded_data.size());
|
m_image_decoder = Gfx::ImageDecoder::create(m_encoded_data.data(), m_encoded_data.size());
|
||||||
|
|
||||||
|
if (m_image_decoder->is_animated() && m_image_decoder->frame_count() > 1) {
|
||||||
|
const auto& first_frame = m_image_decoder->frame(0);
|
||||||
|
m_timer->set_interval(first_frame.duration);
|
||||||
|
m_timer->on_timeout = [this] { animate(); };
|
||||||
|
m_timer->start();
|
||||||
|
}
|
||||||
|
|
||||||
document().update_layout();
|
document().update_layout();
|
||||||
|
|
||||||
dispatch_event(Event::create("load"));
|
dispatch_event(Event::create("load"));
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
void HTMLImageElement::animate()
|
||||||
|
{
|
||||||
|
if (!layout_node()) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
m_current_frame_index = (m_current_frame_index + 1) % m_image_decoder->frame_count();
|
||||||
|
const auto& current_frame = m_image_decoder->frame(m_current_frame_index);
|
||||||
|
|
||||||
|
if (current_frame.duration != m_timer->interval()) {
|
||||||
|
m_timer->restart(current_frame.duration);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (m_current_frame_index == m_image_decoder->frame_count() - 1) {
|
||||||
|
++m_loops_completed;
|
||||||
|
if (m_loops_completed > 0 && m_loops_completed == m_image_decoder->loop_count()) {
|
||||||
|
m_timer->stop();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
layout_node()->set_needs_display();
|
||||||
|
}
|
||||||
|
|
||||||
int HTMLImageElement::preferred_width() const
|
int HTMLImageElement::preferred_width() const
|
||||||
{
|
{
|
||||||
bool ok = false;
|
bool ok = false;
|
||||||
|
@ -111,6 +143,11 @@ const Gfx::Bitmap* HTMLImageElement::bitmap() const
|
||||||
{
|
{
|
||||||
if (!m_image_decoder)
|
if (!m_image_decoder)
|
||||||
return nullptr;
|
return nullptr;
|
||||||
|
|
||||||
|
if (m_image_decoder->is_animated()) {
|
||||||
|
return m_image_decoder->frame(m_current_frame_index).image;
|
||||||
|
}
|
||||||
|
|
||||||
return m_image_decoder->bitmap();
|
return m_image_decoder->bitmap();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -27,6 +27,7 @@
|
||||||
#pragma once
|
#pragma once
|
||||||
|
|
||||||
#include <AK/ByteBuffer.h>
|
#include <AK/ByteBuffer.h>
|
||||||
|
#include <LibCore/Forward.h>
|
||||||
#include <LibGfx/Forward.h>
|
#include <LibGfx/Forward.h>
|
||||||
#include <LibWeb/DOM/HTMLElement.h>
|
#include <LibWeb/DOM/HTMLElement.h>
|
||||||
|
|
||||||
|
@ -56,10 +57,16 @@ public:
|
||||||
private:
|
private:
|
||||||
void load_image(const String& src);
|
void load_image(const String& src);
|
||||||
|
|
||||||
|
void animate();
|
||||||
|
|
||||||
virtual RefPtr<LayoutNode> create_layout_node(const StyleProperties* parent_style) const override;
|
virtual RefPtr<LayoutNode> create_layout_node(const StyleProperties* parent_style) const override;
|
||||||
|
|
||||||
RefPtr<Gfx::ImageDecoder> m_image_decoder;
|
RefPtr<Gfx::ImageDecoder> m_image_decoder;
|
||||||
ByteBuffer m_encoded_data;
|
ByteBuffer m_encoded_data;
|
||||||
|
|
||||||
|
size_t m_current_frame_index { 0 };
|
||||||
|
size_t m_loops_completed { 0 };
|
||||||
|
NonnullRefPtr<Core::Timer> m_timer;
|
||||||
};
|
};
|
||||||
|
|
||||||
template<>
|
template<>
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue