<script>
import { onMount } from 'svelte';
import Tixy from './Tixy.svelte';
let time = 0;
//////////////////////////////////////////////////////////////
// inspired by https://tixy.land/ from @aemkei
// https://twitter.com/aemkei/status/1323399877611708416
// rebuild by @matths (dittgen@gmail.com)
// change transform function in <Tixy> component
//////////////////////////////////////////////////////////////
onMount(() => {
let frame;
(function loop() {
frame = requestAnimationFrame(loop);
time = window.performance.now();
})();
return () => cancelAnimationFrame(frame);
});
</script>
<Tixy {time} size={16} tixy={(t,i,x,y) => (x-8)*(y-8)-Math.sin(t)*64} />
<Tixy {time} size={16} tixy={(t,i,x,y) => Math.random()<0.3} />
<Tixy {time} size={16} tixy={(t,i,x,y) => Math.sin(t-Math.sqrt((x-7.5)**2+(y-6)**2))} />
<Tixy {time} size={16} tixy={(t,i,x,y) => Math.sin(x/2)-Math.sin(x/8-t)-y+6} />
<Tixy {time} size={16} tixy={(t,i,x,y) => x<3||y<3||x>12||y>12?t%1:-t%2} />
<Tixy {time} size={16} tixy={(t,i,x,y) => x*y>.2*Math.sin(t%3.14)*900?.2:-0.6*Math.sin(t%3.14)} />