Better asset importing

This commit is contained in:
Criador_Mod
2026-03-29 15:39:40 +01:00
parent eef6de3ae0
commit 0e15617df1
4 changed files with 75 additions and 60 deletions

View File

@@ -1,45 +1,15 @@
import { useEffect, useMemo, useRef, useState } from "react"; import { useEffect, useMemo, useRef, useState } from "react";
// Assets // Assets
import dirtBg from "../assets/images/backgrounds/Dirt_background_JE1.webp"; import * as Assets from "@/utils/ImportAssets";
import endPoemBg from "../assets/images/backgrounds/End_Poem_Background_JE.webp";
import endStoneBg from "../assets/images/backgrounds/End_Stone_background_BE2.webp";
import portalBg from "../assets/images/backgrounds/Portal_Backgrounid_Je1.webp";
import steveAndAlex from "../assets/images/deco/steveandalex.png";
import technoDeco from "../assets/images/deco/techno.png";
import codLoader from "../assets/images/loading/Cod_loading.webp";
import gearLoader from "../assets/images/loading/Gear_loading.webp";
import logoLarge from "../assets/images/logos/MINECRAFT LEGACY EDITION logo large.png";
import logoMedium from "../assets/images/logos/MINECRAFT LEGACY EDITION medium.png";
import logoSmall from "../assets/images/logos/MINECRAFT LEGACY EDITION small.png";
import clickSoundFile from "../assets/audio/sound/click.mp3";
import pigSoundFile from "../assets/audio/sound/pig.mp3";
import ariaMath from "../assets/audio/music/Aria Math.mp3";
import beginning from "../assets/audio/music/Beginning.mp3";
import biomeFest from "../assets/audio/music/Biome Fest.mp3";
import blindSpots from "../assets/audio/music/Blind Spots.mp3";
import clark from "../assets/audio/music/Clark.mp3";
import danny from "../assets/audio/music/Danny.mp3";
import dreiton from "../assets/audio/music/Dreiton.mp3";
import dryHands from "../assets/audio/music/Dry Hands.mp3";
import haggstrom from "../assets/audio/music/Haggstrom.mp3";
import hauntMuskie from "../assets/audio/music/Haunt Muskie.mp3";
import miceOnVenus from "../assets/audio/music/Mice On Venus.mp3";
import minecraftSong from "../assets/audio/music/Minecraft.mp3";
import moogCity from "../assets/audio/music/Moog City 2.mp3";
import subwooferLullaby from "../assets/audio/music/Subwoofer Lullaby.mp3";
import sweden from "../assets/audio/music/Sweden.mp3";
import taswell from "../assets/audio/music/Taswell.mp3";
import wetHands from "../assets/audio/music/Wet Hands.mp3";
// Zustand // Zustand
import useRepoStore from "@/zustand/ReposStore"; import useRepoStore from "@/zustand/ReposStore";
const logoSet = { const logoSet = {
small: logoSmall, small: Assets.logoSmall,
medium: logoMedium, medium: Assets.logoMedium,
large: logoLarge large: Assets.logoLarge
}; };
const COD_EASTER_EGG_CHANCE = 0.0000003; const COD_EASTER_EGG_CHANCE = 0.0000003;
@@ -47,26 +17,26 @@ const MIN_LOADING_MS = 1200;
const LOADER_FADE_MS = 420; const LOADER_FADE_MS = 420;
const MUSIC_TRACKS = [ const MUSIC_TRACKS = [
ariaMath, Assets.ariaMath,
beginning, Assets.beginning,
biomeFest, Assets.biomeFest,
blindSpots, Assets.blindSpots,
clark, Assets.clark,
danny, Assets.danny,
dreiton, Assets.dreiton,
dryHands, Assets.dryHands,
haggstrom, Assets.haggstrom,
hauntMuskie, Assets.hauntMuskie,
miceOnVenus, Assets.miceOnVenus,
minecraftSong, Assets.minecraftSong,
moogCity, Assets.moogCity,
subwooferLullaby, Assets.subwooferLullaby,
sweden, Assets.sweden,
taswell, Assets.taswell,
wetHands Assets.wetHands
]; ];
const BACKGROUND_IMAGES = [dirtBg, endPoemBg, endStoneBg, portalBg]; const BACKGROUND_IMAGES = [Assets.dirtBg, Assets.endPoemBg, Assets.endStoneBg, Assets.portalBg];
function randomItem(list) { function randomItem(list) {
return list[Math.floor(Math.random() * list.length)]; return list[Math.floor(Math.random() * list.length)];
@@ -90,9 +60,9 @@ function App() {
const backgroundImage = useMemo(() => randomItem(BACKGROUND_IMAGES), []); const backgroundImage = useMemo(() => randomItem(BACKGROUND_IMAGES), []);
const loadingImage = useMemo(() => { const loadingImage = useMemo(() => {
return Math.random() < COD_EASTER_EGG_CHANCE ? codLoader : gearLoader; return Math.random() < COD_EASTER_EGG_CHANCE ? Assets.codLoader : Assets.gearLoader;
}, []); }, []);
const isCodLoadingScreen = loadingImage === codLoader; const isCodLoadingScreen = loadingImage === Assets.codLoader;
useEffect(() => { useEffect(() => {
if (loading) return; if (loading) return;
@@ -120,7 +90,7 @@ function App() {
backgroundMusicRef.current = music; backgroundMusicRef.current = music;
clickPoolRef.current = Array.from({ length: 5 }, () => { clickPoolRef.current = Array.from({ length: 5 }, () => {
const click = new Audio(clickSoundFile); const click = new Audio(Assets.clickSoundFile);
click.volume = 0.2; click.volume = 0.2;
click.preload = "auto"; click.preload = "auto";
return click; return click;
@@ -166,7 +136,7 @@ function App() {
}, []); }, []);
useEffect(() => { useEffect(() => {
const pig = new Audio(pigSoundFile); const pig = new Audio(Assets.pigSoundFile);
pig.volume = 0.35; pig.volume = 0.35;
pig.preload = "auto"; pig.preload = "auto";
pigAudioRef.current = pig; pigAudioRef.current = pig;
@@ -227,7 +197,7 @@ function App() {
rel="noreferrer" rel="noreferrer"
aria-label="Visit Minecraft.net" aria-label="Visit Minecraft.net"
> >
<img src={steveAndAlex} alt="Steve and Alex" className="top-link-image" /> <img src={Assets.steveAndAlex} alt="Steve and Alex" className="top-link-image" />
</a> </a>
{showLoader && ( {showLoader && (
@@ -359,7 +329,7 @@ function App() {
onMouseEnter={handleTechnoMouseEnter} onMouseEnter={handleTechnoMouseEnter}
onMouseLeave={handleTechnoMouseLeave} onMouseLeave={handleTechnoMouseLeave}
> >
<img src={technoDeco} alt="Technoblade" className="techno-pig" /> <img src={Assets.technoDeco} alt="Technoblade" className="techno-pig" />
<div className="techno-text"> <div className="techno-text">
<p className="techno-quote">"If you wish to defeat me, train for another 100 years."</p> <p className="techno-quote">"If you wish to defeat me, train for another 100 years."</p>
<p className="techno-attr">- Technoblade</p> <p className="techno-attr">- Technoblade</p>

10
src/global.d.ts vendored Normal file
View File

@@ -0,0 +1,10 @@
/// <reference types="vite/client" />
declare module "*.png";
declare module "*.jpg";
declare module "*.jpeg";
declare module "*.webp";
declare module "*.svg";
declare module "*.mp3";
declare module "*.wav";
declare module "*.ogg";

View File

@@ -1,8 +1,8 @@
// Types // Types
import { IProjects } from "../types/projects"; import { IProjects } from "@/types/projects";
// Zustand // Zustand
import useReposStore from "../zustand/ReposStore"; import useReposStore from "@/zustand/ReposStore";
type ReposResponse = { type ReposResponse = {
repos: IProjects[]; repos: IProjects[];

35
src/utils/ImportAssets.ts Normal file
View File

@@ -0,0 +1,35 @@
// Backgrounds
export { default as dirtBg } from "../../assets/images/backgrounds/Dirt_background_JE1.webp";
export { default as endPoemBg } from "../../assets/images/backgrounds/End_Poem_Background_JE.webp";
export { default as endStoneBg } from "../../assets/images/backgrounds/End_Stone_background_BE2.webp";
export { default as portalBg } from "../../assets/images/backgrounds/Portal_Backgrounid_Je1.webp";
// Images
export { default as steveAndAlex } from "../../assets/images/deco/steveandalex.png";
export { default as technoDeco } from "../../assets/images/deco/techno.png";
export { default as codLoader } from "../../assets/images/loading/Cod_loading.webp";
export { default as gearLoader } from "../../assets/images/loading/Gear_loading.webp";
export { default as logoLarge } from "../../assets/images/logos/MINECRAFT LEGACY EDITION logo large.png";
export { default as logoMedium } from "../../assets/images/logos/MINECRAFT LEGACY EDITION medium.png";
export { default as logoSmall } from "../../assets/images/logos/MINECRAFT LEGACY EDITION small.png";
// Audio
export { default as clickSoundFile } from "../../assets/audio/sound/click.mp3";
export { default as pigSoundFile } from "../../assets/audio/sound/pig.mp3";
export { default as ariaMath } from "../../assets/audio/music/Aria Math.mp3";
export { default as beginning } from "../../assets/audio/music/Beginning.mp3";
export { default as biomeFest } from "../../assets/audio/music/Biome Fest.mp3";
export { default as blindSpots } from "../../assets/audio/music/Blind Spots.mp3";
export { default as clark } from "../../assets/audio/music/Clark.mp3";
export { default as danny } from "../../assets/audio/music/Danny.mp3";
export { default as dreiton } from "../../assets/audio/music/Dreiton.mp3";
export { default as dryHands } from "../../assets/audio/music/Dry Hands.mp3";
export { default as haggstrom } from "../../assets/audio/music/Haggstrom.mp3";
export { default as hauntMuskie } from "../../assets/audio/music/Haunt Muskie.mp3";
export { default as miceOnVenus } from "../../assets/audio/music/Mice On Venus.mp3";
export { default as minecraftSong } from "../../assets/audio/music/Minecraft.mp3";
export { default as moogCity } from "../../assets/audio/music/Moog City 2.mp3";
export { default as subwooferLullaby } from "../../assets/audio/music/Subwoofer Lullaby.mp3";
export { default as sweden } from "../../assets/audio/music/Sweden.mp3";
export { default as taswell } from "../../assets/audio/music/Taswell.mp3";
export { default as wetHands } from "../../assets/audio/music/Wet Hands.mp3";