pixi.js

Version:

pixijs.com

pixijs/pixijs

1 lines • 8.31 kB

Source Map (JSON)

View Raw

{"version":3,"file":"MeshPlane.mjs","sources":["../../../src/scene/mesh-plane/MeshPlane.ts"],"sourcesContent":["import { definedProps } from '../container/utils/definedProps';\nimport { Mesh } from '../mesh/shared/Mesh';\nimport { PlaneGeometry } from './PlaneGeometry';\n\nimport type { Texture } from '../../rendering/renderers/shared/texture/Texture';\nimport type { DestroyOptions } from '../container/destroyTypes';\nimport type { MeshOptions } from '../mesh/shared/Mesh';\n\n/**\n * Constructor options used for `MeshPlane` instances. Defines how a texture is mapped\n * onto a plane with configurable vertex density.\n * @example\n * ```ts\n * // Basic plane with default vertex density\n * const plane = new MeshPlane({\n * texture: Assets.get('background.png')\n * });\n *\n * // High-detail plane for complex deformations\n * const detailedPlane = new MeshPlane({\n * texture: Assets.get('landscape.jpg'),\n * verticesX: 20,\n * verticesY: 20\n * });\n * ```\n * @see {@link MeshPlane} For the mesh implementation\n * @see {@link PlaneGeometry} For the underlying geometry\n * @category scene\n * @standard\n * @noInheritDoc\n */\nexport interface MeshPlaneOptions extends Omit<MeshOptions, 'geometry'>\n{\n /** The texture to use on the plane. */\n texture: Texture;\n /**\n * Number of vertices along the X axis. More vertices allow for more detailed deformations.\n * @default 10\n */\n verticesX?: number;\n /**\n * Number of vertices along the Y axis. More vertices allow for more detailed deformations.\n * @default 10\n */\n verticesY?: number;\n}\n\n/**\n * A mesh that renders a texture mapped to a plane with configurable vertex density.\n * Useful for creating distortion effects, bent surfaces, and animated deformations.\n * @example\n * ```ts\n * // Create a basic plane\n * const plane = new MeshPlane({\n * texture: Assets.get('background.png'),\n * verticesX: 10,\n * verticesY: 10\n * });\n *\n * // Get the buffer for vertex positions.\n * const { buffer } = plane.geometry.getAttribute('aPosition');\n *\n * // Listen for animate update\n * let timer = 0;\n *\n * app.ticker.add(() =>\n * {\n * // Randomize the vertices positions a bit to create movement.\n * for (let i = 0; i < buffer.data.length; i++)\n * {\n * buffer.data[i] += Math.sin(timer / 10 + i) * 0.5;\n * }\n * buffer.update();\n * timer++;\n * });\n *\n * // Change texture dynamically\n * plane.texture = Assets.get('newTexture.png');\n * ```\n * @category scene\n * @standard\n */\nexport class MeshPlane extends Mesh\n{\n /**\n * Controls whether the mesh geometry automatically updates when the texture dimensions change.\n * When true, the mesh will resize to match any texture updates. When false, the mesh maintains\n * its original dimensions regardless of texture changes.\n * @example\n * ```ts\n * // Create a plane that auto-resizes with texture changes\n * const plane = new MeshPlane({\n * texture: Assets.get('small.png'),\n * verticesX: 10,\n * verticesY: 10\n * });\n *\n * // Plane will automatically resize to match new texture\n * plane.texture = Assets.get('large.png');\n *\n * // Disable auto-resizing to maintain original dimensions\n * plane.autoResize = false;\n *\n * // Plane keeps its size even with new texture\n * plane.texture = Assets.get('different.png');\n *\n * // Manually update geometry if needed\n * const geometry = plane.geometry as PlaneGeometry;\n * geometry.width = plane.texture.width;\n * geometry.height = plane.texture.height;\n * geometry.build();\n * ```\n * @default true\n * @see {@link MeshPlane#texture} For changing the texture\n * @see {@link PlaneGeometry} For manual geometry updates\n */\n public autoResize: boolean;\n protected _textureID: number;\n\n /**\n * @param options - Options to be applied to MeshPlane\n */\n constructor(options: MeshPlaneOptions)\n {\n const { texture, verticesX, verticesY, ...rest } = options;\n const planeGeometry = new PlaneGeometry(definedProps({\n width: texture.width,\n height: texture.height,\n verticesX,\n verticesY,\n }));\n\n super(definedProps({ ...rest, geometry: planeGeometry, texture }));\n\n // lets call the setter to ensure all necessary updates are performed\n this.texture = texture;\n this.autoResize = true;\n }\n\n /**\n * Method used for overrides, to do something in case texture frame was changed.\n * Meshes based on plane can override it and change more details based on texture.\n * @internal\n */\n public textureUpdated(): void\n {\n const geometry: PlaneGeometry = this.geometry as any;\n const { width, height } = this.texture;\n\n if (this.autoResize && (geometry.width !== width || geometry.height !== height))\n {\n geometry.width = width;\n geometry.height = height;\n geometry.build({});\n }\n }\n\n set texture(value: Texture)\n {\n this._texture?.off('update', this.textureUpdated, this);\n\n super.texture = value;\n\n value.on('update', this.textureUpdated, this);\n\n this.textureUpdated();\n }\n\n /**\n * The texture that the mesh plane uses for rendering. When changed, automatically updates\n * geometry dimensions if autoResize is true and manages texture update event listeners.\n * @example\n * ```ts\n * const plane = new MeshPlane({\n * texture: Assets.get('initial.png'),\n * verticesX: 10,\n * verticesY: 10\n * });\n *\n * // Update texture and auto-resize geometry\n * plane.texture = Assets.get('larger.png');\n * ```\n * @see {@link MeshPlane#autoResize} For controlling automatic geometry updates\n * @see {@link PlaneGeometry} For manual geometry updates\n * @see {@link Texture} For texture creation and management\n */\n get texture(): Texture\n {\n return this._texture;\n }\n\n /**\n * Destroys this sprite renderable and optionally its texture.\n * @param options - Options parameter. A boolean will act as if all options\n * have been set to that value\n * @example\n * meshPlane.destroy();\n * meshPlane.destroy(true);\n * meshPlane.destroy({ texture: true, textureSource: true });\n */\n public destroy(options?: DestroyOptions): void\n {\n this.texture.off('update', this.textureUpdated, this);\n super.destroy(options);\n }\n}\n"],"names":[],"mappings":";;;;;AAkFO,MAAM,kBAAkB,IAC/B,CAAA;AAAA;AAAA;AAAA;AAAA,EAuCI,YAAY,OACZ,EAAA;AACI,IAAA,MAAM,EAAE,OAAS,EAAA,SAAA,EAAW,SAAW,EAAA,GAAG,MAAS,GAAA,OAAA,CAAA;AACnD,IAAM,MAAA,aAAA,GAAgB,IAAI,aAAA,CAAc,YAAa,CAAA;AAAA,MACjD,OAAO,OAAQ,CAAA,KAAA;AAAA,MACf,QAAQ,OAAQ,CAAA,MAAA;AAAA,MAChB,SAAA;AAAA,MACA,SAAA;AAAA,KACH,CAAC,CAAA,CAAA;AAEF,IAAM,KAAA,CAAA,YAAA,CAAa,EAAE,GAAG,IAAA,EAAM,UAAU,aAAe,EAAA,OAAA,EAAS,CAAC,CAAA,CAAA;AAGjE,IAAA,IAAA,CAAK,OAAU,GAAA,OAAA,CAAA;AACf,IAAA,IAAA,CAAK,UAAa,GAAA,IAAA,CAAA;AAAA,GACtB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOO,cACP,GAAA;AACI,IAAA,MAAM,WAA0B,IAAK,CAAA,QAAA,CAAA;AACrC,IAAA,MAAM,EAAE,KAAA,EAAO,MAAO,EAAA,GAAI,IAAK,CAAA,OAAA,CAAA;AAE/B,IAAA,IAAI,KAAK,UAAe,KAAA,QAAA,CAAS,UAAU,KAAS,IAAA,QAAA,CAAS,WAAW,MACxE,CAAA,EAAA;AACI,MAAA,QAAA,CAAS,KAAQ,GAAA,KAAA,CAAA;AACjB,MAAA,QAAA,CAAS,MAAS,GAAA,MAAA,CAAA;AAClB,MAAS,QAAA,CAAA,KAAA,CAAM,EAAE,CAAA,CAAA;AAAA,KACrB;AAAA,GACJ;AAAA,EAEA,IAAI,QAAQ,KACZ,EAAA;AACI,IAAA,IAAA,CAAK,QAAU,EAAA,GAAA,CAAI,QAAU,EAAA,IAAA,CAAK,gBAAgB,IAAI,CAAA,CAAA;AAEtD,IAAA,KAAA,CAAM,OAAU,GAAA,KAAA,CAAA;AAEhB,IAAA,KAAA,CAAM,EAAG,CAAA,QAAA,EAAU,IAAK,CAAA,cAAA,EAAgB,IAAI,CAAA,CAAA;AAE5C,IAAA,IAAA,CAAK,cAAe,EAAA,CAAA;AAAA,GACxB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAoBA,IAAI,OACJ,GAAA;AACI,IAAA,OAAO,IAAK,CAAA,QAAA,CAAA;AAAA,GAChB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAWO,QAAQ,OACf,EAAA;AACI,IAAA,IAAA,CAAK,OAAQ,CAAA,GAAA,CAAI,QAAU,EAAA,IAAA,CAAK,gBAAgB,IAAI,CAAA,CAAA;AACpD,IAAA,KAAA,CAAM,QAAQ,OAAO,CAAA,CAAA;AAAA,GACzB;AACJ;;;;"}