From 0590252597948b230760fb0ee57ac6b49e1fe096 Mon Sep 17 00:00:00 2001 From: Reinder Nijhoff Date: Tue, 18 Jun 2024 10:01:48 +0200 Subject: [PATCH] removed enums and statics --- example/package-lock.json | 11 -------- example/package.json | 3 -- example/src/examples/CreateDestructTest.js | 2 +- example/src/examples/Flow.js | 2 +- example/src/examples/FluidDynamics.js | 11 +++++--- example/src/examples/FluidLike.js | 2 +- example/src/examples/Glitch.js | 2 +- example/src/examples/Mask1.js | 2 +- example/src/examples/Mask2.js | 2 +- example/src/examples/Stargate.js | 2 +- src/index.ts | 3 +- src/lib/FrameBuffer.ts | 6 ++-- src/lib/ImageEffectRenderer.ts | 2 +- src/lib/Renderer.ts | 32 +++++++++++----------- src/lib/RendererBuffer.ts | 7 ++--- src/lib/Uniform.ts | 16 +++++------ src/lib/WebGLInstance.ts | 25 ++++++++--------- 17 files changed, 60 insertions(+), 70 deletions(-) diff --git a/example/package-lock.json b/example/package-lock.json index 8cbe636..4e1539b 100644 --- a/example/package-lock.json +++ b/example/package-lock.json @@ -8,9 +8,6 @@ "name": "image-effect-renderer examples", "version": "1.0.0", "license": "MIT", - "dependencies": { - "@mediamonks/image-effect-renderer": "^2.1.3" - }, "devDependencies": { "vite": "^5.1.6" } @@ -453,14 +450,6 @@ "@jridgewell/sourcemap-codec": "^1.4.14" } }, - "node_modules/@mediamonks/image-effect-renderer": { - "version": "2.1.3", - "resolved": "https://registry.npmjs.org/@mediamonks/image-effect-renderer/-/image-effect-renderer-2.1.3.tgz", - "integrity": "sha512-ochWhvFgtgH1s6DAFCyxXzrxNLSk5OaLGYi6M2XtHpcmqsf85/EFlK4X0seJNVmZOTRVDmkS2a0mpt5lVwwEEw==", - "engines": { - "node": ">=16.0.0" - } - }, "node_modules/@rollup/rollup-android-arm-eabi": { "version": "4.13.1", "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.13.1.tgz", diff --git a/example/package.json b/example/package.json index ad288e2..fab6561 100755 --- a/example/package.json +++ b/example/package.json @@ -13,8 +13,5 @@ "license": "MIT", "devDependencies": { "vite": "^5.1.6" - }, - "dependencies": { - "@mediamonks/image-effect-renderer": "^2.1.3" } } diff --git a/example/src/examples/CreateDestructTest.js b/example/src/examples/CreateDestructTest.js index 7df212a..ce88383 100644 --- a/example/src/examples/CreateDestructTest.js +++ b/example/src/examples/CreateDestructTest.js @@ -1,4 +1,4 @@ -import {ImageEffectRenderer} from '@mediamonks/image-effect-renderer'; +import {ImageEffectRenderer} from '../../../src/index'; import Stargate from "./Stargate"; import Flow from "./Flow"; import FluidDynamics from "./FluidDynamics"; diff --git a/example/src/examples/Flow.js b/example/src/examples/Flow.js index a2f47a8..ad40793 100644 --- a/example/src/examples/Flow.js +++ b/example/src/examples/Flow.js @@ -1,4 +1,4 @@ -import {ImageEffectRenderer} from '@mediamonks/image-effect-renderer'; +import {ImageEffectRenderer} from '../../../src/index'; import flow_image from '../shader/flow_image.glsl?raw'; import flow_buffer from '../shader/flow_buffer.glsl?raw'; import ImageLoader from "../utils/ImageLoader"; diff --git a/example/src/examples/FluidDynamics.js b/example/src/examples/FluidDynamics.js index f3f6418..06c76c7 100644 --- a/example/src/examples/FluidDynamics.js +++ b/example/src/examples/FluidDynamics.js @@ -1,4 +1,4 @@ -import {ImageEffectRenderer} from '@mediamonks/image-effect-renderer'; +import {ImageEffectRenderer} from '../../../src/index'; import fluid_dynamics from '../shader/fluid_dynamics.glsl?raw'; import fluid_paint from '../shader/fluid_paint.glsl?raw'; import fluid_image from '../shader/fluid_image.glsl?raw'; @@ -18,17 +18,20 @@ export default class FluidDynamics { this.renderer.createBuffer(0, fluid_dynamics, { type: WebGLRenderingContext.FLOAT, clampX: false, - clampY: false + clampY: false, + pixelRatio: 0.5 }); this.renderer.createBuffer(1, fluid_dynamics, { type: WebGLRenderingContext.FLOAT, clampX: false, - clampY: false + clampY: false, + pixelRatio: 0.5 }); this.renderer.createBuffer(2, fluid_dynamics, { type: WebGLRenderingContext.FLOAT, clampX: false, - clampY: false + clampY: false, + pixelRatio: 0.5 }); this.renderer.buffers[0].setImage(0, this.renderer.buffers[2]); diff --git a/example/src/examples/FluidLike.js b/example/src/examples/FluidLike.js index 386b4b5..4d463e2 100644 --- a/example/src/examples/FluidLike.js +++ b/example/src/examples/FluidLike.js @@ -1,4 +1,4 @@ -import {ImageEffectRenderer} from '@mediamonks/image-effect-renderer'; +import {ImageEffectRenderer} from '../../../src/index'; import shader from '../shader/fluid_like.glsl?raw'; export default class FluidLike { diff --git a/example/src/examples/Glitch.js b/example/src/examples/Glitch.js index 5ebdde0..4bc49a2 100644 --- a/example/src/examples/Glitch.js +++ b/example/src/examples/Glitch.js @@ -1,4 +1,4 @@ -import {ImageEffectRenderer} from '@mediamonks/image-effect-renderer'; +import {ImageEffectRenderer} from '../../../src/index'; import shader from '../shader/glitch.glsl?raw'; import ImageLoader from "../utils/ImageLoader"; diff --git a/example/src/examples/Mask1.js b/example/src/examples/Mask1.js index b89b799..fcb27eb 100644 --- a/example/src/examples/Mask1.js +++ b/example/src/examples/Mask1.js @@ -1,4 +1,4 @@ -import {ImageEffectRenderer} from '@mediamonks/image-effect-renderer'; +import {ImageEffectRenderer} from '../../../src/index'; import shader from '../shader/mask_1.glsl?raw'; import ImageLoader from "../utils/ImageLoader"; diff --git a/example/src/examples/Mask2.js b/example/src/examples/Mask2.js index 1544b28..746dc5e 100644 --- a/example/src/examples/Mask2.js +++ b/example/src/examples/Mask2.js @@ -1,4 +1,4 @@ -import {ImageEffectRenderer} from '@mediamonks/image-effect-renderer'; +import {ImageEffectRenderer} from '../../../src/index'; import shader from '../shader/mask_2.glsl?raw'; import ImageLoader from "../utils/ImageLoader"; diff --git a/example/src/examples/Stargate.js b/example/src/examples/Stargate.js index eeb78dc..70d382a 100644 --- a/example/src/examples/Stargate.js +++ b/example/src/examples/Stargate.js @@ -1,4 +1,4 @@ -import {ImageEffectRenderer} from '@mediamonks/image-effect-renderer'; +import {ImageEffectRenderer} from '../../../src/index'; import shader from '../shader/stargate.glsl?raw'; export default class Stargate { diff --git a/src/index.ts b/src/index.ts index 9452d2f..61d9827 100755 --- a/src/index.ts +++ b/src/index.ts @@ -1,5 +1,6 @@ -export {default as ImageEffectRenderer} from './lib/ImageEffectRenderer.js'; +export * from './lib/ImageEffectRenderer.js'; export type {RendererInstance} from './lib/RendererInstance.js'; export type {RendererBuffer} from './lib/RendererBuffer.js'; export type {ImageOptions} from './lib/Renderer.js'; export type {ImageEffectRendererOptions} from './lib/ImageEffectRenderer.js'; +export type {BufferOptions} from './lib/RendererBuffer.js'; \ No newline at end of file diff --git a/src/lib/FrameBuffer.ts b/src/lib/FrameBuffer.ts index c4d47b9..79f5f18 100644 --- a/src/lib/FrameBuffer.ts +++ b/src/lib/FrameBuffer.ts @@ -2,11 +2,13 @@ import {WebGLInstance} from "./WebGLInstance.js"; export type FrameBufferOptions = { type: number, + pixelRatio: number, msaa: boolean, } -const defaultFrameBufferOptions: FrameBufferOptions = { - type: WebGLRenderingContext.UNSIGNED_BYTE, +export const defaultFrameBufferOptions: FrameBufferOptions = { + type: 5121, // WebGLRenderingContext.UNSIGNED_BYTE, + pixelRatio: 1, msaa: false, }; diff --git a/src/lib/ImageEffectRenderer.ts b/src/lib/ImageEffectRenderer.ts index dbf6673..0fce502 100644 --- a/src/lib/ImageEffectRenderer.ts +++ b/src/lib/ImageEffectRenderer.ts @@ -30,7 +30,7 @@ const poolWebGLInstance: WebGLInstance[] = []; let sharedInstance: WebGLInstance; let sharedTime: number = -1; -export default class ImageEffectRenderer { +export class ImageEffectRenderer { constructor() { throw new Error('Use ImageEffectRenderer.createTemporary to create an ImageEffectRenderer'); } diff --git a/src/lib/Renderer.ts b/src/lib/Renderer.ts index c5f7ecc..46a8068 100644 --- a/src/lib/Renderer.ts +++ b/src/lib/Renderer.ts @@ -1,5 +1,5 @@ import {WebGLInstance} from './WebGLInstance.js'; -import Uniform, {UniformType} from "./Uniform.js"; +import Uniform, {UNIFORM_FLOAT, UNIFORM_INT, UNIFORM_MATRIX, UNIFORM_VEC2, UNIFORM_VEC3, UNIFORM_VEC4, type UniformType} from "./Uniform.js"; import type Program from "./Program.js"; import type {RendererBuffer} from "./RendererBuffer.js"; import type {Texture} from "./Texture.js.js"; @@ -26,11 +26,11 @@ export type ImageOptions = { } export const defaultImageOptions: ImageOptions = { - clampX: true, - clampY: true, - flipY: false, - useMipmap: true, - useCache: true, + clampX: true, + clampY: true, + flipY: false, + useMipmap: true, + useCache: true, minFilterLinear: true, magFilterLinear: true, }; @@ -98,8 +98,8 @@ export class Renderer { this.textures[slotIndex] = { texture: undefined, - buffer: image, - cached: false, + buffer: image, + cached: false, }; this.gl.setTextureParameter(image.src.texture, bufferOptions); @@ -121,8 +121,8 @@ export class Renderer { } this.textures[slotIndex] = { texture: texture, - buffer: undefined, - cached: imageOptions.useCache, + buffer: undefined, + cached: imageOptions.useCache, }; context.bindTexture(context.TEXTURE_2D, texture); context.pixelStorei(context.UNPACK_FLIP_Y_WEBGL, options.flipY ? 1 : 0); @@ -138,7 +138,7 @@ export class Renderer { * @param value - Float value. */ public setUniformFloat(name: string, value: number): void { - this.setUniform(name, UniformType.FLOAT, value, 0, 0, 0, undefined); + this.setUniform(name, UNIFORM_FLOAT, value, 0, 0, 0, undefined); } /** @@ -147,7 +147,7 @@ export class Renderer { * @param value - Integer value. */ public setUniformInt(name: string, value: number): void { - this.setUniform(name, UniformType.INT, value, 0, 0, 0, undefined); + this.setUniform(name, UNIFORM_INT, value, 0, 0, 0, undefined); } /** @@ -157,7 +157,7 @@ export class Renderer { * @param y - Y value. */ public setUniformVec2(name: string, x: number, y: number): void { - this.setUniform(name, UniformType.VEC2, x, y, 0, 0, undefined); + this.setUniform(name, UNIFORM_VEC2, x, y, 0, 0, undefined); } /** @@ -168,7 +168,7 @@ export class Renderer { * @param z - Z value. */ public setUniformVec3(name: string, x: number, y: number, z: number): void { - this.setUniform(name, UniformType.VEC3, x, y, z, 0, undefined); + this.setUniform(name, UNIFORM_VEC3, x, y, z, 0, undefined); } /** @@ -180,7 +180,7 @@ export class Renderer { * @param w - W value. */ public setUniformVec4(name: string, x: number, y: number, z: number, w: number): void { - this.setUniform(name, UniformType.VEC4, x, y, z, w, undefined); + this.setUniform(name, UNIFORM_VEC4, x, y, z, w, undefined); } /** @@ -189,7 +189,7 @@ export class Renderer { * @param matrix - 4X4 matrix. */ public setUniformMatrix(name: string, matrix: Float32Array): void { - this.setUniform(name, UniformType.MATRIX, 0, 0, 0, 0, matrix); + this.setUniform(name, UNIFORM_MATRIX, 0, 0, 0, 0, matrix); } public destruct() { diff --git a/src/lib/RendererBuffer.ts b/src/lib/RendererBuffer.ts index d8a05b1..99e1dcc 100644 --- a/src/lib/RendererBuffer.ts +++ b/src/lib/RendererBuffer.ts @@ -1,4 +1,4 @@ -import {FrameBuffer, type FrameBufferOptions} from "./FrameBuffer.js"; +import {defaultFrameBufferOptions, FrameBuffer, type FrameBufferOptions} from "./FrameBuffer.js"; import {WebGLInstance} from "./WebGLInstance.js"; import {defaultImageOptions, type ImageOptions, Renderer} from "./Renderer.js"; @@ -6,10 +6,9 @@ export type BufferOptions = ImageOptions & FrameBufferOptions; const defaultBufferOptions: BufferOptions = { ...defaultImageOptions, + ...defaultFrameBufferOptions, useMipmap: false, - useCache: false, - type: 5121, // WebGLRenderingContext.UNSIGNED_BYTE, - msaa: false, + useCache: false, }; export class RendererBuffer extends Renderer { diff --git a/src/lib/Uniform.ts b/src/lib/Uniform.ts index 4ee7f2c..38f5e4a 100644 --- a/src/lib/Uniform.ts +++ b/src/lib/Uniform.ts @@ -1,11 +1,11 @@ -export enum UniformType { - INT, - FLOAT, - VEC2, - VEC3, - VEC4, - MATRIX, -} +export const UNIFORM_INT = 0; +export const UNIFORM_FLOAT = 1; +export const UNIFORM_VEC2 = 2; +export const UNIFORM_VEC3 = 3; +export const UNIFORM_VEC4 = 4; +export const UNIFORM_MATRIX = 5; + +export type UniformType = typeof UNIFORM_INT | typeof UNIFORM_FLOAT | typeof UNIFORM_VEC2 | typeof UNIFORM_VEC3 | typeof UNIFORM_VEC4 | typeof UNIFORM_MATRIX; export default class Uniform { public type: UniformType; diff --git a/src/lib/WebGLInstance.ts b/src/lib/WebGLInstance.ts index 5bc8541..92a9d59 100644 --- a/src/lib/WebGLInstance.ts +++ b/src/lib/WebGLInstance.ts @@ -1,7 +1,6 @@ import type {ImageOptions} from "./Renderer.js"; import Program from "./Program.js"; -import type Uniform from "./Uniform.js"; -import {UniformType} from "./Uniform.js"; +import Uniform, {UNIFORM_FLOAT, UNIFORM_INT, UNIFORM_MATRIX, UNIFORM_VEC2, UNIFORM_VEC3, UNIFORM_VEC4} from "./Uniform.js"; import type {Texture} from "./Texture.js.js"; export class WebGLInstance { @@ -17,12 +16,12 @@ export class WebGLInstance { this.canvas = canvas || document.createElement('canvas'); const options = { - premultipliedAlpha: true, - alpha: true, + premultipliedAlpha: true, + alpha: true, preserveDrawingBuffer: false, - antialias: false, - depth: false, - stencil: false, + antialias: false, + depth: false, + stencil: false, }; this.context = this.canvas.getContext('webgl2', options); @@ -118,22 +117,22 @@ export class WebGLInstance { const location = program.getUniformLocation(u.name); if (location !== null) { switch (u.type) { - case UniformType.INT: + case UNIFORM_INT: context.uniform1i(location, u.x); break; - case UniformType.FLOAT: + case UNIFORM_FLOAT: context.uniform1f(location, u.x); break; - case UniformType.VEC2: + case UNIFORM_VEC2: context.uniform2f(location, u.x, u.y); break; - case UniformType.VEC3: + case UNIFORM_VEC3: context.uniform3f(location, u.x, u.y, u.z); break; - case UniformType.VEC4: + case UNIFORM_VEC4: context.uniform4f(location, u.x, u.y, u.z, u.w); break; - case UniformType.MATRIX: + case UNIFORM_MATRIX: context.uniformMatrix4fv(location, false, u.matrix); break; }