Val Town is a social website to write and deploy JavaScript.
Build APIs and schedule functions from your browser.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
import { html } from "https://esm.town/v/stevekrouse/html";
import { sparklineSVG } from "https://esm.town/v/stevekrouse/sparklineSVG";
// Comment: Crafting a streamlined server with Hono that sends back SVG sparkline and a playful animated cat goofing around
export default async function() {
const sparkline = sparklineSVG([5, 10, 5, 20, 15, 10, 15, 20, 25, 30]);
// HTML response containing the sparkline SVG and a simple animated cat gif
return html(`
<html>
<body style="display: flex; justify-content: center; align-items: center; height: 100vh;">
<div>
<h1>Sparkline SVG Example with Animated Cat</h1>
${sparkline}
<img src="https://media.giphy.com/media/JIX9t2j0ZTN9S/source.gif" style="position: absolute; animation: moveCat 5s linear infinite;" />
</div>
<!-- Keyframes for animation -->
<style>
@keyframes moveCat {
0% { transform: translate(0, 0); }
25% { transform: translate(100px, -100px); }
50% { transform: translate(200px, 0); }
75% { transform: translate(100px, 100px); }
100% { transform: translate(0, 0); }
}
</style>
</body>
</html>
`);
}
janpaul123-valle_tmp_32548579067333305484587672007568.web.val.run
July 15, 2024