feat(contact): intro animation
This commit is contained in:
29
app/components/Contact/TopScreen/LeftBar.vue
Normal file
29
app/components/Contact/TopScreen/LeftBar.vue
Normal file
@@ -0,0 +1,29 @@
|
||||
<script setup lang="ts">
|
||||
const store = useContactStore();
|
||||
|
||||
const backgroundImage = useTemplateRef("backgroundImage");
|
||||
const thingsImage = useTemplateRef("thingsImage");
|
||||
|
||||
useRender((ctx) => {
|
||||
if (!backgroundImage.value || !thingsImage.value) return;
|
||||
|
||||
ctx.globalAlpha = store.isIntro ? store.intro.stage1Opacity : 1;
|
||||
ctx.drawImage(backgroundImage.value, 0, 0);
|
||||
|
||||
ctx.globalAlpha = store.isIntro ? store.intro.stage3Opacity : 1;
|
||||
ctx.drawImage(thingsImage.value, 0, 0);
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<img
|
||||
ref="backgroundImage"
|
||||
src="/assets/images/contact/top-screen/left-bar.png"
|
||||
hidden
|
||||
/>
|
||||
<img
|
||||
ref="thingsImage"
|
||||
src="/assets/images/contact/top-screen/left-bar-things.png"
|
||||
hidden
|
||||
/>
|
||||
</template>
|
||||
Reference in New Issue
Block a user