summaryrefslogtreecommitdiff
path: root/Base/home/anon/www
diff options
context:
space:
mode:
authorAndreas Kling <kling@serenityos.org>2020-03-22 21:15:49 +0100
committerAndreas Kling <kling@serenityos.org>2020-03-22 21:18:03 +0100
commit39045bfde82be80052eda5e9502b43b22ef3eb9e (patch)
treea3dc6e9e0d1ac4f683f110929ad2111e2e9b30a2 /Base/home/anon/www
parent424a3f5ac3c659d57d38aba36f4062c8ecbc4044 (diff)
downloadserenity-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.html24
-rw-r--r--Base/home/anon/www/welcome.html1
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>