<script>
import Graphic from "./Graphic.svelte";
let holding = false;
let deg = 0;
let number = 1;
function hold() {
holding = true;
}
function release() {
holding = false;
number = Math.ceil(deg / 60);
number = number>0?number:1;
}
function step() {
if (holding) {
deg = (deg + 23) % 360;
}
requestAnimationFrame(step);
}
requestAnimationFrame(step);
</script>
<Graphic {deg} />
<p>
페달을 {number} 번 밟았다.
</p>
<button on:touchstart|preventDefault="{hold}" on:touchend|preventDefault="{release}" on:mousedown="{hold}" on:mouseup="{release}" on:mouseleave="{release}">
{holding?"멈추기":"페달 밟기"}
</button>
<a class="webtoon"
href="https://comic.naver.com/bestChallenge/detail?titleId=734597&no=25">
<b>원작 보기</b></a>
<style>
@import url("https://fonts.googleapis.com/css2?family=Jua&display=swap");
p {