@nativescript/canvas-three 2.0.0-webgpu.25 → 2.0.0-webgpu.27

package/three/src/textures/Data3DTexture.d.ts

@@ -0,0 +1,96 @@
+import { MagnificationTextureFilter, MinificationTextureFilter, Wrapping } from "../constants.js";
+import { Texture } from "./Texture.js";
+import { Texture3DImageData } from "./types.js";
+
+/**
+ * Creates a three-dimensional texture from raw data, with parameters to divide it into width, height, and depth
+ * @example
+ * ```typescript
+ * This creates a[name] with repeating data, 0 to 255
+ * // create a buffer with some data
+ * const sizeX = 64;
+ * const sizeY = 64;
+ * const sizeZ = 64;
+ * const data = new Uint8Array(sizeX * sizeY * sizeZ);
+ * let i = 0;
+ * for (let z = 0; z & lt; sizeZ; z++) {
+ *     for (let y = 0; y & lt; sizeY; y++) {
+ *         for (let x = 0; x & lt; sizeX; x++) {
+ *             data[i] = i % 256;
+ *             i++;
+ *         }
+ *     }
+ * }
+ * // use the buffer to create the texture
+ * const texture = new THREE.Data3DTexture(data, sizeX, sizeY, sizeZ);
+ * texture.needsUpdate = true;
+ * ```
+ * @see Example: {@link https://threejs.org/examples/#webgl2_materials_texture3d | WebGL2 / materials / texture3d}
+ * @see Example: {@link https://threejs.org/examples/#webgl2_materials_texture3d_partialupdate | WebGL2 / materials / texture3d / partialupdate}
+ * @see Example: {@link https://threejs.org/examples/#webgl2_volume_cloud | WebGL2 / volume / cloud}
+ * @see Example: {@link https://threejs.org/examples/#webgl2_volume_perlin | WebGL2 / volume / perlin}
+ * @see {@link https://threejs.org/docs/index.html#api/en/textures/Data3DTexture | Official Documentation}
+ * @see {@link https://github.com/mrdoob/three.js/blob/master/src/textures/Data3DTexture.js | Source}
+ */
+export class Data3DTexture extends Texture {
+    /**
+     * Create a new instance of {@link Data3DTexture}
+     * @param data {@link https://developer.mozilla.org/en-US/docs/Web/API/ArrayBufferView | ArrayBufferView} of the texture. Default `null`.
+     * @param width Width of the texture. Default `1`.
+     * @param height Height of the texture. Default `1`.
+     * @param depth Depth of the texture. Default `1`.
+     */
+    constructor(data?: BufferSource | null, width?: number, height?: number, depth?: number);
+
+    /**
+     * Read-only flag to check if a given object is of type {@link Data3DTexture}.
+     * @remarks This is a _constant_ value
+     * @defaultValue `true`
+     */
+    readonly isData3DTexture: true;
+
+    /**
+     * Overridden with a record type holding data, width and height and depth.
+     * @override
+     */
+    get image(): Texture3DImageData;
+    set image(data: Texture3DImageData);
+
+    /**
+     * @override
+     * @defaultValue {@link THREE.NearestFilter}
+     */
+    magFilter: MagnificationTextureFilter;
+
+    /**
+     * @override
+     * @defaultValue {@link THREE.NearestFilter}
+     */
+    minFilter: MinificationTextureFilter;
+
+    /**
+     * @override
+     * @defaultValue {@link THREE.ClampToEdgeWrapping}
+     */
+    wrapR: Wrapping;
+
+    /**
+     * @override
+     * @defaultValue `false`
+     */
+    flipY: boolean;
+
+    /**
+     * @override
+     * @defaultValue `false`
+     */
+    generateMipmaps: boolean;
+
+    /**
+     * @override
+     * @defaultValue `1`
+     */
+    unpackAlignment: number;
+}
+
+export {};

package/three/src/textures/DataArrayTexture.d.ts

@@ -0,0 +1,123 @@
+import { MagnificationTextureFilter, MinificationTextureFilter } from "../constants.js";
+import { Texture } from "./Texture.js";
+import { Texture3DImageData } from "./types.js";
+
+/**
+ * Creates an array of textures directly from raw data, width and height and depth
+ * @example
+ * ```typescript
+ * This creates a[name] where each texture has a different color.
+ * // create a buffer with color data
+ * const width = 512;
+ * const height = 512;
+ * const depth = 100;
+ * const size = width * height;
+ * const data = new Uint8Array(4 * size * depth);
+ * for (let i = 0; i & lt; depth; i++) {
+ *     const color = new THREE.Color(Math.random(), Math.random(), Math.random());
+ *     const r = Math.floor(color.r * 255);
+ *     const g = Math.floor(color.g * 255);
+ *     const b = Math.floor(color.b * 255);
+ *     for (let j = 0; j & lt; size; j++) {
+ *         const stride = (i * size + j) * 4;
+ *         data[stride] = r;
+ *         data[stride + 1] = g;
+ *         data[stride + 2] = b;
+ *         data[stride + 3] = 255;
+ *     }
+ * }
+ * // used the buffer to create a [name]
+ * const texture = new THREE.DataArrayTexture(data, width, height, depth);
+ * texture.needsUpdate = true;
+ * ```
+ * @see Example: {@link https://threejs.org/examples/#webgl2_materials_texture2darray | WebGL2 / materials / texture2darray}
+ * @see Example: {@link https://threejs.org/examples/#webgl2_rendertarget_texture2darray | WebGL2 / rendertarget / texture2darray}
+ * @see {@link https://threejs.org/docs/index.html#api/en/textures/DataArrayTexture | Official Documentation}
+ * @see {@link https://github.com/mrdoob/three.js/blob/master/src/textures/DataArrayTexture.js | Source}
+ */
+export class DataArrayTexture extends Texture {
+    /**
+     * Read-only flag to check if a given object is of type {@link DataArrayTexture}.
+     * @remarks This is a _constant_ value
+     * @defaultValue `true`
+     */
+    readonly isDataArrayTexture: true;
+
+    /**
+     * Overridden with a record type holding data, width and height and depth.
+     * @override
+     */
+    get image(): Texture3DImageData;
+    set image(data: Texture3DImageData);
+
+    /**
+     * @override
+     * @defaultValue {@link THREE.NearestFilter}
+     */
+    magFilter: MagnificationTextureFilter;
+
+    /**
+     * @override
+     * @defaultValue {@link THREE.NearestFilter}
+     */
+    minFilter: MinificationTextureFilter;
+
+    /**
+     * @override
+     * @defaultValue  {@link THREE.ClampToEdgeWrapping}
+     */
+    wrapR: boolean;
+
+    /**
+     * @override
+     * @defaultValue `false`
+     */
+    generateMipmaps: boolean;
+
+    /**
+     * @override
+     * @defaultValue `false`
+     */
+    flipY: boolean;
+
+    /**
+     * @override
+     * @defaultValue `1`
+     */
+    unpackAlignment: number;
+
+    /**
+     * A set of all layers which need to be updated in the texture. See {@link DataArrayTexture.addLayerUpdate}.
+     */
+    layerUpdates: Set<number>;
+
+    /**
+     * This creates a new {@link THREE.DataArrayTexture | DataArrayTexture} object.
+     * @remarks The interpretation of the data depends on {@link format} and {@link type}.
+     * @remarks If the {@link type} is {@link THREE.UnsignedByteType}, a {@link Uint8Array} will be useful for addressing the texel data
+     * @remarks If the {@link format} is {@link THREE.RGBAFormat}, data needs four values for one texel; Red, Green, Blue and Alpha (typically the opacity).
+     * @remarks For the packed {@link type | types}, {@link THREE.UnsignedShort4444Type} and {@link THREE.UnsignedShort5551Type}
+     * all color components of one texel can be addressed as bitfields within an integer element of a {@link Uint16Array}.
+     * @remarks In order to use the {@link type | types} {@link THREE.FloatType} and {@link THREE.HalfFloatType},
+     * the WebGL implementation must support the respective extensions _OES_texture_float_ and _OES_texture_half_float_
+     * @remarks In order to use {@link THREE.LinearFilter} for component-wise, bilinear interpolation of the texels based on these types,
+     * the WebGL extensions _OES_texture_float_linear_ or _OES_texture_half_float_linear_ must also be present.
+     * @param data {@link https://developer.mozilla.org/en-US/docs/Web/API/ArrayBufferView | ArrayBufferView} of the texture. Default `null`.
+     * @param width Width of the texture. Default `1`.
+     * @param height Height of the texture. Default `1`.
+     * @param depth Depth of the texture. Default `1`.
+     */
+    constructor(data?: BufferSource | null, width?: number, height?: number, depth?: number);
+
+    /**
+     * Describes that a specific layer of the texture needs to be updated. Normally when {@link Texture.needsUpdate} is
+     * set to true, the entire compressed texture array is sent to the GPU. Marking specific layers will only transmit
+     * subsets of all mipmaps associated with a specific depth in the array which is often much more performant.
+     */
+    addLayerUpdate(layerIndex: number): void;
+
+    /**
+     * Resets the layer updates registry. See {@link DataArrayTexture.addLayerUpdate}.
+     */
+    clearLayoutUpdates(): void;
+}

package/three/src/textures/DataTexture.d.ts

@@ -0,0 +1,113 @@
+import {
+    ColorSpace,
+    MagnificationTextureFilter,
+    Mapping,
+    MinificationTextureFilter,
+    PixelFormat,
+    TextureDataType,
+    Wrapping,
+} from "../constants.js";
+import { Texture } from "./Texture.js";
+import { TextureImageData } from "./types.js";
+
+/**
+ * Creates a texture directly from raw data, width and height.
+ * @example
+ * ```typescript
+ * // create a buffer with color data
+ * const width = 512;
+ * const height = 512;
+ * const size = width * height;
+ * const data = new Uint8Array(4 * size);
+ * const color = new THREE.Color(0xffffff);
+ * const r = Math.floor(color.r * 255);
+ * const g = Math.floor(color.g * 255);
+ * const b = Math.floor(color.b * 255);
+ * for (let i = 0; i & lt; size; i++) {
+ *     const stride = i * 4;
+ *     data[stride] = r;
+ *     data[stride + 1] = g;
+ *     data[stride + 2] = b;
+ *     data[stride + 3] = 255;
+ * }
+ * // used the buffer to create a [name]
+ * const texture = new THREE.DataTexture(data, width, height);
+ * texture.needsUpdate = true;
+ * ```
+ * @see {@link https://threejs.org/docs/index.html#api/en/textures/DataTexture | Official Documentation}
+ * @see {@link https://github.com/mrdoob/three.js/blob/master/src/textures/DataTexture.js | Source}
+ */
+export class DataTexture extends Texture {
+    /**
+     * @param data {@link https://developer.mozilla.org/en-US/docs/Web/API/ArrayBufferView | ArrayBufferView} of the texture. Default `null`.
+     * @param width Width of the texture. Default `1`.
+     * @param height Height of the texture. Default `1`.
+     * @param format See {@link Texture.format | .format}. Default {@link THREE.RGBAFormat}
+     * @param type See {@link Texture.type | .type}. Default {@link THREE.UnsignedByteType}
+     * @param mapping See {@link Texture.mapping | .mapping}. Default {@link THREE.Texture.DEFAULT_MAPPING}
+     * @param wrapS See {@link Texture.wrapS | .wrapS}. Default {@link THREE.ClampToEdgeWrapping}
+     * @param wrapT See {@link Texture.wrapT | .wrapT}. Default {@link THREE.ClampToEdgeWrapping}
+     * @param magFilter See {@link Texture.magFilter | .magFilter}. Default {@link THREE.NearestFilter}
+     * @param minFilter  See {@link Texture.minFilter | .minFilter}. Default {@link THREE.NearestFilter}
+     * @param anisotropy See {@link Texture.anisotropy | .anisotropy}. Default {@link THREE.Texture.DEFAULT_ANISOTROPY}
+     * @param colorSpace See {@link Texture.colorSpace | .colorSpace}. Default {@link NoColorSpace}
+     */
+    constructor(
+        data?: BufferSource | null,
+        width?: number,
+        height?: number,
+        format?: PixelFormat,
+        type?: TextureDataType,
+        mapping?: Mapping,
+        wrapS?: Wrapping,
+        wrapT?: Wrapping,
+        magFilter?: MagnificationTextureFilter,
+        minFilter?: MinificationTextureFilter,
+        anisotropy?: number,
+        colorSpace?: ColorSpace,
+    );
+
+    /**
+     * Read-only flag to check if a given object is of type {@link DataTexture}.
+     * @remarks This is a _constant_ value
+     * @defaultValue `true`
+     */
+    readonly isDataTexture: true;
+
+    /**
+     * Overridden with a record type holding data, width and height and depth.
+     * @override
+     */
+    get image(): TextureImageData;
+    set image(value: TextureImageData);
+
+    /**
+     * @override
+     * @defaultValue {@link THREE.NearestFilter}
+     */
+    magFilter: MagnificationTextureFilter;
+
+    /**
+     * @override
+     * @defaultValue {@link THREE.NearestFilter}
+     */
+    minFilter: MinificationTextureFilter;
+
+    /**
+     * @override
+     * @defaultValue `false`
+     */
+    flipY: boolean;
+
+    /**
+     * @override
+     * @defaultValue `false`
+     */
+    generateMipmaps: boolean;
+
+    /**
+     * @override
+     * @defaultValue `1`
+     */
+    unpackAlignment: number;
+}

package/three/src/textures/DepthTexture.d.ts

@@ -0,0 +1,104 @@
+import {
+    DepthTexturePixelFormat,
+    MagnificationTextureFilter,
+    Mapping,
+    MinificationTextureFilter,
+    TextureComparisonFunction,
+    TextureDataType,
+    Wrapping,
+} from "../constants.js";
+import { Texture } from "./Texture.js";
+
+/**
+ * This class can be used to automatically save the depth information of a rendering into a texture
+ * @see Example: {@link https://threejs.org/examples/#webgl_depth_texture | depth / texture}
+ * @see {@link https://threejs.org/docs/index.html#api/en/textures/DepthTexture | Official Documentation}
+ * @see {@link https://github.com/mrdoob/three.js/blob/master/src/textures/DepthTexture.js | Source}
+ */
+export class DepthTexture extends Texture {
+    /**
+     * Create a new instance of {@link DepthTexture}
+     * @param width Width of the texture.
+     * @param height Height of the texture.
+     * @param type See {@link Texture.type | .type}. Default {@link THREE.UnsignedByteType} or {@link THREE.UnsignedInt248Type}
+     * @param mapping See {@link Texture.mapping | .mapping}. Default {@link THREE.Texture.DEFAULT_MAPPING}
+     * @param wrapS See {@link Texture.wrapS | .wrapS}. Default {@link THREE.ClampToEdgeWrapping}
+     * @param wrapT See {@link Texture.wrapT | .wrapT}. Default {@link THREE.ClampToEdgeWrapping}
+     * @param magFilter See {@link Texture.magFilter | .magFilter}. Default {@link THREE.NearestFilter}
+     * @param minFilter  See {@link Texture.minFilter | .minFilter}. Default {@link THREE.NearestFilter}
+     * @param anisotropy See {@link Texture.anisotropy | .anisotropy}. Default {@link THREE.Texture.DEFAULT_ANISOTROPY}
+     * @param format See {@link DepthTexture.format | .format}. Default {@link THREE.DepthFormat}
+     */
+    constructor(
+        width: number,
+        height: number,
+        type?: TextureDataType,
+        mapping?: Mapping,
+        wrapS?: Wrapping,
+        wrapT?: Wrapping,
+        magFilter?: MagnificationTextureFilter,
+        minFilter?: MinificationTextureFilter,
+        anisotropy?: number,
+        format?: DepthTexturePixelFormat,
+    );
+
+    /**
+     * Read-only flag to check if a given object is of type {@link DepthTexture}.
+     * @remarks This is a _constant_ value
+     * @defaultValue `true`
+     */
+    readonly isDepthTexture: true;
+
+    /**
+     * Overridden with a record type holding width and height.
+     * @override
+     */
+    get image(): { width: number; height: number };
+    set image(value: { width: number; height: number });
+
+    /**
+     * @override
+     * @defaultValue `false`
+     */
+    flipY: boolean;
+
+    /**
+     * @override
+     * @defaultValue {@link THREE.NearestFilter}
+     */
+    magFilter: MagnificationTextureFilter;
+
+    /**
+     * @override
+     * @defaultValue {@link THREE.NearestFilter}
+     */
+    minFilter: MinificationTextureFilter;
+
+    /**
+     * @override Depth textures do not use mipmaps.
+     * @defaultValue `false`
+     */
+    generateMipmaps: boolean;
+
+    /**
+     * @override
+     * @see {@link Texture.format | Texture.format}
+     * @defaultValue {@link THREE.DepthFormat}.
+     */
+    format: DepthTexturePixelFormat;
+
+    /**
+     * @override
+     * @defaultValue {@link THREE.UnsignedByteType} when {@link format | .format} === {@link THREE.DepthFormat}
+     * @defaultValue {@link THREE.UnsignedInt248Type} when {@link format | .format} === {@link THREE.DepthStencilFormat}
+     */
+    type: TextureDataType;
+
+    /**
+     * This is used to define the comparison function used when comparing texels in the depth texture to the value in
+     * the depth buffer. Default is `null` which means comparison is disabled.
+     *
+     * See {@link THREE.TextureComparisonFunction} for functions.
+     */
+    compareFunction: TextureComparisonFunction | null;
+}

package/three/src/textures/FramebufferTexture.d.ts

@@ -0,0 +1,62 @@
+import { MagnificationTextureFilter, MinificationTextureFilter } from "../constants.js";
+import { Texture } from "./Texture.js";
+
+/**
+ * This class can only be used in combination with {@link THREE.WebGLRenderer.copyFramebufferToTexture | WebGLRenderer.copyFramebufferToTexture()}.
+ * @example
+ * ```typescript
+ * const pixelRatio = window.devicePixelRatio;
+ * const textureSize = 128 * pixelRatio;
+ *
+ * // instantiate a framebuffer texture
+ * const frameTexture = new FramebufferTexture( textureSize, textureSize, RGBAFormat );
+ *
+ * // calculate start position for copying part of the frame data
+ * const vector = new Vector2();
+ * vector.x = ( window.innerWidth * pixelRatio / 2 ) - ( textureSize / 2 );
+ * vector.y = ( window.innerHeight * pixelRatio / 2 ) - ( textureSize / 2 );
+ *
+ * // render the scene
+ * renderer.clear();
+ * renderer.render( scene, camera );
+ *
+ * // copy part of the rendered frame into the framebuffer texture
+ * renderer.copyFramebufferToTexture( frameTexture, vector );
+ * ```
+ * @see Example: {@link https://threejs.org/examples/#webgl_framebuffer_texture | webgl_framebuffer_texture}
+ * @see {@link https://threejs.org/docs/index.html#api/en/textures/FramebufferTexture | Official Documentation}
+ * @see {@link https://github.com/mrdoob/three.js/blob/master/src/textures/FramebufferTexture.js | Source}
+ */
+export class FramebufferTexture extends Texture {
+    /**
+     * Create a new instance of {@link FramebufferTexture}
+     * @param width The width of the texture.
+     * @param height The height of the texture.
+     */
+    constructor(width: number, height: number);
+
+    /**
+     * Read-only flag to check if a given object is of type {@link FramebufferTexture}.
+     * @remarks This is a _constant_ value
+     * @defaultValue `true`
+     */
+    readonly isFramebufferTexture: true;
+
+    /**
+     * @override
+     * @defaultValue {@link THREE.NearestFilter}
+     */
+    magFilter: MagnificationTextureFilter;
+
+    /**
+     * @override
+     * @defaultValue {@link THREE.NearestFilter}
+     */
+    minFilter: MinificationTextureFilter;
+
+    /**
+     * @override
+     * @defaultValue `false`
+     */
+    generateMipmaps: boolean;
+}

package/three/src/textures/Source.d.ts

@@ -0,0 +1,75 @@
+export type SerializedImage =
+    | string
+    | {
+        data: number[];
+        width: number;
+        height: number;
+        type: string;
+    };
+
+export class SourceJSON {
+    uuid: string;
+    url: SerializedImage | SerializedImage[];
+}
+
+/**
+ * Represents the data {@link Source} of a texture.
+ * @see {@link https://threejs.org/docs/index.html#api/en/textures/Source | Official Documentation}
+ * @see {@link https://github.com/mrdoob/three.js/blob/master/src/textures/Source.js | Source}
+ */
+export class Source {
+    /**
+     * Create a new instance of {@link Source}
+     * @param data The data definition of a texture. Default `null`
+     */
+    constructor(data: any);
+
+    /**
+     * Flag to check if a given object is of type {@link Source}.
+     * @remarks This is a _constant_ value
+     * @defaultValue `true`
+     */
+    readonly isSource: true;
+
+    readonly id: number;
+
+    /**
+     * The actual data of a texture.
+     * @remarks The type of this property depends on the texture that uses this instance.
+     */
+    data: any;
+
+    /**
+     * This property is only relevant when {@link .needsUpdate} is set to `true` and provides more control on how
+     * texture data should be processed.
+     * When `dataReady` is set to `false`, the engine performs the memory allocation (if necessary) but does not
+     * transfer the data into the GPU memory.
+     * @default true
+     */
+    dataReady: boolean;
+
+    /**
+     * When the property is set to `true`, the engine allocates the memory for the texture (if necessary) and triggers
+     * the actual texture upload to the GPU next time the source is used.
+     */
+    set needsUpdate(value: boolean);
+
+    /**
+     * {@link http://en.wikipedia.org/wiki/Universally_unique_identifier | UUID} of this object instance.
+     * @remarks This gets automatically assigned and shouldn't be edited.
+     */
+    uuid: string;
+
+    /**
+     * This starts at `0` and counts how many times {@link needsUpdate | .needsUpdate} is set to `true`.
+     * @remarks Expects a `Integer`
+     * @defaultValue `0`
+     */
+    version: number;
+
+    /**
+     * Convert the data {@link Source} to three.js {@link https://github.com/mrdoob/three.js/wiki/JSON-Object-Scene-format-4 | JSON Object/Scene format}.
+     * @param meta Optional object containing metadata.
+     */
+    toJSON(meta?: string | {}): SourceJSON;
+}