pixi.js

Version:

pixijs.com

pixijs/pixijs

1 lines • 8.22 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,IAAA,CAC/B;AAAA;AAAA;AAAA;AAAA,EAuCI,YAAY,OAAA,EACZ;AACI,IAAA,MAAM,EAAE,OAAA,EAAS,SAAA,EAAW,SAAA,EAAW,GAAG,MAAK,GAAI,OAAA;AACnD,IAAA,MAAM,aAAA,GAAgB,IAAI,aAAA,CAAc,YAAA,CAAa;AAAA,MACjD,OAAO,OAAA,CAAQ,KAAA;AAAA,MACf,QAAQ,OAAA,CAAQ,MAAA;AAAA,MAChB,SAAA;AAAA,MACA;AAAA,KACH,CAAC,CAAA;AAEF,IAAA,KAAA,CAAM,YAAA,CAAa,EAAE,GAAG,IAAA,EAAM,UAAU,aAAA,EAAe,OAAA,EAAS,CAAC,CAAA;AAGjE,IAAA,IAAA,CAAK,OAAA,GAAU,OAAA;AACf,IAAA,IAAA,CAAK,UAAA,GAAa,IAAA;AAAA,EACtB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOO,cAAA,GACP;AACI,IAAA,MAAM,WAA0B,IAAA,CAAK,QAAA;AACrC,IAAA,MAAM,EAAE,KAAA,EAAO,MAAA,EAAO,GAAI,IAAA,CAAK,OAAA;AAE/B,IAAA,IAAI,KAAK,UAAA,KAAe,QAAA,CAAS,UAAU,KAAA,IAAS,QAAA,CAAS,WAAW,MAAA,CAAA,EACxE;AACI,MAAA,QAAA,CAAS,KAAA,GAAQ,KAAA;AACjB,MAAA,QAAA,CAAS,MAAA,GAAS,MAAA;AAClB,MAAA,QAAA,CAAS,KAAA,CAAM,EAAE,CAAA;AAAA,IACrB;AAAA,EACJ;AAAA,EAEA,IAAI,QAAQ,KAAA,EACZ;AACI,IAAA,IAAA,CAAK,QAAA,EAAU,GAAA,CAAI,QAAA,EAAU,IAAA,CAAK,gBAAgB,IAAI,CAAA;AAEtD,IAAA,KAAA,CAAM,OAAA,GAAU,KAAA;AAEhB,IAAA,KAAA,CAAM,EAAA,CAAG,QAAA,EAAU,IAAA,CAAK,cAAA,EAAgB,IAAI,CAAA;AAE5C,IAAA,IAAA,CAAK,cAAA,EAAe;AAAA,EACxB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAoBA,IAAI,OAAA,GACJ;AACI,IAAA,OAAO,IAAA,CAAK,QAAA;AAAA,EAChB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAWO,QAAQ,OAAA,EACf;AACI,IAAA,IAAA,CAAK,OAAA,CAAQ,GAAA,CAAI,QAAA,EAAU,IAAA,CAAK,gBAAgB,IAAI,CAAA;AACpD,IAAA,KAAA,CAAM,QAAQ,OAAO,CAAA;AAAA,EACzB;AACJ;;;;"}