1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
|
// const URLS = [
// "/src/imgs/bg2.png",
// "/src/imgs/topbar.png",
// ];
import { allChars } from "./consts";
import { toKebabCase } from "./helpers";
export const IMGS = {
bg: {} as HTMLImageElement,
topbar: {} as HTMLImageElement,
playerUp: {} as HTMLImageElement,
playerLeft: {} as HTMLImageElement,
playerRight: {} as HTMLImageElement,
bigCircleDown: {} as HTMLImageElement,
bigCircleDownToRight1: {} as HTMLImageElement,
bigCircleDownToRight2: {} as HTMLImageElement,
bigCircleDownToRight3: {} as HTMLImageElement,
bigCircleRight: {} as HTMLImageElement,
bigCircleRightToUp1: {} as HTMLImageElement,
bigCircleRightToUp2: {} as HTMLImageElement,
bigCircleRightToUp3: {} as HTMLImageElement,
bigCircleUp: {} as HTMLImageElement,
bigCircleUpToLeft1: {} as HTMLImageElement,
bigCircleUpToLeft2: {} as HTMLImageElement,
bigCircleUpToLeft3: {} as HTMLImageElement,
bigCircleLeft: {} as HTMLImageElement,
bigCircleLeftToDown1: {} as HTMLImageElement,
bigCircleLeftToDown2: {} as HTMLImageElement,
bigCircleLeftToDown3: {} as HTMLImageElement,
simpleDown: {} as HTMLImageElement,
simpleRot1: {} as HTMLImageElement,
simpleRot2: {} as HTMLImageElement,
simpleRot3: {} as HTMLImageElement,
simpleRot4: {} as HTMLImageElement,
simpleUp: {} as HTMLImageElement, // po 4 klatki na sprite
font: {
white: {} as any,
yellow: {} as any,
blue: {} as any,
red: {} as any,
green: {} as any,
purple: {} as any,
' ': {} as HTMLImageElement,
},
selector: {} as HTMLImageElement,
empty: {} as HTMLImageElement,
};
// window.IMGS = IMGS;
export default async function loadAllImages() {
for (const key in IMGS) {
if (["empty", "font"].includes(key)) continue;
IMGS[key as keyof typeof IMGS] = await asyncImageLoader("/src/imgs/" + toKebabCase(key) + ".png") as any
}
for (const color of ['yellow', 'white']) {
for (const char of allChars) {
(((IMGS.font as any)[color] as any)[char]) = await asyncImageLoader("/src/imgs/font/" + color + "/" + encodeURIComponent(char) + ".png") as any
}
}
IMGS.font[' '] = await asyncImageLoader("/src/imgs/font/ .png")
IMGS.font.yellow[' '] = await asyncImageLoader("/src/imgs/font/ .png")
IMGS.font.white[' '] = await asyncImageLoader("/src/imgs/font/ .png")
}
async function asyncImageLoader(url: string): Promise<HTMLImageElement> {
return new Promise((resolve, reject) => {
const image = new Image()
image.src = url
image.onload = () => resolve(image)
image.onerror = () => { console.log("img did not load", url); reject() }
})
}
|
