feat(contact): intro animation
This commit is contained in:
@@ -1,16 +1,31 @@
|
||||
<script setup lang="ts">
|
||||
const backgroundImage = useTemplateRef("backgroundImage");
|
||||
const store = useContactStore();
|
||||
|
||||
const homeBackgroundImage = useTemplateRef("homeBackgroundImage");
|
||||
const contactBackgroundImage = useTemplateRef("contactBackgroundImage");
|
||||
|
||||
callOnce("contactIntro", store.animateIntro);
|
||||
|
||||
useRender((ctx) => {
|
||||
if (!backgroundImage.value) return;
|
||||
if (!homeBackgroundImage.value || !contactBackgroundImage.value) return;
|
||||
|
||||
ctx.drawImage(backgroundImage.value, 0, 0);
|
||||
if (store.isIntro) {
|
||||
ctx.drawImage(homeBackgroundImage.value, 0, 0);
|
||||
ctx.globalAlpha = store.intro.stage2Opacity;
|
||||
}
|
||||
|
||||
ctx.drawImage(contactBackgroundImage.value, 0, 0);
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<img
|
||||
ref="backgroundImage"
|
||||
ref="homeBackgroundImage"
|
||||
src="/assets/images/home/bottom-screen/background.png"
|
||||
hidden
|
||||
/>
|
||||
<img
|
||||
ref="contactBackgroundImage"
|
||||
src="/assets/images/contact/bottom-screen/background.png"
|
||||
hidden
|
||||
/>
|
||||
|
||||
Reference in New Issue
Block a user