feat(core): update Context to Renderer, update Resource and Texture

src/core/Renderer.ts

@@ -0,0 +1,119 @@
+import State from './State';
+
+/** Check if supplied parameter is a WebGLRenderingContext */
+export function isWebGL(gl: any): boolean {
+  if (typeof WebGLRenderingContext !== 'undefined' && gl instanceof WebGLRenderingContext) {
+    return true;
+  }
+  if (typeof WebGL2RenderingContext !== 'undefined' && gl instanceof WebGL2RenderingContext) {
+    return true;
+  }
+  // Look for debug contexts, headless gl etc
+  return Boolean(gl && Number.isFinite(gl._version));
+}
+
+
+/** Check if supplied parameter is a WebGL2RenderingContext */
+export function isWebGL2(gl: any): boolean {
+  if (typeof WebGL2RenderingContext !== 'undefined' && gl instanceof WebGL2RenderingContext) {
+    return true;
+  }
+  // Look for debug contexts, headless gl etc
+  return Boolean(gl && gl._version === 2);
+}
+
+export type ExtensionKeys = 'ANGLE_instanced_arrays' | 'OES_vertex_array_object';
+export type Extensions = ANGLE_instanced_arrays | OES_vertex_array_object;
+
+/**
+ * 这是一个基类，
+ */
+export default class Renderer {
+  #gl: WebGLRenderingContext | WebGL2RenderingContext;
+
+  #state: any;
+
+  #extensions: {
+    [key in ExtensionKeys]: Extensions;
+  };
+
+  public vertexAttribDivisor: Extensions;
+  public drawArraysInstanced: Extensions;
+  public drawElementsInstanced: Extensions;
+  public createVertexArray: Extensions;
+  public bindVertexArray: Extensions;
+  public deleteVertexArray: Extensions;
+
+  constructor(gl: WebGLRenderingContext | WebGL2RenderingContext) {
+    this.#gl = gl;
+
+    this.#state = new State(this.#gl);
+    this.vertexAttribDivisor = this.getExtension(
+      'ANGLE_instanced_arrays',
+      'vertexAttribDivisor',
+      'vertexAttribDivisorANGLE'
+    );
+    this.drawArraysInstanced = this.getExtension(
+      'ANGLE_instanced_arrays',
+      'drawArraysInstanced',
+      'drawArraysInstancedANGLE',
+    );
+    this.drawElementsInstanced = this.getExtension(
+      'ANGLE_instanced_arrays',
+      'drawElementsInstanced',
+      'drawElementsInstancedANGLE',
+    );
+    this.createVertexArray = this.getExtension(
+      'OES_vertex_array_object',
+      'createVertexArray',
+      'createVertexArrayOES',
+    );
+    this.bindVertexArray = this.getExtension(
+      'OES_vertex_array_object',
+      'bindVertexArray',
+      'bindVertexArrayOES',
+    );
+    this.deleteVertexArray = this.getExtension(
+      'OES_vertex_array_object',
+      'deleteVertexArray',
+      'deleteVertexArrayOES',
+    );
+  }
+
+  get gl() {
+    return this.#gl;
+  }
+
+  get canvas () {
+    return this.#gl.canvas;
+  }
+
+  get isWebGL() {
+    return isWebGL(this.gl);
+  }
+
+  get isWebGL2() {
+    return isWebGL2(this.gl);
+  }
+
+  get size () {
+    return {
+      width: 'clientWidth' in this.canvas ? this.canvas.clientWidth : this.canvas.width,
+      height: 'clientHeight' in this.canvas ? this.canvas.clientHeight : this.canvas.height,
+    };
+  }
+
+  get state () {
+    return this.#state;
+  }
+
+  getExtension (extension, method, extFunc) {
+    const func = this.gl[method];
+    if (method && func) return func.bind(this.gl);
+    if (!this.#extensions[extension]) {
+      this.#extensions[extension] = this.gl.getExtension(extension);
+    }
+    const ef = this.#extensions[extension];
+    return method ? ef ? ef[extFunc].bind(ef) : null : ef;
+  }
+}

src/core/Resource.ts

@@ -1,7 +1,8 @@
 import { uid } from '@/utils';
 import type { WithUndef } from '@/types';
 
-import Context from './Context';
+import Base from './Base';
+import Renderer from './Renderer';
 
 const ERR_RESOURCE_METHOD_UNDEFINED = 'Resource subclass must define virtual methods';
 
@@ -12,7 +13,7 @@ export interface IResourceOptions {
   userData: any;
 }
 
-export default class Resource<T> extends Context {
+export default class Resource<T> extends Base {
   #handle: any;
 
   id: string;
@@ -26,8 +27,8 @@ export default class Resource<T> extends Context {
 
   options: Partial<IResourceOptions & T>;
 
-  constructor(context: WebGLRenderingContext | WebGL2RenderingContext, options: Partial<IResourceOptions & T> = {}) {
-    super(context);
+  constructor(renderer: Renderer, options: Partial<IResourceOptions & T> = {}) {
+    super(renderer);
     this.id = options?.id || uid(this.constructor.name);
     this.name = options?.name;
     this.userData = options?.userData;
@@ -52,7 +53,7 @@ export default class Resource<T> extends Context {
   delete({ deleteChildren = false } = {}) {
     // Delete this object, and get refs to any children
     // @ts-expect-error
-    const children = this.#handle && this.#deleteHandle(this.#handle);
+    const children = this.#handle && this.deleteHandle(this.#handle);
     if (this.#handle) {
       this.removeStats();
     }