@lightningjs/renderer 0.3.0 → 0.3.2

package/src/core/lib/utils.ts

@@ -0,0 +1,144 @@
+/*
+ * If not stated otherwise in this file or this component's LICENSE file the
+ * following copyright and licenses apply:
+ *
+ * Copyright 2023 Comcast Cable Communications Management, LLC.
+ *
+ * Licensed under the Apache License, Version 2.0 (the License);
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export type RGBA = [r: number, g: number, b: number, a: number];
+export const getNormalizedRgbaComponents = (rgba: number): RGBA => {
+  const r = rgba >>> 24;
+  const g = (rgba >>> 16) & 0xff;
+  const b = (rgba >>> 8) & 0xff;
+  const a = rgba & 0xff;
+  return [r / 255, g / 255, b / 255, a / 255];
+};
+
+export const getRgbaComponents = (rgba: number): RGBA => {
+  const r = rgba >>> 24;
+  const g = (rgba >>> 16) & 0xff;
+  const b = (rgba >>> 8) & 0xff;
+  const a = rgba & 0xff;
+  return [r, g, b, a];
+};
+
+export const norm = (rgba: number): number => {
+  const r = rgba >>> 24;
+  const g = (rgba >>> 16) & 0xff;
+  const b = (rgba >>> 8) & 0xff;
+  const a = rgba & 0xff;
+  const rgbaArr: RGBA = [r / 255, g / 255, b / 255, a / 255];
+
+  rgbaArr[0] = Math.max(0, Math.min(255, rgbaArr[0]));
+  rgbaArr[1] = Math.max(0, Math.min(255, rgbaArr[1]));
+  rgbaArr[2] = Math.max(0, Math.min(255, rgbaArr[2]));
+  rgbaArr[3] = Math.max(0, Math.min(255, rgbaArr[3]));
+  let v =
+    ((rgbaArr[3] | 0) << 24) +
+    ((rgbaArr[0] | 0) << 16) +
+    ((rgbaArr[1] | 0) << 8) +
+    (rgbaArr[2] | 0);
+  if (v < 0) {
+    v = 0xffffffff + v + 1;
+  }
+  return v;
+};
+
+/**
+ * Get a CSS color string from a RGBA color
+ *
+ * @param color
+ * @returns
+ */
+export function getRgbaString(color: RGBA) {
+  const r = Math.floor(color[0] * 255.0);
+  const g = Math.floor(color[1] * 255.0);
+  const b = Math.floor(color[2] * 255.0);
+  const a = Math.floor(color[3] * 255.0);
+  return `rgba(${r},${g},${b},${a.toFixed(4)})`;
+}
+
+export interface Rect {
+  x: number;
+  y: number;
+  width: number;
+  height: number;
+}
+
+export interface Bound {
+  x1: number;
+  y1: number;
+  x2: number;
+  y2: number;
+}
+
+export function intersectBound(a: Bound, b: Bound): Bound {
+  const intersection = {
+    x1: Math.max(a.x1, b.x1),
+    y1: Math.max(a.y1, b.y1),
+    x2: Math.min(a.x2, b.x2),
+    y2: Math.min(a.y2, b.y2),
+  };
+  if (intersection.x1 < intersection.x2 && intersection.y1 < intersection.y2) {
+    return intersection;
+  }
+  return {
+    x1: 0,
+    y1: 0,
+    x2: 0,
+    y2: 0,
+  };
+}
+
+export function intersectRect(a: Rect, b: Rect): Rect {
+  const x = Math.max(a.x, b.x);
+  const y = Math.max(a.y, b.y);
+  const width = Math.min(a.x + a.width, b.x + b.width) - x;
+  const height = Math.min(a.y + a.height, b.y + b.height) - y;
+  if (width > 0 && height > 0) {
+    return {
+      x,
+      y,
+      width,
+      height,
+    };
+  }
+  return {
+    x: 0,
+    y: 0,
+    width: 0,
+    height: 0,
+  };
+}
+
+export function compareRect(a: Rect | null, b: Rect | null): boolean {
+  if (a === b) {
+    return true;
+  }
+  if (a === null || b === null) {
+    return false;
+  }
+  return (
+    a.x === b.x && a.y === b.y && a.width === b.width && a.height === b.height
+  );
+}
+
+export function isBoundPositive(bound: Bound): boolean {
+  return bound.x1 < bound.x2 && bound.y1 < bound.y2;
+}
+
+export function isRectPositive(rect: Rect): boolean {
+  return rect.width > 0 && rect.height > 0;
+}

package/src/core/platform.ts

@@ -0,0 +1,40 @@
+/*
+ * If not stated otherwise in this file or this component's LICENSE file the
+ * following copyright and licenses apply:
+ *
+ * Copyright 2023 Comcast Cable Communications Management, LLC.
+ *
+ * Licensed under the Apache License, Version 2.0 (the License);
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import type { Stage } from './Stage.js';
+
+/**
+ * Platform render loop initiator
+ */
+export const startLoop = (stage: Stage) => {
+  const loop = () => {
+    // emit('frameStart');
+    stage.drawFrame();
+    requestAnimationFrame(loop);
+  };
+  requestAnimationFrame(loop);
+};
+
+/**
+ * Return unix timestamp
+ * @return {number}
+ */
+export const getTimeStamp = () => {
+  return performance ? performance.now() : Date.now();
+};

package/src/core/renderers/CoreContextTexture.ts

@@ -0,0 +1,30 @@
+/*
+ * If not stated otherwise in this file or this component's LICENSE file the
+ * following copyright and licenses apply:
+ *
+ * Copyright 2023 Comcast Cable Communications Management, LLC.
+ *
+ * Licensed under the Apache License, Version 2.0 (the License);
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import type { Texture } from '../textures/Texture.js';
+
+export abstract class CoreContextTexture {
+  readonly textureSource: Texture;
+
+  constructor(textureSource: Texture) {
+    this.textureSource = textureSource;
+  }
+
+  abstract load(): void;
+}

package/src/core/renderers/CoreRenderOp.ts

@@ -0,0 +1,22 @@
+/*
+ * If not stated otherwise in this file or this component's LICENSE file the
+ * following copyright and licenses apply:
+ *
+ * Copyright 2023 Comcast Cable Communications Management, LLC.
+ *
+ * Licensed under the Apache License, Version 2.0 (the License);
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export abstract class CoreRenderOp {
+  abstract draw(): void;
+}

package/src/core/renderers/CoreRenderer.ts

@@ -0,0 +1,66 @@
+/*
+ * If not stated otherwise in this file or this component's LICENSE file the
+ * following copyright and licenses apply:
+ *
+ * Copyright 2023 Comcast Cable Communications Management, LLC.
+ *
+ * Licensed under the Apache License, Version 2.0 (the License);
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import type { CoreShaderManager } from '../CoreShaderManager.js';
+import type { TextureOptions } from '../CoreTextureManager.js';
+import type { Stage } from '../Stage.js';
+import type { Rect } from '../lib/utils.js';
+import type { Texture } from '../textures/Texture.js';
+import { CoreContextTexture } from './CoreContextTexture.js';
+import type { CoreRenderOp } from './CoreRenderOp.js';
+import type { CoreShader } from './CoreShader.js';
+
+export interface QuadOptions {
+  width: number;
+  height: number;
+  colorTl: number;
+  colorTr: number;
+  colorBl: number;
+  colorBr: number;
+  texture: Texture | null;
+  textureOptions: TextureOptions | null;
+  zIndex: number;
+  shader: CoreShader | null;
+  shaderProps: Record<string, unknown> | null;
+  alpha: number;
+  scale: number;
+  clippingRect: Rect | null;
+  wpx: number;
+  wpy: number;
+  ta: number;
+  tb: number;
+  tc: number;
+  td: number;
+  worldScale: number;
+}
+
+export abstract class CoreRenderer {
+  protected stage: Stage;
+
+  constructor(stage: Stage) {
+    this.stage = stage;
+  }
+
+  abstract reset(): void;
+  abstract sortRenderables(): void;
+  abstract render(surface: 'screen' | CoreContextTexture): void;
+  abstract addRenderable(params: QuadOptions | CoreRenderOp): void;
+  abstract createCtxTexture(textureSource: Texture): CoreContextTexture;
+  abstract getShaderManager(): CoreShaderManager;
+}

package/src/core/renderers/CoreShader.ts

@@ -0,0 +1,41 @@
+/*
+ * If not stated otherwise in this file or this component's LICENSE file the
+ * following copyright and licenses apply:
+ *
+ * Copyright 2023 Comcast Cable Communications Management, LLC.
+ *
+ * Licensed under the Apache License, Version 2.0 (the License);
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import type { CoreRenderOp } from './CoreRenderOp.js';
+
+export abstract class CoreShader {
+  // abstract draw(): void;
+  static makeCacheKey(props: Record<string, unknown>): string | false {
+    return false;
+  }
+
+  static resolveDefaults(
+    props: Record<string, unknown>,
+  ): Record<string, unknown> {
+    return {};
+  }
+
+  abstract bindRenderOp(
+    renderOp: CoreRenderOp,
+    props: Record<string, unknown> | null,
+  ): void;
+  protected abstract bindProps(props: Record<string, unknown>): void;
+  abstract attach(): void;
+  abstract detach(): void;
+}

package/src/core/renderers/webgl/WebGlCoreCtxSubTexture.ts

@@ -0,0 +1,36 @@
+/*
+ * If not stated otherwise in this file or this component's LICENSE file the
+ * following copyright and licenses apply:
+ *
+ * Copyright 2023 Comcast Cable Communications Management, LLC.
+ *
+ * Licensed under the Apache License, Version 2.0 (the License);
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import type { Dimensions } from '../../../common/CommonTypes.js';
+import type { SubTexture } from '../../textures/SubTexture.js';
+import { WebGlCoreCtxTexture } from './WebGlCoreCtxTexture.js';
+
+export class WebGlCoreCtxSubTexture extends WebGlCoreCtxTexture {
+  constructor(gl: WebGLRenderingContext, textureSource: SubTexture) {
+    super(gl, textureSource);
+  }
+
+  override async onLoadRequest(): Promise<Dimensions> {
+    const props = await (this.textureSource as SubTexture).getTextureData();
+    return {
+      width: props.width || 0,
+      height: props.height || 0,
+    };
+  }
+}

package/src/core/renderers/webgl/WebGlCoreCtxTexture.ts

@@ -0,0 +1,208 @@
+/*
+ * If not stated otherwise in this file or this component's LICENSE file the
+ * following copyright and licenses apply:
+ *
+ * Copyright 2023 Comcast Cable Communications Management, LLC.
+ *
+ * Licensed under the Apache License, Version 2.0 (the License);
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import type { Dimensions } from '../../../common/CommonTypes.js';
+import { assertTruthy } from '../../../utils.js';
+import type { Texture } from '../../textures/Texture.js';
+import { isPowerOfTwo } from '../../utils.js';
+import { CoreContextTexture } from '../CoreContextTexture.js';
+import { isWebGl2 } from './internal/WebGlUtils.js';
+
+const TRANSPARENT_TEXTURE_DATA = new Uint8Array([0, 0, 0, 0]);
+
+/**
+ * A wrapper around a WebGLTexture that handles loading the texture data
+ * from a Texture source and uploading it to the GPU as well as freeing
+ * the uploaded texture.
+ *
+ * @remarks
+ * When accessing the ctxTexture property, the texture will be loaded if
+ * it hasn't been already. ctxTexture will always return a valid WebGLTexture
+ * and trigger the loading/uploading of the texture's data if it hasn't been
+ * loaded yet.
+ */
+export class WebGlCoreCtxTexture extends CoreContextTexture {
+  protected _nativeCtxTexture: WebGLTexture | null = null;
+  private _state: 'freed' | 'loading' | 'loaded' | 'failed' = 'freed';
+  private _w = 0;
+  private _h = 0;
+
+  constructor(protected gl: WebGLRenderingContext, textureSource: Texture) {
+    super(textureSource);
+  }
+
+  get ctxTexture(): WebGLTexture {
+    if (this._state === 'freed') {
+      this.load();
+    }
+    assertTruthy(this._nativeCtxTexture);
+    return this._nativeCtxTexture;
+  }
+
+  get w() {
+    return this._w;
+  }
+
+  get h() {
+    return this._h;
+  }
+
+  /**
+   * Load the texture data from the Texture source and upload it to the GPU
+   *
+   * @remarks
+   * This method is called automatically when accessing the ctxTexture property
+   * if the texture hasn't been loaded yet. But it can also be called manually
+   * to force the texture to be pre-loaded prior to accessing the ctxTexture
+   * property.
+   */
+  load() {
+    // If the texture is already loading or loaded, don't load it again.
+    if (this._state === 'loading' || this._state === 'loaded') {
+      return;
+    }
+    this._state = 'loading';
+    this.textureSource.setState('loading');
+    this.onLoadRequest()
+      .then(({ width, height }) => {
+        this._state = 'loaded';
+        this._w = width;
+        this._h = height;
+        // Update the texture source's width and height so that it can be used
+        // for rendering.
+        this.textureSource.setState('loaded', { width, height });
+      })
+      .catch((err) => {
+        this._state = 'failed';
+        this.textureSource.setState('failed', err);
+        console.error(err);
+      });
+  }
+
+  /**
+   * Called when the texture data needs to be loaded and uploaded to a texture
+   */
+  async onLoadRequest(): Promise<Dimensions> {
+    this._nativeCtxTexture = this.createNativeCtxTexture();
+    const { gl } = this;
+
+    // On initial load request, create a 1x1 transparent texture to use until
+    // the texture data is finally loaded.
+    gl.bindTexture(gl.TEXTURE_2D, this._nativeCtxTexture);
+
+    // linear texture filtering
+    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
+    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
+
+    // texture wrapping method
+    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
+    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
+
+    gl.bindTexture(gl.TEXTURE_2D, this._nativeCtxTexture);
+    gl.texImage2D(
+      gl.TEXTURE_2D,
+      0,
+      gl.RGBA,
+      1,
+      1,
+      0,
+      gl.RGBA,
+      gl.UNSIGNED_BYTE,
+      TRANSPARENT_TEXTURE_DATA,
+    );
+
+    const textureData = await this.textureSource?.getTextureData();
+    let width = 0;
+    let height = 0;
+    assertTruthy(this._nativeCtxTexture);
+    // If textureData is null, the texture is empty (0, 0) and we don't need to
+    // upload any data to the GPU.
+    if (textureData instanceof ImageBitmap) {
+      width = textureData.width;
+      height = textureData.height;
+      gl.bindTexture(gl.TEXTURE_2D, this._nativeCtxTexture);
+
+      gl.texImage2D(
+        gl.TEXTURE_2D,
+        0,
+        gl.RGBA,
+        gl.RGBA,
+        gl.UNSIGNED_BYTE,
+        textureData,
+      );
+
+      // generate mipmaps for power-of-2 textures or in WebGL2RenderingContext
+      if (isWebGl2(gl) || (isPowerOfTwo(width) && isPowerOfTwo(height))) {
+        gl.generateMipmap(gl.TEXTURE_2D);
+      }
+    } else if (textureData === null) {
+      width = 0;
+      height = 0;
+      // Reset to a 1x1 transparent texture
+      gl.bindTexture(gl.TEXTURE_2D, this._nativeCtxTexture);
+      gl.texImage2D(
+        gl.TEXTURE_2D,
+        0,
+        gl.RGBA,
+        1,
+        1,
+        0,
+        gl.RGBA,
+        gl.UNSIGNED_BYTE,
+        TRANSPARENT_TEXTURE_DATA,
+      );
+    } else {
+      console.error(
+        `WebGlCoreCtxTexture.onLoadRequest: Unexpected textureData returned`,
+        textureData,
+      );
+    }
+
+    return {
+      width,
+      height,
+    };
+  }
+  /**
+   * Free the WebGLTexture from the GPU
+   *
+   * @returns
+   */
+  free() {
+    if (this._state === 'freed') {
+      return;
+    }
+    this._state = 'freed';
+    this._w = 0;
+    this._h = 0;
+    if (!this._nativeCtxTexture) {
+      return;
+    }
+    this.gl.deleteTexture(this._nativeCtxTexture);
+    this._nativeCtxTexture = null;
+  }
+
+  private createNativeCtxTexture() {
+    const nativeTexture = this.gl.createTexture();
+    if (!nativeTexture) {
+      throw new Error('Could not create WebGL Texture');
+    }
+    return nativeTexture;
+  }
+}

package/src/core/renderers/webgl/WebGlCoreRenderOp.ts

@@ -0,0 +1,111 @@
+/*
+ * If not stated otherwise in this file or this component's LICENSE file the
+ * following copyright and licenses apply:
+ *
+ * Copyright 2023 Comcast Cable Communications Management, LLC.
+ *
+ * Licensed under the Apache License, Version 2.0 (the License);
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { CoreRenderOp } from '../CoreRenderOp.js';
+import { WebGlCoreShader } from './WebGlCoreShader.js';
+import type { WebGlCoreCtxTexture } from './WebGlCoreCtxTexture.js';
+import type { WebGlCoreRendererOptions } from './WebGlCoreRenderer.js';
+import type { BufferCollection } from './internal/BufferCollection.js';
+import type { Dimensions } from '../../../common/CommonTypes.js';
+import type { Rect } from '../../lib/utils.js';
+
+const MAX_TEXTURES = 8; // TODO: get from gl
+
+/**
+ * Can render multiple quads with multiple textures (up to vertex shader texture limit)
+ *
+ */
+export class WebGlCoreRenderOp extends CoreRenderOp {
+  length = 0;
+  numQuads = 0;
+  textures: WebGlCoreCtxTexture[] = [];
+  readonly maxTextures: number;
+
+  constructor(
+    readonly gl: WebGLRenderingContext | WebGL2RenderingContext,
+    readonly options: WebGlCoreRendererOptions,
+    readonly buffers: BufferCollection,
+    readonly shader: WebGlCoreShader,
+    readonly shaderProps: Record<string, unknown>,
+    readonly alpha: number,
+    readonly clippingRect: Rect | null,
+    readonly dimensions: Dimensions,
+    readonly bufferIdx: number,
+    readonly zIndex: number,
+  ) {
+    super();
+    this.gl = gl;
+    this.maxTextures = shader.supportsIndexedTextures
+      ? (gl.getParameter(gl.MAX_VERTEX_TEXTURE_IMAGE_UNITS) as number)
+      : 1;
+  }
+
+  addTexture(texture: WebGlCoreCtxTexture): number {
+    const { textures, maxTextures } = this;
+    const existingIdx = textures.findIndex((t) => t === texture);
+    if (existingIdx !== -1) {
+      return existingIdx;
+    }
+    const newIdx = textures.length;
+    if (newIdx >= maxTextures) {
+      return 0xffffffff;
+    }
+    this.textures.push(texture);
+    return newIdx;
+  }
+
+  draw() {
+    const { gl, shader, shaderProps, options } = this;
+    // shaderOp.draw(this);
+
+    const { shManager } = options;
+    shManager.useShader(shader);
+    shader.bindRenderOp(this, shaderProps);
+
+    // TODO: Reduce calculations required
+    const quadIdx = (this.bufferIdx / 24) * 6 * 2;
+
+    // TODO: Move these somewhere else?
+    gl.enable(gl.BLEND);
+    gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA);
+
+    // Clipping
+    if (this.clippingRect) {
+      const { x, y, width, height } = this.clippingRect;
+      const pixelRatio = options.pixelRatio;
+      const canvasHeight = options.canvas.height;
+
+      const clipX = Math.round(x * pixelRatio);
+      const clipWidth = Math.round(width * pixelRatio);
+      const clipHeight = Math.round(height * pixelRatio);
+      const clipY = Math.round(canvasHeight - clipHeight - y * pixelRatio);
+      gl.enable(gl.SCISSOR_TEST);
+      gl.scissor(clipX, clipY, clipWidth, clipHeight);
+    } else {
+      gl.disable(gl.SCISSOR_TEST);
+    }
+
+    gl.drawElements(
+      gl.TRIANGLES,
+      6 * this.numQuads,
+      gl.UNSIGNED_SHORT,
+      quadIdx,
+    );
+  }
+}