pihkaal/pihkaal-me
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(assets): new assets loading system (currently only for images)

Browse Source
This commit is contained in:
Stevan
2025-12-17 12:28:48 +01:00
parent 05398d5252
commit b85899617b
106 changed files with 359 additions and 366 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
app/components/Settings/BottomScreen/Menus/User/Menu.vue
View File

@@ -1,12 +1,4 @@
<script setup lang="ts">
import MENU_IMAGE from "/assets/images/settings/top-screen/user/user.webp";
import MENU_ACTIVE_IMAGE from "/assets/images/settings/top-screen/user/user-active.webp";
import MENU_DISABLED_IMAGE from "/assets/images/settings/top-screen/user/user-disabled.png";
import BIRTHDAY_IMAGE from "/assets/images/settings/top-screen/user/birthday.webp";
import COLOR_IMAGE from "/assets/images/settings/top-screen/user/color.webp";
import MESSAGE_IMAGE from "/assets/images/settings/top-screen/user/message.webp";
import USER_NAME_IMAGE from "/assets/images/settings/top-screen/user/user-name.webp";
const props = defineProps<{
x: number;
y: number;
@@ -14,23 +6,7 @@ const props = defineProps<{
const settingsStore = useSettingsStore();
const [
menuImage,
menuActiveImage,
menuDisabledImage,
birthdayImage,
colorImage,
messageImage,
userNameImage,
] = useImages(
MENU_IMAGE,
MENU_ACTIVE_IMAGE,
MENU_DISABLED_IMAGE,
BIRTHDAY_IMAGE,
COLOR_IMAGE,
MESSAGE_IMAGE,
USER_NAME_IMAGE,
);
const { assets } = useAssets();
const isOpen = computed(() => settingsStore.isMenuOpen("user"));
const isAnyOtherMenuOpen = computed(() =>
@@ -44,27 +20,31 @@ useRender((ctx) => {
if (isOpen.value || animation.playing) {
ctx.drawImage(
birthdayImage!,
assets.settings.topScreen.user.birthday,
-48 + animation.stage2Offset,
-48 + animation.stage1Offset,
);
ctx.drawImage(userNameImage!, 0, -48 + animation.stage1Offset);
ctx.drawImage(
messageImage!,
assets.settings.topScreen.user.userName,
0,
-48 + animation.stage1Offset,
);
ctx.drawImage(
assets.settings.topScreen.user.message,
48 - animation.stage2Offset,
-48 + animation.stage1Offset,
);
ctx.drawImage(
colorImage!,
assets.settings.topScreen.user.color,
0,
-96 + animation.stage2Offset + animation.stage1Offset,
);
ctx.drawImage(menuActiveImage!, 0, 0);
ctx.drawImage(assets.settings.topScreen.user.userActive, 0, 0);
} else if (isAnyOtherMenuOpen.value) {
ctx.drawImage(menuDisabledImage!, 0, 0);
ctx.drawImage(assets.settings.topScreen.user.userDisabled, 0, 0);
} else {
ctx.drawImage(menuImage!, 0, 0);
ctx.drawImage(assets.settings.topScreen.user.user, 0, 0);
}
});