rapid-render 0.0.1

package/dist/rapid.umd.cjs

@@ -0,0 +1,42 @@
+(function(n,o){typeof exports=="object"&&typeof module<"u"?o(exports):typeof define=="function"&&define.amd?define(["exports"],o):(n=typeof globalThis<"u"?globalThis:n||self,o(n.rapid={}))})(this,function(n){"use strict";var L=Object.defineProperty;var j=(n,o,c)=>o in n?L(n,o,{enumerable:!0,configurable:!0,writable:!0,value:c}):n[o]=c;var s=(n,o,c)=>(j(n,typeof o!="symbol"?o+"":o,c),c);class f{constructor(e){s(this,"usedElemNum");s(this,"typedArray");s(this,"arrayType");s(this,"maxElemNum");s(this,"bytePerElem");this.usedElemNum=0,this.maxElemNum=64,this.bytePerElem=e.BYTES_PER_ELEMENT,this.arrayType=e,this.typedArray=new e(this.maxElemNum)}clear(){this.usedElemNum=0}resize(e=0){if(e+=this.usedElemNum,e>this.maxElemNum){for(;e>this.maxElemNum;)this.maxElemNum<<=1;const t=this.typedArray;return this.typedArray=new this.arrayType(this.maxElemNum),this.typedArray.set(t),this}}push(e){this.typedArray[this.usedElemNum]=e,this.usedElemNum+=1}pop(e){this.usedElemNum-=e}getArray(e=0,t){return t==null?this.typedArray:this.typedArray.subarray(e,t)}get length(){return this.typedArray.length}}class g extends f{constructor(){super(Float32Array)}pushMat(){const e=this.usedElemNum-6,t=this.typedArray;this.resize(6),this.push(t[e+0]),this.push(t[e+1]),this.push(t[e+2]),this.push(t[e+3]),this.push(t[e+4]),this.push(t[e+5])}popMat(){this.pop(6)}pushIdentity(){this.resize(6),this.push(1),this.push(0),this.push(0),this.push(1),this.push(0),this.push(0)}translate(e,t){const r=this.usedElemNum-6,i=this.typedArray;i[r+4]=i[r+0]*e+i[r+2]*t+i[r+4],i[r+5]=i[r+1]*e+i[r+3]*t+i[r+5]}rotate(e){const t=this.usedElemNum-6,r=this.typedArray,i=Math.cos(e),h=Math.sin(e),u=r[t+0],v=r[t+1],P=r[t+2],x=r[t+3];r[t+0]=u*i-v*h,r[t+1]=u*h+v*i,r[t+2]=P*i-x*h,r[t+3]=P*h+x*i}scale(e,t=e){const r=this.usedElemNum-6,i=this.typedArray;i[r+0]=i[r+0]*e,i[r+1]=i[r+1]*e,i[r+2]=i[r+2]*t,i[r+3]=i[r+3]*t}apply(e,t){const r=this.usedElemNum-6,i=this.typedArray;return[i[r+0]*e+i[r+2]*t+i[r+4],i[r+1]*e+i[r+3]*t+i[r+5]]}}class d{constructor(e,t,r,i){s(this,"r");s(this,"g");s(this,"b");s(this,"a");this.r=e,this.g=t,this.b=r,this.a=i}equals(e){return e.r==this.r&&e.g==this.g&&e.b==this.b&&e.a==this.a}static fromHex(e){e.startsWith("#")&&(e=e.slice(1));const t=parseInt(e.slice(0,2),16)/255,r=parseInt(e.slice(2,4),16)/255,i=parseInt(e.slice(4,6),16)/255;let h=1;return e.length>=8&&(h=parseInt(e.slice(6,8),16)/255),new d(t,r,i,h)}}class T extends f{constructor(t,r,i=t.ARRAY_BUFFER){super(r);s(this,"buffer");s(this,"gl");s(this,"type");s(this,"bufferSize",0);this.gl=t,this.buffer=t.createBuffer(),this.type=i}bindBuffer(){this.gl.bindBuffer(this.type,this.buffer)}bufferData(){const t=this.gl;this.usedElemNum>this.bufferSize?(t.bufferData(this.type,this.getArray(0,this.usedElemNum),t.STATIC_DRAW),this.bufferSize=this.usedElemNum):t.bufferSubData(this.type,0,this.getArray(0,this.usedElemNum))}clear(){super.clear(),this.bufferSize=0}}class b extends T{constructor(t,r,i){super(t,Uint16Array,t.ELEMENT_ARRAY_BUFFER);s(this,"elemVertPerObj");s(this,"objects",0);s(this,"vertexPerObject");s(this,"dirty",!0);this.elemVertPerObj=r,this.vertexPerObject=i}addObject(t){this.objects++,this.resize(this.elemVertPerObj)}setObjects(t){if(t>this.objects){for(;t>this.objects;)this.addObject(this.objects*this.vertexPerObject);this.dirty=!0}}bufferData(){this.dirty&&super.bufferData(),this.dirty=!1}clear(){super.clear(),this.objects=0}}const _=a=>{const e=a.getContext("webgl2")||a.getContext("webgl");if(!e)throw new Error("TODO");return e},p=(a,e,t)=>{const r=a.createShader(t);if(!r)throw new Error("Unable to create webgl shader");if(a.shaderSource(r,e),a.compileShader(r),!a.getShaderParameter(r,a.COMPILE_STATUS)){const h=a.getShaderInfoLog(r);throw console.error("Shader compilation failed:",h),new Error("Unable to compile shader: "+h+e)}return r},m=(a,e,t)=>{var r=a.createProgram(),i=p(a,e,35633),h=p(a,t,35632);if(!r)throw new Error("Unable to create program shader");return a.attachShader(r,i),a.attachShader(r,h),a.linkProgram(r),r};function A(a,e,t){const r=a.createTexture();if(a.bindTexture(a.TEXTURE_2D,r),a.texParameteri(a.TEXTURE_2D,a.TEXTURE_MIN_FILTER,t?a.LINEAR:a.NEAREST),a.texParameteri(a.TEXTURE_2D,a.TEXTURE_MAG_FILTER,t?a.LINEAR:a.NEAREST),a.texParameteri(a.TEXTURE_2D,a.TEXTURE_WRAP_S,a.CLAMP_TO_EDGE),a.texParameteri(a.TEXTURE_2D,a.TEXTURE_WRAP_T,a.CLAMP_TO_EDGE),a.texImage2D(a.TEXTURE_2D,0,a.RGBA,a.RGBA,a.UNSIGNED_BYTE,e),!r)throw new Error("unable to create texture");return r}class R{constructor(e){s(this,"shader");s(this,"defaultShader");s(this,"render");s(this,"gl");s(this,"attributeBuffer");s(this,"attribute");this.render=e,this.gl=e.gl,this.attributeBuffer=new T(this.gl,Float32Array)}createDefaultShader(e){this.defaultShader=m(this.render.gl,e.vs,e.fs),this.attribute=e.attribute}addVertex(e,t,...r){const[i,h]=this.render.matrix.apply(e,t);this.attributeBuffer.push(i),this.attributeBuffer.push(h)}flush(){this.doFlush(),this.reset()}doFlush(){this.attributeBuffer.bufferData()}reset(){this.attributeBuffer.clear()}enter(e){this.shader=e||this.defaultShader;const t=this.gl;t.useProgram(this.shader),this.attributeBuffer.bindBuffer(),this.attribute.forEach(i=>{const h=t.getAttribLocation(this.shader,i.name);t.enableVertexAttribArray(h),t.vertexAttribPointer(h,i.size,i.type,i.normalized||!1,i.stride,i.offset||0)});const r=t.getUniformLocation(this.shader,"uProjectionMatrix");t.uniformMatrix4fv(r,!1,this.render.projection)}exit(){}}const w=`precision mediump float;\r
+\r
+uniform vec4 uColor;\r
+\r
+void main(void) {\r
+    gl_FragColor = uColor;\r
+}\r
+`,M=`precision mediump float;\r
+\r
+attribute vec2 aPosition;\r
+uniform mat4 uProjectionMatrix;\r
+uniform vec4 uColor;\r
+\r
+void main(void) {\r
+    gl_Position = uProjectionMatrix * vec4(aPosition, 0.0, 1.0);\r
+}\r
+`;class y extends R{constructor(t){super(t);s(this,"color",new d(0,0,0,1));s(this,"colorDirty",!0);s(this,"count",0);const r=this.gl,i=2*Float32Array.BYTES_PER_ELEMENT;this.createDefaultShader({fs:w,vs:M,attribute:[{name:"aPosition",size:2,type:r.FLOAT,stride:i}]})}setColor(t){t.equals(this.color)||(this.color=t,this.colorDirty=!0)}drawShape(t,r=new d(0,0,0,1)){this.setColor(r);for(let i=0;i<t.length;i+=2)this.addVertex(t[i],t[i+1]),this.count++;this.flush()}doFlush(){if(this.count>0){super.doFlush();const t=this.gl;if(this.colorDirty){const r=this.color,i=this.gl,h=i.getUniformLocation(this.shader,"uColor");i.uniform4f(h,r.r,r.g,r.b,r.a),this.colorDirty=!1}t.drawArrays(t.TRIANGLE_FAN,0,this.count)}}reset(){super.reset(),this.count=0}enter(t){super.enter(t),this.colorDirty=!0}}const N=`precision lowp float;\r
+uniform sampler2D uTextures[%TEXTURE_NUM%];\r
+\r
+uniform vec4 uColor;\r
+varying vec2 vRegion;\r
+varying float vTextureId;\r
+\r
+void main(void) {\r
+    vec4 color;\r
+    %GET_COLOR%\r
+    \r
+    gl_FragColor = color;\r
+}`,U=`precision lowp float;\r
+attribute vec2 aPosition;\r
+attribute vec2 aRegion;\r
+attribute float aTextureId;\r
+\r
+uniform mat4 uProjectionMatrix;\r
+varying vec2 vRegion;\r
+varying float vTextureId;\r
+\r
+void main(void) {\r
+    gl_Position = uProjectionMatrix * vec4(aPosition, 0.0, 1.0);\r
+    vRegion = aRegion;\r
+    vTextureId = aTextureId;\r
+}`;class X extends b{constructor(e){super(e,6,4)}addObject(e){super.addObject(),this.push(e),this.push(e+3),this.push(e+2),this.push(e),this.push(e+1),this.push(e+2)}}class S extends R{constructor(t){super(t);s(this,"objects",0);s(this,"usedTextures",[]);s(this,"elementArray",new X(this.gl));s(this,"textureUnits");const r=this.gl,i=5*Float32Array.BYTES_PER_ELEMENT;this.createDefaultShader({fs:this.generateFragShader(N,t.MAX_TEXTURE_IMAGE_UNITS),vs:U,attribute:[{name:"aPosition",size:2,type:r.FLOAT,stride:i},{name:"aRegion",size:2,type:r.FLOAT,stride:i,offset:2*Float32Array.BYTES_PER_ELEMENT},{name:"aTextureId",size:1,type:r.FLOAT,stride:i,offset:4*Float32Array.BYTES_PER_ELEMENT}]}),this.textureUnits=Array.from({length:t.MAX_TEXTURE_IMAGE_UNITS},(h,u)=>u)}addVertex(t,r,i,h,u){super.addVertex(t,r),this.attributeBuffer.push(i),this.attributeBuffer.push(h),this.attributeBuffer.push(u)}drawSprite(t,r,i){this.objects>10922&&this.flush();const h=t.base,u=this.useTexture(h.texture);this.objects++,this.elementArray.setObjects(this.objects),this.attributeBuffer.resize(2*6),this.addVertex(r,i,t.clipX,t.clipY,u),this.addVertex(r+t.width,i,t.clipW,t.clipY,u),this.addVertex(r+t.width,i+t.height,t.clipW,t.clipH,u),this.addVertex(r,i+t.height,t.clipX,t.clipH,u)}useTexture(t){let r=this.usedTextures.indexOf(t);return r===-1&&(this.usedTextures.length>=this.render.MAX_TEXTURE_IMAGE_UNITS&&this.flush(),this.usedTextures.push(t),r=this.usedTextures.length-1),r}doFlush(){if(this.objects>0){super.doFlush();const t=this.gl;for(let r=0;r<this.usedTextures.length;r++){const i=this.usedTextures[r];t.activeTexture(t.TEXTURE0+r),t.bindTexture(t.TEXTURE_2D,i)}this.elementArray.bufferData(),t.drawElements(t.TRIANGLES,this.objects*6,t.UNSIGNED_SHORT,0)}}reset(){super.reset(),this.elementArray.clear(),this.objects=0,this.usedTextures=[]}enter(t){super.enter(t);const r=this.gl,i=r.getUniformLocation(this.shader,"uTextures");r.uniform1iv(i,this.textureUnits),this.elementArray.bindBuffer()}generateFragShader(t,r){let i="";t=t.replace("%TEXTURE_NUM%",r.toString());for(let h=0;h<r;h++)h==0?i+=`if(vTextureId == ${h}.0)`:h==r-1?i+="else":i+=`else if(vTextureId == ${h}.0)`,i+=`{color = texture2D(uTextures[${h}], vRegion);}`;return t=t.replace("%GET_COLOR%",i),t}}class I{constructor(e){s(this,"render");s(this,"cache",new Map);this.render=e}async textureFromUrl(e,t=!1){let r=this.cache.get(e);if(!r){const i=await this.loadImage(e);r=l.fromImageSource(this.render,i,t),this.cache.set(e,r)}return new E(r)}async loadImage(e){return new Promise(t=>{const r=new Image;r.onload=()=>{t(r)},r.src=e})}}class l{constructor(e,t,r){s(this,"texture");s(this,"width");s(this,"height");this.texture=e,this.width=t,this.height=r}static fromImageSource(e,t,r=!1){return new l(A(e.gl,t,r),t.width,t.height)}}class E{constructor(e){s(this,"base");s(this,"clipX");s(this,"clipY");s(this,"clipW");s(this,"clipH");s(this,"width");s(this,"height");this.base=e,this.setClipRegion(0,0,e.width,e.height),console.log(this)}setClipRegion(e,t,r,i){this.clipX=e/this.base.width,this.clipY=t/this.base.width,this.clipW=this.clipX+r/this.base.width,this.clipH=this.clipY+i/this.base.width,this.width=r,this.height=i}static fromImageSource(e,t,r=!1){return new E(l.fromImageSource(e,t,r))}static fromUrl(e,t){return e.texture.textureFromUrl(t)}}class C{constructor(e){s(this,"canvas");s(this,"gl");s(this,"projection");s(this,"matrix",new g);s(this,"texture",new I(this));s(this,"devicePixelRatio");s(this,"nativeWdith");s(this,"nativeHeight");s(this,"backgroundColor");s(this,"currentRegion");s(this,"regions",new Map);s(this,"MAX_TEXTURE_IMAGE_UNITS");this.canvas=e.canvas;const t=_(this.canvas);this.gl=t,this.backgroundColor=e.backgroundColor||new d(.2,.2,.2,1),this.devicePixelRatio=e.pixelDensity||window.devicePixelRatio||1,this.projection=this.createOrthMatrix(0,this.canvas.width,this.canvas.height,0),this.nativeHeight=e.height||500,this.nativeWdith=e.width||500,this.updateNativeSize(),this.resize(),t.enable(t.BLEND),t.blendFunc(t.SRC_ALPHA,t.ONE_MINUS_SRC_ALPHA),this.MAX_TEXTURE_IMAGE_UNITS=this.gl.getParameter(this.gl.MAX_TEXTURE_IMAGE_UNITS),this.registerRegion("sprite",S),this.registerRegion("graphic",y)}registerRegion(e,t){this.regions.set(e,new t(this))}setRegion(e,t){var i,h;const r=this.regions.get(e);(r!=this.currentRegion||t&&t!==this.currentRegion.shader)&&((i=this.currentRegion)==null||i.flush(),(h=this.currentRegion)==null||h.exit(),this.currentRegion=r,r.enter(t))}drawSprite(e,t=0,r=0,i){this.setRegion("sprite",i),this.currentRegion.drawSprite(e,t,r)}drawShape(e,t,r){this.setRegion("graphic",r),this.currentRegion.drawShape(e,t)}flush(){this.currentRegion&&this.currentRegion.flush()}save(){this.matrix.pushMat()}start(){this.matrix.clear(),this.matrix.pushIdentity(),this.currentRegion=void 0,this.clear()}end(){var e;(e=this.currentRegion)==null||e.flush()}restore(){this.matrix.popMat()}clear(){const e=this.gl,t=this.backgroundColor;e.clearColor(t.r,t.g,t.b,t.a),e.clear(e.COLOR_BUFFER_BIT)}resize(){const e=this.canvas,t=this.devicePixelRatio;e.width=this.nativeWdith*t,e.height=this.nativeHeight*t,this.gl.viewport(0,0,e.width,e.height)}updateNativeSize(){this.projection=this.createOrthMatrix(0,this.nativeWdith,this.nativeHeight,0)}setNativeSize(e,t){this.nativeWdith=e/this.devicePixelRatio,this.nativeHeight=t/this.devicePixelRatio,this.updateNativeSize()}createOrthMatrix(e,t,r,i){return new Float32Array([2/(t-e),0,0,0,0,2/(i-r),0,0,0,0,-1,0,-(t+e)/(t-e),-(i+r)/(i-r),0,1])}createShader(e,t){return m(this.gl,e,t)}}n.BaseTexture=l,n.BufferArray=T,n.Color=d,n.DynamicArrayBuffer=f,n.ElementArray=b,n.GraphicRegion=y,n.MatrixStack=g,n.Rapid=C,n.RenderRegion=R,n.SpriteRegion=S,n.Texture=E,n.TextureCache=I,n.compileShader=p,n.createShaderProgram=m,n.createTexture=A,n.getContext=_,Object.defineProperty(n,Symbol.toStringTag,{value:"Module"})});

package/dist/region/graphic_region.d.ts

@@ -0,0 +1,41 @@
+import RenderRegion from "./region";
+import Rapid from "../renderer";
+import { Color } from "../math";
+/**
+ * draw quad texture sprites
+ */
+declare class GraphicRegion extends RenderRegion {
+    /** color to draw shapes */
+    protected color: Color;
+    /** is the color needs to be updated */
+    private colorDirty;
+    /** number of vertex to render */
+    private count;
+    constructor(render: Rapid);
+    /**
+     * set a color
+     * @param color
+     */
+    private setColor;
+    /**
+     * draw a shape
+     * @param vertexs
+     * @param color
+     */
+    drawShape(vertexs: number[], color?: Color): void;
+    /**
+     * render
+     */
+    protected doFlush(): void;
+    /**
+     * reset this region
+     * called when flush or entering this region
+     */
+    reset(): void;
+    /**
+     * enter this region
+     * @param shader costum shader
+     */
+    enter(shader?: WebGLProgram | undefined): void;
+}
+export default GraphicRegion;

package/dist/region/region.d.ts

@@ -0,0 +1,44 @@
+import { IRenderRegionOptions, WebGLContext } from "../interface";
+import { BufferArray as WebglBufferArray } from "../math";
+import Rapid from "../renderer";
+declare class RenderRegion {
+    /** shader to render */
+    shader?: WebGLProgram;
+    /** If there is no new shader, use the default shader  */
+    protected defaultShader: WebGLProgram;
+    protected render: Rapid;
+    protected gl: WebGLContext;
+    /** buffer  */
+    protected attributeBuffer: WebglBufferArray;
+    /** shader attribute */
+    private attribute;
+    constructor(render: Rapid);
+    /**
+     * Create a default shader that is called by subclasses
+     * @param options
+     */
+    createDefaultShader(options: IRenderRegionOptions): void;
+    /**
+     * add a vertex
+     * @param x
+     * @param y
+     */
+    addVertex(x: number, y: number, ..._args: unknown[]): void;
+    flush(): void;
+    protected doFlush(): void;
+    /**
+     * reset this region
+     * called when flush or entering this region
+     */
+    reset(): void;
+    /**
+     * enter this region
+     * @param shader costum shader
+     */
+    enter(shader?: WebGLProgram): void;
+    /**
+     * exit this reigon
+     */
+    exit(): void;
+}
+export default RenderRegion;

package/dist/region/sprite_region.d.ts

@@ -0,0 +1,47 @@
+import RenderRegion from "./region";
+import Rapid from "../renderer";
+import { Texture } from "../texture";
+/**
+ * draw quad texture sprites
+ */
+declare class SpriteRegion extends RenderRegion {
+    private objects;
+    private usedTextures;
+    private elementArray;
+    readonly textureUnits: number[];
+    constructor(render: Rapid);
+    addVertex(x: number, y: number, v: number, u: number, t: number): void;
+    /**
+     * draw a sprite
+     * @param texture sprite texture
+     * @param offsetX
+     * @param offsetY
+     */
+    drawSprite(texture: Texture, offsetX: number, offsetY: number): void;
+    /**
+     * use a texture
+     * @return texture unit id
+     */
+    private useTexture;
+    /**
+     * render
+     */
+    protected doFlush(): void;
+    /**
+     * reset this region
+     */
+    reset(): void;
+    /**
+     * enter this region
+     * @param shader costum shader
+     */
+    enter(shader?: WebGLProgram | undefined): void;
+    /**
+     * Generate shader based on the maximum texture units supported by the GPU
+     * @param fs
+     * @param max
+     * @returns
+     */
+    generateFragShader(fs: string, max: number): string;
+}
+export default SpriteRegion;

package/dist/renderer.d.ts

@@ -0,0 +1,109 @@
+import { IRapiadOptions, WebGLContext } from "./interface";
+import { Color, MatrixStack } from "./math";
+import RenderRegion from "./region/region";
+import { Texture, TextureCache } from "./texture";
+/**
+ * Rapid
+ *⚡Rapid.js is a lightning-fast and lightweight 2D WebGL rendering for HTML5
+ * @example
+ * ```js
+ * let rap = new Rapid({
+ *  canvas: document.getElementById("game"),
+ *  width: 600,
+ *  height: 600,
+ *  backgroundColor: Color.fromHex("00FFFF")
+ * })
+ * rap.start() // Please call rap.start before rendering
+ * // draw..
+ * rap.end() // Please call rap.end after rendering
+ * ```
+ */
+declare class Rapid {
+    /**
+     * canvas element
+     */
+    canvas: HTMLCanvasElement;
+    /**
+     * WebGLContext
+     */
+    gl: WebGLContext;
+    /**
+     * projection matrix
+     */
+    projection: Float32Array;
+    /**
+     * matrix stack
+     */
+    matrix: MatrixStack;
+    /**
+     * texture manager
+     */
+    texture: TextureCache;
+    devicePixelRatio: number;
+    nativeWdith: number;
+    nativeHeight: number;
+    /** background color */
+    backgroundColor: Color;
+    private currentRegion?;
+    private regions;
+    readonly MAX_TEXTURE_IMAGE_UNITS: number;
+    constructor(options: IRapiadOptions);
+    /**
+     * register a region, use {@link setRegion} to use it
+     * @param name
+     * @param region
+     */
+    registerRegion(name: string, region: typeof RenderRegion): void;
+    /**
+     * Sets the current render region and its associated shader.
+     *
+     * @param regionName - The name of the render region to use.
+     * @param shader - The shader to use with the render region, or undefined to use the default shader.
+     */
+    setRegion(regionName: string, shader?: WebGLShader): void;
+    /**
+     * Draws a sprite on the screen.
+     *
+     * @param texture - The texture to use for the sprite.
+     * @param offsetX - The horizontal offset of the sprite from the origin.
+     * @param offsetY - The vertical offset of the sprite from the origin.
+     */
+    drawSprite(texture: Texture, offsetX?: number, offsetY?: number, shader?: WebGLShader): void;
+    /**
+     * Draws a shape on the screen.
+     *
+     * @param vertexs - An array of vertex coordinates, where each vertex is a 2-element array of X and Y coordinates.
+     * @param color - The color of the shape
+     */
+    drawShape(vertexs: number[], color?: Color, shader?: WebGLShader): void;
+    /**
+     * render
+     */
+    flush(): void;
+    /**
+     * Saves the current state
+     */
+    save(): void;
+    /**
+     * Call this before rendering
+     */
+    start(): void;
+    /**
+     * Call this after rendering
+     */
+    end(): void;
+    /**
+     * Restore to the previous saved state
+     */
+    restore(): void;
+    /**
+     * clear the canvas
+     */
+    clear(): void;
+    resize(): void;
+    private updateNativeSize;
+    setNativeSize(width: number, height: number): void;
+    private createOrthMatrix;
+    createShader(vs: string, fs: string): WebGLProgram;
+}
+export default Rapid;

package/dist/texture.d.ts

@@ -0,0 +1,88 @@
+import { Rapid } from ".";
+import { Images } from "./interface";
+/**
+ * texture manager
+ */
+declare class TextureCache {
+    private render;
+    private cache;
+    constructor(render: Rapid);
+    /**
+     * create texture from url
+     * Equivalent to {@link Texture.fromUrl} method
+     * @param url
+     * @param antialias
+     * @returns
+     */
+    textureFromUrl(url: string, antialias?: boolean): Promise<Texture>;
+    loadImage(url: string): Promise<HTMLImageElement>;
+}
+/**
+ * Each {@link Texture} references a baseTexture, and different textures may have the same baseTexture
+ */
+declare class BaseTexture {
+    texture: WebGLTexture;
+    width: number;
+    height: number;
+    constructor(texture: WebGLTexture, width: number, height: number);
+    static fromImageSource(r: Rapid, image: Images, antialias?: boolean): BaseTexture;
+}
+declare class Texture {
+    /**
+     * Reference to the {@link BaseTexture} used by this texture.
+     */
+    base: BaseTexture;
+    /**
+     * The x-coordinate of the top-left corner of the clipped region.
+     */
+    clipX: number;
+    /**
+     * The y-coordinate of the top-left corner of the clipped region.
+     */
+    clipY: number;
+    /**
+     * The width of the clipped region.
+     */
+    clipW: number;
+    /**
+     * The height of the clipped region.
+     */
+    clipH: number;
+    /**
+     * The width of the texture.
+     */
+    width: number;
+    /**
+     * The height of the texture.
+     */
+    height: number;
+    /**
+     * Creates a new `Texture` instance with the specified base texture reference.
+     * @param base - The {@link BaseTexture} to be used by the texture.
+     */
+    constructor(base: BaseTexture);
+    /**
+     * Sets the region of the texture to be used for rendering.
+     * @param x - The x-coordinate of the top-left corner of the region.
+     * @param y - The y-coordinate of the top-left corner of the region.
+     * @param w - The width of the region.
+     * @param h - The height of the region.
+     */
+    setClipRegion(x: number, y: number, w: number, h: number): void;
+    /**
+     * Creates a new `Texture` instance from the specified image source.
+     * @param rapid - The Rapid instance to use.
+     * @param image - The image source to create the texture from.
+     * @param antialias - Whether to enable antialiasing for the texture. Default is `false`.
+     * @returns A new `Texture` instance created from the image source.
+     */
+    static fromImageSource(rapid: Rapid, image: Images, antialias?: boolean): Texture;
+    /**
+     * Creates a new `Texture` instance from the specified URL.
+     * @param rapid - The Rapid instance to use.
+     * @param url - The URL of the image to create the texture from.
+     * @returns A new `Texture` instance created from the specified URL.
+     */
+    static fromUrl(rapid: Rapid, url: string): Promise<Texture>;
+}
+export { Texture, BaseTexture, TextureCache };

package/dist/utils/webgl.d.ts

@@ -0,0 +1,24 @@
+import { WebGLContext } from "../interface";
+/**
+ * get webgl rendering context
+ * @param canvas
+ * @returns webgl1 or webgl2
+ */
+export declare const getContext: (canvas: HTMLCanvasElement) => WebGLContext;
+/**
+ * compile string to webgl shader
+ * @param gl
+ * @param source
+ * @param type
+ * @returns
+ */
+export declare const compileShader: (gl: WebGLContext, source: string, type: number) => WebGLShader;
+/**
+ * create webgl program by shader string
+ * @param gl
+ * @param vsSource
+ * @param fsSource
+ * @returns
+ */
+export declare const createShaderProgram: (gl: WebGLContext, vsSource: string, fsSource: string) => WebGLProgram;
+export declare function createTexture(gl: WebGLRenderingContext, image: TexImageSource, antialias: boolean): WebGLTexture;

package/package.json

@@ -0,0 +1,40 @@
+{
+  "name": "rapid-render",
+  "version": "0.0.1",
+  "type": "module",
+  "files": [
+    "dist"
+  ],
+  "main": "./dist/rapid.umd.cjs",
+  "module": "./dist/rapid.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    "types": "./dist/index.d.ts",
+    "import": "./dist/rapid.js",
+    "require": "./dist/rapid.umd.cjs"
+  },
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build && tsc"
+  },
+  "keywords": [
+    "webgl",
+    "game",
+    "engine",
+    "game engine",
+    "canvas",
+    "game dev",
+    "renderer",
+    "render",
+    "fast"
+  ],
+  "devDependencies": {
+    "tslib": "^2.6.2",
+    "typedoc": "^0.25.7",
+    "typedoc-theme-category-nav": "^0.0.3",
+    "typescript": "^5.3.3",
+    "vite": "^5.0.10"
+  },
+  "author": "nightscra",
+  "license": "MIT"
+}