Why Nostr? What is Njump?
2023-10-30 05:52:09

Chris Trottier on Nostr: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" ...

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Wave Animation</title>
<style>
canvas {
border: 1px solid black;
}
</style>
</head>
<body>
<canvas id="waveCanvas"></canvas>

<script>
const canvas = document.getElementById("waveCanvas");
const ctx = canvas.getContext("2d");

canvas.width = window.innerWidth;
canvas.height = window.innerHeight;

// I always crave
// Hypnotic waves
// Rolling to shore
// Eternal, more

let waveY = canvas.height / 2;
const amplitude = 50;
const frequency = 0.01;
let increment = 0.05;

function animate() {
requestAnimationFrame(animate);
ctx.clearRect(0, 0, canvas.width, canvas.height);

ctx.beginPath();
for (let x = 0; x < canvas.width; x++) {
const y = waveY + Math.sin(x * frequency + increment) * amplitude;
ctx.lineTo(x, y);
}

ctx.strokeStyle = "blue";
ctx.stroke();

increment += 0.05;
}

animate();

</script>
</body>
</html>

Author Public Key
npub1jeqcnv0u9nyz8vjknegr2p62f54hfm3v9srudwq4rzarz4tqwk7qlujglm