diff options
author | Andreas Kling <kling@serenityos.org> | 2020-03-22 21:15:49 +0100 |
---|---|---|
committer | Andreas Kling <kling@serenityos.org> | 2020-03-22 21:18:03 +0100 |
commit | 39045bfde82be80052eda5e9502b43b22ef3eb9e (patch) | |
tree | a3dc6e9e0d1ac4f683f110929ad2111e2e9b30a2 /Base/home/anon/www | |
parent | 424a3f5ac3c659d57d38aba36f4062c8ecbc4044 (diff) | |
download | serenity-39045bfde82be80052eda5e9502b43b22ef3eb9e.zip |
LibWeb: Add basic support for requestAnimationFrame()
We now support rAF, driven by GUI::DisplayLink callbacks. It's a bit
strange how we keep registering new callbacks over and over.
That's something we can definitely optimize.
This allows you to update animations/whatever without doing it more
often than the browser can display.
Diffstat (limited to 'Base/home/anon/www')
-rw-r--r-- | Base/home/anon/www/raf.html | 24 | ||||
-rw-r--r-- | Base/home/anon/www/welcome.html | 1 |
2 files changed, 25 insertions, 0 deletions
diff --git a/Base/home/anon/www/raf.html b/Base/home/anon/www/raf.html new file mode 100644 index 0000000000..25b9642b7a --- /dev/null +++ b/Base/home/anon/www/raf.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> +<head><title>rAF test</title></head> +<body> +<canvas id=c width=300 height=300></canvas> +<script> +c = document.getElementById('c'); +x = c.getContext("2d"); +x.fillStyle = 'black'; +x.fillRect(0, 0, c.width, c.height); +function raf() { + x.fillStyle = 'red'; + x.fillRect( + Math.random() * c.width, + Math.random() * c.height, + Math.random() * 10, + Math.random() * 10 + ); + requestAnimationFrame(raf); +} +requestAnimationFrame(raf); +</script> +</body> +</html> diff --git a/Base/home/anon/www/welcome.html b/Base/home/anon/www/welcome.html index c2bb81c828..d4d99a920a 100644 --- a/Base/home/anon/www/welcome.html +++ b/Base/home/anon/www/welcome.html @@ -24,6 +24,7 @@ h1 { <p>Some small test pages:</p> <ul> <li><a href="demo.html">fun demo</a></li> + <li><a href="raf.html">requestAnimationFrame test</a></li> <li><a href="canvas.html">canvas 2D test</a></li> <li><a href="events.html">simple DOM events test</a></li> <li><a href="dom.html">simple DOM JS test</a></li> |