Start using the sdf-2d library
This commit is contained in:
schmelczerandras
parent
99f47e2961
commit
1b7dee4be0
50 changed files with 314 additions and 2119 deletions
|
|
@ -1,9 +1,8 @@
|
|||
import { vec3 } from 'gl-matrix';
|
||||
import { CircleLight, compile, Flashlight, Renderer } from 'sdf-2d';
|
||||
import { CommandBroadcaster } from './commands/command-broadcaster';
|
||||
import { BeforeRenderCommand } from './graphics/commands/before-render';
|
||||
import { RenderCommand } from './graphics/commands/render';
|
||||
import { IRenderer } from './graphics/i-renderer';
|
||||
import { WebGl2Renderer } from './graphics/rendering/webgl2-renderer';
|
||||
import { timeIt } from './helper/timing';
|
||||
import { prettyPrint } from './helper/pretty-print';
|
||||
import { IGame } from './i-game';
|
||||
import { KeyboardListener } from './input/keyboard-listener';
|
||||
import { MouseListener } from './input/mouse-listener';
|
||||
|
|
@ -12,13 +11,14 @@ import { GameObject } from './objects/game-object';
|
|||
import { Objects } from './objects/objects';
|
||||
import { Camera } from './objects/types/camera';
|
||||
import { Character } from './objects/types/character';
|
||||
import { InfoText } from './objects/types/info-text';
|
||||
import { createDungeon } from './objects/world/create-dungeon';
|
||||
import { MoveToCommand } from './physics/commands/move-to';
|
||||
import { StepCommand } from './physics/commands/step';
|
||||
import { TeleportToCommand } from './physics/commands/teleport-to';
|
||||
import { Physics } from './physics/physics';
|
||||
import { BoundingBoxBase } from './shapes/bounding-box-base';
|
||||
import { CircleShape } from './shapes/types/circle-shape';
|
||||
import { TunnelShape } from './shapes/types/tunnel-shape';
|
||||
|
||||
export class Game implements IGame {
|
||||
public readonly objects = new Objects();
|
||||
|
|
@ -26,14 +26,13 @@ export class Game implements IGame {
|
|||
public readonly camera = new Camera();
|
||||
private previousTime?: DOMHighResTimeStamp = null;
|
||||
private previousFpsValues: Array<number> = [];
|
||||
private infoText = new InfoText();
|
||||
private character: Character;
|
||||
private renderer: IRenderer;
|
||||
private initializeRendererPromise: Promise<void>;
|
||||
private renderer: Renderer;
|
||||
private rendererPromise: Promise<Renderer>;
|
||||
private overlay: HTMLElement = document.querySelector('#overlay');
|
||||
|
||||
constructor() {
|
||||
const canvas: HTMLCanvasElement = document.querySelector('canvas#main');
|
||||
const overlay: HTMLElement = document.querySelector('#overlay');
|
||||
|
||||
document.addEventListener('visibilitychange', this.handleVisibilityChange.bind(this));
|
||||
|
||||
|
|
@ -46,14 +45,31 @@ export class Game implements IGame {
|
|||
[this.objects]
|
||||
);
|
||||
|
||||
this.renderer = new WebGl2Renderer(canvas, overlay);
|
||||
this.initializeRendererPromise = this.renderer.initialize();
|
||||
this.rendererPromise = compile(
|
||||
canvas,
|
||||
[
|
||||
CircleShape.descriptor,
|
||||
TunnelShape.descriptor,
|
||||
Flashlight.descriptor,
|
||||
CircleLight.descriptor,
|
||||
],
|
||||
[
|
||||
vec3.fromValues(0, 0, 0),
|
||||
vec3.fromValues(224 / 255, 96 / 255, 126 / 255),
|
||||
vec3.fromValues(119 / 255, 173 / 255, 120 / 255),
|
||||
]
|
||||
);
|
||||
this.initializeScene();
|
||||
this.physics.start();
|
||||
}
|
||||
|
||||
public async start(): Promise<void> {
|
||||
await this.initializeRendererPromise;
|
||||
this.renderer = await this.rendererPromise;
|
||||
this.renderer.setRuntimeSettings({
|
||||
isWorldInverted: true,
|
||||
ambientLight: vec3.fromValues(0.35, 0.1, 0.45),
|
||||
shadowLength: 300,
|
||||
});
|
||||
requestAnimationFrame(this.gameLoop.bind(this));
|
||||
}
|
||||
|
||||
|
|
@ -70,8 +86,6 @@ export class Game implements IGame {
|
|||
}
|
||||
|
||||
private initializeScene() {
|
||||
this.objects.addObject(this.infoText);
|
||||
|
||||
const start = createDungeon(this.objects, this.physics);
|
||||
createDungeon(this.objects, this.physics);
|
||||
|
||||
|
|
@ -90,7 +104,6 @@ export class Game implements IGame {
|
|||
}
|
||||
}
|
||||
|
||||
@timeIt()
|
||||
private gameLoop(time: DOMHighResTimeStamp) {
|
||||
if (this.previousTime === null) {
|
||||
this.previousTime = time;
|
||||
|
|
@ -98,44 +111,26 @@ export class Game implements IGame {
|
|||
|
||||
const deltaTime = time - this.previousTime;
|
||||
this.previousTime = time;
|
||||
this.calculateFps(deltaTime);
|
||||
|
||||
this.objects.sendCommand(new StepCommand(deltaTime));
|
||||
this.camera.sendCommand(new MoveToCommand(this.character.position));
|
||||
|
||||
this.renderer.startFrame(deltaTime);
|
||||
|
||||
this.camera.sendCommand(new BeforeRenderCommand(this.renderer));
|
||||
this.camera.sendCommand(new RenderCommand(this.renderer));
|
||||
|
||||
const shouldBeDrawn = this.physics
|
||||
.findIntersecting(this.camera.viewArea)
|
||||
.map((b) => b.shape?.gameObject);
|
||||
|
||||
for (const object of shouldBeDrawn) {
|
||||
object?.sendCommand(new BeforeRenderCommand(this.renderer));
|
||||
object?.sendCommand(new RenderCommand(this.renderer));
|
||||
}
|
||||
|
||||
this.character.sendCommand(new RenderCommand(this.renderer));
|
||||
this.infoText.sendCommand(new RenderCommand(this.renderer));
|
||||
this.renderer.finishFrame();
|
||||
this.renderer.renderDrawables();
|
||||
|
||||
this.overlay.innerText = prettyPrint(this.renderer.insights);
|
||||
|
||||
localStorage.setItem('character-position', JSON.stringify(this.character.position));
|
||||
window.requestAnimationFrame(this.gameLoop.bind(this));
|
||||
}
|
||||
|
||||
private calculateFps(deltaTime: number) {
|
||||
this.previousFpsValues.push(1000 / deltaTime);
|
||||
if (this.previousFpsValues.length > 30) {
|
||||
this.previousFpsValues.sort();
|
||||
const min = this.previousFpsValues[0];
|
||||
const median = this.previousFpsValues[
|
||||
Math.floor(this.previousFpsValues.length / 2)
|
||||
];
|
||||
|
||||
InfoText.modifyRecord('FPS', { min, median });
|
||||
|
||||
this.previousFpsValues = [];
|
||||
}
|
||||
requestAnimationFrame(this.gameLoop.bind(this));
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,12 +0,0 @@
|
|||
import { Command } from '../../commands/command';
|
||||
import { IRenderer } from '../i-renderer';
|
||||
|
||||
export class BeforeRenderCommand extends Command {
|
||||
public constructor(public readonly renderer?: IRenderer) {
|
||||
super();
|
||||
}
|
||||
|
||||
public get type(): string {
|
||||
return 'BeforeRenderCommand';
|
||||
}
|
||||
}
|
||||
|
|
@ -1,8 +1,8 @@
|
|||
import { Renderer } from 'sdf-2d';
|
||||
import { Command } from '../../commands/command';
|
||||
import { IRenderer } from '../../graphics/i-renderer';
|
||||
|
||||
export class RenderCommand extends Command {
|
||||
public constructor(public readonly renderer?: IRenderer) {
|
||||
public constructor(public readonly renderer?: Renderer) {
|
||||
super();
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,32 +0,0 @@
|
|||
import { mat2d, vec2 } from 'gl-matrix';
|
||||
import { Blob } from '../../shapes/types/blob';
|
||||
import { settings } from '../settings';
|
||||
import { IDrawable } from './i-drawable';
|
||||
import { IDrawableDescriptor } from './i-drawable-descriptor';
|
||||
|
||||
export class DrawableBlob extends Blob implements IDrawable {
|
||||
public static descriptor: IDrawableDescriptor = {
|
||||
uniformName: 'blobs',
|
||||
countMacroName: 'blobCount',
|
||||
shaderCombinationSteps: settings.shaderCombinations.blobSteps,
|
||||
empty: new DrawableBlob(vec2.fromValues(0, 0)),
|
||||
};
|
||||
|
||||
public serializeToUniforms(uniforms: any, scale: number, transform: mat2d): void {
|
||||
const { uniformName } = DrawableBlob.descriptor;
|
||||
if (!Object.prototype.hasOwnProperty.call(uniforms, uniformName)) {
|
||||
uniforms[uniformName] = [];
|
||||
}
|
||||
uniforms[uniformName].push({
|
||||
headCenter: vec2.transformMat2d(vec2.create(), this.head.center, transform),
|
||||
leftFootCenter: vec2.transformMat2d(vec2.create(), this.leftFoot.center, transform),
|
||||
rightFootCenter: vec2.transformMat2d(
|
||||
vec2.create(),
|
||||
this.rightFoot.center,
|
||||
transform
|
||||
),
|
||||
headRadius: this.headRadius * scale,
|
||||
footRadius: this.footRadius * scale,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
@ -1,28 +0,0 @@
|
|||
import { mat2d, vec2 } from 'gl-matrix';
|
||||
import TunnelShape from '../../shapes/types/tunnel-shape';
|
||||
import { settings } from '../settings';
|
||||
import { IDrawable } from './i-drawable';
|
||||
import { IDrawableDescriptor } from './i-drawable-descriptor';
|
||||
|
||||
export class DrawableTunnel extends TunnelShape implements IDrawable {
|
||||
public static descriptor: IDrawableDescriptor = {
|
||||
uniformName: 'lines',
|
||||
countMacroName: 'lineCount',
|
||||
shaderCombinationSteps: settings.shaderCombinations.lineSteps,
|
||||
empty: new DrawableTunnel(vec2.fromValues(0, 0), vec2.fromValues(0, 0), 0, 0),
|
||||
};
|
||||
|
||||
public serializeToUniforms(uniforms: any, scale: number, transform: mat2d): void {
|
||||
const { uniformName } = DrawableTunnel.descriptor;
|
||||
if (!Object.prototype.hasOwnProperty.call(uniforms, uniformName)) {
|
||||
uniforms[uniformName] = [];
|
||||
}
|
||||
|
||||
uniforms[uniformName].push({
|
||||
from: vec2.transformMat2d(vec2.create(), this.from, transform),
|
||||
toFromDelta: vec2.scale(vec2.create(), this.toFromDelta, scale),
|
||||
fromRadius: this.fromRadius * scale,
|
||||
toRadius: this.toRadius * scale,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
import { IDrawable } from './i-drawable';
|
||||
|
||||
export interface IDrawableDescriptor {
|
||||
uniformName: string;
|
||||
countMacroName: string;
|
||||
shaderCombinationSteps: Array<number>;
|
||||
readonly empty: IDrawable;
|
||||
}
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
import { vec2, mat2d } from 'gl-matrix';
|
||||
|
||||
export interface IDrawable {
|
||||
distance(target: vec2): number;
|
||||
serializeToUniforms(uniforms: any, scale: number, transform: mat2d): void;
|
||||
}
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
import { mat2d, vec2, vec3 } from 'gl-matrix';
|
||||
import { settings } from '../../settings';
|
||||
import { IDrawableDescriptor } from '../i-drawable-descriptor';
|
||||
import { ILight } from './i-light';
|
||||
|
||||
export class CircleLight implements ILight {
|
||||
public static descriptor: IDrawableDescriptor = {
|
||||
uniformName: 'circleLights',
|
||||
countMacroName: 'circleLightCount',
|
||||
shaderCombinationSteps: settings.shaderCombinations.circleLightSteps,
|
||||
empty: new CircleLight(vec2.fromValues(0, 0), 0, vec3.fromValues(0, 0, 0), 0),
|
||||
};
|
||||
|
||||
constructor(
|
||||
public center: vec2,
|
||||
public lightDrop: number,
|
||||
public color: vec3,
|
||||
public lightness: number
|
||||
) {}
|
||||
|
||||
public distance(_: vec2): number {
|
||||
return 0;
|
||||
}
|
||||
|
||||
public serializeToUniforms(uniforms: any, scale: number, transform: mat2d): void {
|
||||
const { uniformName } = CircleLight.descriptor;
|
||||
|
||||
if (!Object.prototype.hasOwnProperty.call(uniforms, uniformName)) {
|
||||
uniforms[uniformName] = [];
|
||||
}
|
||||
|
||||
uniforms[uniformName].push({
|
||||
center: vec2.transformMat2d(vec2.create(), this.center, transform),
|
||||
lightDrop: this.lightDrop,
|
||||
value: this.value,
|
||||
});
|
||||
}
|
||||
|
||||
public get value(): vec3 {
|
||||
return vec3.scale(
|
||||
vec3.create(),
|
||||
vec3.normalize(this.color, this.color),
|
||||
this.lightness
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
import { mat2d, vec2, vec3 } from 'gl-matrix';
|
||||
import { settings } from '../../settings';
|
||||
import { IDrawableDescriptor } from '../i-drawable-descriptor';
|
||||
import { ILight } from './i-light';
|
||||
|
||||
export class Flashlight implements ILight {
|
||||
public static descriptor: IDrawableDescriptor = {
|
||||
uniformName: 'flashlights',
|
||||
countMacroName: 'flashlightCount',
|
||||
shaderCombinationSteps: settings.shaderCombinations.flashlightSteps,
|
||||
empty: new Flashlight(
|
||||
vec2.fromValues(0, 0),
|
||||
vec2.fromValues(0, 0),
|
||||
0,
|
||||
vec3.fromValues(0, 0, 0),
|
||||
0
|
||||
),
|
||||
};
|
||||
|
||||
public constructor(
|
||||
public center: vec2,
|
||||
public direction: vec2,
|
||||
public lightDrop: number,
|
||||
public color: vec3,
|
||||
public lightness: number
|
||||
) {}
|
||||
|
||||
public distance(_: vec2): number {
|
||||
return 0;
|
||||
}
|
||||
|
||||
public serializeToUniforms(uniforms: any, scale: number, transform: mat2d): void {
|
||||
const listName = Flashlight.descriptor.uniformName;
|
||||
|
||||
if (!Object.prototype.hasOwnProperty.call(uniforms, listName)) {
|
||||
uniforms[listName] = [];
|
||||
}
|
||||
|
||||
uniforms[listName].push({
|
||||
center: vec2.transformMat2d(vec2.create(), this.center, transform),
|
||||
direction: this.direction,
|
||||
lightDrop: this.lightDrop,
|
||||
value: this.value,
|
||||
});
|
||||
}
|
||||
|
||||
public get value(): vec3 {
|
||||
return vec3.scale(vec3.create(), this.color, this.lightness);
|
||||
}
|
||||
}
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
import { IDrawable } from '../i-drawable';
|
||||
|
||||
export type ILight = IDrawable;
|
||||
|
|
@ -1,13 +0,0 @@
|
|||
import { checkShader } from './check-shader';
|
||||
|
||||
export const checkProgram = (gl: WebGL2RenderingContext, program: WebGLProgram) => {
|
||||
const success = gl.getProgramParameter(program, gl.LINK_STATUS);
|
||||
|
||||
if (!success) {
|
||||
gl.getAttachedShaders(program).forEach((s) => {
|
||||
checkShader(gl, s);
|
||||
});
|
||||
|
||||
throw new Error(gl.getProgramInfoLog(program));
|
||||
}
|
||||
};
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
export const checkShader = (gl: WebGL2RenderingContext, shader: WebGLShader) => {
|
||||
const success = gl.getShaderParameter(shader, gl.COMPILE_STATUS);
|
||||
|
||||
if (!success) {
|
||||
throw new Error(gl.getShaderInfoLog(shader));
|
||||
}
|
||||
};
|
||||
|
|
@ -1,44 +0,0 @@
|
|||
import { waitWhileFalse } from '../../../helper/wait-while-false';
|
||||
import { tryEnableExtension } from '../helper/enable-extension';
|
||||
import { checkProgram } from './check-program';
|
||||
import { createShader } from './create-shader';
|
||||
|
||||
export const createProgram = async (
|
||||
gl: WebGL2RenderingContext,
|
||||
vertexShaderSource: string,
|
||||
fragmentShaderSource: string,
|
||||
substitutions: { [name: string]: string }
|
||||
): Promise<WebGLProgram> => {
|
||||
const program = gl.createProgram();
|
||||
|
||||
const extension = tryEnableExtension(gl, 'KHR_parallel_shader_compile');
|
||||
|
||||
const vertexShader = createShader(
|
||||
gl,
|
||||
gl.VERTEX_SHADER,
|
||||
vertexShaderSource,
|
||||
substitutions
|
||||
);
|
||||
gl.attachShader(program, vertexShader);
|
||||
|
||||
const fragmentShader = createShader(
|
||||
gl,
|
||||
gl.FRAGMENT_SHADER,
|
||||
fragmentShaderSource,
|
||||
substitutions
|
||||
);
|
||||
gl.attachShader(program, fragmentShader);
|
||||
|
||||
gl.linkProgram(program);
|
||||
|
||||
if (extension) {
|
||||
const checkCompileStatus = () =>
|
||||
gl.getProgramParameter(program, extension.COMPLETION_STATUS_KHR);
|
||||
|
||||
await waitWhileFalse(checkCompileStatus);
|
||||
}
|
||||
|
||||
checkProgram(gl, program);
|
||||
|
||||
return program;
|
||||
};
|
||||
|
|
@ -1,17 +0,0 @@
|
|||
export const createShader = (
|
||||
gl: WebGL2RenderingContext,
|
||||
type: GLenum,
|
||||
source: string,
|
||||
substitutions: { [name: string]: string }
|
||||
): WebGLShader => {
|
||||
source = source.replace(/{(.+)}/gm, (_, name: string): string => {
|
||||
const value = substitutions[name];
|
||||
return Number.isInteger(value) ? `${value}.0` : value;
|
||||
});
|
||||
|
||||
const shader = gl.createShader(type);
|
||||
gl.shaderSource(shader, source);
|
||||
gl.compileShader(shader);
|
||||
|
||||
return shader;
|
||||
};
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
import { FrameBuffer } from './frame-buffer';
|
||||
|
||||
export class DefaultFrameBuffer extends FrameBuffer {
|
||||
constructor(gl: WebGL2RenderingContext) {
|
||||
super(gl);
|
||||
this.frameBuffer = null;
|
||||
this.setSize();
|
||||
}
|
||||
|
||||
public setSize(): boolean {
|
||||
const hasChanged = super.setSize();
|
||||
if (hasChanged) {
|
||||
this.gl.canvas.width = this.size.x;
|
||||
this.gl.canvas.height = this.size.y;
|
||||
}
|
||||
|
||||
return hasChanged;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,44 +0,0 @@
|
|||
import { vec2 } from 'gl-matrix';
|
||||
import { settings } from '../../settings';
|
||||
|
||||
export abstract class FrameBuffer {
|
||||
public renderScale = 1;
|
||||
public enableHighDpiRendering = settings.enableHighDpiRendering;
|
||||
|
||||
protected size = vec2.create();
|
||||
protected frameBuffer: WebGLFramebuffer;
|
||||
|
||||
constructor(protected gl: WebGL2RenderingContext) {}
|
||||
|
||||
public bindAndClear(colorInput?: WebGLTexture) {
|
||||
this.gl.bindFramebuffer(this.gl.FRAMEBUFFER, this.frameBuffer);
|
||||
|
||||
if (colorInput !== null) {
|
||||
this.gl.bindTexture(this.gl.TEXTURE_2D, colorInput);
|
||||
}
|
||||
|
||||
this.gl.viewport(0, 0, this.size.x, this.size.y);
|
||||
this.gl.clearColor(0, 0, 0, 0);
|
||||
this.gl.clear(this.gl.COLOR_BUFFER_BIT | this.gl.DEPTH_BUFFER_BIT);
|
||||
}
|
||||
|
||||
public setSize(): boolean {
|
||||
const realToCssPixels =
|
||||
(this.enableHighDpiRendering ? window.devicePixelRatio : 1) * this.renderScale;
|
||||
|
||||
const canvasWidth = (this.gl.canvas as HTMLCanvasElement).clientWidth;
|
||||
const canvasHeight = (this.gl.canvas as HTMLCanvasElement).clientHeight;
|
||||
|
||||
const displayWidth = Math.floor(canvasWidth * realToCssPixels);
|
||||
const displayHeight = Math.floor(canvasHeight * realToCssPixels);
|
||||
|
||||
const oldSize = vec2.clone(this.getSize());
|
||||
this.size = vec2.fromValues(displayWidth, displayHeight);
|
||||
|
||||
return this.size.x != oldSize.x || this.size.y != oldSize.y;
|
||||
}
|
||||
|
||||
public getSize(): vec2 {
|
||||
return this.size;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,89 +0,0 @@
|
|||
import { enableExtension } from '../helper/enable-extension';
|
||||
import { FrameBuffer } from './frame-buffer';
|
||||
|
||||
export class IntermediateFrameBuffer extends FrameBuffer {
|
||||
private frameTexture: WebGLTexture;
|
||||
private floatLinearEnabled = false;
|
||||
|
||||
constructor(gl: WebGL2RenderingContext) {
|
||||
super(gl);
|
||||
|
||||
enableExtension(gl, 'EXT_color_buffer_float');
|
||||
|
||||
try {
|
||||
enableExtension(gl, 'OES_texture_float_linear');
|
||||
this.floatLinearEnabled = true;
|
||||
} catch {
|
||||
// it's okay
|
||||
}
|
||||
|
||||
this.frameTexture = this.gl.createTexture();
|
||||
this.configureTexture();
|
||||
|
||||
this.frameBuffer = this.gl.createFramebuffer();
|
||||
this.configureFrameBuffer();
|
||||
|
||||
this.setSize();
|
||||
}
|
||||
|
||||
public get colorTexture(): WebGLTexture {
|
||||
return this.frameTexture;
|
||||
}
|
||||
|
||||
public setSize(): boolean {
|
||||
const hasChanged = super.setSize();
|
||||
if (hasChanged) {
|
||||
this.gl.bindTexture(this.gl.TEXTURE_2D, this.frameTexture);
|
||||
|
||||
this.gl.texImage2D(
|
||||
this.gl.TEXTURE_2D,
|
||||
0,
|
||||
this.gl.RG16F,
|
||||
this.size.x,
|
||||
this.size.y,
|
||||
0,
|
||||
this.gl.RG,
|
||||
this.gl.FLOAT,
|
||||
null
|
||||
);
|
||||
}
|
||||
|
||||
return hasChanged;
|
||||
}
|
||||
|
||||
private configureTexture() {
|
||||
this.gl.bindTexture(this.gl.TEXTURE_2D, this.frameTexture);
|
||||
this.gl.texParameteri(
|
||||
this.gl.TEXTURE_2D,
|
||||
this.gl.TEXTURE_MAG_FILTER,
|
||||
this.floatLinearEnabled ? this.gl.LINEAR : this.gl.NEAREST
|
||||
);
|
||||
this.gl.texParameteri(
|
||||
this.gl.TEXTURE_2D,
|
||||
this.gl.TEXTURE_MIN_FILTER,
|
||||
this.floatLinearEnabled ? this.gl.LINEAR : this.gl.NEAREST
|
||||
);
|
||||
this.gl.texParameteri(
|
||||
this.gl.TEXTURE_2D,
|
||||
this.gl.TEXTURE_WRAP_S,
|
||||
this.gl.CLAMP_TO_EDGE
|
||||
);
|
||||
this.gl.texParameteri(
|
||||
this.gl.TEXTURE_2D,
|
||||
this.gl.TEXTURE_WRAP_T,
|
||||
this.gl.CLAMP_TO_EDGE
|
||||
);
|
||||
}
|
||||
|
||||
private configureFrameBuffer() {
|
||||
this.gl.bindFramebuffer(this.gl.FRAMEBUFFER, this.frameBuffer);
|
||||
const attachmentPoint = this.gl.COLOR_ATTACHMENT0;
|
||||
this.gl.framebufferTexture2D(
|
||||
this.gl.FRAMEBUFFER,
|
||||
attachmentPoint,
|
||||
this.gl.TEXTURE_2D,
|
||||
this.frameTexture,
|
||||
0
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
@ -1,41 +0,0 @@
|
|||
import { InfoText } from '../../../objects/types/info-text';
|
||||
|
||||
const extensions: Map<string, any> = new Map();
|
||||
|
||||
const printExtensions = () => {
|
||||
const values = {};
|
||||
for (const [k, v] of extensions.entries()) {
|
||||
values[k] = v !== null;
|
||||
}
|
||||
InfoText.modifyRecord('extensions', values);
|
||||
};
|
||||
|
||||
export const tryEnableExtension = (
|
||||
gl: WebGL2RenderingContext,
|
||||
name: string
|
||||
): any | null => {
|
||||
if (extensions.has(name)) {
|
||||
return extensions.get(name);
|
||||
}
|
||||
|
||||
let extension = null;
|
||||
if (gl.getSupportedExtensions().indexOf(name) != -1) {
|
||||
extension = gl.getExtension(name);
|
||||
}
|
||||
|
||||
extensions.set(name, extension);
|
||||
|
||||
printExtensions();
|
||||
|
||||
return extension;
|
||||
};
|
||||
|
||||
export const enableExtension = (gl: WebGL2RenderingContext, name: string): any => {
|
||||
const extension = tryEnableExtension(gl, name);
|
||||
|
||||
if (extension === null) {
|
||||
throw new Error(`Unsupported extension ${name}`);
|
||||
}
|
||||
|
||||
return extension;
|
||||
};
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
export const getWebGl2Context = (canvas: HTMLCanvasElement): WebGL2RenderingContext => {
|
||||
const gl = canvas.getContext('webgl2');
|
||||
|
||||
if (!gl) {
|
||||
throw new Error('WebGl2 is not supported');
|
||||
}
|
||||
|
||||
return gl;
|
||||
};
|
||||
|
|
@ -1,82 +0,0 @@
|
|||
import { mat3, ReadonlyVec3, vec2, vec3 } from 'gl-matrix';
|
||||
|
||||
const loaderMat3 = mat3.create();
|
||||
|
||||
export const loadUniform = (
|
||||
gl: WebGL2RenderingContext,
|
||||
value: any,
|
||||
type: GLenum,
|
||||
location: WebGLUniformLocation
|
||||
): any => {
|
||||
const converters: Map<
|
||||
GLenum,
|
||||
(gl: WebGL2RenderingContext, value: any, location: WebGLUniformLocation) => void
|
||||
> = new Map();
|
||||
{
|
||||
converters.set(WebGL2RenderingContext.FLOAT, (gl, v, l) => {
|
||||
if (v instanceof Array) {
|
||||
if (v.length == 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
gl.uniform1fv(l, new Float32Array(v));
|
||||
} else {
|
||||
gl.uniform1f(l, v);
|
||||
}
|
||||
});
|
||||
|
||||
converters.set(WebGL2RenderingContext.FLOAT_VEC2, (gl, v: vec2 | Array<vec2>, l) => {
|
||||
if (v.length == 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (v[0] instanceof Array) {
|
||||
const result = new Float32Array(v.length * 2);
|
||||
|
||||
for (let i = 0; i < v.length; i++) {
|
||||
result[2 * i] = (v[i] as Array<number>).x;
|
||||
result[2 * i + 1] = (v[i] as Array<number>).y;
|
||||
}
|
||||
|
||||
gl.uniform2fv(l, result);
|
||||
} else {
|
||||
gl.uniform2fv(l, v as vec2);
|
||||
}
|
||||
});
|
||||
|
||||
converters.set(
|
||||
WebGL2RenderingContext.FLOAT_VEC3,
|
||||
(gl, v: ReadonlyVec3 | Array<vec3>, l) => {
|
||||
if (v.length == 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (v[0] instanceof Array) {
|
||||
const result = new Float32Array(v.length * 3);
|
||||
|
||||
for (let i = 0; i < v.length; i++) {
|
||||
result[3 * i] = (v[i] as Array<number>)[0];
|
||||
result[3 * i + 1] = (v[i] as Array<number>)[1];
|
||||
result[3 * i + 2] = (v[i] as Array<number>)[2];
|
||||
}
|
||||
|
||||
gl.uniform3fv(l, result);
|
||||
} else {
|
||||
gl.uniform3fv(l, v as vec3);
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
converters.set(WebGL2RenderingContext.FLOAT_MAT3, (gl, v, l) => {
|
||||
gl.uniformMatrix3fv(l, true, mat3.fromMat2d(loaderMat3, v));
|
||||
});
|
||||
|
||||
converters.set(WebGL2RenderingContext.BOOL, (gl, v, l) => gl.uniform1i(l, v));
|
||||
|
||||
if (!converters.has(type)) {
|
||||
throw new Error(`Unimplemented webgl type: ${type}`);
|
||||
}
|
||||
|
||||
converters.get(type)(gl, value, location);
|
||||
}
|
||||
};
|
||||
Some files were not shown because too many files have changed in this diff Show more
Loading…
Reference in a new issue