diff --git a/.all-contributorsrc b/.all-contributorsrc index 927ebe2b8..405500e8f 100644 --- a/.all-contributorsrc +++ b/.all-contributorsrc @@ -349,10 +349,8 @@ "profile": "https://github.com/atulrnt", "contributions": [ "code", - ], - "code" ] - }, + } ], "skipCi": true, "contributorsPerLine": 7 diff --git a/types/three/examples/jsm/loaders/DDSLoader.d.ts b/types/three/examples/jsm/loaders/DDSLoader.d.ts index b7619e97a..99bda75ea 100644 --- a/types/three/examples/jsm/loaders/DDSLoader.d.ts +++ b/types/three/examples/jsm/loaders/DDSLoader.d.ts @@ -1,7 +1,7 @@ import { LoadingManager, CompressedTextureLoader, PixelFormat, CompressedPixelFormat } from '../../../src/Three'; export interface DDS { - mipmaps: object[]; + mipmaps: ImageData[]; width: number; height: number; format: PixelFormat | CompressedPixelFormat; diff --git a/types/three/examples/jsm/loaders/KTXLoader.d.ts b/types/three/examples/jsm/loaders/KTXLoader.d.ts index fad9eaea3..74229233a 100644 --- a/types/three/examples/jsm/loaders/KTXLoader.d.ts +++ b/types/three/examples/jsm/loaders/KTXLoader.d.ts @@ -1,7 +1,7 @@ import { LoadingManager, CompressedTextureLoader, PixelFormat, CompressedPixelFormat } from '../../../src/Three'; export interface KTX { - mipmaps: object[]; + mipmaps: ImageData[]; width: number; height: number; format: PixelFormat | CompressedPixelFormat; diff --git a/types/three/examples/jsm/loaders/PVRLoader.d.ts b/types/three/examples/jsm/loaders/PVRLoader.d.ts index 3304f55ce..3d4be157b 100644 --- a/types/three/examples/jsm/loaders/PVRLoader.d.ts +++ b/types/three/examples/jsm/loaders/PVRLoader.d.ts @@ -1,7 +1,7 @@ import { LoadingManager, CompressedTextureLoader, CompressedPixelFormat } from '../../../src/Three'; export interface PVR { - mipmaps: object[]; + mipmaps: ImageData[]; width: number; height: number; format: CompressedPixelFormat; diff --git a/types/three/src/renderers/WebGL3DRenderTarget.d.ts b/types/three/src/renderers/WebGL3DRenderTarget.d.ts index ccdf09b02..a62e9aee8 100644 --- a/types/three/src/renderers/WebGL3DRenderTarget.d.ts +++ b/types/three/src/renderers/WebGL3DRenderTarget.d.ts @@ -1,10 +1,11 @@ import { Data3DTexture } from '../textures/Data3DTexture'; +import { DataDimensions3D } from '../textures/Texture'; import { WebGLRenderTarget } from './WebGLRenderTarget'; /** * Represents a three-dimensional render target. */ -export class WebGL3DRenderTarget extends WebGLRenderTarget { +export class WebGL3DRenderTarget extends WebGLRenderTarget { /** * Creates a new WebGL3DRenderTarget. * @@ -19,10 +20,5 @@ export class WebGL3DRenderTarget extends WebGLRenderTarget { */ depth: number; - /** - * The texture property is overwritten with an instance of {@link Data3DTexture}. - */ - texture: Data3DTexture; - readonly isWebGL3DRenderTarget: true; } diff --git a/types/three/src/renderers/WebGLArrayRenderTarget.d.ts b/types/three/src/renderers/WebGLArrayRenderTarget.d.ts index 35344e848..395dd7b68 100644 --- a/types/three/src/renderers/WebGLArrayRenderTarget.d.ts +++ b/types/three/src/renderers/WebGLArrayRenderTarget.d.ts @@ -1,10 +1,11 @@ import { DataArrayTexture } from '../textures/DataArrayTexture'; +import { DataDimensions3D } from '../textures/Texture'; import { WebGLRenderTarget } from './WebGLRenderTarget'; /** * This type of render target represents an array of textures. */ -export class WebGLArrayRenderTarget extends WebGLRenderTarget { +export class WebGLArrayRenderTarget extends WebGLRenderTarget { /** * Creates a new WebGLArrayRenderTarget. * @@ -19,10 +20,5 @@ export class WebGLArrayRenderTarget extends WebGLRenderTarget { */ depth: number; - /** - * The texture property is overwritten with an instance of {@link DataArrayTexture}. - */ - texture: DataArrayTexture; - readonly isWebGLArrayRenderTarget: true; } diff --git a/types/three/src/renderers/WebGLCubeRenderTarget.d.ts b/types/three/src/renderers/WebGLCubeRenderTarget.d.ts index ae98bc016..b83a29601 100644 --- a/types/three/src/renderers/WebGLCubeRenderTarget.d.ts +++ b/types/three/src/renderers/WebGLCubeRenderTarget.d.ts @@ -1,13 +1,11 @@ import { WebGLRenderTargetOptions, WebGLRenderTarget } from './WebGLRenderTarget'; import { WebGLRenderer } from './WebGLRenderer'; -import { Texture } from './../textures/Texture'; +import { BaseTextureImageType, Texture } from './../textures/Texture'; import { CubeTexture } from './../textures/CubeTexture'; -export class WebGLCubeRenderTarget extends WebGLRenderTarget { +export class WebGLCubeRenderTarget extends WebGLRenderTarget { constructor(size: number, options?: WebGLRenderTargetOptions); - texture: CubeTexture; - fromEquirectangularTexture(renderer: WebGLRenderer, texture: Texture): this; clear(renderer: WebGLRenderer, color: boolean, depth: boolean, stencil: boolean): void; diff --git a/types/three/src/renderers/WebGLRenderTarget.d.ts b/types/three/src/renderers/WebGLRenderTarget.d.ts index 8588676bd..67dcda631 100644 --- a/types/three/src/renderers/WebGLRenderTarget.d.ts +++ b/types/three/src/renderers/WebGLRenderTarget.d.ts @@ -1,5 +1,5 @@ import { Vector4 } from './../math/Vector4'; -import { Texture } from './../textures/Texture'; +import { MipMapType, Texture, TextureImageTypes } from './../textures/Texture'; import { DepthTexture } from './../textures/DepthTexture'; import { EventDispatcher } from './../core/EventDispatcher'; import { Wrapping, TextureFilter, TextureDataType, TextureEncoding } from '../constants'; @@ -25,7 +25,11 @@ export interface WebGLRenderTargetOptions { samples?: number; } -export class WebGLRenderTarget extends EventDispatcher { +export class WebGLRenderTarget< + ImageT extends TextureImageTypes = TextureImageTypes, + MipMapT extends MipMapType = MipMapType, + TextureT extends Texture = Texture, +> extends EventDispatcher { constructor(width: number, height: number, options?: WebGLRenderTargetOptions); width: number; @@ -38,7 +42,7 @@ export class WebGLRenderTarget extends EventDispatcher { */ scissorTest: boolean; viewport: Vector4; - texture: Texture; + texture: TextureT; /** * @default true diff --git a/types/three/src/textures/CanvasTexture.d.ts b/types/three/src/textures/CanvasTexture.d.ts index 6828dff37..144c1d57b 100644 --- a/types/three/src/textures/CanvasTexture.d.ts +++ b/types/three/src/textures/CanvasTexture.d.ts @@ -1,7 +1,8 @@ import { Texture } from './Texture'; import { Mapping, Wrapping, TextureFilter, PixelFormat, TextureDataType } from '../constants'; +import { OffscreenCanvas } from '../renderers/WebGLRenderer'; -export class CanvasTexture extends Texture { +export class CanvasTexture extends Texture { /** * @param canvas * @param [format=THREE.RGBAFormat] @@ -15,7 +16,7 @@ export class CanvasTexture extends Texture { * @param [encoding=THREE.LinearEncoding] */ constructor( - canvas: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement | ImageBitmap, + canvas: HTMLCanvasElement | OffscreenCanvas, mapping?: Mapping, wrapS?: Wrapping, wrapT?: Wrapping, diff --git a/types/three/src/textures/CompressedTexture.d.ts b/types/three/src/textures/CompressedTexture.d.ts index 582413c56..7f8bc073a 100644 --- a/types/three/src/textures/CompressedTexture.d.ts +++ b/types/three/src/textures/CompressedTexture.d.ts @@ -1,4 +1,4 @@ -import { Texture } from './Texture'; +import { Dimensions2D, Texture } from './Texture'; import { Mapping, Wrapping, @@ -8,7 +8,7 @@ import { TextureEncoding, } from '../constants'; -export class CompressedTexture extends Texture { +export class CompressedTexture extends Texture { /** * @param mipmaps * @param width @@ -38,9 +38,6 @@ export class CompressedTexture extends Texture { encoding?: TextureEncoding, ); - get image(): { width: number; height: number }; - set image(value: { width: number; height: number }); - mipmaps: ImageData[]; /** diff --git a/types/three/src/textures/CubeTexture.d.ts b/types/three/src/textures/CubeTexture.d.ts index 75958c05e..f6659787f 100644 --- a/types/three/src/textures/CubeTexture.d.ts +++ b/types/three/src/textures/CubeTexture.d.ts @@ -1,7 +1,7 @@ -import { Texture } from './Texture'; +import { BaseTextureImageType, Texture } from './Texture'; import { Mapping, Wrapping, TextureFilter, PixelFormat, TextureDataType, TextureEncoding } from '../constants'; -export class CubeTexture extends Texture { +export class CubeTexture extends Texture { /** * @param [images=[]] * @param [mapping=THREE.CubeReflectionMapping] @@ -15,7 +15,7 @@ export class CubeTexture extends Texture { * @param [encoding=THREE.LinearEncoding] */ constructor( - images?: any[], // HTMLImageElement or HTMLCanvasElement + images?: BaseTextureImageType[], mapping?: Mapping, wrapS?: Wrapping, wrapT?: Wrapping, diff --git a/types/three/src/textures/Data3DTexture.d.ts b/types/three/src/textures/Data3DTexture.d.ts index 52dfd17b6..77f41a456 100644 --- a/types/three/src/textures/Data3DTexture.d.ts +++ b/types/three/src/textures/Data3DTexture.d.ts @@ -1,7 +1,7 @@ -import { Texture } from './Texture'; +import { DataDimensions3D, Texture } from './Texture'; import { TextureFilter } from '../constants'; -export class Data3DTexture extends Texture { +export class Data3DTexture extends Texture { constructor(data: BufferSource, width: number, height: number, depth: number); /** diff --git a/types/three/src/textures/DataArrayTexture.d.ts b/types/three/src/textures/DataArrayTexture.d.ts index 594c236eb..56a891723 100644 --- a/types/three/src/textures/DataArrayTexture.d.ts +++ b/types/three/src/textures/DataArrayTexture.d.ts @@ -1,7 +1,7 @@ -import { Texture } from './Texture'; +import { DataDimensions3D, Texture } from './Texture'; import { TextureFilter } from '../constants'; -export class DataArrayTexture extends Texture { +export class DataArrayTexture extends Texture { constructor(data?: BufferSource, width?: number, height?: number, depth?: number); /** diff --git a/types/three/src/textures/DataTexture.d.ts b/types/three/src/textures/DataTexture.d.ts index 2d847a474..2de9a66c5 100644 --- a/types/three/src/textures/DataTexture.d.ts +++ b/types/three/src/textures/DataTexture.d.ts @@ -1,7 +1,7 @@ import { Texture } from './Texture'; import { Mapping, Wrapping, TextureFilter, PixelFormat, TextureDataType, TextureEncoding } from '../constants'; -export class DataTexture extends Texture { +export class DataTexture extends Texture { /** * @param data * @param width diff --git a/types/three/src/textures/DepthTexture.d.ts b/types/three/src/textures/DepthTexture.d.ts index 343d3034b..fc5d8a56e 100644 --- a/types/three/src/textures/DepthTexture.d.ts +++ b/types/three/src/textures/DepthTexture.d.ts @@ -1,7 +1,7 @@ -import { Texture } from './Texture'; +import { Dimensions2D, Texture } from './Texture'; import { Mapping, Wrapping, TextureFilter, TextureDataType } from '../constants'; -export class DepthTexture extends Texture { +export class DepthTexture extends Texture { /** * @param width * @param height @@ -25,9 +25,6 @@ export class DepthTexture extends Texture { anisotropy?: number, ); - get image(): { width: number; height: number }; - set image(value: { width: number; height: number }); - /** * @default false */ diff --git a/types/three/src/textures/FramebufferTexture.d.ts b/types/three/src/textures/FramebufferTexture.d.ts index c5b52178a..ebbe5826f 100644 --- a/types/three/src/textures/FramebufferTexture.d.ts +++ b/types/three/src/textures/FramebufferTexture.d.ts @@ -1,7 +1,7 @@ -import { Texture } from './Texture'; +import { Dimensions2D, Texture } from './Texture'; import { PixelFormat } from '../constants'; -export class FramebufferTexture extends Texture { +export class FramebufferTexture extends Texture { readonly isFramebufferTexture: true; constructor(width: number, height: number, format: PixelFormat); diff --git a/types/three/src/textures/Texture.d.ts b/types/three/src/textures/Texture.d.ts index ef0391bee..49cb2ae0c 100644 --- a/types/three/src/textures/Texture.d.ts +++ b/types/three/src/textures/Texture.d.ts @@ -11,8 +11,32 @@ import { TextureDataType, TextureEncoding, } from '../constants'; +import { CubeTexture } from './CubeTexture'; +import { OffscreenCanvas } from '../renderers/WebGLRenderer'; -export class Texture extends EventDispatcher { +export interface Dimensions2D { + width: number; + height: number; +} + +export interface DataDimensions3D extends ImageData { + depth: number; +} + +export type BaseTextureImageType = TexImageSource | OffscreenCanvas | DataDimensions3D | Dimensions2D; + +export type TextureImageTypes = BaseTextureImageType | BaseTextureImageType[]; + +export interface ManualMipMapType extends Dimensions2D { + data: ImageSource; +} + +export type MipMapType = ImageData | ManualMipMapType | CubeTexture; + +export class Texture< + ImageT extends TextureImageTypes = TextureImageTypes, + MipMapT extends MipMapType = MipMapType, +> extends EventDispatcher { /** * @param [image] * @param [mapping=THREE.Texture.DEFAULT_MAPPING] @@ -26,7 +50,7 @@ export class Texture extends EventDispatcher { * @param [encoding=THREE.LinearEncoding] */ constructor( - image?: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement, + image?: ImageT, mapping?: Mapping, wrapS?: Wrapping, wrapT?: Wrapping, @@ -61,7 +85,7 @@ export class Texture extends EventDispatcher { * video element as a source for your texture image and continuously update this texture * as long as video is playing - the {@link VideoTexture} class handles this automatically. */ - get image(): any; + get image(): ImageT; /** * An image object, typically created using the {@link TextureLoader.load} method. @@ -71,12 +95,12 @@ export class Texture extends EventDispatcher { * video element as a source for your texture image and continuously update this texture * as long as video is playing - the {@link VideoTexture} class handles this automatically. */ - set image(data: any); + set image(data: ImageT); /** * @default [] */ - mipmaps: any[]; // ImageData[] for 2D textures and CubeTexture[] for cube textures; + mipmaps: MipMapT[]; // ImageData[] for 2D textures and CubeTexture[] for cube textures; /** * @default THREE.Texture.DEFAULT_MAPPING diff --git a/types/three/src/textures/VideoTexture.d.ts b/types/three/src/textures/VideoTexture.d.ts index 75d2de329..4dfc61e57 100644 --- a/types/three/src/textures/VideoTexture.d.ts +++ b/types/three/src/textures/VideoTexture.d.ts @@ -1,7 +1,7 @@ import { Texture } from './Texture'; import { Mapping, Wrapping, TextureFilter, PixelFormat, TextureDataType } from '../constants'; -export class VideoTexture extends Texture { +export class VideoTexture extends Texture { /** * @param video * @param [mapping=THREE.Texture.DEFAULT_MAPPING] diff --git a/types/three/test/postprocessing/postprocessing-savepass.ts b/types/three/test/postprocessing/postprocessing-savepass.ts index 490ac60f0..9eebbb5e8 100644 --- a/types/three/test/postprocessing/postprocessing-savepass.ts +++ b/types/three/test/postprocessing/postprocessing-savepass.ts @@ -2,7 +2,7 @@ import * as THREE from 'three'; import { SavePass } from 'three/examples/jsm/postprocessing/SavePass'; let pass = new SavePass(); // $ExpectType SavePass -let rt = pass.renderTarget; // $ExpectType WebGLRenderTarget +let rt = pass.renderTarget; // $ExpectType WebGLRenderTarget> pass = new SavePass(new THREE.WebGLRenderTarget(128, 128)); // $ExpectType SavePass -rt = pass.renderTarget; // $ExpectType WebGLRenderTarget +rt = pass.renderTarget; // $ExpectType WebGLRenderTarget> diff --git a/types/three/test/textures/textures-source.ts b/types/three/test/textures/textures-source.ts index 2e5090fdf..483f9cefe 100644 --- a/types/three/test/textures/textures-source.ts +++ b/types/three/test/textures/textures-source.ts @@ -11,3 +11,57 @@ imageLoader.load('/path/to/image.png', image => { material.map.source = source; material.map.offset.x = 0.5; }); + +function assertNever(_: never): void { + throw new Error('Assertion failed'); +} + +(function testTextureFromImage() { + const image = document.createElement('img'); + const imageTex = new THREE.Texture(image); + const img = imageTex.image; // $ExpectType HTMLImageElement + if (!(img instanceof HTMLImageElement)) { + assertNever(img); + } +})(); + +(function testTextureFromCanvas() { + const canvas = document.createElement('canvas'); + const canvasTex = new THREE.Texture(canvas); + const canv = canvasTex.image; // $ExpectType HTMLCanvasElement + if (!(canv instanceof HTMLCanvasElement)) { + assertNever(canv); + } +})(); + +(function testTextureFromVideo() { + const video = document.createElement('video'); + const videoTex = new THREE.VideoTexture(video); + const vid = videoTex.image; // $ExpectType HTMLVideoElement + if (!(vid instanceof HTMLVideoElement)) { + assertNever(vid); + } +})(); + +(function testCanvasTexture() { + const canvas = makeCanvas(); + const canvTex = new THREE.CanvasTexture(canvas); + const img = canvTex.image; // $ExpectType HTMLCanvasElement + if (!(img instanceof HTMLCanvasElement)) { + assertNever(img); + } +})(); + +function makeCanvas() { + const canvas = document.createElement('canvas'); + canvas.width = 1024; + canvas.height = 1024; + const g = canvas.getContext('2d'); + if (g) { + g.fillStyle = 'red'; + g.fillRect(0, 0, 512, 512); + g.fillStyle = 'blue'; + g.fillRect(512, 512, 512, 512); + } + return canvas; +}