feat(assets): new assets loading system (currently only for images)
This commit is contained in:
@@ -1,14 +1,12 @@
|
||||
<script setup lang="ts">
|
||||
import BACKGROUND_IMAGE from "/assets/images/home/bottom-screen/background.webp";
|
||||
|
||||
const store = useHomeStore();
|
||||
const app = useAppStore();
|
||||
|
||||
const [backgroundImage] = useImages(BACKGROUND_IMAGE);
|
||||
const { assets } = useAssets();
|
||||
|
||||
useRender((ctx) => {
|
||||
ctx.globalAlpha = app.booted ? 1 : store.intro.stage1Opacity;
|
||||
ctx.drawImage(backgroundImage!, 0, 0);
|
||||
ctx.drawImage(assets.home.bottomScreen.background, 0, 0);
|
||||
});
|
||||
|
||||
defineOptions({
|
||||
|
||||
@@ -1,17 +1,15 @@
|
||||
<script setup lang="ts">
|
||||
import BUTTON_IMAGE from "/assets/images/home/bottom-screen/buttons/contact.webp";
|
||||
|
||||
const props = defineProps<{
|
||||
x: number;
|
||||
y: number;
|
||||
opacity: number;
|
||||
}>();
|
||||
|
||||
const [buttonImage] = useImages(BUTTON_IMAGE);
|
||||
const { assets } = useAssets();
|
||||
|
||||
useRender((ctx) => {
|
||||
ctx.globalAlpha = props.opacity;
|
||||
ctx.drawImage(buttonImage!, props.x, props.y);
|
||||
ctx.drawImage(assets.home.bottomScreen.buttons.contact, props.x, props.y);
|
||||
});
|
||||
|
||||
defineOptions({
|
||||
|
||||
@@ -1,17 +1,19 @@
|
||||
<script setup lang="ts">
|
||||
import BUTTON_IMAGE from "/assets/images/home/bottom-screen/buttons/downloadPlay.webp";
|
||||
|
||||
const props = defineProps<{
|
||||
x: number;
|
||||
y: number;
|
||||
opacity: number;
|
||||
}>();
|
||||
|
||||
const [buttonImage] = useImages(BUTTON_IMAGE);
|
||||
const { assets } = useAssets();
|
||||
|
||||
useRender((ctx) => {
|
||||
ctx.globalAlpha = props.opacity;
|
||||
ctx.drawImage(buttonImage!, props.x, props.y);
|
||||
ctx.drawImage(
|
||||
assets.home.bottomScreen.buttons.downloadPlay,
|
||||
props.x,
|
||||
props.y,
|
||||
);
|
||||
});
|
||||
|
||||
defineOptions({
|
||||
|
||||
@@ -1,17 +1,15 @@
|
||||
<script setup lang="ts">
|
||||
import BUTTON_IMAGE from "/assets/images/home/bottom-screen/buttons/game.webp";
|
||||
|
||||
const props = defineProps<{
|
||||
x: number;
|
||||
y: number;
|
||||
opacity: number;
|
||||
}>();
|
||||
|
||||
const [buttonImage] = useImages(BUTTON_IMAGE);
|
||||
const { assets } = useAssets();
|
||||
|
||||
useRender((ctx) => {
|
||||
ctx.globalAlpha = props.opacity;
|
||||
ctx.drawImage(buttonImage!, props.x, props.y);
|
||||
ctx.drawImage(assets.home.bottomScreen.buttons.game, props.x, props.y);
|
||||
});
|
||||
|
||||
defineOptions({
|
||||
|
||||
@@ -1,17 +1,15 @@
|
||||
<script setup lang="ts">
|
||||
import BUTTON_IMAGE from "/assets/images/home/bottom-screen/buttons/settings.webp";
|
||||
|
||||
const props = defineProps<{
|
||||
x: number;
|
||||
y: number;
|
||||
opacity: number;
|
||||
}>();
|
||||
|
||||
const [buttonImage] = useImages(BUTTON_IMAGE);
|
||||
const { assets } = useAssets();
|
||||
|
||||
useRender((ctx) => {
|
||||
ctx.globalAlpha = props.opacity;
|
||||
ctx.drawImage(buttonImage!, props.x, props.y);
|
||||
ctx.drawImage(assets.home.bottomScreen.buttons.settings, props.x, props.y);
|
||||
});
|
||||
|
||||
defineOptions({
|
||||
|
||||
Reference in New Issue
Block a user