@tolokoban/tgd
Version:
ToloGameDev library for WebGL2
108 lines • 9.72 kB
JavaScript
import { TgdDataset } from "./../../dataset/dataset.js";
import { TgdProgram } from "./../../program/index.js";
import { webglPresetCull, webglPresetDepth } from "./../../utils/index.js";
import { TgdVertexArray } from "./../../vao/index.js";
import { TgdPainter } from "../painter.js";
import { TgdPainterState } from "../state/index.js";
import { FRAG } from "./background.frag.js";
import { VERT } from "./background.vert.js";
export class TgdPainterBackground extends TgdPainter {
constructor(context, { texture, x = 0, y = 0, z = 0.999999, zoom = 1, scaleX = 1, scaleY = 1, mode = "cover", } = {}) {
super();
this.context = context;
/**
* With a zoom of **1**, the image will have the smaller size to cover
* the whole scene.
*/
this.zoom = 1;
this.x = 0;
this.y = 0;
this.z = 1;
this.mode = "cover";
this.texture = texture;
this.mode = mode;
this.x = x;
this.y = y;
this.z = z;
this.zoom = zoom;
this.texture = texture;
this.program = new TgdProgram(context.gl, {
vert: VERT,
frag: FRAG,
});
const dataset = new TgdDataset({
attPoint: "vec2",
attUV: "vec2",
});
dataset.set("attPoint", new Float32Array([
-1 * scaleX,
+1 * scaleY,
+1 * scaleX,
+1 * scaleY,
-1 * scaleX,
-1 * scaleY,
+1 * scaleX,
-1 * scaleY,
]));
dataset.set("attUV", new Float32Array([0, 0, 1, 0, 0, 1, 1, 1]));
this.vao = new TgdVertexArray(context.gl, this.program, [dataset]);
}
delete() {
const { program, vao } = this;
program.delete();
vao.delete();
}
paint() {
const { gl } = this.context;
const { vao, program, texture, zoom, x, y, z, mode } = this;
program.use();
const { scaleX, scaleY } = mode === "cover" ? this.getScaleForCover() : this.getScaleForContain();
program.uniform2f("uniScale", scaleX, scaleY);
program.uniform2f("uniScroll", x, y);
program.uniform1f("uniZoom", 1 / zoom);
program.uniform1f("uniZ", z);
texture?.activate(0, program, "uniTexture");
TgdPainterState.do(this.context, {
cull: webglPresetCull.off,
depth: webglPresetDepth.off,
action: () => {
vao.bind();
gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
vao.unbind();
},
});
gl.disable(gl.CULL_FACE);
}
getScaleForCover() {
const { texture, context } = this;
if (!texture)
return { scaleX: 1, scaleY: 1 };
const { drawingBufferWidth: width, drawingBufferHeight: height } = context.gl;
const horizontal = texture.width * height > texture.height * width;
const scaleX = horizontal ? (texture.width * height) / (width * texture.height) : 1;
const scaleY = horizontal ? 1 : (texture.height * width) / (height * texture.width);
return { scaleX, scaleY };
}
getScaleForContain() {
const { texture, context } = this;
if (!texture)
return { scaleX: 1, scaleY: 1 };
const { drawingBufferWidth: width, drawingBufferHeight: height } = context.gl;
const aspectRatio = width / height;
const aspectRatioTexture = texture.width / texture.height;
const sx = width / texture.width;
const sy = height / texture.height;
if (sx > sy) {
// We took all vertical space and have void on right an left.
return {
scaleX: aspectRatioTexture / aspectRatio,
scaleY: 1,
};
}
return {
scaleX: 1,
scaleY: aspectRatio / aspectRatioTexture,
};
}
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFja2dyb3VuZC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9wYWludGVyL2JhY2tncm91bmQvYmFja2dyb3VuZC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFDQSxPQUFPLEVBQUUsVUFBVSxFQUFFLE1BQU0sc0JBQXNCLENBQUE7QUFDakQsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLGNBQWMsQ0FBQTtBQUd6QyxPQUFPLEVBQUUsZUFBZSxFQUFFLGdCQUFnQixFQUFFLE1BQU0sWUFBWSxDQUFBO0FBQzlELE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSxVQUFVLENBQUE7QUFDekMsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLFlBQVksQ0FBQTtBQUN2QyxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sVUFBVSxDQUFBO0FBQzFDLE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUN4QyxPQUFPLEVBQUUsSUFBSSxFQUFFLE1BQU0sbUJBQW1CLENBQUE7QUE0QnhDLE1BQU0sT0FBTyxvQkFBcUIsU0FBUSxVQUFVO0lBZ0JoRCxZQUNxQixPQUdoQixFQUNELEVBQ0ksT0FBTyxFQUNQLENBQUMsR0FBRyxDQUFDLEVBQ0wsQ0FBQyxHQUFHLENBQUMsRUFDTCxDQUFDLEdBQUcsUUFBUSxFQUNaLElBQUksR0FBRyxDQUFDLEVBQ1IsTUFBTSxHQUFHLENBQUMsRUFDVixNQUFNLEdBQUcsQ0FBQyxFQUNWLElBQUksR0FBRyxPQUFPLE1BQ3dCLEVBQUU7UUFFNUMsS0FBSyxFQUFFLENBQUE7UUFmVSxZQUFPLEdBQVAsT0FBTyxDQUd2QjtRQWRMOzs7V0FHRztRQUNJLFNBQUksR0FBRyxDQUFDLENBQUE7UUFDUixNQUFDLEdBQUcsQ0FBQyxDQUFBO1FBQ0wsTUFBQyxHQUFHLENBQUMsQ0FBQTtRQUNMLE1BQUMsR0FBRyxDQUFDLENBQUE7UUFDTCxTQUFJLEdBQXdCLE9BQU8sQ0FBQTtRQW1CdEMsSUFBSSxDQUFD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