ts-game-engine/lib/Materials/SkyboxMaterial.js

Simple WebGL game/render engine written in TypeScript

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const Material_1 = require("./Material");
const Constants_1 = require("../Constants");
const TextureCube_1 = require("../Textures/TextureCube");
class SkyboxMaterial extends Material_1.Material {
    constructor(scene) {
        super(scene, vsSource, fsSource);
        this.Shader.DefineUniform(Constants_1.VIEW_DIRECTION_PROJECTION_INVERSE_MATRIX_UNIFORM, 10 /* Matrix4 */);
        this.Shader.DefineUniform("uSkybox", 12 /* SamplerCube */);
        this.skyboxTexture = TextureCube_1.TextureCube.GetBlank(scene);
    }
    get SkyboxTexture() { return this.skyboxTexture; }
    set SkyboxTexture(texture) { this.skyboxTexture = texture; }
    SetUniforms(globalUniforms) {
        this.Shader.SetMatrix4Uniform(Constants_1.VIEW_DIRECTION_PROJECTION_INVERSE_MATRIX_UNIFORM, globalUniforms.viewDirectionProjectionInverseMatrix);
        this.Shader.SetSamplerUniform("uSkybox", 0, this.skyboxTexture, 34067 /* TextureCubeMap */);
    }
}
exports.SkyboxMaterial = SkyboxMaterial;
const vsSource = `#version 300 es
layout(location = ${Constants_1.POSITION_ATTRIBUTE_LOCATION}) in vec3 ${Constants_1.POSITION_ATTRIBUTE};

out vec4 vPosition;

void main() {
    vec2 scaledPosition = ${Constants_1.POSITION_ATTRIBUTE}.xy * 2.0; // scale quad from -.5 +.5 range to -1 +1
    vPosition = vec4(scaledPosition, 1, 1);
    gl_Position = vPosition;
}`;
const fsSource = `#version 300 es
precision mediump float;

in vec4 vPosition;

uniform mat4 ${Constants_1.VIEW_DIRECTION_PROJECTION_INVERSE_MATRIX_UNIFORM};
uniform samplerCube uSkybox;

out vec4 fragColor;

void main() {
    vec4 t = ${Constants_1.VIEW_DIRECTION_PROJECTION_INVERSE_MATRIX_UNIFORM} * vPosition;
    fragColor = texture(uSkybox, normalize(t.xyz / t.w));
}`;