-
Notifications
You must be signed in to change notification settings - Fork 0
/
imageloader.js
67 lines (67 loc) · 3.06 KB
/
imageloader.js
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
'use strict'
/*
* Loads images and spritesheet descriptors. Must be created with opengl context.
*/
class ImageLoader {
constructor(gl, images={}, sprites={}, callback = null) {
if (! (images instanceof Map) ) { // If music_paths is not already a map
images = new Map(Object.entries(images));
}
if (! (sprites instanceof Map) ) { // If music_paths is not already a map
sprites = new Map(Object.entries(sprites));
}
this.textures = new Map();
this.count = images.size + sprites.size;
this.countdown = this.count;
if (this.count === 0) {
if (callback !== null) callback(this);
return;
}
const that = this;
for (const [name,path] of images) {
const request = new XMLHttpRequest();
request.open('GET',path,true);
request.responseType = 'blob';
request.onload = () => {
let img = new Image();
img.addEventListener('load', function() {
const texture = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, texture);
gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, img);
//gl.generateMipmap(gl.TEXTURE_2D);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
that.textures.set(name,texture);
that.countdown -= 1;
if (that.countdown === 0 &&callback !== null) callback(that);
});
img.src = URL.createObjectURL(request.response);
};
request.send();
}
this.texture_frames = new Map();
this.model_frames = new Map();
for (const [name,path] of sprites) {
const request = new XMLHttpRequest();
request.open('GET',path,true);
request.responseType = 'json';
request.onload = () => {
const size = request.response.meta.size;
const frames = request.response.frames;
for (const name in frames) {
const frame = frames[name].frame;
this.texture_frames.set(name,(new Mat()).unittotexrecteq(frame.x/size.w,frame.y/size.h,frame.w/size.w,frame.h/size.h));
const largest_dim = size.h>size.w ? size.h:size.w;
const sourceSize = frames[name].spriteSourceSize;
const model_matrix = (new Mat(sourceSize.w,0.0, 0.0,sourceSize.h, 0.0,0.0)).muleq(1/512);
this.model_frames.set(name,model_matrix);
}
this.countdown -= 1;
if (this.countdown === 0 &&callback !== null) callback(this);
};
request.send();
}
}
}