mirrors/svelte
mirrors/svelte
0
0
Fork 0
mirror of https://github.com/sveltejs/svelte.git synced 2024-11-21 11:28:58 +01:00
Code Issues Releases Wiki Activity

docs: Update 7guis-timer example to support SSR context (#13356)

Browse Source 
* Update 7guis-timer

* remove window reference on variable init

* better still

* prettier

---------

Co-authored-by: Rich Harris <hello@rich-harris.dev>
Co-authored-by: Rich Harris <rich.harris@vercel.com>
This commit is contained in:
sacrosanctic 2024-09-23 20:32:11 +08:00 committed by GitHub
parent c5fa0b46e1
commit c5028a27c5
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 12 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
documentation/examples/20-7guis/04-7guis-timer/App.svelte
View File

@ -1,31 +1,30 @@
<!-- https://eugenkiss.github.io/7guis/tasks#timer -->
<script>
import { onDestroy } from 'svelte';
import { onMount } from 'svelte';
let elapsed = 0;
let duration = 5000;
let last_time = window.performance.now();
let frame;
onMount(() => {
let last_time = performance.now();
(function update() {
frame = requestAnimationFrame(update);
let frame = requestAnimationFrame(function update(time) {
frame = requestAnimationFrame(update);
const time = window.performance.now();
elapsed += Math.min(time - last_time, duration - elapsed);
elapsed += Math.min(time - last_time, duration - elapsed);
last_time = time;
});
last_time = time;
})();
onDestroy(() => {
cancelAnimationFrame(frame);
return () => {
cancelAnimationFrame(frame);
};
});
</script>
<label>
elapsed time:
<progress value={elapsed / duration} />
<progress value={elapsed / duration}></progress>
</label>
<div>{(elapsed / 1000).toFixed(1)}s</div>