37 lines
892 B
Vue
37 lines
892 B
Vue
<script setup lang="ts">
|
|
const { onRender } = useScreen();
|
|
const { assets } = useAssets();
|
|
const store = useIntroStore();
|
|
const frames = Object.keys(assets.images.intro.logoAnimated).sort();
|
|
|
|
onMounted(() => {
|
|
store.animateIntro();
|
|
});
|
|
|
|
onRender((ctx) => {
|
|
ctx.fillStyle = "#fbfbfb";
|
|
ctx.fillRect(0, 0, LOGICAL_WIDTH, LOGICAL_HEIGHT);
|
|
|
|
ctx.globalAlpha = store.isIntro
|
|
? store.intro.textOpacity
|
|
: store.isOutro
|
|
? store.outro.textOpacity
|
|
: 1;
|
|
|
|
const frameIndex = Math.floor(store.intro.logoFrameIndex);
|
|
const frameKey = frames[
|
|
frameIndex
|
|
] as keyof typeof assets.images.intro.logoAnimated;
|
|
const frame = assets.images.intro.logoAnimated[frameKey];
|
|
|
|
frame.draw(ctx, 0, 0);
|
|
|
|
ctx.globalAlpha = store.isOutro ? store.outro.backgroundOpacity : 0;
|
|
assets.images.home.topScreen.background.draw(ctx, 0, 0);
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div />
|
|
</template>
|