35 lines
708 B
Vue
35 lines
708 B
Vue
<script setup lang="ts">
|
|
const props = defineProps<{
|
|
screen: "top" | "bottom";
|
|
}>();
|
|
|
|
const confetti = useConfetti();
|
|
const { onRender } = useScreen();
|
|
|
|
onRender((ctx) => {
|
|
let offset: number;
|
|
if (props.screen === "top") {
|
|
confetti.update();
|
|
offset = 0;
|
|
} else {
|
|
offset = LOGICAL_HEIGHT;
|
|
}
|
|
|
|
for (const p of confetti.particles) {
|
|
const localY = p.y - offset;
|
|
if (localY < -10 || localY > LOGICAL_HEIGHT + 10) continue;
|
|
|
|
ctx.save();
|
|
ctx.translate(p.x, localY);
|
|
ctx.rotate(p.rotation);
|
|
|
|
ctx.fillStyle = p.color;
|
|
ctx.fillRect(-p.width / 2, -p.height / 2, p.width, p.height);
|
|
|
|
ctx.restore();
|
|
}
|
|
}, 10000);
|
|
|
|
defineOptions({ render: () => null });
|
|
</script>
|