(p: T): T\n {\n p.set(this._x, this._y);\n\n return p;\n }\n\n /**\n * Accepts another point (`p`) and returns `true` if the given point is equal to this point\n *\n * @param p - The point to check\n * @returns Returns `true` if both `x` and `y` are equal\n */\n equals(p: IPointData): boolean\n {\n return (p.x === this._x) && (p.y === this._y);\n }\n\n // #if _DEBUG\n toString(): string\n {\n return `[@pixi/math:ObservablePoint x=${0} y=${0} scope=${this.scope}]`;\n }\n // #endif\n\n /** Position of the observable point on the x axis. */\n get x(): number\n {\n return this._x;\n }\n\n set x(value: number)\n {\n if (this._x !== value)\n {\n this._x = value;\n this.cb.call(this.scope);\n }\n }\n\n /** Position of the observable point on the y axis. */\n get y(): number\n {\n return this._y;\n }\n\n set y(value: number)\n {\n if (this._y !== value)\n {\n this._y = value;\n this.cb.call(this.scope);\n }\n }\n}\n","import { Point } from './Point';\nimport { PI_2 } from './const';\n\nimport type { Transform } from './Transform';\nimport type { IPointData } from './IPointData';\n\n/**\n * The PixiJS Matrix as a class makes it a lot faster.\n *\n * Here is a representation of it:\n * ```js\n * | a | c | tx|\n * | b | d | ty|\n * | 0 | 0 | 1 |\n * ```\n *\n * @memberof PIXI\n */\nexport class Matrix\n{\n /** @default 1 */\n public a: number;\n\n /** @default 0 */\n public b: number;\n\n /** @default 0 */\n public c: number;\n\n /** @default 1 */\n public d: number;\n\n /** @default 0 */\n public tx: number;\n\n /** @default 0 */\n public ty: number;\n\n public array: Float32Array|null = null;\n\n /**\n * @param a - x scale\n * @param b - y skew\n * @param c - x skew\n * @param d - y scale\n * @param tx - x translation\n * @param ty - y translation\n */\n constructor(a = 1, b = 0, c = 0, d = 1, tx = 0, ty = 0)\n {\n this.a = a;\n this.b = b;\n this.c = c;\n this.d = d;\n this.tx = tx;\n this.ty = ty;\n }\n\n /**\n * Creates a Matrix object based on the given array. The Element to Matrix mapping order is as follows:\n *\n * a = array[0]\n * b = array[1]\n * c = array[3]\n * d = array[4]\n * tx = array[2]\n * ty = array[5]\n *\n * @param array - The array that the matrix will be populated from.\n */\n fromArray(array: number[]): void\n {\n this.a = array[0];\n this.b = array[1];\n this.c = array[3];\n this.d = array[4];\n this.tx = array[2];\n this.ty = array[5];\n }\n\n /**\n * Sets the matrix properties.\n *\n * @param a - Matrix component\n * @param b - Matrix component\n * @param c - Matrix component\n * @param d - Matrix component\n * @param tx - Matrix component\n * @param ty - Matrix component\n * @return This matrix. Good for chaining method calls.\n */\n set(a: number, b: number, c: number, d: number, tx: number, ty: number): this\n {\n this.a = a;\n this.b = b;\n this.c = c;\n this.d = d;\n this.tx = tx;\n this.ty = ty;\n\n return this;\n }\n\n /**\n * Creates an array from the current Matrix object.\n *\n * @param transpose - Whether we need to transpose the matrix or not\n * @param [out=new Float32Array(9)] - If provided the array will be assigned to out\n * @return The newly created array which contains the matrix\n */\n toArray(transpose: boolean, out?: Float32Array): Float32Array\n {\n if (!this.array)\n {\n this.array = new Float32Array(9);\n }\n\n const array = out || this.array;\n\n if (transpose)\n {\n array[0] = this.a;\n array[1] = this.b;\n array[2] = 0;\n array[3] = this.c;\n array[4] = this.d;\n array[5] = 0;\n array[6] = this.tx;\n array[7] = this.ty;\n array[8] = 1;\n }\n else\n {\n array[0] = this.a;\n array[1] = this.c;\n array[2] = this.tx;\n array[3] = this.b;\n array[4] = this.d;\n array[5] = this.ty;\n array[6] = 0;\n array[7] = 0;\n array[8] = 1;\n }\n\n return array;\n }\n\n /**\n * Get a new position with the current transformation applied.\n * Can be used to go from a child's coordinate space to the world coordinate space. (e.g. rendering)\n *\n * @param pos - The origin\n * @param {PIXI.Point} [newPos] - The point that the new position is assigned to (allowed to be same as input)\n * @return {PIXI.Point} The new point, transformed through this matrix\n */\n apply(pos: IPointData, newPos?: P): P\n {\n newPos = (newPos || new Point()) as P;\n\n const x = pos.x;\n const y = pos.y;\n\n newPos.x = (this.a * x) + (this.c * y) + this.tx;\n newPos.y = (this.b * x) + (this.d * y) + this.ty;\n\n return newPos;\n }\n\n /**\n * Get a new position with the inverse of the current transformation applied.\n * Can be used to go from the world coordinate space to a child's coordinate space. (e.g. input)\n *\n * @param pos - The origin\n * @param {PIXI.Point} [newPos] - The point that the new position is assigned to (allowed to be same as input)\n * @return {PIXI.Point} The new point, inverse-transformed through this matrix\n */\n applyInverse
(pos: IPointData, newPos?: P): P\n {\n newPos = (newPos || new Point()) as P;\n\n const id = 1 / ((this.a * this.d) + (this.c * -this.b));\n\n const x = pos.x;\n const y = pos.y;\n\n newPos.x = (this.d * id * x) + (-this.c * id * y) + (((this.ty * this.c) - (this.tx * this.d)) * id);\n newPos.y = (this.a * id * y) + (-this.b * id * x) + (((-this.ty * this.a) + (this.tx * this.b)) * id);\n\n return newPos;\n }\n\n /**\n * Translates the matrix on the x and y.\n *\n * @param x - How much to translate x by\n * @param y - How much to translate y by\n * @return This matrix. Good for chaining method calls.\n */\n translate(x: number, y: number): this\n {\n this.tx += x;\n this.ty += y;\n\n return this;\n }\n\n /**\n * Applies a scale transformation to the matrix.\n *\n * @param x - The amount to scale horizontally\n * @param y - The amount to scale vertically\n * @return This matrix. Good for chaining method calls.\n */\n scale(x: number, y: number): this\n {\n this.a *= x;\n this.d *= y;\n this.c *= x;\n this.b *= y;\n this.tx *= x;\n this.ty *= y;\n\n return this;\n }\n\n /**\n * Applies a rotation transformation to the matrix.\n *\n * @param angle - The angle in radians.\n * @return This matrix. Good for chaining method calls.\n */\n rotate(angle: number): this\n {\n const cos = Math.cos(angle);\n const sin = Math.sin(angle);\n\n const a1 = this.a;\n const c1 = this.c;\n const tx1 = this.tx;\n\n this.a = (a1 * cos) - (this.b * sin);\n this.b = (a1 * sin) + (this.b * cos);\n this.c = (c1 * cos) - (this.d * sin);\n this.d = (c1 * sin) + (this.d * cos);\n this.tx = (tx1 * cos) - (this.ty * sin);\n this.ty = (tx1 * sin) + (this.ty * cos);\n\n return this;\n }\n\n /**\n * Appends the given Matrix to this Matrix.\n *\n * @param matrix - The matrix to append.\n * @return This matrix. Good for chaining method calls.\n */\n append(matrix: Matrix): this\n {\n const a1 = this.a;\n const b1 = this.b;\n const c1 = this.c;\n const d1 = this.d;\n\n this.a = (matrix.a * a1) + (matrix.b * c1);\n this.b = (matrix.a * b1) + (matrix.b * d1);\n this.c = (matrix.c * a1) + (matrix.d * c1);\n this.d = (matrix.c * b1) + (matrix.d * d1);\n\n this.tx = (matrix.tx * a1) + (matrix.ty * c1) + this.tx;\n this.ty = (matrix.tx * b1) + (matrix.ty * d1) + this.ty;\n\n return this;\n }\n\n /**\n * Sets the matrix based on all the available properties\n *\n * @param x - Position on the x axis\n * @param y - Position on the y axis\n * @param pivotX - Pivot on the x axis\n * @param pivotY - Pivot on the y axis\n * @param scaleX - Scale on the x axis\n * @param scaleY - Scale on the y axis\n * @param rotation - Rotation in radians\n * @param skewX - Skew on the x axis\n * @param skewY - Skew on the y axis\n * @return This matrix. Good for chaining method calls.\n */\n setTransform(x: number, y: number, pivotX: number, pivotY: number, scaleX: number,\n scaleY: number, rotation: number, skewX: number, skewY: number): this\n {\n this.a = Math.cos(rotation + skewY) * scaleX;\n this.b = Math.sin(rotation + skewY) * scaleX;\n this.c = -Math.sin(rotation - skewX) * scaleY;\n this.d = Math.cos(rotation - skewX) * scaleY;\n\n this.tx = x - ((pivotX * this.a) + (pivotY * this.c));\n this.ty = y - ((pivotX * this.b) + (pivotY * this.d));\n\n return this;\n }\n\n /**\n * Prepends the given Matrix to this Matrix.\n *\n * @param matrix - The matrix to prepend\n * @return This matrix. Good for chaining method calls.\n */\n prepend(matrix: Matrix): this\n {\n const tx1 = this.tx;\n\n if (matrix.a !== 1 || matrix.b !== 0 || matrix.c !== 0 || matrix.d !== 1)\n {\n const a1 = this.a;\n const c1 = this.c;\n\n this.a = (a1 * matrix.a) + (this.b * matrix.c);\n this.b = (a1 * matrix.b) + (this.b * matrix.d);\n this.c = (c1 * matrix.a) + (this.d * matrix.c);\n this.d = (c1 * matrix.b) + (this.d * matrix.d);\n }\n\n this.tx = (tx1 * matrix.a) + (this.ty * matrix.c) + matrix.tx;\n this.ty = (tx1 * matrix.b) + (this.ty * matrix.d) + matrix.ty;\n\n return this;\n }\n\n /**\n * Decomposes the matrix (x, y, scaleX, scaleY, and rotation) and sets the properties on to a transform.\n *\n * @param transform - The transform to apply the properties to.\n * @return The transform with the newly applied properties\n */\n decompose(transform: Transform): Transform\n {\n // sort out rotation / skew..\n const a = this.a;\n const b = this.b;\n const c = this.c;\n const d = this.d;\n const pivot = transform.pivot;\n\n const skewX = -Math.atan2(-c, d);\n const skewY = Math.atan2(b, a);\n\n const delta = Math.abs(skewX + skewY);\n\n if (delta < 0.00001 || Math.abs(PI_2 - delta) < 0.00001)\n {\n transform.rotation = skewY;\n transform.skew.x = transform.skew.y = 0;\n }\n else\n {\n transform.rotation = 0;\n transform.skew.x = skewX;\n transform.skew.y = skewY;\n }\n\n // next set scale\n transform.scale.x = Math.sqrt((a * a) + (b * b));\n transform.scale.y = Math.sqrt((c * c) + (d * d));\n\n // next set position\n transform.position.x = this.tx + ((pivot.x * a) + (pivot.y * c));\n transform.position.y = this.ty + ((pivot.x * b) + (pivot.y * d));\n\n return transform;\n }\n\n /**\n * Inverts this matrix\n *\n * @return This matrix. Good for chaining method calls.\n */\n invert(): this\n {\n const a1 = this.a;\n const b1 = this.b;\n const c1 = this.c;\n const d1 = this.d;\n const tx1 = this.tx;\n const n = (a1 * d1) - (b1 * c1);\n\n this.a = d1 / n;\n this.b = -b1 / n;\n this.c = -c1 / n;\n this.d = a1 / n;\n this.tx = ((c1 * this.ty) - (d1 * tx1)) / n;\n this.ty = -((a1 * this.ty) - (b1 * tx1)) / n;\n\n return this;\n }\n\n /**\n * Resets this Matrix to an identity (default) matrix.\n *\n * @return This matrix. Good for chaining method calls.\n */\n identity(): this\n {\n this.a = 1;\n this.b = 0;\n this.c = 0;\n this.d = 1;\n this.tx = 0;\n this.ty = 0;\n\n return this;\n }\n\n /**\n * Creates a new Matrix object with the same values as this one.\n *\n * @return A copy of this matrix. Good for chaining method calls.\n */\n clone(): Matrix\n {\n const matrix = new Matrix();\n\n matrix.a = this.a;\n matrix.b = this.b;\n matrix.c = this.c;\n matrix.d = this.d;\n matrix.tx = this.tx;\n matrix.ty = this.ty;\n\n return matrix;\n }\n\n /**\n * Changes the values of the given matrix to be the same as the ones in this matrix\n *\n * @param matrix - The matrix to copy to.\n * @return The matrix given in parameter with its values updated.\n */\n copyTo(matrix: Matrix): Matrix\n {\n matrix.a = this.a;\n matrix.b = this.b;\n matrix.c = this.c;\n matrix.d = this.d;\n matrix.tx = this.tx;\n matrix.ty = this.ty;\n\n return matrix;\n }\n\n /**\n * Changes the values of the matrix to be the same as the ones in given matrix\n *\n * @param {PIXI.Matrix} matrix - The matrix to copy from.\n * @return {PIXI.Matrix} this\n */\n copyFrom(matrix: Matrix): this\n {\n this.a = matrix.a;\n this.b = matrix.b;\n this.c = matrix.c;\n this.d = matrix.d;\n this.tx = matrix.tx;\n this.ty = matrix.ty;\n\n return this;\n }\n\n // #if _DEBUG\n toString(): string\n {\n return `[@pixi/math:Matrix a=${this.a} b=${this.b} c=${this.c} d=${this.d} tx=${this.tx} ty=${this.ty}]`;\n }\n // #endif\n\n /**\n * A default (identity) matrix\n *\n * @readonly\n */\n static get IDENTITY(): Matrix\n {\n return new Matrix();\n }\n\n /**\n * A temp matrix\n *\n * @readonly\n */\n static get TEMP_MATRIX(): Matrix\n {\n return new Matrix();\n }\n}\n","// Your friendly neighbour https://en.wikipedia.org/wiki/Dihedral_group\n//\n// This file implements the dihedral group of order 16, also called\n// of degree 8. That's why its called groupD8.\n\nimport { Matrix } from './Matrix';\n\n/*\n * Transform matrix for operation n is:\n * | ux | vx |\n * | uy | vy |\n */\n\nconst ux = [1, 1, 0, -1, -1, -1, 0, 1, 1, 1, 0, -1, -1, -1, 0, 1];\nconst uy = [0, 1, 1, 1, 0, -1, -1, -1, 0, 1, 1, 1, 0, -1, -1, -1];\nconst vx = [0, -1, -1, -1, 0, 1, 1, 1, 0, 1, 1, 1, 0, -1, -1, -1];\nconst vy = [1, 1, 0, -1, -1, -1, 0, 1, -1, -1, 0, 1, 1, 1, 0, -1];\n\n/**\n * [Cayley Table]{@link https://en.wikipedia.org/wiki/Cayley_table}\n * for the composition of each rotation in the dihederal group D8.\n *\n * @type number[][]\n * @private\n */\nconst rotationCayley: number[][] = [];\n\n/**\n * Matrices for each `GD8Symmetry` rotation.\n *\n * @type Matrix[]\n * @private\n */\nconst rotationMatrices: Matrix[] = [];\n\n/*\n * Alias for {@code Math.sign}.\n */\nconst signum = Math.sign;\n\n/*\n * Initializes `rotationCayley` and `rotationMatrices`. It is called\n * only once below.\n */\nfunction init(): void\n{\n for (let i = 0; i < 16; i++)\n {\n const row: number[] = [];\n\n rotationCayley.push(row);\n\n for (let j = 0; j < 16; j++)\n {\n /* Multiplies rotation matrices i and j. */\n const _ux = signum((ux[i] * ux[j]) + (vx[i] * uy[j]));\n const _uy = signum((uy[i] * ux[j]) + (vy[i] * uy[j]));\n const _vx = signum((ux[i] * vx[j]) + (vx[i] * vy[j]));\n const _vy = signum((uy[i] * vx[j]) + (vy[i] * vy[j]));\n\n /* Finds rotation matrix matching the product and pushes it. */\n for (let k = 0; k < 16; k++)\n {\n if (ux[k] === _ux && uy[k] === _uy\n && vx[k] === _vx && vy[k] === _vy)\n {\n row.push(k);\n break;\n }\n }\n }\n }\n\n for (let i = 0; i < 16; i++)\n {\n const mat = new Matrix();\n\n mat.set(ux[i], uy[i], vx[i], vy[i], 0, 0);\n rotationMatrices.push(mat);\n }\n}\n\ninit();\n\ntype GD8Symmetry = number;\n/**\n * @memberof PIXI\n * @typedef {number} GD8Symmetry\n * @see PIXI.groupD8\n */\n\n/**\n * Implements the dihedral group D8, which is similar to\n * [group D4]{@link http://mathworld.wolfram.com/DihedralGroupD4.html};\n * D8 is the same but with diagonals, and it is used for texture\n * rotations.\n *\n * The directions the U- and V- axes after rotation\n * of an angle of `a: GD8Constant` are the vectors `(uX(a), uY(a))`\n * and `(vX(a), vY(a))`. These aren't necessarily unit vectors.\n *\n * **Origin:**(...children: T): T[0]\n {\n // if there is only one argument we can bypass looping through the them\n if (children.length > 1)\n {\n // loop through the array and add all children\n for (let i = 0; i < children.length; i++)\n {\n // eslint-disable-next-line prefer-rest-params\n this.addChild(children[i]);\n }\n }\n else\n {\n const child = children[0];\n // if the child has a parent then lets remove it as PixiJS objects can only exist in one place\n\n if (child.parent)\n {\n child.parent.removeChild(child);\n }\n\n child.parent = this;\n this.sortDirty = true;\n\n // ensure child transform will be recalculated\n child.transform._parentID = -1;\n\n this.children.push(child);\n\n // ensure bounds will be recalculated\n this._boundsID++;\n\n // TODO - lets either do all callbacks or all events.. not both!\n this.onChildrenChange(this.children.length - 1);\n this.emit('childAdded', child, this, this.children.length - 1);\n child.emit('added', this);\n }\n\n return children[0];\n }\n\n /**\n * Adds a child to the container at a specified index. If the index is out of bounds an error will be thrown\n *\n * @param {PIXI.DisplayObject} child - The child to add\n * @param {number} index - The index to place the child in\n * @return {PIXI.DisplayObject} The child that was added.\n */\n addChildAt(child: T, index: number): T\n {\n if (index < 0 || index > this.children.length)\n {\n throw new Error(`${child}addChildAt: The index ${index} supplied is out of bounds ${this.children.length}`);\n }\n\n if (child.parent)\n {\n child.parent.removeChild(child);\n }\n\n child.parent = this;\n this.sortDirty = true;\n\n // ensure child transform will be recalculated\n child.transform._parentID = -1;\n\n this.children.splice(index, 0, child);\n\n // ensure bounds will be recalculated\n this._boundsID++;\n\n // TODO - lets either do all callbacks or all events.. not both!\n this.onChildrenChange(index);\n child.emit('added', this);\n this.emit('childAdded', child, this, index);\n\n return child;\n }\n\n /**\n * Swaps the position of 2 Display Objects within this container.\n *\n * @param {PIXI.DisplayObject} child - First display object to swap\n * @param {PIXI.DisplayObject} child2 - Second display object to swap\n */\n swapChildren(child: DisplayObject, child2: DisplayObject): void\n {\n if (child === child2)\n {\n return;\n }\n\n const index1 = this.getChildIndex(child);\n const index2 = this.getChildIndex(child2);\n\n this.children[index1] = child2;\n this.children[index2] = child;\n this.onChildrenChange(index1 < index2 ? index1 : index2);\n }\n\n /**\n * Returns the index position of a child DisplayObject instance\n *\n * @param {PIXI.DisplayObject} child - The DisplayObject instance to identify\n * @return {number} The index position of the child display object to identify\n */\n getChildIndex(child: DisplayObject): number\n {\n const index = this.children.indexOf(child);\n\n if (index === -1)\n {\n throw new Error('The supplied DisplayObject must be a child of the caller');\n }\n\n return index;\n }\n\n /**\n * Changes the position of an existing child in the display object container\n *\n * @param {PIXI.DisplayObject} child - The child DisplayObject instance for which you want to change the index number\n * @param {number} index - The resulting index number for the child display object\n */\n setChildIndex(child: DisplayObject, index: number): void\n {\n if (index < 0 || index >= this.children.length)\n {\n throw new Error(`The index ${index} supplied is out of bounds ${this.children.length}`);\n }\n\n const currentIndex = this.getChildIndex(child);\n\n removeItems(this.children, currentIndex, 1); // remove from old position\n this.children.splice(index, 0, child); // add at new position\n\n this.onChildrenChange(index);\n }\n\n /**\n * Returns the child at the specified index\n *\n * @param {number} index - The index to get the child at\n * @return {PIXI.DisplayObject} The child at the given index, if any.\n */\n getChildAt(index: number): DisplayObject\n {\n if (index < 0 || index >= this.children.length)\n {\n throw new Error(`getChildAt: Index (${index}) does not exist.`);\n }\n\n return this.children[index];\n }\n\n /**\n * Removes one or more children from the container.\n *\n * @param {...PIXI.DisplayObject} children - The DisplayObject(s) to remove\n * @return {PIXI.DisplayObject} The first child that was removed.\n */\n removeChild(...children: T): T[0]\n {\n // if there is only one argument we can bypass looping through the them\n if (children.length > 1)\n {\n // loop through the arguments property and remove all children\n for (let i = 0; i < children.length; i++)\n {\n this.removeChild(children[i]);\n }\n }\n else\n {\n const child = children[0];\n const index = this.children.indexOf(child);\n\n if (index === -1) return null;\n\n child.parent = null;\n // ensure child transform will be recalculated\n child.transform._parentID = -1;\n removeItems(this.children, index, 1);\n\n // ensure bounds will be recalculated\n this._boundsID++;\n\n // TODO - lets either do all callbacks or all events.. not both!\n this.onChildrenChange(index);\n child.emit('removed', this);\n this.emit('childRemoved', child, this, index);\n }\n\n return children[0];\n }\n\n /**\n * Removes a child from the specified index position.\n *\n * @param {number} index - The index to get the child from\n * @return {PIXI.DisplayObject} The child that was removed.\n */\n removeChildAt(index: number): DisplayObject\n {\n const child = this.getChildAt(index);\n\n // ensure child transform will be recalculated..\n child.parent = null;\n child.transform._parentID = -1;\n removeItems(this.children, index, 1);\n\n // ensure bounds will be recalculated\n this._boundsID++;\n\n // TODO - lets either do all callbacks or all events.. not both!\n this.onChildrenChange(index);\n child.emit('removed', this);\n this.emit('childRemoved', child, this, index);\n\n return child;\n }\n\n /**\n * Removes all children from this container that are within the begin and end indexes.\n *\n * @param {number} [beginIndex=0] - The beginning position.\n * @param {number} [endIndex=this.children.length] - The ending position. Default value is size of the container.\n * @returns {PIXI.DisplayObject[]} List of removed children\n */\n removeChildren(beginIndex = 0, endIndex = this.children.length): DisplayObject[]\n {\n const begin = beginIndex;\n const end = endIndex;\n const range = end - begin;\n let removed;\n\n if (range > 0 && range <= end)\n {\n removed = this.children.splice(begin, range);\n\n for (let i = 0; i < removed.length; ++i)\n {\n removed[i].parent = null;\n if (removed[i].transform)\n {\n removed[i].transform._parentID = -1;\n }\n }\n\n this._boundsID++;\n\n this.onChildrenChange(beginIndex);\n\n for (let i = 0; i < removed.length; ++i)\n {\n removed[i].emit('removed', this);\n this.emit('childRemoved', removed[i], this, i);\n }\n\n return removed;\n }\n else if (range === 0 && this.children.length === 0)\n {\n return [];\n }\n\n throw new RangeError('removeChildren: numeric values are outside the acceptable range.');\n }\n\n /**\n * Sorts children by zIndex. Previous order is maintained for 2 children with the same zIndex.\n */\n sortChildren(): void\n {\n let sortRequired = false;\n\n for (let i = 0, j = this.children.length; i < j; ++i)\n {\n const child = this.children[i];\n\n child._lastSortedIndex = i;\n\n if (!sortRequired && child.zIndex !== 0)\n {\n sortRequired = true;\n }\n }\n\n if (sortRequired && this.children.length > 1)\n {\n this.children.sort(sortChildren);\n }\n\n this.sortDirty = false;\n }\n\n /**\n * Updates the transform on all children of this container for rendering\n */\n updateTransform(): void\n {\n if (this.sortableChildren && this.sortDirty)\n {\n this.sortChildren();\n }\n\n this._boundsID++;\n\n this.transform.updateTransform(this.parent.transform);\n\n // TODO: check render flags, how to process stuff here\n this.worldAlpha = this.alpha * this.parent.worldAlpha;\n\n for (let i = 0, j = this.children.length; i < j; ++i)\n {\n const child = this.children[i];\n\n if (child.visible)\n {\n child.updateTransform();\n }\n }\n }\n\n /**\n * Recalculates the bounds of the container.\n *\n * This implementation will automatically fit the children's bounds into the calculation. Each child's bounds\n * is limited to its mask's bounds or filterArea, if any is applied.\n */\n calculateBounds(): void\n {\n this._bounds.clear();\n\n this._calculateBounds();\n\n for (let i = 0; i < this.children.length; i++)\n {\n const child = this.children[i];\n\n if (!child.visible || !child.renderable)\n {\n continue;\n }\n\n child.calculateBounds();\n\n // TODO: filter+mask, need to mask both somehow\n if (child._mask)\n {\n const maskObject = ((child._mask as MaskData).maskObject || child._mask) as Container;\n\n maskObject.calculateBounds();\n this._bounds.addBoundsMask(child._bounds, maskObject._bounds);\n }\n else if (child.filterArea)\n {\n this._bounds.addBoundsArea(child._bounds, child.filterArea);\n }\n else\n {\n this._bounds.addBounds(child._bounds);\n }\n }\n\n this._bounds.updateID = this._boundsID;\n }\n\n /**\n * Retrieves the local bounds of the displayObject as a rectangle object.\n *\n * Calling `getLocalBounds` may invalidate the `_bounds` of the whole subtree below. If using it inside a render()\n * call, it is advised to call `getBounds()` immediately after to recalculate the world bounds of the subtree.\n *\n * @param {PIXI.Rectangle} [rect] - Optional rectangle to store the result of the bounds calculation.\n * @param {boolean} [skipChildrenUpdate=false] - Setting to `true` will stop re-calculation of children transforms,\n * it was default behaviour of pixi 4.0-5.2 and caused many problems to users.\n * @return {PIXI.Rectangle} The rectangular bounding area.\n */\n public getLocalBounds(rect?: Rectangle, skipChildrenUpdate = false): Rectangle\n {\n const result = super.getLocalBounds(rect);\n\n if (!skipChildrenUpdate)\n {\n for (let i = 0, j = this.children.length; i < j; ++i)\n {\n const child = this.children[i];\n\n if (child.visible)\n {\n child.updateTransform();\n }\n }\n }\n\n return result;\n }\n\n /**\n * Recalculates the content bounds of this object. This should be overriden to\n * calculate the bounds of this specific object (not including children).\n *\n * @protected\n */\n protected _calculateBounds(): void\n {\n // FILL IN//\n }\n\n /**\n * Renders the object using the WebGL renderer.\n *\n * The [_render]{@link PIXI.Container#_render} method is be overriden for rendering the contents of the\n * container itself. This `render` method will invoke it, and also invoke the `render` methods of all\n * children afterward.\n *\n * If `renderable` or `visible` is false or if `worldAlpha` is not positive, this implementation will entirely\n * skip rendering. See {@link PIXI.DisplayObject} for choosing between `renderable` or `visible`. Generally,\n * setting alpha to zero is not recommended for purely skipping rendering.\n *\n * When your scene becomes large (especially when it is larger than can be viewed in a single screen), it is\n * advised to employ **culling** to automatically skip rendering objects outside of the current screen. The\n * [@pixi-essentials/cull]{@link https://www.npmjs.com/package/@pixi-essentials/cull} and\n * [pixi-cull]{@link https://www.npmjs.com/package/pixi-cull} packages do this out of the box.\n *\n * The [renderAdvanced]{@link PIXI.Container#renderAdvanced} method is internally used when when masking or\n * filtering is applied on a container. This does, however, break batching and can affect performance when\n * masking and filtering is applied extensively throughout the scene graph.\n *\n * @param {PIXI.Renderer} renderer - The renderer\n */\n render(renderer: Renderer): void\n {\n // if the object is not visible or the alpha is 0 then no need to render this element\n if (!this.visible || this.worldAlpha <= 0 || !this.renderable)\n {\n return;\n }\n\n // do a quick check to see if this element has a mask or a filter.\n if (this._mask || (this.filters && this.filters.length))\n {\n this.renderAdvanced(renderer);\n }\n else\n {\n this._render(renderer);\n\n // simple render children!\n for (let i = 0, j = this.children.length; i < j; ++i)\n {\n this.children[i].render(renderer);\n }\n }\n }\n\n /**\n * Render the object using the WebGL renderer and advanced features.\n *\n * @protected\n * @param {PIXI.Renderer} renderer - The renderer\n */\n protected renderAdvanced(renderer: Renderer): void\n {\n const filters = this.filters;\n const mask = this._mask as MaskData;\n\n // push filter first as we need to ensure the stencil buffer is correct for any masking\n if (filters)\n {\n if (!this._enabledFilters)\n {\n this._enabledFilters = [];\n }\n\n this._enabledFilters.length = 0;\n\n for (let i = 0; i < filters.length; i++)\n {\n if (filters[i].enabled)\n {\n this._enabledFilters.push(filters[i]);\n }\n }\n }\n\n const flush = (filters && this._enabledFilters && this._enabledFilters.length)\n || (mask && (!mask.isMaskData\n || (mask.enabled && (mask.autoDetect || mask.type !== MASK_TYPES.NONE))));\n\n if (flush)\n {\n renderer.batch.flush();\n }\n\n if (filters && this._enabledFilters && this._enabledFilters.length)\n {\n renderer.filter.push(this, this._enabledFilters);\n }\n\n if (mask)\n {\n renderer.mask.push(this, this._mask);\n }\n\n // add this object to the batch, only rendered if it has a texture.\n this._render(renderer);\n\n // now loop through the children and make sure they get rendered\n for (let i = 0, j = this.children.length; i < j; i++)\n {\n this.children[i].render(renderer);\n }\n\n if (flush)\n {\n renderer.batch.flush();\n }\n\n if (mask)\n {\n renderer.mask.pop(this);\n }\n\n if (filters && this._enabledFilters && this._enabledFilters.length)\n {\n renderer.filter.pop();\n }\n }\n\n /**\n * To be overridden by the subclasses.\n *\n * @protected\n * @param {PIXI.Renderer} renderer - The renderer\n */\n protected _render(_renderer: Renderer): void // eslint-disable-line no-unused-vars\n {\n // this is where content itself gets rendered...\n }\n\n /**\n * Removes all internal references and listeners as well as removes children from the display list.\n * Do not use a Container after calling `destroy`.\n *\n * @param {object|boolean} [options] - Options parameter. A boolean will act as if all options\n * have been set to that value\n * @param {boolean} [options.children=false] - if set to true, all the children will have their destroy\n * method called as well. 'options' will be passed on to those calls.\n * @param {boolean} [options.texture=false] - Only used for child Sprites if options.children is set to true\n * Should it destroy the texture of the child sprite\n * @param {boolean} [options.baseTexture=false] - Only used for child Sprites if options.children is set to true\n * Should it destroy the base texture of the child sprite\n */\n destroy(options?: IDestroyOptions|boolean): void\n {\n super.destroy();\n\n this.sortDirty = false;\n\n const destroyChildren = typeof options === 'boolean' ? options : options && options.children;\n\n const oldChildren = this.removeChildren(0, this.children.length);\n\n if (destroyChildren)\n {\n for (let i = 0; i < oldChildren.length; ++i)\n {\n oldChildren[i].destroy(options);\n }\n }\n }\n\n /**\n * The width of the Container, setting this will actually modify the scale to achieve the value set\n *\n * @member {number}\n */\n get width(): number\n {\n return this.scale.x * this.getLocalBounds().width;\n }\n\n set width(value: number)\n {\n const width = this.getLocalBounds().width;\n\n if (width !== 0)\n {\n this.scale.x = value / width;\n }\n else\n {\n this.scale.x = 1;\n }\n\n this._width = value;\n }\n\n /**\n * The height of the Container, setting this will actually modify the scale to achieve the value set\n *\n * @member {number}\n */\n get height(): number\n {\n return this.scale.y * this.getLocalBounds().height;\n }\n\n set height(value: number)\n {\n const height = this.getLocalBounds().height;\n\n if (height !== 0)\n {\n this.scale.y = value / height;\n }\n else\n {\n this.scale.y = 1;\n }\n\n this._height = value;\n }\n}\n\n/**\n * Container default updateTransform, does update children of container.\n * Will crash if there's no parent element.\n *\n * @memberof PIXI.Container#\n * @method containerUpdateTransform\n */\nContainer.prototype.containerUpdateTransform = Container.prototype.updateTransform;\n","import { Rectangle } from '@pixi/math';\n\nimport type { IPointData, Transform, Matrix } from '@pixi/math';\n\n/**\n * 'Builder' pattern for bounds rectangles.\n *\n * This could be called an Axis-Aligned Bounding Box.\n * It is not an actual shape. It is a mutable thing; no 'EMPTY' or those kind of problems.\n *\n * @class\n * @memberof PIXI\n */\nexport class Bounds\n{\n public minX: number;\n public minY: number;\n public maxX: number;\n public maxY: number;\n public rect: Rectangle;\n public updateID: number;\n\n constructor()\n {\n /**\n * @member {number}\n * @default 0\n */\n this.minX = Infinity;\n\n /**\n * @member {number}\n * @default 0\n */\n this.minY = Infinity;\n\n /**\n * @member {number}\n * @default 0\n */\n this.maxX = -Infinity;\n\n /**\n * @member {number}\n * @default 0\n */\n this.maxY = -Infinity;\n\n this.rect = null;\n\n /**\n * It is updated to _boundsID of corresponding object to keep bounds in sync with content.\n * Updated from outside, thus public modifier.\n *\n * @member {number}\n * @public\n */\n this.updateID = -1;\n }\n\n /**\n * Checks if bounds are empty.\n *\n * @return {boolean} True if empty.\n */\n isEmpty(): boolean\n {\n return this.minX > this.maxX || this.minY > this.maxY;\n }\n\n /**\n * Clears the bounds and resets.\n *\n */\n clear(): void\n {\n this.minX = Infinity;\n this.minY = Infinity;\n this.maxX = -Infinity;\n this.maxY = -Infinity;\n }\n\n /**\n * Can return Rectangle.EMPTY constant, either construct new rectangle, either use your rectangle\n * It is not guaranteed that it will return tempRect\n *\n * @param {PIXI.Rectangle} rect - temporary object will be used if AABB is not empty\n * @returns {PIXI.Rectangle} A rectangle of the bounds\n */\n getRectangle(rect?: Rectangle): Rectangle\n {\n if (this.minX > this.maxX || this.minY > this.maxY)\n {\n return Rectangle.EMPTY;\n }\n\n rect = rect || new Rectangle(0, 0, 1, 1);\n\n rect.x = this.minX;\n rect.y = this.minY;\n rect.width = this.maxX - this.minX;\n rect.height = this.maxY - this.minY;\n\n return rect;\n }\n\n /**\n * This function should be inlined when its possible.\n *\n * @param {PIXI.IPointData} point - The point to add.\n */\n addPoint(point: IPointData): void\n {\n this.minX = Math.min(this.minX, point.x);\n this.maxX = Math.max(this.maxX, point.x);\n this.minY = Math.min(this.minY, point.y);\n this.maxY = Math.max(this.maxY, point.y);\n }\n\n /**\n * Adds a point, after transformed. This should be inlined when its possible.\n *\n * @param matrix\n * @param point\n */\n addPointMatrix(matrix: Matrix, point: IPointData): void\n {\n const { a, b, c, d, tx, ty } = matrix;\n\n const x = (a * point.x) + (c * point.y) + tx;\n const y = (b * point.x) + (d * point.y) + ty;\n\n this.minX = Math.min(this.minX, x);\n this.maxX = Math.max(this.maxX, x);\n this.minY = Math.min(this.minY, y);\n this.maxY = Math.max(this.maxY, y);\n }\n\n /**\n * Adds a quad, not transformed\n *\n * @param {Float32Array} vertices - The verts to add.\n */\n addQuad(vertices: Float32Array): void\n {\n let minX = this.minX;\n let minY = this.minY;\n let maxX = this.maxX;\n let maxY = this.maxY;\n\n let x = vertices[0];\n let y = vertices[1];\n\n minX = x < minX ? x : minX;\n minY = y < minY ? y : minY;\n maxX = x > maxX ? x : maxX;\n maxY = y > maxY ? y : maxY;\n\n x = vertices[2];\n y = vertices[3];\n minX = x < minX ? x : minX;\n minY = y < minY ? y : minY;\n maxX = x > maxX ? x : maxX;\n maxY = y > maxY ? y : maxY;\n\n x = vertices[4];\n y = vertices[5];\n minX = x < minX ? x : minX;\n minY = y < minY ? y : minY;\n maxX = x > maxX ? x : maxX;\n maxY = y > maxY ? y : maxY;\n\n x = vertices[6];\n y = vertices[7];\n minX = x < minX ? x : minX;\n minY = y < minY ? y : minY;\n maxX = x > maxX ? x : maxX;\n maxY = y > maxY ? y : maxY;\n\n this.minX = minX;\n this.minY = minY;\n this.maxX = maxX;\n this.maxY = maxY;\n }\n\n /**\n * Adds sprite frame, transformed.\n *\n * @param {PIXI.Transform} transform - transform to apply\n * @param {number} x0 - left X of frame\n * @param {number} y0 - top Y of frame\n * @param {number} x1 - right X of frame\n * @param {number} y1 - bottom Y of frame\n */\n addFrame(transform: Transform, x0: number, y0: number, x1: number, y1: number): void\n {\n this.addFrameMatrix(transform.worldTransform, x0, y0, x1, y1);\n }\n\n /**\n * Adds sprite frame, multiplied by matrix\n *\n * @param {PIXI.Matrix} matrix - matrix to apply\n * @param {number} x0 - left X of frame\n * @param {number} y0 - top Y of frame\n * @param {number} x1 - right X of frame\n * @param {number} y1 - bottom Y of frame\n */\n addFrameMatrix(matrix: Matrix, x0: number, y0: number, x1: number, y1: number): void\n {\n const a = matrix.a;\n const b = matrix.b;\n const c = matrix.c;\n const d = matrix.d;\n const tx = matrix.tx;\n const ty = matrix.ty;\n\n let minX = this.minX;\n let minY = this.minY;\n let maxX = this.maxX;\n let maxY = this.maxY;\n\n let x = (a * x0) + (c * y0) + tx;\n let y = (b * x0) + (d * y0) + ty;\n\n minX = x < minX ? x : minX;\n minY = y < minY ? y : minY;\n maxX = x > maxX ? x : maxX;\n maxY = y > maxY ? y : maxY;\n\n x = (a * x1) + (c * y0) + tx;\n y = (b * x1) + (d * y0) + ty;\n minX = x < minX ? x : minX;\n minY = y < minY ? y : minY;\n maxX = x > maxX ? x : maxX;\n maxY = y > maxY ? y : maxY;\n\n x = (a * x0) + (c * y1) + tx;\n y = (b * x0) + (d * y1) + ty;\n minX = x < minX ? x : minX;\n minY = y < minY ? y : minY;\n maxX = x > maxX ? x : maxX;\n maxY = y > maxY ? y : maxY;\n\n x = (a * x1) + (c * y1) + tx;\n y = (b * x1) + (d * y1) + ty;\n minX = x < minX ? x : minX;\n minY = y < minY ? y : minY;\n maxX = x > maxX ? x : maxX;\n maxY = y > maxY ? y : maxY;\n\n this.minX = minX;\n this.minY = minY;\n this.maxX = maxX;\n this.maxY = maxY;\n }\n\n /**\n * Adds screen vertices from array\n *\n * @param {Float32Array} vertexData - calculated vertices\n * @param {number} beginOffset - begin offset\n * @param {number} endOffset - end offset, excluded\n */\n addVertexData(vertexData: Float32Array, beginOffset: number, endOffset: number): void\n {\n let minX = this.minX;\n let minY = this.minY;\n let maxX = this.maxX;\n let maxY = this.maxY;\n\n for (let i = beginOffset; i < endOffset; i += 2)\n {\n const x = vertexData[i];\n const y = vertexData[i + 1];\n\n minX = x < minX ? x : minX;\n minY = y < minY ? y : minY;\n maxX = x > maxX ? x : maxX;\n maxY = y > maxY ? y : maxY;\n }\n\n this.minX = minX;\n this.minY = minY;\n this.maxX = maxX;\n this.maxY = maxY;\n }\n\n /**\n * Add an array of mesh vertices\n *\n * @param {PIXI.Transform} transform - mesh transform\n * @param {Float32Array} vertices - mesh coordinates in array\n * @param {number} beginOffset - begin offset\n * @param {number} endOffset - end offset, excluded\n */\n addVertices(transform: Transform, vertices: Float32Array, beginOffset: number, endOffset: number): void\n {\n this.addVerticesMatrix(transform.worldTransform, vertices, beginOffset, endOffset);\n }\n\n /**\n * Add an array of mesh vertices.\n *\n * @param {PIXI.Matrix} matrix - mesh matrix\n * @param {Float32Array} vertices - mesh coordinates in array\n * @param {number} beginOffset - begin offset\n * @param {number} endOffset - end offset, excluded\n * @param {number} [padX=0] - x padding\n * @param {number} [padY=0] - y padding\n */\n addVerticesMatrix(matrix: Matrix, vertices: Float32Array, beginOffset: number,\n endOffset: number, padX = 0, padY = padX): void\n {\n const a = matrix.a;\n const b = matrix.b;\n const c = matrix.c;\n const d = matrix.d;\n const tx = matrix.tx;\n const ty = matrix.ty;\n\n let minX = this.minX;\n let minY = this.minY;\n let maxX = this.maxX;\n let maxY = this.maxY;\n\n for (let i = beginOffset; i < endOffset; i += 2)\n {\n const rawX = vertices[i];\n const rawY = vertices[i + 1];\n const x = (a * rawX) + (c * rawY) + tx;\n const y = (d * rawY) + (b * rawX) + ty;\n\n minX = Math.min(minX, x - padX);\n maxX = Math.max(maxX, x + padX);\n minY = Math.min(minY, y - padY);\n maxY = Math.max(maxY, y + padY);\n }\n\n this.minX = minX;\n this.minY = minY;\n this.maxX = maxX;\n this.maxY = maxY;\n }\n\n /**\n * Adds other Bounds.\n *\n * @param {PIXI.Bounds} bounds - The Bounds to be added\n */\n addBounds(bounds: Bounds): void\n {\n const minX = this.minX;\n const minY = this.minY;\n const maxX = this.maxX;\n const maxY = this.maxY;\n\n this.minX = bounds.minX < minX ? bounds.minX : minX;\n this.minY = bounds.minY < minY ? bounds.minY : minY;\n this.maxX = bounds.maxX > maxX ? bounds.maxX : maxX;\n this.maxY = bounds.maxY > maxY ? bounds.maxY : maxY;\n }\n\n /**\n * Adds other Bounds, masked with Bounds.\n *\n * @param {PIXI.Bounds} bounds - The Bounds to be added.\n * @param {PIXI.Bounds} mask - TODO\n */\n addBoundsMask(bounds: Bounds, mask: Bounds): void\n {\n const _minX = bounds.minX > mask.minX ? bounds.minX : mask.minX;\n const _minY = bounds.minY > mask.minY ? bounds.minY : mask.minY;\n const _maxX = bounds.maxX < mask.maxX ? bounds.maxX : mask.maxX;\n const _maxY = bounds.maxY < mask.maxY ? bounds.maxY : mask.maxY;\n\n if (_minX <= _maxX && _minY <= _maxY)\n {\n const minX = this.minX;\n const minY = this.minY;\n const maxX = this.maxX;\n const maxY = this.maxY;\n\n this.minX = _minX < minX ? _minX : minX;\n this.minY = _minY < minY ? _minY : minY;\n this.maxX = _maxX > maxX ? _maxX : maxX;\n this.maxY = _maxY > maxY ? _maxY : maxY;\n }\n }\n\n /**\n * Adds other Bounds, multiplied by matrix. Bounds shouldn't be empty.\n *\n * @param {PIXI.Bounds} bounds - other bounds\n * @param {PIXI.Matrix} matrix - multiplicator\n */\n addBoundsMatrix(bounds: Bounds, matrix: Matrix): void\n {\n this.addFrameMatrix(matrix, bounds.minX, bounds.minY, bounds.maxX, bounds.maxY);\n }\n\n /**\n * Adds other Bounds, masked with Rectangle.\n *\n * @param {PIXI.Bounds} bounds - TODO\n * @param {PIXI.Rectangle} area - TODO\n */\n addBoundsArea(bounds: Bounds, area: Rectangle): void\n {\n const _minX = bounds.minX > area.x ? bounds.minX : area.x;\n const _minY = bounds.minY > area.y ? bounds.minY : area.y;\n const _maxX = bounds.maxX < area.x + area.width ? bounds.maxX : (area.x + area.width);\n const _maxY = bounds.maxY < area.y + area.height ? bounds.maxY : (area.y + area.height);\n\n if (_minX <= _maxX && _minY <= _maxY)\n {\n const minX = this.minX;\n const minY = this.minY;\n const maxX = this.maxX;\n const maxY = this.maxY;\n\n this.minX = _minX < minX ? _minX : minX;\n this.minY = _minY < minY ? _minY : minY;\n this.maxX = _maxX > maxX ? _maxX : maxX;\n this.maxY = _maxY > maxY ? _maxY : maxY;\n }\n }\n\n /**\n * Pads bounds object, making it grow in all directions.\n * If paddingY is omitted, both paddingX and paddingY will be set to paddingX.\n *\n * @param {number} [paddingX=0] - The horizontal padding amount.\n * @param {number} [paddingY=0] - The vertical padding amount.\n */\n pad(paddingX = 0, paddingY = paddingX): void\n {\n if (!this.isEmpty())\n {\n this.minX -= paddingX;\n this.maxX += paddingX;\n this.minY -= paddingY;\n this.maxY += paddingY;\n }\n }\n\n /**\n * Adds padded frame. (x0, y0) should be strictly less than (x1, y1)\n *\n * @param {number} x0 - left X of frame\n * @param {number} y0 - top Y of frame\n * @param {number} x1 - right X of frame\n * @param {number} y1 - bottom Y of frame\n * @param {number} padX - padding X\n * @param {number} padY - padding Y\n */\n addFramePad(x0: number, y0: number, x1: number, y1: number, padX: number, padY: number): void\n {\n x0 -= padX;\n y0 -= padY;\n x1 += padX;\n y1 += padY;\n\n this.minX = this.minX < x0 ? this.minX : x0;\n this.maxX = this.maxX > x1 ? this.maxX : x1;\n this.minY = this.minY < y0 ? this.minY : y0;\n this.maxY = this.maxY > y1 ? this.maxY : y1;\n }\n}\n","/*! *****************************************************************************\r\nCopyright (c) Microsoft Corporation. All rights reserved.\r\nLicensed under the Apache License, Version 2.0 (the \"License\"); you may not use\r\nthis file except in compliance with the License. You may obtain a copy of the\r\nLicense at http://www.apache.org/licenses/LICENSE-2.0\r\n\r\nTHIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\r\nKIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED\r\nWARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,\r\nMERCHANTABLITY OR NON-INFRINGEMENT.\r\n\r\nSee the Apache Version 2.0 License for specific language governing permissions\r\nand limitations under the License.\r\n***************************************************************************** */\r\n/* global Reflect, Promise */\r\n\r\nvar extendStatics = function(d, b) {\r\n extendStatics = Object.setPrototypeOf ||\r\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\r\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\r\n return extendStatics(d, b);\r\n};\r\n\r\nexport function __extends(d, b) {\r\n extendStatics(d, b);\r\n function __() { this.constructor = d; }\r\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\r\n}\r\n\r\nexport var __assign = function() {\r\n __assign = Object.assign || function __assign(t) {\r\n for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n s = arguments[i];\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];\r\n }\r\n return t;\r\n }\r\n return __assign.apply(this, arguments);\r\n}\r\n\r\nexport function __rest(s, e) {\r\n var t = {};\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)\r\n t[p] = s[p];\r\n if (s != null && typeof Object.getOwnPropertySymbols === \"function\")\r\n for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)\r\n t[p[i]] = s[p[i]];\r\n return t;\r\n}\r\n\r\nexport function __decorate(decorators, target, key, desc) {\r\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\r\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\r\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\r\n return c > 3 && r && Object.defineProperty(target, key, r), r;\r\n}\r\n\r\nexport function __param(paramIndex, decorator) {\r\n return function (target, key) { decorator(target, key, paramIndex); }\r\n}\r\n\r\nexport function __metadata(metadataKey, metadataValue) {\r\n if (typeof Reflect === \"object\" && typeof Reflect.metadata === \"function\") return Reflect.metadata(metadataKey, metadataValue);\r\n}\r\n\r\nexport function __awaiter(thisArg, _arguments, P, generator) {\r\n return new (P || (P = Promise))(function (resolve, reject) {\r\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }\r\n step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n });\r\n}\r\n\r\nexport function __generator(thisArg, body) {\r\n var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n function verb(n) { return function (v) { return step([n, v]); }; }\r\n function step(op) {\r\n if (f) throw new TypeError(\"Generator is already executing.\");\r\n while (_) try {\r\n if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\r\n if (y = 0, t) op = [op[0] & 2, t.value];\r\n switch (op[0]) {\r\n case 0: case 1: t = op; break;\r\n case 4: _.label++; return { value: op[1], done: false };\r\n case 5: _.label++; y = op[1]; op = [0]; continue;\r\n case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n default:\r\n if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n if (t[2]) _.ops.pop();\r\n _.trys.pop(); continue;\r\n }\r\n op = body.call(thisArg, _);\r\n } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n }\r\n}\r\n\r\nexport function __exportStar(m, exports) {\r\n for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];\r\n}\r\n\r\nexport function __values(o) {\r\n var m = typeof Symbol === \"function\" && o[Symbol.iterator], i = 0;\r\n if (m) return m.call(o);\r\n return {\r\n next: function () {\r\n if (o && i >= o.length) o = void 0;\r\n return { value: o && o[i++], done: !o };\r\n }\r\n };\r\n}\r\n\r\nexport function __read(o, n) {\r\n var m = typeof Symbol === \"function\" && o[Symbol.iterator];\r\n if (!m) return o;\r\n var i = m.call(o), r, ar = [], e;\r\n try {\r\n while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);\r\n }\r\n catch (error) { e = { error: error }; }\r\n finally {\r\n try {\r\n if (r && !r.done && (m = i[\"return\"])) m.call(i);\r\n }\r\n finally { if (e) throw e.error; }\r\n }\r\n return ar;\r\n}\r\n\r\nexport function __spread() {\r\n for (var ar = [], i = 0; i < arguments.length; i++)\r\n ar = ar.concat(__read(arguments[i]));\r\n return ar;\r\n}\r\n\r\nexport function __await(v) {\r\n return this instanceof __await ? (this.v = v, this) : new __await(v);\r\n}\r\n\r\nexport function __asyncGenerator(thisArg, _arguments, generator) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var g = generator.apply(thisArg, _arguments || []), i, q = [];\r\n return i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i;\r\n function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }\r\n function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }\r\n function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }\r\n function fulfill(value) { resume(\"next\", value); }\r\n function reject(value) { resume(\"throw\", value); }\r\n function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }\r\n}\r\n\r\nexport function __asyncDelegator(o) {\r\n var i, p;\r\n return i = {}, verb(\"next\"), verb(\"throw\", function (e) { throw e; }), verb(\"return\"), i[Symbol.iterator] = function () { return this; }, i;\r\n function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === \"return\" } : f ? f(v) : v; } : f; }\r\n}\r\n\r\nexport function __asyncValues(o) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var m = o[Symbol.asyncIterator], i;\r\n return m ? m.call(o) : (o = typeof __values === \"function\" ? __values(o) : o[Symbol.iterator](), i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i);\r\n function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }\r\n function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }\r\n}\r\n\r\nexport function __makeTemplateObject(cooked, raw) {\r\n if (Object.defineProperty) { Object.defineProperty(cooked, \"raw\", { value: raw }); } else { cooked.raw = raw; }\r\n return cooked;\r\n};\r\n\r\nexport function __importStar(mod) {\r\n if (mod && mod.__esModule) return mod;\r\n var result = {};\r\n if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];\r\n result.default = mod;\r\n return result;\r\n}\r\n\r\nexport function __importDefault(mod) {\r\n return (mod && mod.__esModule) ? mod : { default: mod };\r\n}\r\n","import { DEG_TO_RAD, Matrix, Point, RAD_TO_DEG, Rectangle, Transform } from '@pixi/math';\nimport { EventEmitter } from '@pixi/utils';\nimport { Bounds } from './Bounds';\n\nimport type { Container } from './Container';\nimport type { Filter, MaskData, Renderer } from '@pixi/core';\nimport type { IPointData, ObservablePoint } from '@pixi/math';\nimport type { Dict } from '@pixi/utils';\n\nexport interface IDestroyOptions {\n children?: boolean;\n texture?: boolean;\n baseTexture?: boolean;\n}\n\nexport interface DisplayObject extends Omit, EventEmitter {}\n\n/**\n * The base class for all objects that are rendered on the screen.\n *\n * This is an abstract class and can not be used on its own; rather it should be extended.\n *\n * ## Display objects implemented in PixiJS\n *\n * | Display Object | Description |\n * | ------------------------------- | --------------------------------------------------------------------- |\n * | {@link PIXI.Container} | Adds support for `children` to DisplayObject |\n * | {@link PIXI.Graphics} | Shape-drawing display object similar to the Canvas API |\n * | {@link PIXI.Sprite} | Draws textures (i.e. images) |\n * | {@link PIXI.Text} | Draws text using the Canvas API internally |\n * | {@link PIXI.BitmapText} | More scaleable solution for text rendering, reusing glyph textures |\n * | {@link PIXI.TilingSprite} | Draws textures/images in a tiled fashion |\n * | {@link PIXI.AnimatedSprite} | Draws an animation of multiple images |\n * | {@link PIXI.Mesh} | Provides a lower-level API for drawing meshes with custom data |\n * | {@link PIXI.NineSlicePlane} | Mesh-related |\n * | {@link PIXI.SimpleMesh} | v4-compatible mesh |\n * | {@link PIXI.SimplePlane} | Mesh-related |\n * | {@link PIXI.SimpleRope} | Mesh-related |\n *\n * ## Transforms\n *\n * The [transform]{@link DisplayObject#transform} of a display object describes the projection from its\n * local coordinate space to its parent's local coordinate space. The following properties are derived\n * from the transform:\n *\n * \n * \n * \n * Property \n * Description \n * \n * \n * \n * \n * [pivot]{@link PIXI.DisplayObject#pivot} \n * \n * Invariant under rotation, scaling, and skewing. The projection of into the parent's space of the pivot\n * is equal to position, regardless of the other three transformations. In other words, It is the center of\n * rotation, scaling, and skewing.\n * \n * \n * \n * [position]{@link PIXI.DisplayObject#position} \n * \n * Translation. This is the position of the [pivot]{@link PIXI.DisplayObject#pivot} in the parent's local\n * space. The default value of the pivot is the origin (0,0). If the top-left corner of your display object\n * is (0,0) in its local space, then the position will be its top-left corner in the parent's local space.\n * \n * \n * \n * [scale]{@link PIXI.DisplayObject#scale} \n * \n * Scaling. This will stretch (or compress) the display object's projection. The scale factors are along the\n * local coordinate axes. In other words, the display object is scaled before rotated or skewed. The center\n * of scaling is the [pivot]{@link PIXI.DisplayObject#pivot}.\n * \n * \n * \n * [rotation]{@link PIXI.DisplayObject#rotation} \n * \n * Rotation. This will rotate the display object's projection by this angle (in radians).\n * \n * \n * \n * [skew]{@link PIXI.DisplayObject#skew} \n * \n * Skewing. This can be used to deform a rectangular display object into a parallelogram.
\n * \n * In PixiJS, skew has a slightly different behaviour than the conventional meaning. It can be\n * thought of the net rotation applied to the coordinate axes (separately). For example, if \"skew.x\" is\n * ⍺ and \"skew.y\" is β, then the line x = 0 will be rotated by ⍺ (y = -x*cot⍺) and the line y = 0 will be\n * rotated by β (y = x*tanβ). A line y = x*tanϴ (i.e. a line at angle ϴ to the x-axis in local-space) will\n * be rotated by an angle between ⍺ and β.\n *
\n * \n * It can be observed that if skew is applied equally to both axes, then it will be equivalent to applying\n * a rotation. Indeed, if \"skew.x\" = -ϴ and \"skew.y\" = ϴ, it will produce an equivalent of \"rotation\" = ϴ.\n *
\n * \n * Another quite interesting observation is that \"skew.x\", \"skew.y\", rotation are communtative operations. Indeed,\n * because rotation is essentially a careful combination of the two.\n *
\n * \n * \n * \n * angle \n * Rotation. This is an alias for [rotation]{@link PIXI.DisplayObject#rotation}, but in degrees. \n * \n * \n * x \n * Translation. This is an alias for position.x! \n * \n * \n * y \n * Translation. This is an alias for position.y! \n * \n * \n * width \n * \n * Implemented in [Container]{@link PIXI.Container}. Scaling. The width property calculates scale.x by dividing\n * the \"requested\" width by the local bounding box width. It is indirectly an abstraction over scale.x, and there\n * is no concept of user-defined width.\n * \n * \n * \n * height \n * \n * Implemented in [Container]{@link PIXI.Container}. Scaling. The height property calculates scale.y by dividing\n * the \"requested\" height by the local bounding box height. It is indirectly an abstraction over scale.y, and there\n * is no concept of user-defined height.\n * \n * \n * \n *
\n *\n * ## Bounds\n *\n * The bounds of a display object is defined by the minimum axis-aligned rectangle in world space that can fit\n * around it. The abstract `calculateBounds` method is responsible for providing it (and it should use the\n * `worldTransform` to calculate in world space).\n *\n * There are a few additional types of bounding boxes:\n *\n * | Bounds | Description |\n * | --------------------- | ---------------------------------------------------------------------------------------- |\n * | World Bounds | This is synonymous is the regular bounds described above. See `getBounds()`. |\n * | Local Bounds | This the axis-aligned bounding box in the parent's local space. See `getLocalBounds()`. |\n * | Render Bounds | The bounds, but including extra rendering effects like filter padding. |\n * | Projected Bounds | The bounds of the projected display object onto the screen. Usually equals world bounds. |\n * | Relative Bounds | The bounds of a display object when projected onto a ancestor's (or parent's) space. |\n * | Natural Bounds | The bounds of an object in its own local space (not parent's space, like in local bounds)|\n * | Content Bounds | The natural bounds when excluding all children of a `Container`. |\n *\n * ### calculateBounds\n *\n * [Container]{@link Container} already implements `calculateBounds` in a manner that includes children.\n *\n * But for a non-Container display object, the `calculateBounds` method must be overridden in order for `getBounds` and\n * `getLocalBounds` to work. This method must write the bounds into `this._bounds`.\n *\n * Generally, the following technique works for most simple cases: take the list of points\n * forming the \"hull\" of the object (i.e. outline of the object's shape), and then add them\n * using {@link PIXI.Bounds#addPointMatrix}.\n *\n * ```js\n * calculateBounds(): void\n * {\n * const points = [...];\n *\n * for (let i = 0, j = points.length; i < j; i++)\n * {\n * this._bounds.addPointMatrix(this.worldTransform, points[i]);\n * }\n * }\n * ```\n *\n * You can optimize this for a large number of points by using {@link PIXI.Bounds#addVerticesMatrix} to pass them\n * in one array together.\n *\n * ## Alpha\n *\n * This alpha sets a display object's **relative opacity** w.r.t its parent. For example, if the alpha of a display\n * object is 0.5 and its parent's alpha is 0.5, then it will be rendered with 25% opacity (assuming alpha is not\n * applied on any ancestor further up the chain).\n *\n * The alpha with which the display object will be rendered is called the [worldAlpha]{@link PIXI.DisplayObject#worldAlpha}.\n *\n * ## Renderable vs Visible\n *\n * The `renderable` and `visible` properties can be used to prevent a display object from being rendered to the\n * screen. However, there is a subtle difference between the two. When using `renderable`, the transforms of the display\n * object (and its children subtree) will continue to be calculated. When using `visible`, the transforms will not\n * be calculated.\n *\n * It is recommended that applications use the `renderable` property for culling. See\n * [@pixi-essentials/cull]{@link https://www.npmjs.com/package/@pixi-essentials/cull} or\n * [pixi-cull]{@link https://www.npmjs.com/package/pixi-cull} for more details.\n *\n * Otherwise, to prevent an object from rendering in the general-purpose sense - `visible` is the property to use. This\n * one is also better in terms of performance.\n *\n * @class\n * @extends PIXI.utils.EventEmitter\n * @memberof PIXI\n */\nexport abstract class DisplayObject extends EventEmitter\n{\n abstract sortDirty: boolean;\n\n public parent: Container;\n public worldAlpha: number;\n public transform: Transform;\n public alpha: number;\n public visible: boolean;\n public renderable: boolean;\n public filterArea: Rectangle;\n public filters: Filter[] | null;\n public isSprite: boolean;\n public isMask: boolean;\n public _lastSortedIndex: number;\n public _mask: Container|MaskData;\n public _bounds: Bounds;\n public _localBounds: Bounds;\n\n protected _zIndex: number;\n protected _enabledFilters: Filter[];\n protected _boundsID: number;\n protected _boundsRect: Rectangle;\n protected _localBoundsRect: Rectangle;\n protected _destroyed: boolean;\n\n private _maskRefCount: number;\n private tempDisplayObjectParent: TemporaryDisplayObject;\n public displayObjectUpdateTransform: () => void;\n\n /**\n * Mixes all enumerable properties and methods from a source object to DisplayObject.\n *\n * @param {object} source - The source of properties and methods to mix in.\n */\n static mixin(source: Dict): void\n {\n // in ES8/ES2017, this would be really easy:\n // Object.defineProperties(DisplayObject.prototype, Object.getOwnPropertyDescriptors(source));\n\n // get all the enumerable property keys\n const keys = Object.keys(source);\n\n // loop through properties\n for (let i = 0; i < keys.length; ++i)\n {\n const propertyName = keys[i];\n\n // Set the property using the property descriptor - this works for accessors and normal value properties\n Object.defineProperty(\n DisplayObject.prototype,\n propertyName,\n Object.getOwnPropertyDescriptor(source, propertyName)\n );\n }\n }\n\n constructor()\n {\n super();\n\n this.tempDisplayObjectParent = null;\n\n // TODO: need to create Transform from factory\n /**\n * World transform and local transform of this object.\n * This will become read-only later, please do not assign anything there unless you know what are you doing.\n *\n * @member {PIXI.Transform}\n */\n this.transform = new Transform();\n\n /**\n * The opacity of the object.\n *\n * @member {number}\n */\n this.alpha = 1;\n\n /**\n * The visibility of the object. If false the object will not be drawn, and\n * the updateTransform function will not be called.\n *\n * Only affects recursive calls from parent. You can ask for bounds or call updateTransform manually.\n *\n * @member {boolean}\n */\n this.visible = true;\n\n /**\n * Can this object be rendered, if false the object will not be drawn but the updateTransform\n * methods will still be called.\n *\n * Only affects recursive calls from parent. You can ask for bounds manually.\n *\n * @member {boolean}\n */\n this.renderable = true;\n\n /**\n * The display object container that contains this display object.\n *\n * @member {PIXI.Container}\n */\n this.parent = null;\n\n /**\n * The multiplied alpha of the displayObject.\n *\n * @member {number}\n * @readonly\n */\n this.worldAlpha = 1;\n\n /**\n * Which index in the children array the display component was before the previous zIndex sort.\n * Used by containers to help sort objects with the same zIndex, by using previous array index as the decider.\n *\n * @member {number}\n * @protected\n */\n this._lastSortedIndex = 0;\n\n /**\n * The zIndex of the displayObject.\n * A higher value will mean it will be rendered on top of other displayObjects within the same container.\n *\n * @member {number}\n * @protected\n */\n this._zIndex = 0;\n\n /**\n * The area the filter is applied to. This is used as more of an optimization\n * rather than figuring out the dimensions of the displayObject each frame you can set this rectangle.\n *\n * Also works as an interaction mask.\n *\n * @member {?PIXI.Rectangle}\n */\n this.filterArea = null;\n\n /**\n * Sets the filters for the displayObject.\n * * IMPORTANT: This is a WebGL only feature and will be ignored by the canvas renderer.\n * To remove filters simply set this property to `'null'`.\n *\n * @member {?PIXI.Filter[]}\n */\n this.filters = null;\n\n /**\n * Currently enabled filters\n * @member {PIXI.Filter[]}\n * @protected\n */\n this._enabledFilters = null;\n\n /**\n * The bounds object, this is used to calculate and store the bounds of the displayObject.\n *\n * @member {PIXI.Bounds}\n */\n this._bounds = new Bounds();\n\n /**\n * Local bounds object, swapped with `_bounds` when using `getLocalBounds()`.\n *\n * @member {PIXI.Bounds}\n */\n this._localBounds = null;\n\n /**\n * Flags the cached bounds as dirty.\n *\n * @member {number}\n * @protected\n */\n this._boundsID = 0;\n\n /**\n * Cache of this display-object's bounds-rectangle.\n *\n * @member {PIXI.Bounds}\n * @protected\n */\n this._boundsRect = null;\n\n /**\n * Cache of this display-object's local-bounds rectangle.\n *\n * @member {PIXI.Bounds}\n * @protected\n */\n this._localBoundsRect = null;\n\n /**\n * The original, cached mask of the object.\n *\n * @member {PIXI.Container|PIXI.MaskData|null}\n * @protected\n */\n this._mask = null;\n\n /**\n * The number of times this object is used as a mask by another object.\n *\n * @member {number}\n * @private\n */\n this._maskRefCount = 0;\n\n /**\n * If the object has been destroyed via destroy(). If true, it should not be used.\n *\n * @member {boolean}\n * @protected\n */\n this._destroyed = false;\n\n /**\n * used to fast check if a sprite is.. a sprite!\n * @member {boolean}\n */\n this.isSprite = false;\n\n /**\n * Does any other displayObject use this object as a mask?\n * @member {boolean}\n */\n this.isMask = false;\n }\n\n /**\n * Fired when this DisplayObject is added to a Container.\n *\n * @instance\n * @event added\n * @param {PIXI.Container} container - The container added to.\n */\n\n /**\n * Fired when this DisplayObject is removed from a Container.\n *\n * @instance\n * @event removed\n * @param {PIXI.Container} container - The container removed from.\n */\n\n /**\n * Fired when this DisplayObject is destroyed.\n *\n * @instance\n * @event destroyed\n */\n\n /**\n * Readonly flag for destroyed display objects.\n */\n get destroyed(): boolean\n {\n return this._destroyed;\n }\n\n /**\n * Recalculates the bounds of the display object.\n */\n abstract calculateBounds(): void;\n\n abstract removeChild(child: DisplayObject): void;\n\n /**\n * Renders the object using the WebGL renderer.\n *\n * @param {PIXI.Renderer} renderer - The renderer.\n */\n abstract render(renderer: Renderer): void;\n\n /**\n * Recursively updates transform of all objects from the root to this one\n * internal function for toLocal()\n */\n protected _recursivePostUpdateTransform(): void\n {\n if (this.parent)\n {\n this.parent._recursivePostUpdateTransform();\n this.transform.updateTransform(this.parent.transform);\n }\n else\n {\n this.transform.updateTransform(this._tempDisplayObjectParent.transform);\n }\n }\n\n /**\n * Updates the object transform for rendering.\n *\n * TODO - Optimization pass!\n */\n updateTransform(): void\n {\n this._boundsID++;\n\n this.transform.updateTransform(this.parent.transform);\n // multiply the alphas..\n this.worldAlpha = this.alpha * this.parent.worldAlpha;\n }\n\n /**\n * Calculates and returns the (world) bounds of the display object as a [Rectangle]{@link PIXI.Rectangle}.\n *\n * This method is expensive on containers with a large subtree (like the stage). This is because the bounds\n * of a container depend on its children's bounds, which recursively causes all bounds in the subtree to\n * be recalculated. The upside, however, is that calling `getBounds` once on a container will indeed update\n * the bounds of all children (the whole subtree, in fact). This side effect should be exploited by using\n * `displayObject._bounds.getRectangle()` when traversing through all the bounds in a scene graph. Otherwise,\n * calling `getBounds` on each object in a subtree will cause the total cost to increase quadratically as\n * its height increases.\n *\n * * The transforms of all objects in a container's **subtree** and of all **ancestors** are updated.\n * * The world bounds of all display objects in a container's **subtree** will also be recalculated.\n *\n * The `_bounds` object stores the last calculation of the bounds. You can use to entirely skip bounds\n * calculation if needed.\n *\n * ```js\n * const lastCalculatedBounds = displayObject._bounds.getRectangle(optionalRect);\n * ```\n *\n * Do know that usage of `getLocalBounds` can corrupt the `_bounds` of children (the whole subtree, actually). This\n * is a known issue that has not been solved. See [getLocalBounds]{@link PIXI.DisplayObject#getLocalBounds} for more\n * details.\n *\n * `getBounds` should be called with `skipUpdate` equal to `true` in a render() call. This is because the transforms\n * are guaranteed to be update-to-date. In fact, recalculating inside a render() call may cause corruption in certain\n * cases.\n *\n * @param {boolean} [skipUpdate] - Setting to `true` will stop the transforms of the scene graph from\n * being updated. This means the calculation returned MAY be out of date BUT will give you a\n * nice performance boost.\n * @param {PIXI.Rectangle} [rect] - Optional rectangle to store the result of the bounds calculation.\n * @return {PIXI.Rectangle} The minimum axis-aligned rectangle in world space that fits around this object.\n */\n getBounds(skipUpdate?: boolean, rect?: Rectangle): Rectangle\n {\n if (!skipUpdate)\n {\n if (!this.parent)\n {\n this.parent = this._tempDisplayObjectParent as Container;\n this.updateTransform();\n this.parent = null;\n }\n else\n {\n this._recursivePostUpdateTransform();\n this.updateTransform();\n }\n }\n\n if (this._bounds.updateID !== this._boundsID)\n {\n this.calculateBounds();\n this._bounds.updateID = this._boundsID;\n }\n\n if (!rect)\n {\n if (!this._boundsRect)\n {\n this._boundsRect = new Rectangle();\n }\n\n rect = this._boundsRect;\n }\n\n return this._bounds.getRectangle(rect);\n }\n\n /**\n * Retrieves the local bounds of the displayObject as a rectangle object.\n *\n * @param {PIXI.Rectangle} [rect] - Optional rectangle to store the result of the bounds calculation.\n * @return {PIXI.Rectangle} The rectangular bounding area.\n */\n getLocalBounds(rect?: Rectangle): Rectangle\n {\n if (!rect)\n {\n if (!this._localBoundsRect)\n {\n this._localBoundsRect = new Rectangle();\n }\n\n rect = this._localBoundsRect;\n }\n\n if (!this._localBounds)\n {\n this._localBounds = new Bounds();\n }\n\n const transformRef = this.transform;\n const parentRef = this.parent;\n\n this.parent = null;\n this.transform = this._tempDisplayObjectParent.transform;\n\n const worldBounds = this._bounds;\n const worldBoundsID = this._boundsID;\n\n this._bounds = this._localBounds;\n\n const bounds = this.getBounds(false, rect);\n\n this.parent = parentRef;\n this.transform = transformRef;\n\n this._bounds = worldBounds;\n this._bounds.updateID += this._boundsID - worldBoundsID;// reflect side-effects\n\n return bounds;\n }\n\n /**\n * Calculates the global position of the display object.\n *\n * @param {PIXI.IPointData} position - The world origin to calculate from.\n * @param {PIXI.Point} [point] - A Point object in which to store the value, optional\n * (otherwise will create a new Point).\n * @param {boolean} [skipUpdate=false] - Should we skip the update transform.\n * @return {PIXI.Point} A point object representing the position of this object.\n */\n toGlobal(position: IPointData, point?: P, skipUpdate = false): P\n {\n if (!skipUpdate)\n {\n this._recursivePostUpdateTransform();\n\n // this parent check is for just in case the item is a root object.\n // If it is we need to give it a temporary parent so that displayObjectUpdateTransform works correctly\n // this is mainly to avoid a parent check in the main loop. Every little helps for performance :)\n if (!this.parent)\n {\n this.parent = this._tempDisplayObjectParent as Container;\n this.displayObjectUpdateTransform();\n this.parent = null;\n }\n else\n {\n this.displayObjectUpdateTransform();\n }\n }\n\n // don't need to update the lot\n return this.worldTransform.apply
(position, point);\n }\n\n /**\n * Calculates the local position of the display object relative to another point.\n *\n * @param {PIXI.IPointData} position - The world origin to calculate from.\n * @param {PIXI.DisplayObject} [from] - The DisplayObject to calculate the global position from.\n * @param {PIXI.Point} [point] - A Point object in which to store the value, optional\n * (otherwise will create a new Point).\n * @param {boolean} [skipUpdate=false] - Should we skip the update transform\n * @return {PIXI.Point} A point object representing the position of this object\n */\n toLocal
(position: IPointData, from?: DisplayObject, point?: P, skipUpdate?: boolean): P\n {\n if (from)\n {\n position = from.toGlobal(position, point, skipUpdate);\n }\n\n if (!skipUpdate)\n {\n this._recursivePostUpdateTransform();\n\n // this parent check is for just in case the item is a root object.\n // If it is we need to give it a temporary parent so that displayObjectUpdateTransform works correctly\n // this is mainly to avoid a parent check in the main loop. Every little helps for performance :)\n if (!this.parent)\n {\n this.parent = this._tempDisplayObjectParent as Container;\n this.displayObjectUpdateTransform();\n this.parent = null;\n }\n else\n {\n this.displayObjectUpdateTransform();\n }\n }\n\n // simply apply the matrix..\n return this.worldTransform.applyInverse
(position, point);\n }\n\n /**\n * Set the parent Container of this DisplayObject.\n *\n * @param {PIXI.Container} container - The Container to add this DisplayObject to.\n * @return {PIXI.Container} The Container that this DisplayObject was added to.\n */\n setParent(container: Container): Container\n {\n if (!container || !container.addChild)\n {\n throw new Error('setParent: Argument must be a Container');\n }\n\n container.addChild(this);\n\n return container;\n }\n\n /**\n * Convenience function to set the position, scale, skew and pivot at once.\n *\n * @param {number} [x=0] - The X position\n * @param {number} [y=0] - The Y position\n * @param {number} [scaleX=1] - The X scale value\n * @param {number} [scaleY=1] - The Y scale value\n * @param {number} [rotation=0] - The rotation\n * @param {number} [skewX=0] - The X skew value\n * @param {number} [skewY=0] - The Y skew value\n * @param {number} [pivotX=0] - The X pivot value\n * @param {number} [pivotY=0] - The Y pivot value\n * @return {PIXI.DisplayObject} The DisplayObject instance\n */\n setTransform(x = 0, y = 0, scaleX = 1, scaleY = 1, rotation = 0, skewX = 0, skewY = 0, pivotX = 0, pivotY = 0): this\n {\n this.position.x = x;\n this.position.y = y;\n this.scale.x = !scaleX ? 1 : scaleX;\n this.scale.y = !scaleY ? 1 : scaleY;\n this.rotation = rotation;\n this.skew.x = skewX;\n this.skew.y = skewY;\n this.pivot.x = pivotX;\n this.pivot.y = pivotY;\n\n return this;\n }\n\n /**\n * Base destroy method for generic display objects. This will automatically\n * remove the display object from its parent Container as well as remove\n * all current event listeners and internal references. Do not use a DisplayObject\n * after calling `destroy()`.\n *\n */\n destroy(_options?: IDestroyOptions|boolean): void\n {\n if (this.parent)\n {\n this.parent.removeChild(this);\n }\n this.emit('destroyed');\n this.removeAllListeners();\n this.transform = null;\n\n this.parent = null;\n this._bounds = null;\n this.mask = null;\n\n this.filters = null;\n this.filterArea = null;\n this.hitArea = null;\n\n this.interactive = false;\n this.interactiveChildren = false;\n\n this._destroyed = true;\n }\n\n /**\n * @protected\n * @member {PIXI.Container}\n */\n get _tempDisplayObjectParent(): TemporaryDisplayObject\n {\n if (this.tempDisplayObjectParent === null)\n {\n // eslint-disable-next-line @typescript-eslint/no-use-before-define\n this.tempDisplayObjectParent = new TemporaryDisplayObject();\n }\n\n return this.tempDisplayObjectParent;\n }\n\n /**\n * Used in Renderer, cacheAsBitmap and other places where you call an `updateTransform` on root\n *\n * ```\n * const cacheParent = elem.enableTempParent();\n * elem.updateTransform();\n * elem.disableTempParent(cacheParent);\n * ```\n *\n * @returns {PIXI.Container} current parent\n */\n enableTempParent(): Container\n {\n const myParent = this.parent;\n\n this.parent = this._tempDisplayObjectParent as Container;\n\n return myParent;\n }\n\n /**\n * Pair method for `enableTempParent`\n *\n * @param {PIXI.Container} cacheParent - Actual parent of element\n */\n disableTempParent(cacheParent: Container): void\n {\n this.parent = cacheParent;\n }\n\n /**\n * The position of the displayObject on the x axis relative to the local coordinates of the parent.\n * An alias to position.x\n *\n * @member {number}\n */\n get x(): number\n {\n return this.position.x;\n }\n\n set x(value: number)\n {\n this.transform.position.x = value;\n }\n\n /**\n * The position of the displayObject on the y axis relative to the local coordinates of the parent.\n * An alias to position.y\n *\n * @member {number}\n */\n get y(): number\n {\n return this.position.y;\n }\n\n set y(value: number)\n {\n this.transform.position.y = value;\n }\n\n /**\n * Current transform of the object based on world (parent) factors.\n *\n * @member {PIXI.Matrix}\n * @readonly\n */\n get worldTransform(): Matrix\n {\n return this.transform.worldTransform;\n }\n\n /**\n * Current transform of the object based on local factors: position, scale, other stuff.\n *\n * @member {PIXI.Matrix}\n * @readonly\n */\n get localTransform(): Matrix\n {\n return this.transform.localTransform;\n }\n\n /**\n * The coordinate of the object relative to the local coordinates of the parent.\n *\n * @since PixiJS 4\n * @member {PIXI.ObservablePoint}\n */\n get position(): ObservablePoint\n {\n return this.transform.position;\n }\n\n set position(value: ObservablePoint)\n {\n this.transform.position.copyFrom(value);\n }\n\n /**\n * The scale factors of this object along the local coordinate axes.\n *\n * The default scale is (1, 1).\n *\n * @since PixiJS 4\n * @member {PIXI.ObservablePoint}\n */\n get scale(): ObservablePoint\n {\n return this.transform.scale;\n }\n\n set scale(value: ObservablePoint)\n {\n this.transform.scale.copyFrom(value);\n }\n\n /**\n * The center of rotation, scaling, and skewing for this display object in its local space. The `position`\n * is the projection of `pivot` in the parent's local space.\n *\n * By default, the pivot is the origin (0, 0).\n *\n * @since PixiJS 4\n * @member {PIXI.ObservablePoint}\n */\n get pivot(): ObservablePoint\n {\n return this.transform.pivot;\n }\n\n set pivot(value: ObservablePoint)\n {\n this.transform.pivot.copyFrom(value);\n }\n\n /**\n * The skew factor for the object in radians.\n *\n * @since PixiJS 4\n * @member {PIXI.ObservablePoint}\n */\n get skew(): ObservablePoint\n {\n return this.transform.skew;\n }\n\n set skew(value: ObservablePoint)\n {\n this.transform.skew.copyFrom(value);\n }\n\n /**\n * The rotation of the object in radians.\n * 'rotation' and 'angle' have the same effect on a display object; rotation is in radians, angle is in degrees.\n *\n * @member {number}\n */\n get rotation(): number\n {\n return this.transform.rotation;\n }\n\n set rotation(value: number)\n {\n this.transform.rotation = value;\n }\n\n /**\n * The angle of the object in degrees.\n * 'rotation' and 'angle' have the same effect on a display object; rotation is in radians, angle is in degrees.\n *\n * @member {number}\n */\n get angle(): number\n {\n return this.transform.rotation * RAD_TO_DEG;\n }\n\n set angle(value: number)\n {\n this.transform.rotation = value * DEG_TO_RAD;\n }\n\n /**\n * The zIndex of the displayObject.\n *\n * If a container has the sortableChildren property set to true, children will be automatically\n * sorted by zIndex value; a higher value will mean it will be moved towards the end of the array,\n * and thus rendered on top of other display objects within the same container.\n *\n * @member {number}\n * @see PIXI.Container#sortableChildren\n */\n get zIndex(): number\n {\n return this._zIndex;\n }\n\n set zIndex(value: number)\n {\n this._zIndex = value;\n if (this.parent)\n {\n this.parent.sortDirty = true;\n }\n }\n\n /**\n * Indicates if the object is globally visible.\n *\n * @member {boolean}\n * @readonly\n */\n get worldVisible(): boolean\n {\n let item = this as DisplayObject;\n\n do\n {\n if (!item.visible)\n {\n return false;\n }\n\n item = item.parent;\n } while (item);\n\n return true;\n }\n\n /**\n * Sets a mask for the displayObject. A mask is an object that limits the visibility of an\n * object to the shape of the mask applied to it. In PixiJS a regular mask must be a\n * {@link PIXI.Graphics} or a {@link PIXI.Sprite} object. This allows for much faster masking in canvas as it\n * utilities shape clipping. To remove a mask, set this property to `null`.\n *\n * For sprite mask both alpha and red channel are used. Black mask is the same as transparent mask.\n *\n * @example\n * const graphics = new PIXI.Graphics();\n * graphics.beginFill(0xFF3300);\n * graphics.drawRect(50, 250, 100, 100);\n * graphics.endFill();\n *\n * const sprite = new PIXI.Sprite(texture);\n * sprite.mask = graphics;\n *\n * @todo At the moment, PIXI.CanvasRenderer doesn't support PIXI.Sprite as mask.\n * @member {PIXI.Container|PIXI.MaskData|null}\n */\n get mask(): Container|MaskData|null\n {\n return this._mask;\n }\n\n set mask(value: Container|MaskData|null)\n {\n if (this._mask === value)\n {\n return;\n }\n\n if (this._mask)\n {\n const maskObject = ((this._mask as MaskData).maskObject || this._mask) as Container;\n\n maskObject._maskRefCount--;\n\n if (maskObject._maskRefCount === 0)\n {\n maskObject.renderable = true;\n maskObject.isMask = false;\n }\n }\n\n this._mask = value;\n\n if (this._mask)\n {\n const maskObject = ((this._mask as MaskData).maskObject || this._mask) as Container;\n\n if (maskObject._maskRefCount === 0)\n {\n maskObject.renderable = false;\n maskObject.isMask = true;\n }\n\n maskObject._maskRefCount++;\n }\n }\n}\n\n/**\n * @private\n */\nexport class TemporaryDisplayObject extends DisplayObject\n{\n calculateBounds: () => null;\n removeChild: (child: DisplayObject) => null;\n render: (renderer: Renderer) => null;\n sortDirty: boolean = null;\n}\n\n/**\n * DisplayObject default updateTransform, does not update children of container.\n * Will crash if there's no parent element.\n *\n * @memberof PIXI.DisplayObject#\n * @method displayObjectUpdateTransform\n */\nDisplayObject.prototype.displayObjectUpdateTransform = DisplayObject.prototype.updateTransform;\n","import { DisplayObject } from '@pixi/display';\nimport { isMobile, removeItems } from '@pixi/utils';\nimport { accessibleTarget } from './accessibleTarget';\n\nimport type { Rectangle } from '@pixi/math';\nimport type { Container } from '@pixi/display';\nimport type { Renderer, AbstractRenderer } from '@pixi/core';\nimport type { IAccessibleHTMLElement } from './accessibleTarget';\n\n// add some extra variables to the container..\nDisplayObject.mixin(accessibleTarget);\n\nconst KEY_CODE_TAB = 9;\n\nconst DIV_TOUCH_SIZE = 100;\nconst DIV_TOUCH_POS_X = 0;\nconst DIV_TOUCH_POS_Y = 0;\nconst DIV_TOUCH_ZINDEX = 2;\n\nconst DIV_HOOK_SIZE = 1;\nconst DIV_HOOK_POS_X = -1000;\nconst DIV_HOOK_POS_Y = -1000;\nconst DIV_HOOK_ZINDEX = 2;\n\n/**\n * The Accessibility manager recreates the ability to tab and have content read by screen readers.\n * This is very important as it can possibly help people with disabilities access PixiJS content.\n *\n * A DisplayObject can be made accessible just like it can be made interactive. This manager will map the\n * events as if the mouse was being used, minimizing the effort required to implement.\n *\n * An instance of this class is automatically created by default, and can be found at `renderer.plugins.accessibility`\n *\n * @class\n * @memberof PIXI\n */\nexport class AccessibilityManager\n{\n /** Setting this to true will visually show the divs. */\n public debug = false;\n\n /**\n * The renderer this accessibility manager works for.\n *\n * @type {PIXI.CanvasRenderer|PIXI.Renderer}\n */\n public renderer: AbstractRenderer|Renderer;\n\n /** Internal variable, see isActive getter. */\n private _isActive = false;\n\n /** Internal variable, see isMobileAccessibility getter. */\n private _isMobileAccessibility = false;\n\n /** Button element for handling touch hooks. */\n private _hookDiv: HTMLElement;\n\n /** This is the dom element that will sit over the PixiJS element. This is where the div overlays will go. */\n private div: HTMLElement;\n\n /** A simple pool for storing divs. */\n private pool: IAccessibleHTMLElement[] = [];\n\n /** This is a tick used to check if an object is no longer being rendered. */\n private renderId = 0;\n\n /** The array of currently active accessible items. */\n private children: DisplayObject[] = [];\n\n /** Count to throttle div updates on android devices. */\n private androidUpdateCount = 0;\n\n /** The frequency to update the div elements. */\n private androidUpdateFrequency = 500; // 2fps\n\n /**\n * @param {PIXI.CanvasRenderer|PIXI.Renderer} renderer - A reference to the current renderer\n */\n constructor(renderer: AbstractRenderer|Renderer)\n {\n this._hookDiv = null;\n\n if (isMobile.tablet || isMobile.phone)\n {\n this.createTouchHook();\n }\n\n // first we create a div that will sit over the PixiJS element. This is where the div overlays will go.\n const div = document.createElement('div');\n\n div.style.width = `${DIV_TOUCH_SIZE}px`;\n div.style.height = `${DIV_TOUCH_SIZE}px`;\n div.style.position = 'absolute';\n div.style.top = `${DIV_TOUCH_POS_X}px`;\n div.style.left = `${DIV_TOUCH_POS_Y}px`;\n div.style.zIndex = DIV_TOUCH_ZINDEX.toString();\n\n this.div = div;\n this.renderer = renderer;\n\n /**\n * pre-bind the functions\n *\n * @type {Function}\n * @private\n */\n this._onKeyDown = this._onKeyDown.bind(this);\n\n /**\n * pre-bind the functions\n *\n * @type {Function}\n * @private\n */\n this._onMouseMove = this._onMouseMove.bind(this);\n\n // let listen for tab.. once pressed we can fire up and show the accessibility layer\n self.addEventListener('keydown', this._onKeyDown, false);\n }\n\n /**\n * Value of `true` if accessibility is currently active and accessibility layers are showing.\n * @member {boolean}\n * @readonly\n */\n get isActive(): boolean\n {\n return this._isActive;\n }\n\n /**\n * Value of `true` if accessibility is enabled for touch devices.\n * @member {boolean}\n * @readonly\n */\n get isMobileAccessibility(): boolean\n {\n return this._isMobileAccessibility;\n }\n\n /**\n * Creates the touch hooks.\n *\n * @private\n */\n private createTouchHook(): void\n {\n const hookDiv = document.createElement('button');\n\n hookDiv.style.width = `${DIV_HOOK_SIZE}px`;\n hookDiv.style.height = `${DIV_HOOK_SIZE}px`;\n hookDiv.style.position = 'absolute';\n hookDiv.style.top = `${DIV_HOOK_POS_X}px`;\n hookDiv.style.left = `${DIV_HOOK_POS_Y}px`;\n hookDiv.style.zIndex = DIV_HOOK_ZINDEX.toString();\n hookDiv.style.backgroundColor = '#FF0000';\n hookDiv.title = 'select to enable accessibility for this content';\n\n hookDiv.addEventListener('focus', () =>\n {\n this._isMobileAccessibility = true;\n this.activate();\n this.destroyTouchHook();\n });\n\n document.body.appendChild(hookDiv);\n this._hookDiv = hookDiv;\n }\n\n /**\n * Destroys the touch hooks.\n *\n * @private\n */\n private destroyTouchHook(): void\n {\n if (!this._hookDiv)\n {\n return;\n }\n document.body.removeChild(this._hookDiv);\n this._hookDiv = null;\n }\n\n /**\n * Activating will cause the Accessibility layer to be shown.\n * This is called when a user presses the tab key.\n *\n * @private\n */\n private activate(): void\n {\n if (this._isActive)\n {\n return;\n }\n\n this._isActive = true;\n\n self.document.addEventListener('mousemove', this._onMouseMove, true);\n self.removeEventListener('keydown', this._onKeyDown, false);\n\n this.renderer.on('postrender', this.update, this);\n this.renderer.view.parentNode?.appendChild(this.div);\n }\n\n /**\n * Deactivating will cause the Accessibility layer to be hidden.\n * This is called when a user moves the mouse.\n *\n * @private\n */\n private deactivate(): void\n {\n if (!this._isActive || this._isMobileAccessibility)\n {\n return;\n }\n\n this._isActive = false;\n\n self.document.removeEventListener('mousemove', this._onMouseMove, true);\n self.addEventListener('keydown', this._onKeyDown, false);\n\n this.renderer.off('postrender', this.update);\n this.div.parentNode?.removeChild(this.div);\n }\n\n /**\n * This recursive function will run through the scene graph and add any new accessible objects to the DOM layer.\n *\n * @private\n * @param {PIXI.Container} displayObject - The DisplayObject to check.\n */\n private updateAccessibleObjects(displayObject: Container): void\n {\n if (!displayObject.visible || !displayObject.accessibleChildren)\n {\n return;\n }\n\n if (displayObject.accessible && displayObject.interactive)\n {\n if (!displayObject._accessibleActive)\n {\n this.addChild(displayObject);\n }\n\n displayObject.renderId = this.renderId;\n }\n\n const children = displayObject.children;\n\n if (children)\n {\n for (let i = 0; i < children.length; i++)\n {\n this.updateAccessibleObjects(children[i] as Container);\n }\n }\n }\n\n /**\n * Before each render this function will ensure that all divs are mapped correctly to their DisplayObjects.\n *\n * @private\n */\n private update(): void\n {\n /* On Android default web browser, tab order seems to be calculated by position rather than tabIndex,\n * moving buttons can cause focus to flicker between two buttons making it hard/impossible to navigate,\n * so I am just running update every half a second, seems to fix it.\n */\n const now = performance.now();\n\n if (isMobile.android.device && now < this.androidUpdateCount)\n {\n return;\n }\n\n this.androidUpdateCount = now + this.androidUpdateFrequency;\n\n if (!(this.renderer as Renderer).renderingToScreen)\n {\n return;\n }\n\n // update children...\n if (this.renderer._lastObjectRendered)\n {\n this.updateAccessibleObjects(this.renderer._lastObjectRendered as Container);\n }\n\n const { left, top, width, height } = this.renderer.view.getBoundingClientRect();\n const { width: viewWidth, height: viewHeight, resolution } = this.renderer;\n\n const sx = (width / viewWidth) * resolution;\n const sy = (height / viewHeight) * resolution;\n\n let div = this.div;\n\n div.style.left = `${left}px`;\n div.style.top = `${top}px`;\n div.style.width = `${viewWidth}px`;\n div.style.height = `${viewHeight}px`;\n\n for (let i = 0; i < this.children.length; i++)\n {\n const child = this.children[i];\n\n if (child.renderId !== this.renderId)\n {\n child._accessibleActive = false;\n\n removeItems(this.children, i, 1);\n this.div.removeChild(child._accessibleDiv);\n this.pool.push(child._accessibleDiv);\n child._accessibleDiv = null;\n\n i--;\n }\n else\n {\n // map div to display..\n div = child._accessibleDiv;\n let hitArea = child.hitArea as Rectangle;\n const wt = child.worldTransform;\n\n if (child.hitArea)\n {\n div.style.left = `${(wt.tx + (hitArea.x * wt.a)) * sx}px`;\n div.style.top = `${(wt.ty + (hitArea.y * wt.d)) * sy}px`;\n\n div.style.width = `${hitArea.width * wt.a * sx}px`;\n div.style.height = `${hitArea.height * wt.d * sy}px`;\n }\n else\n {\n hitArea = child.getBounds();\n\n this.capHitArea(hitArea);\n\n div.style.left = `${hitArea.x * sx}px`;\n div.style.top = `${hitArea.y * sy}px`;\n\n div.style.width = `${hitArea.width * sx}px`;\n div.style.height = `${hitArea.height * sy}px`;\n\n // update button titles and hints if they exist and they've changed\n if (div.title !== child.accessibleTitle && child.accessibleTitle !== null)\n {\n div.title = child.accessibleTitle;\n }\n if (div.getAttribute('aria-label') !== child.accessibleHint\n && child.accessibleHint !== null)\n {\n div.setAttribute('aria-label', child.accessibleHint);\n }\n }\n\n // the title or index may have changed, if so lets update it!\n if (child.accessibleTitle !== div.title || child.tabIndex !== div.tabIndex)\n {\n div.title = child.accessibleTitle;\n div.tabIndex = child.tabIndex;\n if (this.debug) this.updateDebugHTML(div);\n }\n }\n }\n\n // increment the render id..\n this.renderId++;\n }\n\n /**\n * private function that will visually add the information to the\n * accessability div\n *\n * @param {HTMLElement} div\n */\n public updateDebugHTML(div: IAccessibleHTMLElement): void\n {\n div.innerHTML = `type: ${div.type} title : ${div.title} tabIndex: ${div.tabIndex}`;\n }\n\n /**\n * Adjust the hit area based on the bounds of a display object\n *\n * @param {PIXI.Rectangle} hitArea - Bounds of the child\n */\n public capHitArea(hitArea: Rectangle): void\n {\n if (hitArea.x < 0)\n {\n hitArea.width += hitArea.x;\n hitArea.x = 0;\n }\n\n if (hitArea.y < 0)\n {\n hitArea.height += hitArea.y;\n hitArea.y = 0;\n }\n\n const { width: viewWidth, height: viewHeight } = this.renderer;\n\n if (hitArea.x + hitArea.width > viewWidth)\n {\n hitArea.width = viewWidth - hitArea.x;\n }\n\n if (hitArea.y + hitArea.height > viewHeight)\n {\n hitArea.height = viewHeight - hitArea.y;\n }\n }\n\n /**\n * Adds a DisplayObject to the accessibility manager\n *\n * @private\n * @param {PIXI.DisplayObject} displayObject - The child to make accessible.\n */\n private addChild(displayObject: T): void\n {\n // this.activate();\n\n let div = this.pool.pop();\n\n if (!div)\n {\n div = document.createElement('button');\n\n div.style.width = `${DIV_TOUCH_SIZE}px`;\n div.style.height = `${DIV_TOUCH_SIZE}px`;\n div.style.backgroundColor = this.debug ? 'rgba(255,255,255,0.5)' : 'transparent';\n div.style.position = 'absolute';\n div.style.zIndex = DIV_TOUCH_ZINDEX.toString();\n div.style.borderStyle = 'none';\n\n // ARIA attributes ensure that button title and hint updates are announced properly\n if (navigator.userAgent.toLowerCase().indexOf('chrome') > -1)\n {\n // Chrome doesn't need aria-live to work as intended; in fact it just gets more confused.\n div.setAttribute('aria-live', 'off');\n }\n else\n {\n div.setAttribute('aria-live', 'polite');\n }\n\n if (navigator.userAgent.match(/rv:.*Gecko\\//))\n {\n // FireFox needs this to announce only the new button name\n div.setAttribute('aria-relevant', 'additions');\n }\n else\n {\n // required by IE, other browsers don't much care\n div.setAttribute('aria-relevant', 'text');\n }\n\n div.addEventListener('click', this._onClick.bind(this));\n div.addEventListener('focus', this._onFocus.bind(this));\n div.addEventListener('focusout', this._onFocusOut.bind(this));\n }\n\n // set pointer events\n div.style.pointerEvents = displayObject.accessiblePointerEvents;\n // set the type, this defaults to button!\n div.type = displayObject.accessibleType;\n\n if (displayObject.accessibleTitle && displayObject.accessibleTitle !== null)\n {\n div.title = displayObject.accessibleTitle;\n }\n else if (!displayObject.accessibleHint\n || displayObject.accessibleHint === null)\n {\n div.title = `displayObject ${displayObject.tabIndex}`;\n }\n\n if (displayObject.accessibleHint\n && displayObject.accessibleHint !== null)\n {\n div.setAttribute('aria-label', displayObject.accessibleHint);\n }\n\n if (this.debug) this.updateDebugHTML(div);\n\n displayObject._accessibleActive = true;\n displayObject._accessibleDiv = div;\n div.displayObject = displayObject;\n\n this.children.push(displayObject);\n this.div.appendChild(displayObject._accessibleDiv);\n displayObject._accessibleDiv.tabIndex = displayObject.tabIndex;\n }\n\n /**\n * Maps the div button press to pixi's InteractionManager (click)\n *\n * @private\n * @param {MouseEvent} e - The click event.\n */\n private _onClick(e: MouseEvent): void\n {\n const interactionManager = this.renderer.plugins.interaction;\n const { displayObject } = e.target as IAccessibleHTMLElement;\n const { eventData } = interactionManager;\n\n interactionManager.dispatchEvent(displayObject, 'click', eventData);\n interactionManager.dispatchEvent(displayObject, 'pointertap', eventData);\n interactionManager.dispatchEvent(displayObject, 'tap', eventData);\n }\n\n /**\n * Maps the div focus events to pixi's InteractionManager (mouseover)\n *\n * @private\n * @param {FocusEvent} e - The focus event.\n */\n private _onFocus(e: FocusEvent): void\n {\n if (!(e.target as Element).getAttribute('aria-live'))\n {\n (e.target as Element).setAttribute('aria-live', 'assertive');\n }\n\n const interactionManager = this.renderer.plugins.interaction;\n const { displayObject } = e.target as IAccessibleHTMLElement;\n const { eventData } = interactionManager;\n\n interactionManager.dispatchEvent(displayObject, 'mouseover', eventData);\n }\n\n /**\n * Maps the div focus events to pixi's InteractionManager (mouseout)\n *\n * @private\n * @param {FocusEvent} e - The focusout event.\n */\n private _onFocusOut(e: FocusEvent): void\n {\n if (!(e.target as Element).getAttribute('aria-live'))\n {\n (e.target as Element).setAttribute('aria-live', 'polite');\n }\n\n const interactionManager = this.renderer.plugins.interaction;\n const { displayObject } = e.target as IAccessibleHTMLElement;\n const { eventData } = interactionManager;\n\n interactionManager.dispatchEvent(displayObject, 'mouseout', eventData);\n }\n\n /**\n * Is called when a key is pressed\n *\n * @private\n * @param {KeyboardEvent} e - The keydown event.\n */\n private _onKeyDown(e: KeyboardEvent): void\n {\n if (e.keyCode !== KEY_CODE_TAB)\n {\n return;\n }\n\n this.activate();\n }\n\n /**\n * Is called when the mouse moves across the renderer element\n *\n * @private\n * @param {MouseEvent} e - The mouse event.\n */\n private _onMouseMove(e: MouseEvent): void\n {\n if (e.movementX === 0 && e.movementY === 0)\n {\n return;\n }\n\n this.deactivate();\n }\n\n /**\n * Destroys the accessibility manager\n *\n */\n public destroy(): void\n {\n this.destroyTouchHook();\n this.div = null;\n\n self.document.removeEventListener('mousemove', this._onMouseMove, true);\n self.removeEventListener('keydown', this._onKeyDown);\n\n this.pool = null;\n this.children = null;\n this.renderer = null;\n }\n}\n","import type { DisplayObject } from '@pixi/display';\n\nexport type PointerEvents = 'auto'\n| 'none'\n| 'visiblePainted'\n| 'visibleFill'\n| 'visibleStroke'\n| 'visible'\n| 'painted'\n| 'fill'\n| 'stroke'\n| 'all'\n| 'inherit';\n\nexport interface IAccessibleTarget {\n accessible: boolean;\n accessibleTitle: string;\n accessibleHint: string;\n tabIndex: number;\n _accessibleActive: boolean;\n _accessibleDiv: IAccessibleHTMLElement;\n accessibleType: string;\n accessiblePointerEvents: PointerEvents;\n accessibleChildren: boolean;\n renderId: number;\n}\n\nexport interface IAccessibleHTMLElement extends HTMLElement {\n type?: string;\n displayObject?: DisplayObject;\n}\n\n/**\n * Default property values of accessible objects\n * used by {@link PIXI.AccessibilityManager}.\n *\n * @private\n * @function accessibleTarget\n * @memberof PIXI\n * @type {Object}\n * @example\n * function MyObject() {}\n *\n * Object.assign(\n * MyObject.prototype,\n * PIXI.accessibleTarget\n * );\n */\nexport const accessibleTarget: IAccessibleTarget = {\n /**\n * Flag for if the object is accessible. If true AccessibilityManager will overlay a\n * shadow div with attributes set\n *\n * @member {boolean}\n * @memberof PIXI.DisplayObject#\n */\n accessible: false,\n\n /**\n * Sets the title attribute of the shadow div\n * If accessibleTitle AND accessibleHint has not been this will default to 'displayObject [tabIndex]'\n *\n * @member {?string}\n * @memberof PIXI.DisplayObject#\n */\n accessibleTitle: null,\n\n /**\n * Sets the aria-label attribute of the shadow div\n *\n * @member {string}\n * @memberof PIXI.DisplayObject#\n */\n accessibleHint: null,\n\n /**\n * @member {number}\n * @memberof PIXI.DisplayObject#\n * @private\n * @todo Needs docs.\n */\n tabIndex: 0,\n\n /**\n * @member {boolean}\n * @memberof PIXI.DisplayObject#\n * @todo Needs docs.\n */\n _accessibleActive: false,\n\n /**\n * @member {boolean}\n * @memberof PIXI.DisplayObject#\n * @todo Needs docs.\n */\n _accessibleDiv: null,\n\n /**\n * Specify the type of div the accessible layer is. Screen readers treat the element differently\n * depending on this type. Defaults to button.\n *\n * @member {string}\n * @memberof PIXI.DisplayObject#\n * @default 'button'\n */\n accessibleType: 'button',\n\n /**\n * Specify the pointer-events the accessible div will use\n * Defaults to auto.\n *\n * @member {string}\n * @memberof PIXI.DisplayObject#\n * @default 'auto'\n */\n accessiblePointerEvents: 'auto',\n\n /**\n * Setting to false will prevent any children inside this container to\n * be accessible. Defaults to true.\n *\n * @member {boolean}\n * @memberof PIXI.DisplayObject#\n * @default true\n */\n accessibleChildren: true,\n\n renderId: -1,\n};\n","import { UPDATE_PRIORITY } from './const';\nimport { Ticker } from './Ticker';\n\n/**\n * Middleware for for Application Ticker.\n *\n * @example\n * import {TickerPlugin} from '@pixi/ticker';\n * import {Application} from '@pixi/app';\n * Application.registerPlugin(TickerPlugin);\n *\n * @class\n * @memberof PIXI\n */\nexport class TickerPlugin\n{\n static start: () => void;\n static stop: () => void;\n static _ticker: Ticker;\n static ticker: Ticker;\n\n /**\n * Initialize the plugin with scope of application instance\n *\n * @static\n * @private\n * @param {object} [options] - See application options\n */\n static init(options?: GlobalMixins.IApplicationOptions): void\n {\n // Set default\n options = Object.assign({\n autoStart: true,\n sharedTicker: false,\n }, options);\n\n // Create ticker setter\n Object.defineProperty(this, 'ticker',\n {\n set(ticker)\n {\n if (this._ticker)\n {\n this._ticker.remove(this.render, this);\n }\n this._ticker = ticker;\n if (ticker)\n {\n ticker.add(this.render, this, UPDATE_PRIORITY.LOW);\n }\n },\n get()\n {\n return this._ticker;\n },\n });\n\n /**\n * Convenience method for stopping the render.\n *\n * @method\n * @memberof PIXI.Application\n * @instance\n */\n this.stop = (): void =>\n {\n this._ticker.stop();\n };\n\n /**\n * Convenience method for starting the render.\n *\n * @method\n * @memberof PIXI.Application\n * @instance\n */\n this.start = (): void =>\n {\n this._ticker.start();\n };\n\n /**\n * Internal reference to the ticker.\n *\n * @type {PIXI.Ticker}\n * @name _ticker\n * @memberof PIXI.Application#\n * @private\n */\n this._ticker = null;\n\n /**\n * Ticker for doing render updates.\n *\n * @type {PIXI.Ticker}\n * @name ticker\n * @memberof PIXI.Application#\n * @default PIXI.Ticker.shared\n */\n this.ticker = options.sharedTicker ? Ticker.shared : new Ticker();\n\n // Start the rendering\n if (options.autoStart)\n {\n this.start();\n }\n }\n\n /**\n * Clean up the ticker, scoped to application.\n *\n * @static\n * @private\n */\n static destroy(): void\n {\n if (this._ticker)\n {\n const oldTicker = this._ticker;\n\n this.ticker = null;\n oldTicker.destroy();\n }\n }\n}\n","import { TickerCallback } from './Ticker';\n\n/**\n * Internal class for handling the priority sorting of ticker handlers.\n *\n * @private\n * @class\n * @memberof PIXI\n */\nexport class TickerListener\n{\n /** The current priority. */\n public priority: number;\n /** The next item in chain. */\n public next: TickerListener = null;\n /** The previous item in chain. */\n public previous: TickerListener = null;\n\n /** The handler function to execute. */\n private fn: TickerCallback;\n /** The calling to execute. */\n private context: T;\n /** If this should only execute once. */\n private once: boolean;\n /** `true` if this listener has been destroyed already. */\n private _destroyed = false;\n\n /**\n * Constructor\n * @private\n * @param fn - The listener function to be added for one update\n * @param context - The listener context\n * @param priority - The priority for emitting\n * @param once - If the handler should fire once\n */\n constructor(fn: TickerCallback, context: T = null, priority = 0, once = false)\n {\n this.fn = fn;\n this.context = context;\n this.priority = priority;\n this.once = once;\n }\n\n /**\n * Simple compare function to figure out if a function and context match.\n * @private\n * @param fn - The listener function to be added for one update\n * @param context - The listener context\n * @return `true` if the listener match the arguments\n */\n match(fn: TickerCallback, context: any = null): boolean\n {\n return this.fn === fn && this.context === context;\n }\n\n /**\n * Emit by calling the current function.\n * @private\n * @param deltaTime - time since the last emit.\n * @return Next ticker\n */\n emit(deltaTime: number): TickerListener\n {\n if (this.fn)\n {\n if (this.context)\n {\n this.fn.call(this.context, deltaTime);\n }\n else\n {\n (this as TickerListener).fn(deltaTime);\n }\n }\n\n const redirect = this.next;\n\n if (this.once)\n {\n this.destroy(true);\n }\n\n // Soft-destroying should remove\n // the next reference\n if (this._destroyed)\n {\n this.next = null;\n }\n\n return redirect;\n }\n\n /**\n * Connect to the list.\n * @private\n * @param previous - Input node, previous listener\n */\n connect(previous: TickerListener): void\n {\n this.previous = previous;\n if (previous.next)\n {\n previous.next.previous = this;\n }\n this.next = previous.next;\n previous.next = this;\n }\n\n /**\n * Destroy and don't use after this.\n * @private\n * @param hard - `true` to remove the `next` reference, this\n * is considered a hard destroy. Soft destroy maintains the next reference.\n * @return The listener to redirect while emitting or removing.\n */\n destroy(hard = false): TickerListener\n {\n this._destroyed = true;\n this.fn = null;\n this.context = null;\n\n // Disconnect, hook up next and previous\n if (this.previous)\n {\n this.previous.next = this.next;\n }\n\n if (this.next)\n {\n this.next.previous = this.previous;\n }\n\n // Redirect to the next item\n const redirect = this.next;\n\n // Remove references\n this.next = hard ? null : redirect;\n this.previous = null;\n\n return redirect;\n }\n}\n","import { settings } from './settings';\nimport { UPDATE_PRIORITY } from './const';\nimport { TickerListener } from './TickerListener';\n\nexport type TickerCallback = (this: T, dt: number) => any;\n\n/**\n * A Ticker class that runs an update loop that other objects listen to.\n *\n * This class is composed around listeners meant for execution on the next requested animation frame.\n * Animation frames are requested only when necessary, e.g. When the ticker is started and the emitter has listeners.\n *\n * @class\n * @memberof PIXI\n */\nexport class Ticker\n{\n /** The private shared ticker instance */\n private static _shared: Ticker;\n /** The private system ticker instance */\n private static _system: Ticker;\n\n /**\n * Whether or not this ticker should invoke the method\n * {@link PIXI.Ticker#start} automatically\n * when a listener is added.\n */\n public autoStart = false;\n /**\n * Scalar time value from last frame to this frame.\n * This value is capped by setting {@link PIXI.Ticker#minFPS}\n * and is scaled with {@link PIXI.Ticker#speed}.\n * **Note:** The cap may be exceeded by scaling.\n */\n public deltaTime = 1;\n /**\n * Scaler time elapsed in milliseconds from last frame to this frame.\n * This value is capped by setting {@link PIXI.Ticker#minFPS}\n * and is scaled with {@link PIXI.Ticker#speed}.\n * **Note:** The cap may be exceeded by scaling.\n * If the platform supports DOMHighResTimeStamp,\n * this value will have a precision of 1 µs.\n * Defaults to target frame time\n * @default 16.66\n */\n public deltaMS: number;\n /**\n * Time elapsed in milliseconds from last frame to this frame.\n * Opposed to what the scalar {@link PIXI.Ticker#deltaTime}\n * is based, this value is neither capped nor scaled.\n * If the platform supports DOMHighResTimeStamp,\n * this value will have a precision of 1 µs.\n * Defaults to target frame time\n * @default 16.66\n */\n public elapsedMS: number;\n /**\n * The last time {@link PIXI.Ticker#update} was invoked.\n * This value is also reset internally outside of invoking\n * update, but only when a new animation frame is requested.\n * If the platform supports DOMHighResTimeStamp,\n * this value will have a precision of 1 µs.\n */\n public lastTime = -1;\n /**\n * Factor of current {@link PIXI.Ticker#deltaTime}.\n * @example\n * // Scales ticker.deltaTime to what would be\n * // the equivalent of approximately 120 FPS\n * ticker.speed = 2;\n */\n public speed = 1;\n /**\n * Whether or not this ticker has been started.\n * `true` if {@link PIXI.Ticker#start} has been called.\n * `false` if {@link PIXI.Ticker#stop} has been called.\n * While `false`, this value may change to `true` in the\n * event of {@link PIXI.Ticker#autoStart} being `true`\n * and a listener is added.\n */\n public started = false;\n\n /** The first listener. All new listeners added are chained on this. */\n private _head: TickerListener;\n /** Internal current frame request ID */\n private _requestId: number = null;\n /**\n * Internal value managed by minFPS property setter and getter.\n * This is the maximum allowed milliseconds between updates.\n */\n private _maxElapsedMS = 100;\n /**\n * Internal value managed by minFPS property setter and getter.\n * This is the minimum allowed milliseconds between updates.\n */\n private _minElapsedMS = 0;\n /** If enabled, deleting is disabled.*/\n private _protected = false;\n /**\n * The last time keyframe was executed.\n * Maintains a relatively fixed interval with the previous value.\n */\n private _lastFrame = -1;\n /**\n * Internal tick method bound to ticker instance.\n * This is because in early 2015, Function.bind\n * is still 60% slower in high performance scenarios.\n * Also separating frame requests from update method\n * so listeners may be called at any time and with\n * any animation API, just invoke ticker.update(time).\n *\n * @param time - Time since last tick.\n */\n private _tick: (time: number) => any;\n\n constructor()\n {\n this._head = new TickerListener(null, null, Infinity);\n this.deltaMS = 1 / settings.TARGET_FPMS;\n this.elapsedMS = 1 / settings.TARGET_FPMS;\n\n this._tick = (time: number): void =>\n {\n this._requestId = null;\n\n if (this.started)\n {\n // Invoke listeners now\n this.update(time);\n // Listener side effects may have modified ticker state.\n if (this.started && this._requestId === null && this._head.next)\n {\n this._requestId = requestAnimationFrame(this._tick);\n }\n }\n };\n }\n\n /**\n * Conditionally requests a new animation frame.\n * If a frame has not already been requested, and if the internal\n * emitter has listeners, a new frame is requested.\n *\n * @private\n */\n private _requestIfNeeded(): void\n {\n if (this._requestId === null && this._head.next)\n {\n // ensure callbacks get correct delta\n this.lastTime = performance.now();\n this._lastFrame = this.lastTime;\n this._requestId = requestAnimationFrame(this._tick);\n }\n }\n\n /**\n * Conditionally cancels a pending animation frame.\n * @private\n */\n private _cancelIfNeeded(): void\n {\n if (this._requestId !== null)\n {\n cancelAnimationFrame(this._requestId);\n this._requestId = null;\n }\n }\n\n /**\n * Conditionally requests a new animation frame.\n * If the ticker has been started it checks if a frame has not already\n * been requested, and if the internal emitter has listeners. If these\n * conditions are met, a new frame is requested. If the ticker has not\n * been started, but autoStart is `true`, then the ticker starts now,\n * and continues with the previous conditions to request a new frame.\n *\n * @private\n */\n private _startIfPossible(): void\n {\n if (this.started)\n {\n this._requestIfNeeded();\n }\n else if (this.autoStart)\n {\n this.start();\n }\n }\n\n /**\n * Register a handler for tick events. Calls continuously unless\n * it is removed or the ticker is stopped.\n *\n * @param fn - The listener function to be added for updates\n * @param context - The listener context\n * @param {number} [priority=PIXI.UPDATE_PRIORITY.NORMAL] - The priority for emitting\n * @returns This instance of a ticker\n */\n add(fn: TickerCallback, context?: T, priority = UPDATE_PRIORITY.NORMAL): this\n {\n return this._addListener(new TickerListener(fn, context, priority));\n }\n\n /**\n * Add a handler for the tick event which is only execute once.\n *\n * @param fn - The listener function to be added for one update\n * @param context - The listener context\n * @param {number} [priority=PIXI.UPDATE_PRIORITY.NORMAL] - The priority for emitting\n * @returns This instance of a ticker\n */\n addOnce(fn: TickerCallback, context?: T, priority = UPDATE_PRIORITY.NORMAL): this\n {\n return this._addListener(new TickerListener(fn, context, priority, true));\n }\n\n /**\n * Internally adds the event handler so that it can be sorted by priority.\n * Priority allows certain handler (user, AnimatedSprite, Interaction) to be run\n * before the rendering.\n *\n * @private\n * @param listener - Current listener being added.\n * @returns This instance of a ticker\n */\n private _addListener(listener: TickerListener): this\n {\n // For attaching to head\n let current = this._head.next;\n let previous = this._head;\n\n // Add the first item\n if (!current)\n {\n listener.connect(previous);\n }\n else\n {\n // Go from highest to lowest priority\n while (current)\n {\n if (listener.priority > current.priority)\n {\n listener.connect(previous);\n break;\n }\n previous = current;\n current = current.next;\n }\n\n // Not yet connected\n if (!listener.previous)\n {\n listener.connect(previous);\n }\n }\n\n this._startIfPossible();\n\n return this;\n }\n\n /**\n * Removes any handlers matching the function and context parameters.\n * If no handlers are left after removing, then it cancels the animation frame.\n *\n * @param fn - The listener function to be removed\n * @param context - The listener context to be removed\n * @returns This instance of a ticker\n */\n remove(fn: TickerCallback, context?: T): this\n {\n let listener = this._head.next;\n\n while (listener)\n {\n // We found a match, lets remove it\n // no break to delete all possible matches\n // incase a listener was added 2+ times\n if (listener.match(fn, context))\n {\n listener = listener.destroy();\n }\n else\n {\n listener = listener.next;\n }\n }\n\n if (!this._head.next)\n {\n this._cancelIfNeeded();\n }\n\n return this;\n }\n\n /**\n * The number of listeners on this ticker, calculated by walking through linked list\n *\n * @readonly\n * @member {number}\n */\n get count(): number\n {\n if (!this._head)\n {\n return 0;\n }\n\n let count = 0;\n let current = this._head;\n\n while ((current = current.next))\n {\n count++;\n }\n\n return count;\n }\n\n /**\n * Starts the ticker. If the ticker has listeners\n * a new animation frame is requested at this point.\n */\n start(): void\n {\n if (!this.started)\n {\n this.started = true;\n this._requestIfNeeded();\n }\n }\n\n /**\n * Stops the ticker. If the ticker has requested\n * an animation frame it is canceled at this point.\n */\n stop(): void\n {\n if (this.started)\n {\n this.started = false;\n this._cancelIfNeeded();\n }\n }\n\n /**\n * Destroy the ticker and don't use after this. Calling\n * this method removes all references to internal events.\n */\n destroy(): void\n {\n if (!this._protected)\n {\n this.stop();\n\n let listener = this._head.next;\n\n while (listener)\n {\n listener = listener.destroy(true);\n }\n\n this._head.destroy();\n this._head = null;\n }\n }\n\n /**\n * Triggers an update. An update entails setting the\n * current {@link PIXI.Ticker#elapsedMS},\n * the current {@link PIXI.Ticker#deltaTime},\n * invoking all listeners with current deltaTime,\n * and then finally setting {@link PIXI.Ticker#lastTime}\n * with the value of currentTime that was provided.\n * This method will be called automatically by animation\n * frame callbacks if the ticker instance has been started\n * and listeners are added.\n *\n * @param {number} [currentTime=performance.now()] - the current time of execution\n */\n update(currentTime = performance.now()): void\n {\n let elapsedMS;\n\n // If the difference in time is zero or negative, we ignore most of the work done here.\n // If there is no valid difference, then should be no reason to let anyone know about it.\n // A zero delta, is exactly that, nothing should update.\n //\n // The difference in time can be negative, and no this does not mean time traveling.\n // This can be the result of a race condition between when an animation frame is requested\n // on the current JavaScript engine event loop, and when the ticker's start method is invoked\n // (which invokes the internal _requestIfNeeded method). If a frame is requested before\n // _requestIfNeeded is invoked, then the callback for the animation frame the ticker requests,\n // can receive a time argument that can be less than the lastTime value that was set within\n // _requestIfNeeded. This difference is in microseconds, but this is enough to cause problems.\n //\n // This check covers this browser engine timing issue, as well as if consumers pass an invalid\n // currentTime value. This may happen if consumers opt-out of the autoStart, and update themselves.\n\n if (currentTime > this.lastTime)\n {\n // Save uncapped elapsedMS for measurement\n elapsedMS = this.elapsedMS = currentTime - this.lastTime;\n\n // cap the milliseconds elapsed used for deltaTime\n if (elapsedMS > this._maxElapsedMS)\n {\n elapsedMS = this._maxElapsedMS;\n }\n\n elapsedMS *= this.speed;\n\n // If not enough time has passed, exit the function.\n // Get ready for next frame by setting _lastFrame, but based on _minElapsedMS\n // adjustment to ensure a relatively stable interval.\n if (this._minElapsedMS)\n {\n const delta = currentTime - this._lastFrame | 0;\n\n if (delta < this._minElapsedMS)\n {\n return;\n }\n\n this._lastFrame = currentTime - (delta % this._minElapsedMS);\n }\n\n this.deltaMS = elapsedMS;\n this.deltaTime = this.deltaMS * settings.TARGET_FPMS;\n\n // Cache a local reference, in-case ticker is destroyed\n // during the emit, we can still check for head.next\n const head = this._head;\n\n // Invoke listeners added to internal emitter\n let listener = head.next;\n\n while (listener)\n {\n listener = listener.emit(this.deltaTime);\n }\n\n if (!head.next)\n {\n this._cancelIfNeeded();\n }\n }\n else\n {\n this.deltaTime = this.deltaMS = this.elapsedMS = 0;\n }\n\n this.lastTime = currentTime;\n }\n\n /**\n * The frames per second at which this ticker is running.\n * The default is approximately 60 in most modern browsers.\n * **Note:** This does not factor in the value of\n * {@link PIXI.Ticker#speed}, which is specific\n * to scaling {@link PIXI.Ticker#deltaTime}.\n *\n * @member {number}\n * @readonly\n */\n get FPS(): number\n {\n return 1000 / this.elapsedMS;\n }\n\n /**\n * Manages the maximum amount of milliseconds allowed to\n * elapse between invoking {@link PIXI.Ticker#update}.\n * This value is used to cap {@link PIXI.Ticker#deltaTime},\n * but does not effect the measured value of {@link PIXI.Ticker#FPS}.\n * When setting this property it is clamped to a value between\n * `0` and `PIXI.settings.TARGET_FPMS * 1000`.\n *\n * @member {number}\n * @default 10\n */\n get minFPS(): number\n {\n return 1000 / this._maxElapsedMS;\n }\n\n set minFPS(fps: number)\n {\n // Minimum must be below the maxFPS\n const minFPS = Math.min(this.maxFPS, fps);\n\n // Must be at least 0, but below 1 / settings.TARGET_FPMS\n const minFPMS = Math.min(Math.max(0, minFPS) / 1000, settings.TARGET_FPMS);\n\n this._maxElapsedMS = 1 / minFPMS;\n }\n\n /**\n * Manages the minimum amount of milliseconds required to\n * elapse between invoking {@link PIXI.Ticker#update}.\n * This will effect the measured value of {@link PIXI.Ticker#FPS}.\n * If it is set to `0`, then there is no limit; PixiJS will render as many frames as it can.\n * Otherwise it will be at least `minFPS`\n *\n * @member {number}\n * @default 0\n */\n get maxFPS(): number\n {\n if (this._minElapsedMS)\n {\n return Math.round(1000 / this._minElapsedMS);\n }\n\n return 0;\n }\n\n set maxFPS(fps: number)\n {\n if (fps === 0)\n {\n this._minElapsedMS = 0;\n }\n else\n {\n // Max must be at least the minFPS\n const maxFPS = Math.max(this.minFPS, fps);\n\n this._minElapsedMS = 1 / (maxFPS / 1000);\n }\n }\n\n /**\n * The shared ticker instance used by {@link PIXI.AnimatedSprite} and by\n * {@link PIXI.VideoResource} to update animation frames / video textures.\n *\n * It may also be used by {@link PIXI.Application} if created with the `sharedTicker` option property set to true.\n *\n * The property {@link PIXI.Ticker#autoStart} is set to `true` for this instance.\n * Please follow the examples for usage, including how to opt-out of auto-starting the shared ticker.\n *\n * @example\n * let ticker = PIXI.Ticker.shared;\n * // Set this to prevent starting this ticker when listeners are added.\n * // By default this is true only for the PIXI.Ticker.shared instance.\n * ticker.autoStart = false;\n * // FYI, call this to ensure the ticker is stopped. It should be stopped\n * // if you have not attempted to render anything yet.\n * ticker.stop();\n * // Call this when you are ready for a running shared ticker.\n * ticker.start();\n *\n * @example\n * // You may use the shared ticker to render...\n * let renderer = PIXI.autoDetectRenderer();\n * let stage = new PIXI.Container();\n * document.body.appendChild(renderer.view);\n * ticker.add(function (time) {\n * renderer.render(stage);\n * });\n *\n * @example\n * // Or you can just update it manually.\n * ticker.autoStart = false;\n * ticker.stop();\n * function animate(time) {\n * ticker.update(time);\n * renderer.render(stage);\n * requestAnimationFrame(animate);\n * }\n * animate(performance.now());\n *\n * @member {PIXI.Ticker}\n * @static\n */\n static get shared(): Ticker\n {\n if (!Ticker._shared)\n {\n const shared = Ticker._shared = new Ticker();\n\n shared.autoStart = true;\n shared._protected = true;\n }\n\n return Ticker._shared;\n }\n\n /**\n * The system ticker instance used by {@link PIXI.InteractionManager} and by\n * {@link PIXI.BasePrepare} for core timing functionality that shouldn't usually need to be paused,\n * unlike the `shared` ticker which drives visual animations and rendering which may want to be paused.\n *\n * The property {@link PIXI.Ticker#autoStart} is set to `true` for this instance.\n *\n * @member {PIXI.Ticker}\n * @static\n */\n static get system(): Ticker\n {\n if (!Ticker._system)\n {\n const system = Ticker._system = new Ticker();\n\n system.autoStart = true;\n system._protected = true;\n }\n\n return Ticker._system;\n }\n}\n","import { Ticker, UPDATE_PRIORITY } from '@pixi/ticker';\nimport { DisplayObject, TemporaryDisplayObject } from '@pixi/display';\nimport { InteractionData, InteractivePointerEvent } from './InteractionData';\nimport { InteractionEvent, InteractionCallback } from './InteractionEvent';\nimport { InteractionTrackingData } from './InteractionTrackingData';\nimport { TreeSearch } from './TreeSearch';\nimport { EventEmitter } from '@pixi/utils';\nimport { interactiveTarget } from './interactiveTarget';\n\nimport type { AbstractRenderer } from '@pixi/core';\nimport type { Point, IPointData } from '@pixi/math';\nimport type { Dict } from '@pixi/utils';\n\n// Mix interactiveTarget into DisplayObject.prototype\nDisplayObject.mixin(interactiveTarget);\n\nconst MOUSE_POINTER_ID = 1;\n\n// Mock interface for hitTestEvent - only used inside hitTest()\ninterface TestInteractionEvent\n{\n target: DisplayObject;\n data: {global: Point};\n}\n\n// helpers for hitTest() - only used inside hitTest()\nconst hitTestEvent: TestInteractionEvent = {\n target: null,\n data: {\n global: null,\n },\n};\n\nexport interface InteractionManagerOptions {\n autoPreventDefault?: boolean;\n interactionFrequency?: number;\n useSystemTicker?: boolean;\n}\n\nexport interface DelayedEvent {\n displayObject: DisplayObject;\n eventString: string;\n eventData: InteractionEvent;\n}\n\ninterface CrossCSSStyleDeclaration extends CSSStyleDeclaration\n{\n msContentZooming: string;\n msTouchAction: string;\n}\n\n/**\n * The interaction manager deals with mouse, touch and pointer events.\n *\n * Any DisplayObject can be interactive if its `interactive` property is set to true.\n *\n * This manager also supports multitouch.\n *\n * An instance of this class is automatically created by default, and can be found at `renderer.plugins.interaction`\n *\n * @class\n * @extends PIXI.utils.EventEmitter\n * @memberof PIXI\n */\nexport class InteractionManager extends EventEmitter\n{\n public readonly activeInteractionData: { [key: number]: InteractionData };\n public readonly supportsTouchEvents: boolean;\n public readonly supportsPointerEvents: boolean;\n public interactionDataPool: InteractionData[];\n public cursor: string;\n public delayedEvents: DelayedEvent[];\n public search: TreeSearch;\n public renderer: AbstractRenderer;\n public autoPreventDefault: boolean;\n public interactionFrequency: number;\n public mouse: InteractionData;\n public eventData: InteractionEvent;\n public moveWhenInside: boolean;\n public cursorStyles: Dict void) | CSSStyleDeclaration>;\n public currentCursorMode: string;\n public resolution: number;\n\n protected interactionDOMElement: HTMLElement;\n protected eventsAdded: boolean;\n protected tickerAdded: boolean;\n protected mouseOverRenderer: boolean;\n\n private _useSystemTicker: boolean;\n private _deltaTime: number;\n private _didMove: boolean;\n private _tempDisplayObject: DisplayObject;\n private readonly _eventListenerOptions: { capture: true, passive: false };\n\n /**\n * @param {PIXI.CanvasRenderer|PIXI.Renderer} renderer - A reference to the current renderer\n * @param {object} [options] - The options for the manager.\n * @param {boolean} [options.autoPreventDefault=true] - Should the manager automatically prevent default browser actions.\n * @param {number} [options.interactionFrequency=10] - Maximum frequency (ms) at pointer over/out states will be checked.\n * @param {number} [options.useSystemTicker=true] - Whether to add {@link tickerUpdate} to {@link PIXI.Ticker.system}.\n */\n constructor(renderer: AbstractRenderer, options?: InteractionManagerOptions)\n {\n super();\n\n options = options || {};\n\n /**\n * The renderer this interaction manager works for.\n *\n * @member {PIXI.AbstractRenderer}\n */\n this.renderer = renderer;\n\n /**\n * Should default browser actions automatically be prevented.\n * Does not apply to pointer events for backwards compatibility\n * preventDefault on pointer events stops mouse events from firing\n * Thus, for every pointer event, there will always be either a mouse of touch event alongside it.\n *\n * @member {boolean}\n * @default true\n */\n this.autoPreventDefault = options.autoPreventDefault !== undefined ? options.autoPreventDefault : true;\n\n /**\n * Maximum frequency in milliseconds at which pointer over/out states will be checked by {@link tickerUpdate}.\n *\n * @member {number}\n * @default 10\n */\n this.interactionFrequency = options.interactionFrequency || 10;\n\n /**\n * The mouse data\n *\n * @member {PIXI.InteractionData}\n */\n this.mouse = new InteractionData();\n this.mouse.identifier = MOUSE_POINTER_ID;\n\n // setting the mouse to start off far off screen will mean that mouse over does\n // not get called before we even move the mouse.\n this.mouse.global.set(-999999);\n\n /**\n * Actively tracked InteractionData\n *\n * @private\n * @member {Object.}\n */\n this.activeInteractionData = {};\n this.activeInteractionData[MOUSE_POINTER_ID] = this.mouse;\n\n /**\n * Pool of unused InteractionData\n *\n * @private\n * @member {PIXI.InteractionData[]}\n */\n this.interactionDataPool = [];\n\n /**\n * An event data object to handle all the event tracking/dispatching\n *\n * @member {object}\n */\n this.eventData = new InteractionEvent();\n\n /**\n * The DOM element to bind to.\n *\n * @protected\n * @member {HTMLElement}\n */\n this.interactionDOMElement = null;\n\n /**\n * This property determines if mousemove and touchmove events are fired only when the cursor\n * is over the object.\n * Setting to true will make things work more in line with how the DOM version works.\n * Setting to false can make things easier for things like dragging\n * It is currently set to false as this is how PixiJS used to work. This will be set to true in\n * future versions of pixi.\n *\n * @member {boolean}\n * @default false\n */\n this.moveWhenInside = false;\n\n /**\n * Have events been attached to the dom element?\n *\n * @protected\n * @member {boolean}\n */\n this.eventsAdded = false;\n\n /**\n * Has the system ticker been added?\n *\n * @protected\n * @member {boolean}\n */\n this.tickerAdded = false;\n\n /**\n * Is the mouse hovering over the renderer? If working in worker mouse considered to be over renderer by default.\n *\n * @protected\n * @member {boolean}\n */\n this.mouseOverRenderer = !('PointerEvent' in self);\n\n /**\n * Does the device support touch events\n * https://www.w3.org/TR/touch-events/\n *\n * @readonly\n * @member {boolean}\n */\n this.supportsTouchEvents = 'ontouchstart' in self;\n\n /**\n * Does the device support pointer events\n * https://www.w3.org/Submission/pointer-events/\n *\n * @readonly\n * @member {boolean}\n */\n this.supportsPointerEvents = !!self.PointerEvent;\n\n // this will make it so that you don't have to call bind all the time\n\n /**\n * @private\n * @member {Function}\n */\n this.onPointerUp = this.onPointerUp.bind(this);\n this.processPointerUp = this.processPointerUp.bind(this);\n\n /**\n * @private\n * @member {Function}\n */\n this.onPointerCancel = this.onPointerCancel.bind(this);\n this.processPointerCancel = this.processPointerCancel.bind(this);\n\n /**\n * @private\n * @member {Function}\n */\n this.onPointerDown = this.onPointerDown.bind(this);\n this.processPointerDown = this.processPointerDown.bind(this);\n\n /**\n * @private\n * @member {Function}\n */\n this.onPointerMove = this.onPointerMove.bind(this);\n this.processPointerMove = this.processPointerMove.bind(this);\n\n /**\n * @private\n * @member {Function}\n */\n this.onPointerOut = this.onPointerOut.bind(this);\n this.processPointerOverOut = this.processPointerOverOut.bind(this);\n\n /**\n * @private\n * @member {Function}\n */\n this.onPointerOver = this.onPointerOver.bind(this);\n\n /**\n * Dictionary of how different cursor modes are handled. Strings are handled as CSS cursor\n * values, objects are handled as dictionaries of CSS values for interactionDOMElement,\n * and functions are called instead of changing the CSS.\n * Default CSS cursor values are provided for 'default' and 'pointer' modes.\n * @member {Object.}\n */\n this.cursorStyles = {\n default: 'inherit',\n pointer: 'pointer',\n };\n\n /**\n * The mode of the cursor that is being used.\n * The value of this is a key from the cursorStyles dictionary.\n *\n * @member {string}\n */\n this.currentCursorMode = null;\n\n /**\n * Internal cached let.\n *\n * @private\n * @member {string}\n */\n this.cursor = null;\n\n /**\n * The current resolution / device pixel ratio.\n *\n * @member {number}\n * @default 1\n */\n this.resolution = 1;\n\n /**\n * Delayed pointer events. Used to guarantee correct ordering of over/out events.\n *\n * @private\n * @member {Array}\n */\n this.delayedEvents = [];\n\n /**\n * TreeSearch component that is used to hitTest stage tree\n *\n * @private\n * @member {PIXI.TreeSearch}\n */\n this.search = new TreeSearch();\n\n /**\n * Used as a last rendered object in case renderer doesnt have _lastObjectRendered\n * @member {DisplayObject}\n * @private\n */\n this._tempDisplayObject = new TemporaryDisplayObject();\n\n /**\n * An options object specifies characteristics about the event listener.\n * @private\n * @readonly\n * @member {Object.}\n */\n this._eventListenerOptions = { capture: true, passive: false };\n\n /**\n * Fired when a pointer device button (usually a mouse left-button) is pressed on the display\n * object.\n *\n * @event PIXI.InteractionManager#mousedown\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device secondary button (usually a mouse right-button) is pressed\n * on the display object.\n *\n * @event PIXI.InteractionManager#rightdown\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device button (usually a mouse left-button) is released over the display\n * object.\n *\n * @event PIXI.InteractionManager#mouseup\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device secondary button (usually a mouse right-button) is released\n * over the display object.\n *\n * @event PIXI.InteractionManager#rightup\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device button (usually a mouse left-button) is pressed and released on\n * the display object.\n *\n * @event PIXI.InteractionManager#click\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device secondary button (usually a mouse right-button) is pressed\n * and released on the display object.\n *\n * @event PIXI.InteractionManager#rightclick\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device button (usually a mouse left-button) is released outside the\n * display object that initially registered a\n * [mousedown]{@link PIXI.InteractionManager#event:mousedown}.\n *\n * @event PIXI.InteractionManager#mouseupoutside\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device secondary button (usually a mouse right-button) is released\n * outside the display object that initially registered a\n * [rightdown]{@link PIXI.InteractionManager#event:rightdown}.\n *\n * @event PIXI.InteractionManager#rightupoutside\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device (usually a mouse) is moved while over the display object\n *\n * @event PIXI.InteractionManager#mousemove\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device (usually a mouse) is moved onto the display object\n *\n * @event PIXI.InteractionManager#mouseover\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device (usually a mouse) is moved off the display object\n *\n * @event PIXI.InteractionManager#mouseout\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device button is pressed on the display object.\n *\n * @event PIXI.InteractionManager#pointerdown\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device button is released over the display object.\n * Not always fired when some buttons are held down while others are released. In those cases,\n * use [mousedown]{@link PIXI.InteractionManager#event:mousedown} and\n * [mouseup]{@link PIXI.InteractionManager#event:mouseup} instead.\n *\n * @event PIXI.InteractionManager#pointerup\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when the operating system cancels a pointer event\n *\n * @event PIXI.InteractionManager#pointercancel\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device button is pressed and released on the display object.\n *\n * @event PIXI.InteractionManager#pointertap\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device button is released outside the display object that initially\n * registered a [pointerdown]{@link PIXI.InteractionManager#event:pointerdown}.\n *\n * @event PIXI.InteractionManager#pointerupoutside\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device is moved while over the display object\n *\n * @event PIXI.InteractionManager#pointermove\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device is moved onto the display object\n *\n * @event PIXI.InteractionManager#pointerover\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device is moved off the display object\n *\n * @event PIXI.InteractionManager#pointerout\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a touch point is placed on the display object.\n *\n * @event PIXI.InteractionManager#touchstart\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a touch point is removed from the display object.\n *\n * @event PIXI.InteractionManager#touchend\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when the operating system cancels a touch\n *\n * @event PIXI.InteractionManager#touchcancel\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a touch point is placed and removed from the display object.\n *\n * @event PIXI.InteractionManager#tap\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a touch point is removed outside of the display object that initially\n * registered a [touchstart]{@link PIXI.InteractionManager#event:touchstart}.\n *\n * @event PIXI.InteractionManager#touchendoutside\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a touch point is moved along the display object.\n *\n * @event PIXI.InteractionManager#touchmove\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device button (usually a mouse left-button) is pressed on the display.\n * object. DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#mousedown\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device secondary button (usually a mouse right-button) is pressed\n * on the display object. DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#rightdown\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device button (usually a mouse left-button) is released over the display\n * object. DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#mouseup\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device secondary button (usually a mouse right-button) is released\n * over the display object. DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#rightup\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device button (usually a mouse left-button) is pressed and released on\n * the display object. DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#click\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device secondary button (usually a mouse right-button) is pressed\n * and released on the display object. DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#rightclick\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device button (usually a mouse left-button) is released outside the\n * display object that initially registered a\n * [mousedown]{@link PIXI.DisplayObject#event:mousedown}.\n * DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#mouseupoutside\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device secondary button (usually a mouse right-button) is released\n * outside the display object that initially registered a\n * [rightdown]{@link PIXI.DisplayObject#event:rightdown}.\n * DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#rightupoutside\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device (usually a mouse) is moved while over the display object.\n * DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#mousemove\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device (usually a mouse) is moved onto the display object.\n * DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#mouseover\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device (usually a mouse) is moved off the display object.\n * DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#mouseout\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device button is pressed on the display object.\n * DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#pointerdown\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device button is released over the display object.\n * DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#pointerup\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when the operating system cancels a pointer event.\n * DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#pointercancel\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device button is pressed and released on the display object.\n * DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#pointertap\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device button is released outside the display object that initially\n * registered a [pointerdown]{@link PIXI.DisplayObject#event:pointerdown}.\n * DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#pointerupoutside\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device is moved while over the display object.\n * DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#pointermove\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device is moved onto the display object.\n * DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#pointerover\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a pointer device is moved off the display object.\n * DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#pointerout\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a touch point is placed on the display object.\n * DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#touchstart\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a touch point is removed from the display object.\n * DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#touchend\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when the operating system cancels a touch.\n * DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#touchcancel\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a touch point is placed and removed from the display object.\n * DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#tap\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a touch point is removed outside of the display object that initially\n * registered a [touchstart]{@link PIXI.DisplayObject#event:touchstart}.\n * DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#touchendoutside\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n /**\n * Fired when a touch point is moved along the display object.\n * DisplayObject's `interactive` property must be set to `true` to fire event.\n *\n * This comes from the @pixi/interaction package.\n *\n * @event PIXI.DisplayObject#touchmove\n * @param {PIXI.InteractionEvent} event - Interaction event\n */\n\n this._useSystemTicker = options.useSystemTicker !== undefined ? options.useSystemTicker : true;\n\n this.setTargetElement(this.renderer.view, this.renderer.resolution);\n }\n\n /**\n * Should the InteractionManager automatically add {@link tickerUpdate} to {@link PIXI.Ticker.system}.\n *\n * @member {boolean}\n * @default true\n */\n get useSystemTicker(): boolean\n {\n return this._useSystemTicker;\n }\n set useSystemTicker(useSystemTicker: boolean)\n {\n this._useSystemTicker = useSystemTicker;\n\n if (useSystemTicker)\n {\n this.addTickerListener();\n }\n else\n {\n this.removeTickerListener();\n }\n }\n\n /**\n * Last rendered object or temp object\n * @readonly\n * @protected\n * @member {PIXI.DisplayObject}\n */\n get lastObjectRendered(): DisplayObject\n {\n return (this.renderer._lastObjectRendered as DisplayObject) || this._tempDisplayObject;\n }\n\n /**\n * Hit tests a point against the display tree, returning the first interactive object that is hit.\n *\n * @param {PIXI.Point} globalPoint - A point to hit test with, in global space.\n * @param {PIXI.Container} [root] - The root display object to start from. If omitted, defaults\n * to the last rendered root of the associated renderer.\n * @return {PIXI.DisplayObject} The hit display object, if any.\n */\n public hitTest(globalPoint: Point, root?: DisplayObject): DisplayObject\n {\n // clear the target for our hit test\n hitTestEvent.target = null;\n // assign the global point\n hitTestEvent.data.global = globalPoint;\n // ensure safety of the root\n if (!root)\n {\n root = this.lastObjectRendered;\n }\n // run the hit test\n this.processInteractive(hitTestEvent as InteractionEvent, root, null, true);\n // return our found object - it'll be null if we didn't hit anything\n\n return hitTestEvent.target;\n }\n\n /**\n * Sets the DOM element which will receive mouse/touch events. This is useful for when you have\n * other DOM elements on top of the renderers Canvas element. With this you'll be bale to delegate\n * another DOM element to receive those events.\n *\n * @param {HTMLElement} element - the DOM element which will receive mouse and touch events.\n * @param {number} [resolution=1] - The resolution / device pixel ratio of the new element (relative to the canvas).\n */\n public setTargetElement(element: HTMLElement, resolution = 1): void\n {\n this.removeTickerListener();\n\n this.removeEvents();\n\n this.interactionDOMElement = element;\n\n this.resolution = resolution;\n\n this.addEvents();\n\n this.addTickerListener();\n }\n\n /**\n * Add the ticker listener\n *\n * @private\n */\n private addTickerListener(): void\n {\n if (this.tickerAdded || !this.interactionDOMElement || !this._useSystemTicker)\n {\n return;\n }\n\n Ticker.system.add(this.tickerUpdate, this, UPDATE_PRIORITY.INTERACTION);\n\n this.tickerAdded = true;\n }\n\n /**\n * Remove the ticker listener\n *\n * @private\n */\n private removeTickerListener(): void\n {\n if (!this.tickerAdded)\n {\n return;\n }\n\n Ticker.system.remove(this.tickerUpdate, this);\n\n this.tickerAdded = false;\n }\n\n /**\n * Registers all the DOM events\n *\n * @private\n */\n private addEvents(): void\n {\n if (this.eventsAdded || !this.interactionDOMElement)\n {\n return;\n }\n\n const style = this.interactionDOMElement.style as CrossCSSStyleDeclaration;\n\n if (self.navigator.msPointerEnabled)\n {\n style.msContentZooming = 'none';\n style.msTouchAction = 'none';\n }\n else if (this.supportsPointerEvents)\n {\n style.touchAction = 'none';\n }\n\n /*\n * These events are added first, so that if pointer events are normalized, they are fired\n * in the same order as non-normalized events. ie. pointer event 1st, mouse / touch 2nd\n */\n if (this.supportsPointerEvents)\n {\n self.document.addEventListener('pointermove', this.onPointerMove, this._eventListenerOptions);\n this.interactionDOMElement.addEventListener('pointerdown', this.onPointerDown, this._eventListenerOptions);\n // pointerout is fired in addition to pointerup (for touch events) and pointercancel\n // we already handle those, so for the purposes of what we do in onPointerOut, we only\n // care about the pointerleave event\n this.interactionDOMElement.addEventListener('pointerleave', this.onPointerOut, this._eventListenerOptions);\n this.interactionDOMElement.addEventListener('pointerover', this.onPointerOver, this._eventListenerOptions);\n self.addEventListener('pointercancel', this.onPointerCancel, this._eventListenerOptions);\n self.addEventListener('pointerup', this.onPointerUp, this._eventListenerOptions);\n }\n else\n {\n self.document.addEventListener('mousemove', this.onPointerMove, this._eventListenerOptions);\n this.interactionDOMElement.addEventListener('mousedown', this.onPointerDown, this._eventListenerOptions);\n this.interactionDOMElement.addEventListener('mouseout', this.onPointerOut, this._eventListenerOptions);\n this.interactionDOMElement.addEventListener('mouseover', this.onPointerOver, this._eventListenerOptions);\n self.addEventListener('mouseup', this.onPointerUp, this._eventListenerOptions);\n }\n\n // always look directly for touch events so that we can provide original data\n // In a future version we should change this to being just a fallback and rely solely on\n // PointerEvents whenever available\n if (this.supportsTouchEvents)\n {\n this.interactionDOMElement.addEventListener('touchstart', this.onPointerDown, this._eventListenerOptions);\n this.interactionDOMElement.addEventListener('touchcancel', this.onPointerCancel, this._eventListenerOptions);\n this.interactionDOMElement.addEventListener('touchend', this.onPointerUp, this._eventListenerOptions);\n this.interactionDOMElement.addEventListener('touchmove', this.onPointerMove, this._eventListenerOptions);\n }\n\n this.eventsAdded = true;\n }\n\n /**\n * Removes all the DOM events that were previously registered\n *\n * @private\n */\n private removeEvents(): void\n {\n if (!this.eventsAdded || !this.interactionDOMElement)\n {\n return;\n }\n\n const style = this.interactionDOMElement.style as CrossCSSStyleDeclaration;\n\n if (self.navigator.msPointerEnabled)\n {\n style.msContentZooming = '';\n style.msTouchAction = '';\n }\n else if (this.supportsPointerEvents)\n {\n style.touchAction = '';\n }\n\n if (this.supportsPointerEvents)\n {\n self.document.removeEventListener('pointermove', this.onPointerMove, this._eventListenerOptions);\n this.interactionDOMElement.removeEventListener('pointerdown', this.onPointerDown, this._eventListenerOptions);\n this.interactionDOMElement.removeEventListener('pointerleave', this.onPointerOut, this._eventListenerOptions);\n this.interactionDOMElement.removeEventListener('pointerover', this.onPointerOver, this._eventListenerOptions);\n self.removeEventListener('pointercancel', this.onPointerCancel, this._eventListenerOptions);\n self.removeEventListener('pointerup', this.onPointerUp, this._eventListenerOptions);\n }\n else\n {\n self.document.removeEventListener('mousemove', this.onPointerMove, this._eventListenerOptions);\n this.interactionDOMElement.removeEventListener('mousedown', this.onPointerDown, this._eventListenerOptions);\n this.interactionDOMElement.removeEventListener('mouseout', this.onPointerOut, this._eventListenerOptions);\n this.interactionDOMElement.removeEventListener('mouseover', this.onPointerOver, this._eventListenerOptions);\n self.removeEventListener('mouseup', this.onPointerUp, this._eventListenerOptions);\n }\n\n if (this.supportsTouchEvents)\n {\n this.interactionDOMElement.removeEventListener('touchstart', this.onPointerDown, this._eventListenerOptions);\n this.interactionDOMElement.removeEventListener('touchcancel', this.onPointerCancel, this._eventListenerOptions);\n this.interactionDOMElement.removeEventListener('touchend', this.onPointerUp, this._eventListenerOptions);\n this.interactionDOMElement.removeEventListener('touchmove', this.onPointerMove, this._eventListenerOptions);\n }\n\n this.interactionDOMElement = null;\n\n this.eventsAdded = false;\n }\n\n /**\n * Updates the state of interactive objects if at least {@link interactionFrequency}\n * milliseconds have passed since the last invocation.\n *\n * Invoked by a throttled ticker update from {@link PIXI.Ticker.system}.\n *\n * @param {number} deltaTime - time delta since the last call\n */\n public tickerUpdate(deltaTime: number): void\n {\n this._deltaTime += deltaTime;\n\n if (this._deltaTime < this.interactionFrequency)\n {\n return;\n }\n\n this._deltaTime = 0;\n\n this.update();\n }\n\n /**\n * Updates the state of interactive objects.\n */\n public update(): void\n {\n if (!this.interactionDOMElement)\n {\n return;\n }\n\n // if the user move the mouse this check has already been done using the mouse move!\n if (this._didMove)\n {\n this._didMove = false;\n\n return;\n }\n\n this.cursor = null;\n\n // Resets the flag as set by a stopPropagation call. This flag is usually reset by a user interaction of any kind,\n // but there was a scenario of a display object moving under a static mouse cursor.\n // In this case, mouseover and mouseevents would not pass the flag test in dispatchEvent function\n for (const k in this.activeInteractionData)\n {\n // eslint-disable-next-line no-prototype-builtins\n if (this.activeInteractionData.hasOwnProperty(k))\n {\n const interactionData = this.activeInteractionData[k];\n\n if (interactionData.originalEvent && interactionData.pointerType !== 'touch')\n {\n const interactionEvent = this.configureInteractionEventForDOMEvent(\n this.eventData,\n interactionData.originalEvent as PointerEvent,\n interactionData\n );\n\n this.processInteractive(\n interactionEvent,\n this.lastObjectRendered,\n this.processPointerOverOut,\n true\n );\n }\n }\n }\n\n this.setCursorMode(this.cursor);\n }\n\n /**\n * Sets the current cursor mode, handling any callbacks or CSS style changes.\n *\n * @param {string} mode - cursor mode, a key from the cursorStyles dictionary\n */\n public setCursorMode(mode: string): void\n {\n mode = mode || 'default';\n let applyStyles = true;\n\n // offscreen canvas does not support setting styles, but cursor modes can be functions,\n // in order to handle pixi rendered cursors, so we can't bail\n if (self.OffscreenCanvas && this.interactionDOMElement instanceof OffscreenCanvas)\n {\n applyStyles = false;\n }\n // if the mode didn't actually change, bail early\n if (this.currentCursorMode === mode)\n {\n return;\n }\n this.currentCursorMode = mode;\n const style = this.cursorStyles[mode];\n\n // only do things if there is a cursor style for it\n if (style)\n {\n switch (typeof style)\n {\n case 'string':\n // string styles are handled as cursor CSS\n if (applyStyles)\n {\n this.interactionDOMElement.style.cursor = style;\n }\n break;\n case 'function':\n // functions are just called, and passed the cursor mode\n style(mode);\n break;\n case 'object':\n // if it is an object, assume that it is a dictionary of CSS styles,\n // apply it to the interactionDOMElement\n if (applyStyles)\n {\n Object.assign(this.interactionDOMElement.style, style);\n }\n break;\n }\n }\n else if (applyStyles && typeof mode === 'string' && !Object.prototype.hasOwnProperty.call(this.cursorStyles, mode))\n {\n // if it mode is a string (not a Symbol) and cursorStyles doesn't have any entry\n // for the mode, then assume that the dev wants it to be CSS for the cursor.\n this.interactionDOMElement.style.cursor = mode;\n }\n }\n\n /**\n * Dispatches an event on the display object that was interacted with\n *\n * @param {PIXI.Container|PIXI.Sprite|PIXI.TilingSprite} displayObject - the display object in question\n * @param {string} eventString - the name of the event (e.g, mousedown)\n * @param {PIXI.InteractionEvent} eventData - the event data object\n * @private\n */\n private dispatchEvent(displayObject: DisplayObject, eventString: string, eventData: InteractionEvent): void\n {\n // Even if the event was stopped, at least dispatch any remaining events\n // for the same display object.\n if (!eventData.stopPropagationHint || displayObject === eventData.stopsPropagatingAt)\n {\n eventData.currentTarget = displayObject;\n eventData.type = eventString;\n\n displayObject.emit(eventString, eventData);\n\n if ((displayObject as any)[eventString])\n {\n (displayObject as any)[eventString](eventData);\n }\n }\n }\n\n /**\n * Puts a event on a queue to be dispatched later. This is used to guarantee correct\n * ordering of over/out events.\n *\n * @param {PIXI.Container|PIXI.Sprite|PIXI.TilingSprite} displayObject - the display object in question\n * @param {string} eventString - the name of the event (e.g, mousedown)\n * @param {object} eventData - the event data object\n * @private\n */\n private delayDispatchEvent(displayObject: DisplayObject, eventString: string, eventData: InteractionEvent): void\n {\n this.delayedEvents.push({ displayObject, eventString, eventData });\n }\n\n /**\n * Maps x and y coords from a DOM object and maps them correctly to the PixiJS view. The\n * resulting value is stored in the point. This takes into account the fact that the DOM\n * element could be scaled and positioned anywhere on the screen.\n *\n * @param {PIXI.IPointData} point - the point that the result will be stored in\n * @param {number} x - the x coord of the position to map\n * @param {number} y - the y coord of the position to map\n */\n public mapPositionToPoint(point: IPointData, x: number, y: number): void\n {\n let rect;\n\n // IE 11 fix\n if (!this.interactionDOMElement.parentElement)\n {\n rect = {\n x: 0,\n y: 0,\n width: (this.interactionDOMElement as any).width,\n height: (this.interactionDOMElement as any).height,\n left: 0,\n top: 0\n };\n }\n else\n {\n rect = this.interactionDOMElement.getBoundingClientRect();\n }\n\n const resolutionMultiplier = 1.0 / this.resolution;\n\n point.x = ((x - rect.left) * ((this.interactionDOMElement as any).width / rect.width)) * resolutionMultiplier;\n point.y = ((y - rect.top) * ((this.interactionDOMElement as any).height / rect.height)) * resolutionMultiplier;\n }\n\n /**\n * This function is provides a neat way of crawling through the scene graph and running a\n * specified function on all interactive objects it finds. It will also take care of hit\n * testing the interactive objects and passes the hit across in the function.\n *\n * @protected\n * @param {PIXI.InteractionEvent} interactionEvent - event containing the point that\n * is tested for collision\n * @param {PIXI.Container|PIXI.Sprite|PIXI.TilingSprite} displayObject - the displayObject\n * that will be hit test (recursively crawls its children)\n * @param {Function} [func] - the function that will be called on each interactive object. The\n * interactionEvent, displayObject and hit will be passed to the function\n * @param {boolean} [hitTest] - indicates whether we want to calculate hits\n * or just iterate through all interactive objects\n */\n public processInteractive(interactionEvent: InteractionEvent, displayObject: DisplayObject,\n func?: InteractionCallback, hitTest?: boolean\n ): void\n {\n const hit = this.search.findHit(interactionEvent, displayObject, func, hitTest);\n\n const delayedEvents = this.delayedEvents;\n\n if (!delayedEvents.length)\n {\n return hit;\n }\n // Reset the propagation hint, because we start deeper in the tree again.\n interactionEvent.stopPropagationHint = false;\n\n const delayedLen = delayedEvents.length;\n\n this.delayedEvents = [];\n\n for (let i = 0; i < delayedLen; i++)\n {\n const { displayObject, eventString, eventData } = delayedEvents[i];\n\n // When we reach the object we wanted to stop propagating at,\n // set the propagation hint.\n if (eventData.stopsPropagatingAt === displayObject)\n {\n eventData.stopPropagationHint = true;\n }\n\n this.dispatchEvent(displayObject, eventString, eventData);\n }\n\n return hit;\n }\n\n /**\n * Is called when the pointer button is pressed down on the renderer element\n *\n * @private\n * @param {PointerEvent} originalEvent - The DOM event of a pointer button being pressed down\n */\n private onPointerDown(originalEvent: InteractivePointerEvent): void\n {\n // if we support touch events, then only use those for touch events, not pointer events\n if (this.supportsTouchEvents && (originalEvent as PointerEvent).pointerType === 'touch') return;\n\n const events = this.normalizeToPointerData(originalEvent);\n\n /*\n * No need to prevent default on natural pointer events, as there are no side effects\n * Normalized events, however, may have the double mousedown/touchstart issue on the native android browser,\n * so still need to be prevented.\n */\n\n // Guaranteed that there will be at least one event in events, and all events must have the same pointer type\n\n if (this.autoPreventDefault && (events[0] as any).isNormalized)\n {\n const cancelable = originalEvent.cancelable || !('cancelable' in originalEvent);\n\n if (cancelable)\n {\n originalEvent.preventDefault();\n }\n }\n\n const eventLen = events.length;\n\n for (let i = 0; i < eventLen; i++)\n {\n const event = events[i];\n\n const interactionData = this.getInteractionDataForPointerId(event);\n\n const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData);\n\n interactionEvent.data.originalEvent = originalEvent;\n\n this.processInteractive(interactionEvent, this.lastObjectRendered, this.processPointerDown, true);\n\n this.emit('pointerdown', interactionEvent);\n if (event.pointerType === 'touch')\n {\n this.emit('touchstart', interactionEvent);\n }\n // emit a mouse event for \"pen\" pointers, the way a browser would emit a fallback event\n else if (event.pointerType === 'mouse' || event.pointerType === 'pen')\n {\n const isRightButton = event.button === 2;\n\n this.emit(isRightButton ? 'rightdown' : 'mousedown', this.eventData);\n }\n }\n }\n\n /**\n * Processes the result of the pointer down check and dispatches the event if need be\n *\n * @private\n * @param {PIXI.InteractionEvent} interactionEvent - The interaction event wrapping the DOM event\n * @param {PIXI.Container|PIXI.Sprite|PIXI.TilingSprite} displayObject - The display object that was tested\n * @param {boolean} hit - the result of the hit test on the display object\n */\n private processPointerDown(interactionEvent: InteractionEvent, displayObject: DisplayObject, hit: boolean): void\n {\n const data = interactionEvent.data;\n const id = interactionEvent.data.identifier;\n\n if (hit)\n {\n if (!displayObject.trackedPointers[id])\n {\n displayObject.trackedPointers[id] = new InteractionTrackingData(id);\n }\n this.dispatchEvent(displayObject, 'pointerdown', interactionEvent);\n\n if (data.pointerType === 'touch')\n {\n this.dispatchEvent(displayObject, 'touchstart', interactionEvent);\n }\n else if (data.pointerType === 'mouse' || data.pointerType === 'pen')\n {\n const isRightButton = data.button === 2;\n\n if (isRightButton)\n {\n displayObject.trackedPointers[id].rightDown = true;\n }\n else\n {\n displayObject.trackedPointers[id].leftDown = true;\n }\n\n this.dispatchEvent(displayObject, isRightButton ? 'rightdown' : 'mousedown', interactionEvent);\n }\n }\n }\n\n /**\n * Is called when the pointer button is released on the renderer element\n *\n * @private\n * @param {PointerEvent} originalEvent - The DOM event of a pointer button being released\n * @param {boolean} cancelled - true if the pointer is cancelled\n * @param {Function} func - Function passed to {@link processInteractive}\n */\n private onPointerComplete(originalEvent: InteractivePointerEvent, cancelled: boolean, func: InteractionCallback): void\n {\n const events = this.normalizeToPointerData(originalEvent);\n\n const eventLen = events.length;\n\n // if the event wasn't targeting our canvas, then consider it to be pointerupoutside\n // in all cases (unless it was a pointercancel)\n const eventAppend = originalEvent.target !== this.interactionDOMElement ? 'outside' : '';\n\n for (let i = 0; i < eventLen; i++)\n {\n const event = events[i];\n\n const interactionData = this.getInteractionDataForPointerId(event);\n\n const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData);\n\n interactionEvent.data.originalEvent = originalEvent;\n\n // perform hit testing for events targeting our canvas or cancel events\n this.processInteractive(interactionEvent, this.lastObjectRendered, func, cancelled || !eventAppend);\n\n this.emit(cancelled ? 'pointercancel' : `pointerup${eventAppend}`, interactionEvent);\n\n if (event.pointerType === 'mouse' || event.pointerType === 'pen')\n {\n const isRightButton = event.button === 2;\n\n this.emit(isRightButton ? `rightup${eventAppend}` : `mouseup${eventAppend}`, interactionEvent);\n }\n else if (event.pointerType === 'touch')\n {\n this.emit(cancelled ? 'touchcancel' : `touchend${eventAppend}`, interactionEvent);\n this.releaseInteractionDataForPointerId(event.pointerId);\n }\n }\n }\n\n /**\n * Is called when the pointer button is cancelled\n *\n * @private\n * @param {PointerEvent} event - The DOM event of a pointer button being released\n */\n private onPointerCancel(event: InteractivePointerEvent): void\n {\n // if we support touch events, then only use those for touch events, not pointer events\n if (this.supportsTouchEvents && (event as PointerEvent).pointerType === 'touch') return;\n\n this.onPointerComplete(event, true, this.processPointerCancel);\n }\n\n /**\n * Processes the result of the pointer cancel check and dispatches the event if need be\n *\n * @private\n * @param {PIXI.InteractionEvent} interactionEvent - The interaction event wrapping the DOM event\n * @param {PIXI.Container|PIXI.Sprite|PIXI.TilingSprite} displayObject - The display object that was tested\n */\n private processPointerCancel(interactionEvent: InteractionEvent, displayObject: DisplayObject): void\n {\n const data = interactionEvent.data;\n\n const id = interactionEvent.data.identifier;\n\n if (displayObject.trackedPointers[id] !== undefined)\n {\n delete displayObject.trackedPointers[id];\n this.dispatchEvent(displayObject, 'pointercancel', interactionEvent);\n\n if (data.pointerType === 'touch')\n {\n this.dispatchEvent(displayObject, 'touchcancel', interactionEvent);\n }\n }\n }\n\n /**\n * Is called when the pointer button is released on the renderer element\n *\n * @private\n * @param {PointerEvent} event - The DOM event of a pointer button being released\n */\n private onPointerUp(event: InteractivePointerEvent): void\n {\n // if we support touch events, then only use those for touch events, not pointer events\n if (this.supportsTouchEvents && (event as PointerEvent).pointerType === 'touch') return;\n\n this.onPointerComplete(event, false, this.processPointerUp);\n }\n\n /**\n * Processes the result of the pointer up check and dispatches the event if need be\n *\n * @private\n * @param {PIXI.InteractionEvent} interactionEvent - The interaction event wrapping the DOM event\n * @param {PIXI.Container|PIXI.Sprite|PIXI.TilingSprite} displayObject - The display object that was tested\n * @param {boolean} hit - the result of the hit test on the display object\n */\n private processPointerUp(interactionEvent: InteractionEvent, displayObject: DisplayObject, hit: boolean): void\n {\n const data = interactionEvent.data;\n\n const id = interactionEvent.data.identifier;\n\n const trackingData = displayObject.trackedPointers[id];\n\n const isTouch = data.pointerType === 'touch';\n\n const isMouse = (data.pointerType === 'mouse' || data.pointerType === 'pen');\n // need to track mouse down status in the mouse block so that we can emit\n // event in a later block\n let isMouseTap = false;\n\n // Mouse only\n if (isMouse)\n {\n const isRightButton = data.button === 2;\n\n const flags = InteractionTrackingData.FLAGS;\n\n const test = isRightButton ? flags.RIGHT_DOWN : flags.LEFT_DOWN;\n\n const isDown = trackingData !== undefined && (trackingData.flags & test);\n\n if (hit)\n {\n this.dispatchEvent(displayObject, isRightButton ? 'rightup' : 'mouseup', interactionEvent);\n\n if (isDown)\n {\n this.dispatchEvent(displayObject, isRightButton ? 'rightclick' : 'click', interactionEvent);\n // because we can confirm that the mousedown happened on this object, flag for later emit of pointertap\n isMouseTap = true;\n }\n }\n else if (isDown)\n {\n this.dispatchEvent(displayObject, isRightButton ? 'rightupoutside' : 'mouseupoutside', interactionEvent);\n }\n // update the down state of the tracking data\n if (trackingData)\n {\n if (isRightButton)\n {\n trackingData.rightDown = false;\n }\n else\n {\n trackingData.leftDown = false;\n }\n }\n }\n\n // Pointers and Touches, and Mouse\n if (hit)\n {\n this.dispatchEvent(displayObject, 'pointerup', interactionEvent);\n if (isTouch) this.dispatchEvent(displayObject, 'touchend', interactionEvent);\n\n if (trackingData)\n {\n // emit pointertap if not a mouse, or if the mouse block decided it was a tap\n if (!isMouse || isMouseTap)\n {\n this.dispatchEvent(displayObject, 'pointertap', interactionEvent);\n }\n if (isTouch)\n {\n this.dispatchEvent(displayObject, 'tap', interactionEvent);\n // touches are no longer over (if they ever were) when we get the touchend\n // so we should ensure that we don't keep pretending that they are\n trackingData.over = false;\n }\n }\n }\n else if (trackingData)\n {\n this.dispatchEvent(displayObject, 'pointerupoutside', interactionEvent);\n if (isTouch) this.dispatchEvent(displayObject, 'touchendoutside', interactionEvent);\n }\n // Only remove the tracking data if there is no over/down state still associated with it\n if (trackingData && trackingData.none)\n {\n delete displayObject.trackedPointers[id];\n }\n }\n\n /**\n * Is called when the pointer moves across the renderer element\n *\n * @private\n * @param {PointerEvent} originalEvent - The DOM event of a pointer moving\n */\n private onPointerMove(originalEvent: InteractivePointerEvent): void\n {\n // if we support touch events, then only use those for touch events, not pointer events\n if (this.supportsTouchEvents && (originalEvent as PointerEvent).pointerType === 'touch') return;\n\n const events = this.normalizeToPointerData(originalEvent);\n\n if (events[0].pointerType === 'mouse' || events[0].pointerType === 'pen')\n {\n this._didMove = true;\n\n this.cursor = null;\n }\n\n const eventLen = events.length;\n\n for (let i = 0; i < eventLen; i++)\n {\n const event = events[i];\n\n const interactionData = this.getInteractionDataForPointerId(event);\n\n const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData);\n\n interactionEvent.data.originalEvent = originalEvent;\n\n this.processInteractive(interactionEvent, this.lastObjectRendered, this.processPointerMove, true);\n\n this.emit('pointermove', interactionEvent);\n if (event.pointerType === 'touch') this.emit('touchmove', interactionEvent);\n if (event.pointerType === 'mouse' || event.pointerType === 'pen') this.emit('mousemove', interactionEvent);\n }\n\n if (events[0].pointerType === 'mouse')\n {\n this.setCursorMode(this.cursor);\n\n // TODO BUG for parents interactive object (border order issue)\n }\n }\n\n /**\n * Processes the result of the pointer move check and dispatches the event if need be\n *\n * @private\n * @param {PIXI.InteractionEvent} interactionEvent - The interaction event wrapping the DOM event\n * @param {PIXI.Container|PIXI.Sprite|PIXI.TilingSprite} displayObject - The display object that was tested\n * @param {boolean} hit - the result of the hit test on the display object\n */\n private processPointerMove(interactionEvent: InteractionEvent, displayObject: DisplayObject, hit: boolean): void\n {\n const data = interactionEvent.data;\n\n const isTouch = data.pointerType === 'touch';\n\n const isMouse = (data.pointerType === 'mouse' || data.pointerType === 'pen');\n\n if (isMouse)\n {\n this.processPointerOverOut(interactionEvent, displayObject, hit);\n }\n\n if (!this.moveWhenInside || hit)\n {\n this.dispatchEvent(displayObject, 'pointermove', interactionEvent);\n if (isTouch) this.dispatchEvent(displayObject, 'touchmove', interactionEvent);\n if (isMouse) this.dispatchEvent(displayObject, 'mousemove', interactionEvent);\n }\n }\n\n /**\n * Is called when the pointer is moved out of the renderer element\n *\n * @private\n * @param {PointerEvent} originalEvent - The DOM event of a pointer being moved out\n */\n private onPointerOut(originalEvent: InteractivePointerEvent): void\n {\n // if we support touch events, then only use those for touch events, not pointer events\n if (this.supportsTouchEvents && (originalEvent as PointerEvent).pointerType === 'touch') return;\n\n const events = this.normalizeToPointerData(originalEvent);\n\n // Only mouse and pointer can call onPointerOut, so events will always be length 1\n const event = events[0];\n\n if (event.pointerType === 'mouse')\n {\n this.mouseOverRenderer = false;\n this.setCursorMode(null);\n }\n\n const interactionData = this.getInteractionDataForPointerId(event);\n\n const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData);\n\n interactionEvent.data.originalEvent = event;\n\n this.processInteractive(interactionEvent, this.lastObjectRendered, this.processPointerOverOut, false);\n\n this.emit('pointerout', interactionEvent);\n if (event.pointerType === 'mouse' || event.pointerType === 'pen')\n {\n this.emit('mouseout', interactionEvent);\n }\n else\n {\n // we can get touchleave events after touchend, so we want to make sure we don't\n // introduce memory leaks\n this.releaseInteractionDataForPointerId(interactionData.identifier);\n }\n }\n\n /**\n * Processes the result of the pointer over/out check and dispatches the event if need be\n *\n * @private\n * @param {PIXI.InteractionEvent} interactionEvent - The interaction event wrapping the DOM event\n * @param {PIXI.Container|PIXI.Sprite|PIXI.TilingSprite} displayObject - The display object that was tested\n * @param {boolean} hit - the result of the hit test on the display object\n */\n private processPointerOverOut(interactionEvent: InteractionEvent, displayObject: DisplayObject, hit: boolean): void\n {\n const data = interactionEvent.data;\n\n const id = interactionEvent.data.identifier;\n\n const isMouse = (data.pointerType === 'mouse' || data.pointerType === 'pen');\n\n let trackingData = displayObject.trackedPointers[id];\n\n // if we just moused over the display object, then we need to track that state\n if (hit && !trackingData)\n {\n trackingData = displayObject.trackedPointers[id] = new InteractionTrackingData(id);\n }\n\n if (trackingData === undefined) return;\n\n if (hit && this.mouseOverRenderer)\n {\n if (!trackingData.over)\n {\n trackingData.over = true;\n this.delayDispatchEvent(displayObject, 'pointerover', interactionEvent);\n if (isMouse)\n {\n this.delayDispatchEvent(displayObject, 'mouseover', interactionEvent);\n }\n }\n\n // only change the cursor if it has not already been changed (by something deeper in the\n // display tree)\n if (isMouse && this.cursor === null)\n {\n this.cursor = displayObject.cursor;\n }\n }\n else if (trackingData.over)\n {\n trackingData.over = false;\n this.dispatchEvent(displayObject, 'pointerout', this.eventData);\n if (isMouse)\n {\n this.dispatchEvent(displayObject, 'mouseout', interactionEvent);\n }\n // if there is no mouse down information for the pointer, then it is safe to delete\n if (trackingData.none)\n {\n delete displayObject.trackedPointers[id];\n }\n }\n }\n\n /**\n * Is called when the pointer is moved into the renderer element\n *\n * @private\n * @param {PointerEvent} originalEvent - The DOM event of a pointer button being moved into the renderer view\n */\n private onPointerOver(originalEvent: InteractivePointerEvent): void\n {\n const events = this.normalizeToPointerData(originalEvent);\n\n // Only mouse and pointer can call onPointerOver, so events will always be length 1\n const event = events[0];\n\n const interactionData = this.getInteractionDataForPointerId(event);\n\n const interactionEvent = this.configureInteractionEventForDOMEvent(this.eventData, event, interactionData);\n\n interactionEvent.data.originalEvent = event;\n\n if (event.pointerType === 'mouse')\n {\n this.mouseOverRenderer = true;\n }\n\n this.emit('pointerover', interactionEvent);\n if (event.pointerType === 'mouse' || event.pointerType === 'pen')\n {\n this.emit('mouseover', interactionEvent);\n }\n }\n\n /**\n * Get InteractionData for a given pointerId. Store that data as well\n *\n * @private\n * @param {PointerEvent} event - Normalized pointer event, output from normalizeToPointerData\n * @return {PIXI.InteractionData} - Interaction data for the given pointer identifier\n */\n private getInteractionDataForPointerId(event: PointerEvent): InteractionData\n {\n const pointerId = event.pointerId;\n\n let interactionData;\n\n if (pointerId === MOUSE_POINTER_ID || event.pointerType === 'mouse')\n {\n interactionData = this.mouse;\n }\n else if (this.activeInteractionData[pointerId])\n {\n interactionData = this.activeInteractionData[pointerId];\n }\n else\n {\n interactionData = this.interactionDataPool.pop() || new InteractionData();\n interactionData.identifier = pointerId;\n this.activeInteractionData[pointerId] = interactionData;\n }\n // copy properties from the event, so that we can make sure that touch/pointer specific\n // data is available\n interactionData.copyEvent(event);\n\n return interactionData;\n }\n\n /**\n * Return unused InteractionData to the pool, for a given pointerId\n *\n * @private\n * @param {number} pointerId - Identifier from a pointer event\n */\n private releaseInteractionDataForPointerId(pointerId: number): void\n {\n const interactionData = this.activeInteractionData[pointerId];\n\n if (interactionData)\n {\n delete this.activeInteractionData[pointerId];\n interactionData.reset();\n this.interactionDataPool.push(interactionData);\n }\n }\n\n /**\n * Configure an InteractionEvent to wrap a DOM PointerEvent and InteractionData\n *\n * @private\n * @param {PIXI.InteractionEvent} interactionEvent - The event to be configured\n * @param {PointerEvent} pointerEvent - The DOM event that will be paired with the InteractionEvent\n * @param {PIXI.InteractionData} interactionData - The InteractionData that will be paired\n * with the InteractionEvent\n * @return {PIXI.InteractionEvent} the interaction event that was passed in\n */\n private configureInteractionEventForDOMEvent(interactionEvent: InteractionEvent, pointerEvent: PointerEvent,\n interactionData: InteractionData\n ): InteractionEvent\n {\n interactionEvent.data = interactionData;\n\n this.mapPositionToPoint(interactionData.global, pointerEvent.clientX, pointerEvent.clientY);\n\n // Not really sure why this is happening, but it's how a previous version handled things\n if (pointerEvent.pointerType === 'touch')\n {\n (pointerEvent as any).globalX = interactionData.global.x;\n (pointerEvent as any).globalY = interactionData.global.y;\n }\n\n interactionData.originalEvent = pointerEvent;\n interactionEvent.reset();\n\n return interactionEvent;\n }\n\n /**\n * Ensures that the original event object contains all data that a regular pointer event would have\n *\n * @private\n * @param {TouchEvent|MouseEvent|PointerEvent} event - The original event data from a touch or mouse event\n * @return {PointerEvent[]} An array containing a single normalized pointer event, in the case of a pointer\n * or mouse event, or a multiple normalized pointer events if there are multiple changed touches\n */\n private normalizeToPointerData(event: InteractivePointerEvent): PointerEvent[]\n {\n const normalizedEvents = [];\n\n if (this.supportsTouchEvents && event instanceof TouchEvent)\n {\n for (let i = 0, li = event.changedTouches.length; i < li; i++)\n {\n const touch = event.changedTouches[i] as PixiTouch;\n\n if (typeof touch.button === 'undefined') touch.button = event.touches.length ? 1 : 0;\n if (typeof touch.buttons === 'undefined') touch.buttons = event.touches.length ? 1 : 0;\n if (typeof touch.isPrimary === 'undefined')\n {\n touch.isPrimary = event.touches.length === 1 && event.type === 'touchstart';\n }\n if (typeof touch.width === 'undefined') touch.width = touch.radiusX || 1;\n if (typeof touch.height === 'undefined') touch.height = touch.radiusY || 1;\n if (typeof touch.tiltX === 'undefined') touch.tiltX = 0;\n if (typeof touch.tiltY === 'undefined') touch.tiltY = 0;\n if (typeof touch.pointerType === 'undefined') touch.pointerType = 'touch';\n if (typeof touch.pointerId === 'undefined') touch.pointerId = touch.identifier || 0;\n if (typeof touch.pressure === 'undefined') touch.pressure = touch.force || 0.5;\n if (typeof touch.twist === 'undefined') touch.twist = 0;\n if (typeof touch.tangentialPressure === 'undefined') touch.tangentialPressure = 0;\n // TODO: Remove these, as layerX/Y is not a standard, is deprecated, has uneven\n // support, and the fill ins are not quite the same\n // offsetX/Y might be okay, but is not the same as clientX/Y when the canvas's top\n // left is not 0,0 on the page\n if (typeof touch.layerX === 'undefined') touch.layerX = touch.offsetX = touch.clientX;\n if (typeof touch.layerY === 'undefined') touch.layerY = touch.offsetY = touch.clientY;\n\n // mark the touch as normalized, just so that we know we did it\n touch.isNormalized = true;\n\n normalizedEvents.push(touch);\n }\n }\n // apparently PointerEvent subclasses MouseEvent, so yay\n else if (!self.MouseEvent\n || (event instanceof MouseEvent && (!this.supportsPointerEvents || !(event instanceof self.PointerEvent))))\n {\n const tempEvent = event as PixiPointerEvent;\n\n if (typeof tempEvent.isPrimary === 'undefined') tempEvent.isPrimary = true;\n if (typeof tempEvent.width === 'undefined') tempEvent.width = 1;\n if (typeof tempEvent.height === 'undefined') tempEvent.height = 1;\n if (typeof tempEvent.tiltX === 'undefined') tempEvent.tiltX = 0;\n if (typeof tempEvent.tiltY === 'undefined') tempEvent.tiltY = 0;\n if (typeof tempEvent.pointerType === 'undefined') tempEvent.pointerType = 'mouse';\n if (typeof tempEvent.pointerId === 'undefined') tempEvent.pointerId = MOUSE_POINTER_ID;\n if (typeof tempEvent.pressure === 'undefined') tempEvent.pressure = 0.5;\n if (typeof tempEvent.twist === 'undefined') tempEvent.twist = 0;\n if (typeof tempEvent.tangentialPressure === 'undefined') tempEvent.tangentialPressure = 0;\n\n // mark the mouse event as normalized, just so that we know we did it\n tempEvent.isNormalized = true;\n\n normalizedEvents.push(tempEvent);\n }\n else\n {\n normalizedEvents.push(event);\n }\n\n return normalizedEvents as PointerEvent[];\n }\n\n /**\n * Destroys the interaction manager\n *\n */\n public destroy(): void\n {\n this.removeEvents();\n\n this.removeTickerListener();\n\n this.removeAllListeners();\n\n this.renderer = null;\n\n this.mouse = null;\n\n this.eventData = null;\n\n this.interactionDOMElement = null;\n\n this.onPointerDown = null;\n this.processPointerDown = null;\n\n this.onPointerUp = null;\n this.processPointerUp = null;\n\n this.onPointerCancel = null;\n this.processPointerCancel = null;\n\n this.onPointerMove = null;\n this.processPointerMove = null;\n\n this.onPointerOut = null;\n this.processPointerOverOut = null;\n\n this.onPointerOver = null;\n\n this.search = null;\n }\n}\n\ninterface PixiPointerEvent extends PointerEvent\n{\n isPrimary: boolean;\n width: number;\n height: number;\n tiltX: number;\n tiltY: number;\n pointerType: string;\n pointerId: number;\n pressure: number;\n twist: number;\n tangentialPressure: number;\n isNormalized: boolean;\n}\n\ninterface PixiTouch extends Touch\n{\n button: number;\n buttons: number;\n isPrimary: boolean;\n width: number;\n height: number;\n tiltX: number;\n tiltY: number;\n pointerType: string;\n pointerId: number;\n pressure: number;\n twist: number;\n tangentialPressure: number;\n layerX: number;\n layerY: number;\n offsetX: number;\n offsetY: number;\n isNormalized: boolean;\n}\n","import { Point, IPointData } from '@pixi/math';\n\nimport type { DisplayObject } from '@pixi/display';\n\nexport type InteractivePointerEvent = PointerEvent | TouchEvent | MouseEvent;\n\n/**\n * Holds all information related to an Interaction event\n *\n * @class\n * @memberof PIXI\n */\nexport class InteractionData\n{\n public global: Point;\n public target: DisplayObject;\n public originalEvent: InteractivePointerEvent;\n public identifier: number;\n public isPrimary: boolean;\n public button: number;\n public buttons: number;\n public width: number;\n public height: number;\n public tiltX: number;\n public tiltY: number;\n public pointerType: string;\n public pressure = 0;\n public rotationAngle = 0;\n public twist = 0;\n public tangentialPressure = 0;\n\n constructor()\n {\n /**\n * This point stores the global coords of where the touch/mouse event happened\n *\n * @member {PIXI.Point}\n */\n this.global = new Point();\n\n /**\n * The target Sprite that was interacted with\n *\n * @member {PIXI.Sprite}\n */\n this.target = null;\n\n /**\n * When passed to an event handler, this will be the original DOM Event that was captured\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent\n * @see https://developer.mozilla.org/en-US/docs/Web/API/TouchEvent\n * @see https://developer.mozilla.org/en-US/docs/Web/API/PointerEvent\n * @member {MouseEvent|TouchEvent|PointerEvent}\n */\n this.originalEvent = null;\n\n /**\n * Unique identifier for this interaction\n *\n * @member {number}\n */\n this.identifier = null;\n\n /**\n * Indicates whether or not the pointer device that created the event is the primary pointer.\n * @see https://developer.mozilla.org/en-US/docs/Web/API/PointerEvent/isPrimary\n * @type {Boolean}\n */\n this.isPrimary = false;\n\n /**\n * Indicates which button was pressed on the mouse or pointer device to trigger the event.\n * @see https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button\n * @type {number}\n */\n this.button = 0;\n\n /**\n * Indicates which buttons are pressed on the mouse or pointer device when the event is triggered.\n * @see https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/buttons\n * @type {number}\n */\n this.buttons = 0;\n\n /**\n * The width of the pointer's contact along the x-axis, measured in CSS pixels.\n * radiusX of TouchEvents will be represented by this value.\n * @see https://developer.mozilla.org/en-US/docs/Web/API/PointerEvent/width\n * @type {number}\n */\n this.width = 0;\n\n /**\n * The height of the pointer's contact along the y-axis, measured in CSS pixels.\n * radiusY of TouchEvents will be represented by this value.\n * @see https://developer.mozilla.org/en-US/docs/Web/API/PointerEvent/height\n * @type {number}\n */\n this.height = 0;\n\n /**\n * The angle, in degrees, between the pointer device and the screen.\n * @see https://developer.mozilla.org/en-US/docs/Web/API/PointerEvent/tiltX\n * @type {number}\n */\n this.tiltX = 0;\n\n /**\n * The angle, in degrees, between the pointer device and the screen.\n * @see https://developer.mozilla.org/en-US/docs/Web/API/PointerEvent/tiltY\n * @type {number}\n */\n this.tiltY = 0;\n\n /**\n * The type of pointer that triggered the event.\n * @see https://developer.mozilla.org/en-US/docs/Web/API/PointerEvent/pointerType\n * @type {string}\n */\n this.pointerType = null;\n\n /**\n * Pressure applied by the pointing device during the event. A Touch's force property\n * will be represented by this value.\n * @see https://developer.mozilla.org/en-US/docs/Web/API/PointerEvent/pressure\n * @type {number}\n */\n this.pressure = 0;\n\n /**\n * From TouchEvents (not PointerEvents triggered by touches), the rotationAngle of the Touch.\n * @see https://developer.mozilla.org/en-US/docs/Web/API/Touch/rotationAngle\n * @type {number}\n */\n this.rotationAngle = 0;\n\n /**\n * Twist of a stylus pointer.\n * @see https://w3c.github.io/pointerevents/#pointerevent-interface\n * @type {number}\n */\n this.twist = 0;\n\n /**\n * Barrel pressure on a stylus pointer.\n * @see https://w3c.github.io/pointerevents/#pointerevent-interface\n * @type {number}\n */\n this.tangentialPressure = 0;\n }\n\n /**\n * The unique identifier of the pointer. It will be the same as `identifier`.\n * @readonly\n * @member {number}\n * @see https://developer.mozilla.org/en-US/docs/Web/API/PointerEvent/pointerId\n */\n get pointerId(): number\n {\n return this.identifier;\n }\n\n /**\n * This will return the local coordinates of the specified displayObject for this InteractionData\n *\n * @param {PIXI.DisplayObject} displayObject - The DisplayObject that you would like the local\n * coords off\n * @param {PIXI.Point} [point] - A Point object in which to store the value, optional (otherwise\n * will create a new point)\n * @param {PIXI.Point} [globalPos] - A Point object containing your custom global coords, optional\n * (otherwise will use the current global coords)\n * @return {PIXI.Point} A point containing the coordinates of the InteractionData position relative\n * to the DisplayObject\n */\n public getLocalPosition(displayObject: DisplayObject, point?: P, globalPos?: IPointData): P\n {\n return displayObject.worldTransform.applyInverse
(globalPos || this.global, point);\n }\n\n /**\n * Copies properties from normalized event data.\n *\n * @param {Touch|MouseEvent|PointerEvent} event - The normalized event data\n */\n public copyEvent(event: Touch | InteractivePointerEvent): void\n {\n // isPrimary should only change on touchstart/pointerdown, so we don't want to overwrite\n // it with \"false\" on later events when our shim for it on touch events might not be\n // accurate\n if ('isPrimary' in event && event.isPrimary)\n {\n this.isPrimary = true;\n }\n this.button = 'button' in event && event.button;\n // event.buttons is not available in all browsers (ie. Safari), but it does have a non-standard\n // event.which property instead, which conveys the same information.\n const buttons = 'buttons' in event && event.buttons;\n\n this.buttons = Number.isInteger(buttons) ? buttons : 'which' in event && event.which;\n this.width = 'width' in event && event.width;\n this.height = 'height' in event && event.height;\n this.tiltX = 'tiltX' in event && event.tiltX;\n this.tiltY = 'tiltY' in event && event.tiltY;\n this.pointerType = 'pointerType' in event && event.pointerType;\n this.pressure = 'pressure' in event && event.pressure;\n this.rotationAngle = 'rotationAngle' in event && event.rotationAngle;\n this.twist = ('twist' in event && event.twist) || 0;\n this.tangentialPressure = ('tangentialPressure' in event && event.tangentialPressure) || 0;\n }\n\n /**\n * Resets the data for pooling.\n */\n public reset(): void\n {\n // isPrimary is the only property that we really need to reset - everything else is\n // guaranteed to be overwritten\n this.isPrimary = false;\n }\n}\n","import type { DisplayObject } from '@pixi/display';\nimport type { InteractionData } from './InteractionData';\n\nexport type InteractionCallback = (interactionEvent: InteractionEvent, displayObject: DisplayObject, hit?: boolean) => void;\n\n/**\n * Event class that mimics native DOM events.\n *\n * @class\n * @memberof PIXI\n */\nexport class InteractionEvent\n{\n public stopped: boolean;\n public stopsPropagatingAt: DisplayObject;\n public stopPropagationHint: boolean;\n public target: DisplayObject;\n public currentTarget: DisplayObject;\n public type: string;\n public data: InteractionData;\n\n constructor()\n {\n /**\n * Whether this event will continue propagating in the tree.\n *\n * Remaining events for the {@link stopsPropagatingAt} object\n * will still be dispatched.\n *\n * @member {boolean}\n */\n this.stopped = false;\n\n /**\n * At which object this event stops propagating.\n *\n * @private\n * @member {PIXI.DisplayObject}\n */\n this.stopsPropagatingAt = null;\n\n /**\n * Whether we already reached the element we want to\n * stop propagating at. This is important for delayed events,\n * where we start over deeper in the tree again.\n *\n * @private\n * @member {boolean}\n */\n this.stopPropagationHint = false;\n\n /**\n * The object which caused this event to be dispatched.\n * For listener callback see {@link PIXI.InteractionEvent.currentTarget}.\n *\n * @member {PIXI.DisplayObject}\n */\n this.target = null;\n\n /**\n * The object whose event listener’s callback is currently being invoked.\n *\n * @member {PIXI.DisplayObject}\n */\n this.currentTarget = null;\n\n /**\n * Type of the event\n *\n * @member {string}\n */\n this.type = null;\n\n /**\n * InteractionData related to this event\n *\n * @member {PIXI.InteractionData}\n */\n this.data = null;\n }\n\n /**\n * Prevents event from reaching any objects other than the current object.\n *\n */\n public stopPropagation(): void\n {\n this.stopped = true;\n this.stopPropagationHint = true;\n this.stopsPropagatingAt = this.currentTarget;\n }\n\n /**\n * Resets the event.\n */\n public reset(): void\n {\n this.stopped = false;\n this.stopsPropagatingAt = null;\n this.stopPropagationHint = false;\n this.currentTarget = null;\n this.target = null;\n }\n}\n","export interface InteractionTrackingFlags\n{\n OVER: number;\n LEFT_DOWN: number;\n RIGHT_DOWN: number;\n NONE: number;\n}\n\n/**\n * DisplayObjects with the {@link PIXI.interactiveTarget} mixin use this class to track interactions\n *\n * @class\n * @private\n * @memberof PIXI\n */\nexport class InteractionTrackingData\n{\n public static FLAGS: Readonly = Object.freeze({\n NONE: 0,\n OVER: 1 << 0,\n LEFT_DOWN: 1 << 1,\n RIGHT_DOWN: 1 << 2,\n });\n\n private readonly _pointerId: number;\n private _flags: number;\n\n /**\n * @param {number} pointerId - Unique pointer id of the event\n * @private\n */\n constructor(pointerId: number)\n {\n this._pointerId = pointerId;\n this._flags = InteractionTrackingData.FLAGS.NONE;\n }\n\n /**\n *\n * @private\n * @param {number} flag - The interaction flag to set\n * @param {boolean} yn - Should the flag be set or unset\n */\n private _doSet(flag: number, yn: boolean): void\n {\n if (yn)\n {\n this._flags = this._flags | flag;\n }\n else\n {\n this._flags = this._flags & (~flag);\n }\n }\n\n /**\n * Unique pointer id of the event\n *\n * @readonly\n * @private\n * @member {number}\n */\n get pointerId(): number\n {\n return this._pointerId;\n }\n\n /**\n * State of the tracking data, expressed as bit flags\n *\n * @private\n * @member {number}\n */\n get flags(): number\n {\n return this._flags;\n }\n\n set flags(flags: number)\n {\n this._flags = flags;\n }\n\n /**\n * Is the tracked event inactive (not over or down)?\n *\n * @private\n * @member {number}\n */\n get none(): boolean\n {\n return this._flags === InteractionTrackingData.FLAGS.NONE;\n }\n\n /**\n * Is the tracked event over the DisplayObject?\n *\n * @private\n * @member {boolean}\n */\n get over(): boolean\n {\n return (this._flags & InteractionTrackingData.FLAGS.OVER) !== 0;\n }\n\n set over(yn: boolean)\n {\n this._doSet(InteractionTrackingData.FLAGS.OVER, yn);\n }\n\n /**\n * Did the right mouse button come down in the DisplayObject?\n *\n * @private\n * @member {boolean}\n */\n get rightDown(): boolean\n {\n return (this._flags & InteractionTrackingData.FLAGS.RIGHT_DOWN) !== 0;\n }\n\n set rightDown(yn: boolean)\n {\n this._doSet(InteractionTrackingData.FLAGS.RIGHT_DOWN, yn);\n }\n\n /**\n * Did the left mouse button come down in the DisplayObject?\n *\n * @private\n * @member {boolean}\n */\n get leftDown(): boolean\n {\n return (this._flags & InteractionTrackingData.FLAGS.LEFT_DOWN) !== 0;\n }\n\n set leftDown(yn: boolean)\n {\n this._doSet(InteractionTrackingData.FLAGS.LEFT_DOWN, yn);\n }\n}\n","import { Point } from '@pixi/math';\n\nimport type { InteractionEvent, InteractionCallback } from './InteractionEvent';\nimport type { Container, DisplayObject } from '@pixi/display';\n\n/**\n * Strategy how to search through stage tree for interactive objects\n *\n * @private\n * @class\n * @memberof PIXI\n */\nexport class TreeSearch\n{\n private readonly _tempPoint: Point;\n\n constructor()\n {\n this._tempPoint = new Point();\n }\n\n /**\n * Recursive implementation for findHit\n *\n * @private\n * @param {PIXI.InteractionEvent} interactionEvent - event containing the point that\n * is tested for collision\n * @param {PIXI.Container|PIXI.Sprite|PIXI.TilingSprite} displayObject - the displayObject\n * that will be hit test (recursively crawls its children)\n * @param {Function} [func] - the function that will be called on each interactive object. The\n * interactionEvent, displayObject and hit will be passed to the function\n * @param {boolean} [hitTest] - this indicates if the objects inside should be hit test against the point\n * @param {boolean} [interactive] - Whether the displayObject is interactive\n * @return {boolean} returns true if the displayObject hit the point\n */\n public recursiveFindHit(interactionEvent: InteractionEvent, displayObject: DisplayObject,\n func?: InteractionCallback, hitTest?: boolean, interactive?: boolean\n ): boolean\n {\n if (!displayObject || !displayObject.visible)\n {\n return false;\n }\n\n const point = interactionEvent.data.global;\n\n // Took a little while to rework this function correctly! But now it is done and nice and optimized! ^_^\n //\n // This function will now loop through all objects and then only hit test the objects it HAS\n // to, not all of them. MUCH faster..\n // An object will be hit test if the following is true:\n //\n // 1: It is interactive.\n // 2: It belongs to a parent that is interactive AND one of the parents children have not already been hit.\n //\n // As another little optimization once an interactive object has been hit we can carry on\n // through the scenegraph, but we know that there will be no more hits! So we can avoid extra hit tests\n // A final optimization is that an object is not hit test directly if a child has already been hit.\n\n interactive = displayObject.interactive || interactive;\n\n let hit = false;\n let interactiveParent = interactive;\n\n // Flag here can set to false if the event is outside the parents hitArea or mask\n let hitTestChildren = true;\n\n // If there is a hitArea, no need to test against anything else if the pointer is not within the hitArea\n // There is also no longer a need to hitTest children.\n if (displayObject.hitArea)\n {\n if (hitTest)\n {\n displayObject.worldTransform.applyInverse(point, this._tempPoint);\n if (!displayObject.hitArea.contains(this._tempPoint.x, this._tempPoint.y))\n {\n hitTest = false;\n hitTestChildren = false;\n }\n else\n {\n hit = true;\n }\n }\n interactiveParent = false;\n }\n // If there is a mask, no need to hitTest against anything else if the pointer is not within the mask.\n // We still want to hitTestChildren, however, to ensure a mouseout can still be generated.\n // https://github.com/pixijs/pixi.js/issues/5135\n else if (displayObject._mask)\n {\n if (hitTest)\n {\n if (!((displayObject._mask as any).containsPoint && (displayObject._mask as any).containsPoint(point)))\n {\n hitTest = false;\n }\n }\n }\n\n // ** FREE TIP **! If an object is not interactive or has no buttons in it\n // (such as a game scene!) set interactiveChildren to false for that displayObject.\n // This will allow PixiJS to completely ignore and bypass checking the displayObjects children.\n if (hitTestChildren && displayObject.interactiveChildren && (displayObject as Container).children)\n {\n const children = (displayObject as Container).children;\n\n for (let i = children.length - 1; i >= 0; i--)\n {\n const child = children[i];\n\n // time to get recursive.. if this function will return if something is hit..\n const childHit = this.recursiveFindHit(interactionEvent, child, func, hitTest, interactiveParent);\n\n if (childHit)\n {\n // its a good idea to check if a child has lost its parent.\n // this means it has been removed whilst looping so its best\n if (!child.parent)\n {\n continue;\n }\n\n // we no longer need to hit test any more objects in this container as we we\n // now know the parent has been hit\n interactiveParent = false;\n\n // If the child is interactive , that means that the object hit was actually\n // interactive and not just the child of an interactive object.\n // This means we no longer need to hit test anything else. We still need to run\n // through all objects, but we don't need to perform any hit tests.\n\n if (childHit)\n {\n if (interactionEvent.target)\n {\n hitTest = false;\n }\n hit = true;\n }\n }\n }\n }\n\n // no point running this if the item is not interactive or does not have an interactive parent.\n if (interactive)\n {\n // if we are hit testing (as in we have no hit any objects yet)\n // We also don't need to worry about hit testing if once of the displayObjects children\n // has already been hit - but only if it was interactive, otherwise we need to keep\n // looking for an interactive child, just in case we hit one\n if (hitTest && !interactionEvent.target)\n {\n // already tested against hitArea if it is defined\n if (!displayObject.hitArea && (displayObject as any).containsPoint)\n {\n if ((displayObject as any).containsPoint(point))\n {\n hit = true;\n }\n }\n }\n\n if (displayObject.interactive)\n {\n if (hit && !interactionEvent.target)\n {\n interactionEvent.target = displayObject;\n }\n\n if (func)\n {\n func(interactionEvent, displayObject, !!hit);\n }\n }\n }\n\n return hit;\n }\n\n /**\n * This function is provides a neat way of crawling through the scene graph and running a\n * specified function on all interactive objects it finds. It will also take care of hit\n * testing the interactive objects and passes the hit across in the function.\n *\n * @private\n * @param {PIXI.InteractionEvent} interactionEvent - event containing the point that\n * is tested for collision\n * @param {PIXI.Container|PIXI.Sprite|PIXI.TilingSprite} displayObject - the displayObject\n * that will be hit test (recursively crawls its children)\n * @param {Function} [func] - the function that will be called on each interactive object. The\n * interactionEvent, displayObject and hit will be passed to the function\n * @param {boolean} [hitTest] - this indicates if the objects inside should be hit test against the point\n * @return {boolean} returns true if the displayObject hit the point\n */\n public findHit(interactionEvent: InteractionEvent, displayObject: DisplayObject,\n func?: InteractionCallback, hitTest?: boolean\n ): void\n {\n this.recursiveFindHit(interactionEvent, displayObject, func, hitTest, false);\n }\n}\n","import type { InteractionTrackingData } from './InteractionTrackingData';\n\ntype Cursor = 'auto'\n | 'default'\n | 'none'\n | 'context-menu'\n | 'help'\n | 'pointer'\n | 'progress'\n | 'wait'\n | 'cell'\n | 'crosshair'\n | 'text'\n | 'vertical-text'\n | 'alias'\n | 'copy'\n | 'move'\n | 'no-drop'\n | 'not-allowed'\n | 'e-resize'\n | 'n-resize'\n | 'ne-resize'\n | 'nw-resize'\n | 's-resize'\n | 'se-resize'\n | 'sw-resize'\n | 'w-resize'\n | 'ns-resize'\n | 'ew-resize'\n | 'nesw-resize'\n | 'col-resize'\n | 'nwse-resize'\n | 'row-resize'\n | 'all-scroll'\n | 'zoom-in'\n | 'zoom-out'\n | 'grab'\n | 'grabbing';\n\nexport interface IHitArea {\n contains(x: number, y: number): boolean;\n}\n\nexport interface InteractiveTarget {\n interactive: boolean;\n interactiveChildren: boolean;\n hitArea: IHitArea;\n cursor: Cursor | string;\n buttonMode: boolean;\n trackedPointers: {[x: number]: InteractionTrackingData};\n _trackedPointers: {[x: number]: InteractionTrackingData};\n}\n\n/**\n * Interface for classes that represent a hit area.\n *\n * It is implemented by the following classes:\n * - {@link PIXI.Circle}\n * - {@link PIXI.Ellipse}\n * - {@link PIXI.Polygon}\n * - {@link PIXI.RoundedRectangle}\n *\n * @interface IHitArea\n * @memberof PIXI\n */\n\n/**\n * Checks whether the x and y coordinates given are contained within this area\n *\n * @method\n * @name contains\n * @memberof PIXI.IHitArea#\n * @param {number} x - The X coordinate of the point to test\n * @param {number} y - The Y coordinate of the point to test\n * @return {boolean} Whether the x/y coordinates are within this area\n */\n\n/**\n * Default property values of interactive objects\n * Used by {@link PIXI.InteractionManager} to automatically give all DisplayObjects these properties\n *\n * @private\n * @name interactiveTarget\n * @type {Object}\n * @memberof PIXI\n * @example\n * function MyObject() {}\n *\n * Object.assign(\n * DisplayObject.prototype,\n * PIXI.interactiveTarget\n * );\n */\nexport const interactiveTarget: InteractiveTarget = {\n interactive: false,\n interactiveChildren: true,\n hitArea: null,\n\n /**\n * If enabled, the mouse cursor use the pointer behavior when hovered over the displayObject if it is interactive\n * Setting this changes the 'cursor' property to `'pointer'`.\n *\n * @example\n * const sprite = new PIXI.Sprite(texture);\n * sprite.interactive = true;\n * sprite.buttonMode = true;\n * @member {boolean}\n * @memberof PIXI.DisplayObject#\n */\n get buttonMode(): boolean\n {\n return this.cursor === 'pointer';\n },\n set buttonMode(value: boolean)\n {\n if (value)\n {\n this.cursor = 'pointer';\n }\n else if (this.cursor === 'pointer')\n {\n this.cursor = null;\n }\n },\n\n /**\n * This defines what cursor mode is used when the mouse cursor\n * is hovered over the displayObject.\n *\n * @example\n * const sprite = new PIXI.Sprite(texture);\n * sprite.interactive = true;\n * sprite.cursor = 'wait';\n * @see https://developer.mozilla.org/en/docs/Web/CSS/cursor\n *\n * @member {string}\n * @memberof PIXI.DisplayObject#\n */\n cursor: null,\n\n /**\n * Internal set of all active pointers, by identifier\n *\n * @member {Map}\n * @memberof PIXI.DisplayObject#\n * @private\n */\n get trackedPointers()\n {\n if (this._trackedPointers === undefined) this._trackedPointers = {};\n\n return this._trackedPointers;\n },\n\n /**\n * Map of all tracked pointers, by identifier. Use trackedPointers to access.\n *\n * @private\n * @type {Map}\n */\n _trackedPointers: undefined,\n};\n","/**\n * A Runner is a highly performant and simple alternative to signals. Best used in situations\n * where events are dispatched to many objects at high frequency (say every frame!)\n *\n *\n * like a signal..\n * ```\n * import { Runner } from '@pixi/runner';\n *\n * const myObject = {\n * loaded: new Runner('loaded')\n * }\n *\n * const listener = {\n * loaded: function(){\n * // thin\n * }\n * }\n *\n * myObject.loaded.add(listener);\n *\n * myObject.loaded.emit();\n * ```\n *\n * Or for handling calling the same function on many items\n * ```\n * import { Runner } from '@pixi/runner';\n *\n * const myGame = {\n * update: new Runner('update')\n * }\n *\n * const gameObject = {\n * update: function(time){\n * // update my gamey state\n * }\n * }\n *\n * myGame.update.add(gameObject);\n *\n * myGame.update.emit(time);\n * ```\n *\n * @memberof PIXI\n */\nexport class Runner\n{\n public items: any[];\n private _name: string;\n private _aliasCount: number;\n\n /**\n * @param name - The function name that will be executed on the listeners added to this Runner.\n */\n constructor(name: string)\n {\n this.items = [];\n this._name = name;\n this._aliasCount = 0;\n }\n\n /**\n * Dispatch/Broadcast Runner to all listeners added to the queue.\n *\n * @param {...any} params - (optional) parameters to pass to each listener\n */\n public emit(a0?: unknown, a1?: unknown, a2?: unknown, a3?: unknown,\n a4?: unknown, a5?: unknown, a6?: unknown, a7?: unknown): this\n {\n if (arguments.length > 8)\n {\n throw new Error('max arguments reached');\n }\n\n const { name, items } = this;\n\n this._aliasCount++;\n\n for (let i = 0, len = items.length; i < len; i++)\n {\n items[i][name](a0, a1, a2, a3, a4, a5, a6, a7);\n }\n\n if (items === this.items)\n {\n this._aliasCount--;\n }\n\n return this;\n }\n\n private ensureNonAliasedItems(): void\n {\n if (this._aliasCount > 0 && this.items.length > 1)\n {\n this._aliasCount = 0;\n this.items = this.items.slice(0);\n }\n }\n\n /**\n * Add a listener to the Runner\n *\n * Runners do not need to have scope or functions passed to them.\n * All that is required is to pass the listening object and ensure that it has contains a function that has the same name\n * as the name provided to the Runner when it was created.\n *\n * Eg A listener passed to this Runner will require a 'complete' function.\n *\n * ```\n * import { Runner } from '@pixi/runner';\n *\n * const complete = new Runner('complete');\n * ```\n *\n * The scope used will be the object itself.\n *\n * @param {any} item - The object that will be listening.\n */\n public add(item: unknown): this\n {\n if ((item as any)[this._name])\n {\n this.ensureNonAliasedItems();\n this.remove(item);\n this.items.push(item);\n }\n\n return this;\n }\n\n /**\n * Remove a single listener from the dispatch queue.\n *\n * @param {any} item - The listener that you would like to remove.\n */\n public remove(item: unknown): this\n {\n const index = this.items.indexOf(item);\n\n if (index !== -1)\n {\n this.ensureNonAliasedItems();\n this.items.splice(index, 1);\n }\n\n return this;\n }\n\n /**\n * Check to see if the listener is already in the Runner\n *\n * @param {any} item - The listener that you would like to check.\n */\n public contains(item: unknown): boolean\n {\n return this.items.indexOf(item) !== -1;\n }\n\n /** Remove all listeners from the Runner */\n public removeAll(): this\n {\n this.ensureNonAliasedItems();\n this.items.length = 0;\n\n return this;\n }\n\n /** Remove all references, don't use after this. */\n public destroy(): void\n {\n this.removeAll();\n this.items = null;\n this._name = null;\n }\n\n /**\n * `true` if there are no this Runner contains no listeners\n *\n * @readonly\n */\n public get empty(): boolean\n {\n return this.items.length === 0;\n }\n\n /**\n * The name of the runner.\n *\n * @readonly\n */\n public get name(): string\n {\n return this._name;\n }\n}\n\nObject.defineProperties(Runner.prototype, {\n /**\n * Alias for `emit`\n * @memberof PIXI.Runner#\n * @method dispatch\n * @see PIXI.Runner#emit\n */\n dispatch: { value: Runner.prototype.emit },\n /**\n * Alias for `emit`\n * @memberof PIXI.Runner#\n * @method run\n * @see PIXI.Runner#emit\n */\n run: { value: Runner.prototype.emit },\n});\n","import { deprecation } from '@pixi/utils';\nimport * as _systems from './systems';\nimport * as _resources from './textures/resources';\n\n/**\n * @memberof PIXI\n * @namespace resources\n * @see PIXI\n * @deprecated since 6.0.0\n */\nconst resources = {};\n\nfor (const name in _resources)\n{\n Object.defineProperty(resources, name,\n {\n get()\n {\n // #if _DEBUG\n deprecation('6.0.0', `PIXI.systems.${name} has moved to PIXI.${name}`);\n // #endif\n\n return (_resources as any)[name];\n },\n });\n}\n\n/**\n * @memberof PIXI\n * @namespace systems\n * @see PIXI\n * @deprecated since 6.0.0\n */\nconst systems = {};\n\nfor (const name in _systems)\n{\n Object.defineProperty(systems, name,\n {\n get()\n {\n // #if _DEBUG\n deprecation('6.0.0', `PIXI.resources.${name} has moved to PIXI.${name}`);\n // #endif\n\n return (_systems as any)[name];\n },\n });\n}\n\nexport { resources, systems };\n","import { Resource } from './Resource';\n\nimport type { IImageResourceOptions } from './ImageResource';\nimport type { ISize } from '@pixi/math';\nimport type { ICubeResourceOptions } from './CubeResource';\nimport type { ISVGResourceOptions } from './SVGResource';\nimport type { IVideoResourceOptions } from './VideoResource';\n\n/*\n * Allow flexible options for resource plugins\n */\nexport type IResourcePluginOptions = { [key: string]: any };\n\n/*\n * All allowable options for autoDetectResource\n */\nexport type IAutoDetectOptions = ISize\n | ICubeResourceOptions\n | IImageResourceOptions\n | ISVGResourceOptions\n | IVideoResourceOptions\n | IResourcePluginOptions;\n\n/**\n * Shape of supported resource plugins\n *\n * @memberof PIXI\n */\nexport interface IResourcePlugin\n{\n test(source: unknown, extension: string): boolean;\n new (source: any, options?: RO): R;\n}\n\n/**\n * Collection of installed resource types, class must extend {@link PIXI.Resource}.\n * @example\n * class CustomResource extends PIXI.Resource {\n * // MUST have source, options constructor signature\n * // for auto-detected resources to be created.\n * constructor(source, options) {\n * super();\n * }\n * upload(renderer, baseTexture, glTexture) {\n * // upload with GL\n * return true;\n * }\n * // used to auto-detect resource\n * static test(source, extension) {\n * return extension === 'xyz'|| source instanceof SomeClass;\n * }\n * }\n * // Install the new resource type\n * PIXI.INSTALLED.push(CustomResource);\n *\n * @memberof PIXI\n * @type {Array}\n * @static\n * @readonly\n */\nexport const INSTALLED: Array> = [];\n\n/**\n * Create a resource element from a single source element. This\n * auto-detects which type of resource to create. All resources that\n * are auto-detectable must have a static `test` method and a constructor\n * with the arguments `(source, options?)`. Currently, the supported\n * resources for auto-detection include:\n * - {@link PIXI.ImageResource}\n * - {@link PIXI.CanvasResource}\n * - {@link PIXI.VideoResource}\n * - {@link PIXI.SVGResource}\n * - {@link PIXI.BufferResource}\n * @static\n * @memberof PIXI\n * @function autoDetectResource\n * @param {string|*} source - Resource source, this can be the URL to the resource,\n * a typed-array (for BufferResource), HTMLVideoElement, SVG data-uri\n * or any other resource that can be auto-detected. If not resource is\n * detected, it's assumed to be an ImageResource.\n * @param {object} [options] - Pass-through options to use for Resource\n * @param {number} [options.width] - Width of BufferResource or SVG rasterization\n * @param {number} [options.height] - Height of BufferResource or SVG rasterization\n * @param {boolean} [options.autoLoad=true] - Image, SVG and Video flag to start loading\n * @param {number} [options.scale=1] - SVG source scale. Overridden by width, height\n * @param {boolean} [options.createBitmap=PIXI.settings.CREATE_IMAGE_BITMAP] - Image option to create Bitmap object\n * @param {boolean} [options.crossorigin=true] - Image and Video option to set crossOrigin\n * @param {boolean} [options.autoPlay=true] - Video option to start playing video immediately\n * @param {number} [options.updateFPS=0] - Video option to update how many times a second the\n * texture should be updated from the video. Leave at 0 to update at every render\n * @return {PIXI.Resource} The created resource.\n */\nexport function autoDetectResource(source: unknown, options?: RO): R\n{\n if (!source)\n {\n return null;\n }\n\n let extension = '';\n\n if (typeof source === 'string')\n {\n // search for file extension: period, 3-4 chars, then ?, # or EOL\n const result = (/\\.(\\w{3,4})(?:$|\\?|#)/i).exec(source);\n\n if (result)\n {\n extension = result[1].toLowerCase();\n }\n }\n\n for (let i = INSTALLED.length - 1; i >= 0; --i)\n {\n const ResourcePlugin = INSTALLED[i] as IResourcePlugin;\n\n if (ResourcePlugin.test && ResourcePlugin.test(source, extension))\n {\n return new ResourcePlugin(source, options);\n }\n }\n\n throw new Error('Unrecognized source type to auto-detect Resource');\n}\n","import { Runner } from '@pixi/runner';\n\nimport type { BaseTexture } from '../BaseTexture';\nimport type { Renderer } from '../../Renderer';\nimport type { GLTexture } from '../GLTexture';\n\n/**\n * Base resource class for textures that manages validation and uploading, depending on its type.\n *\n * Uploading of a base texture to the GPU is required.\n *\n * @memberof PIXI\n */\nexport abstract class Resource\n{\n /**\n * If resource has been destroyed.\n *\n * @readonly\n * @default false\n */\n public destroyed: boolean;\n\n /**\n * `true` if resource is created by BaseTexture\n * useful for doing cleanup with BaseTexture destroy\n * and not cleaning up resources that were created\n * externally.\n */\n public internal: boolean;\n\n /** Internal width of the resource. */\n protected _width: number;\n\n /** Internal height of the resource. */\n protected _height: number;\n\n /**\n * Mini-runner for handling resize events\n * accepts 2 parameters: width, height\n *\n * @member {Runner}\n * @private\n */\n protected onResize: Runner; // TODO: Should this be private? It doesn't seem to be used anywhere else.\n\n /**\n * Mini-runner for handling update events\n *\n * @member {Runner}\n * @private\n */\n protected onUpdate: Runner;\n\n /**\n * Handle internal errors, such as loading errors\n * accepts 1 param: error\n *\n * @member {Runner}\n * @private\n */\n protected onError: Runner;\n\n /**\n * @param width - Width of the resource\n * @param height - Height of the resource\n */\n constructor(width = 0, height = 0)\n {\n this._width = width;\n this._height = height;\n\n this.destroyed = false;\n this.internal = false;\n\n this.onResize = new Runner('setRealSize');\n this.onUpdate = new Runner('update');\n this.onError = new Runner('onError');\n }\n\n /**\n * Bind to a parent BaseTexture\n *\n * @param baseTexture - Parent texture\n */\n bind(baseTexture: BaseTexture): void\n {\n this.onResize.add(baseTexture);\n this.onUpdate.add(baseTexture);\n this.onError.add(baseTexture);\n\n // Call a resize immediate if we already\n // have the width and height of the resource\n if (this._width || this._height)\n {\n this.onResize.emit(this._width, this._height);\n }\n }\n\n /**\n * Unbind to a parent BaseTexture\n *\n * @param baseTexture - Parent texture\n */\n unbind(baseTexture: BaseTexture): void\n {\n this.onResize.remove(baseTexture);\n this.onUpdate.remove(baseTexture);\n this.onError.remove(baseTexture);\n }\n\n /**\n * Trigger a resize event\n *\n * @param width - X dimension\n * @param height - Y dimension\n */\n resize(width: number, height: number): void\n {\n if (width !== this._width || height !== this._height)\n {\n this._width = width;\n this._height = height;\n this.onResize.emit(width, height);\n }\n }\n\n /**\n * Has been validated\n *\n * @readonly\n */\n get valid(): boolean\n {\n return !!this._width && !!this._height;\n }\n\n /** Has been updated trigger event. */\n update(): void\n {\n if (!this.destroyed)\n {\n this.onUpdate.emit();\n }\n }\n\n /**\n * This can be overridden to start preloading a resource\n * or do any other prepare step.\n *\n * @protected\n * @return Handle the validate event\n */\n load(): Promise\n {\n return Promise.resolve(this);\n }\n\n /**\n * The width of the resource.\n *\n * @readonly\n */\n get width(): number\n {\n return this._width;\n }\n\n /**\n * The height of the resource.\n *\n * @readonly\n */\n get height(): number\n {\n return this._height;\n }\n\n /**\n * Uploads the texture or returns false if it cant for some reason. Override this.\n *\n * @param renderer - yeah, renderer!\n * @param baseTexture - the texture\n * @param glTexture - texture instance for this webgl context\n * @returns - true is success\n */\n abstract upload(renderer: Renderer, baseTexture: BaseTexture, glTexture: GLTexture): boolean;\n\n /**\n * Set the style, optional to override\n *\n * @param renderer - yeah, renderer!\n * @param baseTexture - the texture\n * @param glTexture - texture instance for this webgl context\n * @returns - `true` is success\n */\n style(_renderer: Renderer, _baseTexture: BaseTexture, _glTexture: GLTexture): boolean\n {\n return false;\n }\n\n /** Clean up anything, this happens when destroying is ready. */\n dispose(): void\n {\n // override\n }\n\n /**\n * Call when destroying resource, unbind any BaseTexture object\n * before calling this method, as reference counts are maintained\n * internally.\n */\n destroy(): void\n {\n if (!this.destroyed)\n {\n this.destroyed = true;\n this.dispose();\n this.onError.removeAll();\n this.onError = null;\n this.onResize.removeAll();\n this.onResize = null;\n this.onUpdate.removeAll();\n this.onUpdate = null;\n }\n }\n\n /**\n * Abstract, used to auto-detect resource type.\n *\n * @param {*} source - The source object\n * @param {string} extension - The extension of source, if set\n */\n static test(_source: unknown, _extension?: string): boolean\n {\n return false;\n }\n}\n","import { Resource } from './Resource';\nimport { ALPHA_MODES } from '@pixi/constants';\n\nimport type { ISize } from '@pixi/math';\nimport type { BaseTexture } from '../BaseTexture';\nimport type { Renderer } from '../../Renderer';\nimport type { GLTexture } from '../GLTexture';\n/**\n * @interface SharedArrayBuffer\n */\n\n/**\n * Buffer resource with data of typed array.\n *\n * @memberof PIXI\n */\nexport class BufferResource extends Resource\n{\n /**\n * Source array\n * Cannot be {@code ClampedUint8Array} because it cant be uploaded to WebGL\n */\n data: Float32Array|Uint8Array|Uint16Array|Uint32Array;\n\n /**\n * @param source - Source buffer\n * @param options - Options\n * @param {number} options.width - Width of the texture\n * @param {number} options.height - Height of the texture\n */\n constructor(source: Float32Array|Uint8Array|Uint16Array|Uint32Array, options: ISize)\n {\n const { width, height } = options || {};\n\n if (!width || !height)\n {\n throw new Error('BufferResource width or height invalid');\n }\n\n super(width, height);\n\n this.data = source;\n }\n\n /**\n * Upload the texture to the GPU.\n *\n * @param renderer - Upload to the renderer\n * @param baseTexture - Reference to parent texture\n * @param glTexture - glTexture\n * @returns - true is success\n */\n upload(renderer: Renderer, baseTexture: BaseTexture, glTexture: GLTexture): boolean\n {\n const gl = renderer.gl;\n\n gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, baseTexture.alphaMode === ALPHA_MODES.UNPACK);\n\n const width = baseTexture.realWidth;\n const height = baseTexture.realHeight;\n\n if (glTexture.width === width && glTexture.height === height)\n {\n gl.texSubImage2D(\n baseTexture.target,\n 0,\n 0,\n 0,\n width,\n height,\n baseTexture.format,\n glTexture.type,\n this.data\n );\n }\n else\n {\n glTexture.width = width;\n glTexture.height = height;\n\n gl.texImage2D(\n baseTexture.target,\n 0,\n glTexture.internalFormat,\n width,\n height,\n 0,\n baseTexture.format,\n glTexture.type,\n this.data\n );\n }\n\n return true;\n }\n\n /** Destroy and don't use after this. */\n dispose(): void\n {\n this.data = null;\n }\n\n /**\n * Used to auto-detect the type of resource.\n *\n * @param {*} source - The source object\n * @return {boolean} `true` if \n */\n static test(source: unknown): source is Float32Array|Uint8Array|Uint32Array\n {\n return source instanceof Float32Array\n || source instanceof Uint8Array\n || source instanceof Uint32Array;\n }\n}\n","import { BaseTextureCache, EventEmitter, isPow2, TextureCache, uid } from '@pixi/utils';\nimport { FORMATS, SCALE_MODES, TARGETS, TYPES, ALPHA_MODES, MIPMAP_MODES, WRAP_MODES } from '@pixi/constants';\nimport { Resource } from './resources/Resource';\nimport { BufferResource } from './resources/BufferResource';\nimport { autoDetectResource } from './resources/autoDetectResource';\nimport { settings } from '@pixi/settings';\n\nimport type { MSAA_QUALITY } from '@pixi/constants';\nimport type { IAutoDetectOptions } from './resources/autoDetectResource';\nimport type { GLTexture } from './GLTexture';\n\nconst defaultBufferOptions = {\n scaleMode: SCALE_MODES.NEAREST,\n format: FORMATS.RGBA,\n alphaMode: ALPHA_MODES.NPM,\n};\n\nexport type ImageSource = HTMLImageElement|HTMLCanvasElement|HTMLVideoElement|ImageBitmap;\n\nexport interface IBaseTextureOptions {\n alphaMode?: ALPHA_MODES;\n mipmap?: MIPMAP_MODES;\n anisotropicLevel?: number;\n scaleMode?: SCALE_MODES;\n width?: number;\n height?: number;\n wrapMode?: WRAP_MODES;\n format?: FORMATS;\n type?: TYPES;\n target?: TARGETS;\n resolution?: number;\n multisample?: MSAA_QUALITY;\n resourceOptions?: RO;\n pixiIdPrefix?: string;\n}\n\nexport interface BaseTexture extends GlobalMixins.BaseTexture, EventEmitter {}\n\n/**\n * A Texture stores the information that represents an image.\n * All textures have a base texture, which contains information about the source.\n * Therefore you can have many textures all using a single BaseTexture\n *\n * @class\n * @extends PIXI.utils.EventEmitter\n * @memberof PIXI\n * @typeParam R - The BaseTexture's Resource type.\n * @typeParam RO - The options for constructing resource.\n */\nexport class BaseTexture extends EventEmitter\n{\n /**\n * The width of the base texture set when the image has loaded\n *\n * @readonly\n */\n public width: number;\n\n /**\n * The height of the base texture set when the image has loaded\n *\n * @readonly\n */\n public height: number;\n\n /**\n * The resolution / device pixel ratio of the texture\n *\n * @readonly\n * @default PIXI.settings.RESOLUTION\n */\n public resolution: number;\n\n /**\n * How to treat premultiplied alpha, see {@link PIXI.ALPHA_MODES}.\n *\n * @member {PIXI.ALPHA_MODES}\n * @default PIXI.ALPHA_MODES.UNPACK\n */\n public alphaMode?: ALPHA_MODES;\n\n /**\n * Anisotropic filtering level of texture\n *\n * @member {number}\n * @default PIXI.settings.ANISOTROPIC_LEVEL\n */\n public anisotropicLevel?: number;\n\n /**\n * The pixel format of the texture\n *\n * @default PIXI.FORMATS.RGBA\n */\n public format?: FORMATS;\n\n /**\n * The type of resource data\n *\n * @default PIXI.TYPES.UNSIGNED_BYTE\n */\n public type?: TYPES;\n\n /**\n * The target type\n *\n * @default PIXI.TARGETS.TEXTURE_2D\n */\n public target?: TARGETS;\n\n /**\n * Global unique identifier for this BaseTexture\n *\n * @protected\n */\n public readonly uid: number;\n\n /**\n * Used by automatic texture Garbage Collection, stores last GC tick when it was bound\n *\n * @protected\n */\n touched: number;\n\n /**\n * Whether or not the texture is a power of two, try to use power of two textures as much\n * as you can\n *\n * @readonly\n * @default false\n */\n isPowerOfTwo: boolean;\n\n /**\n * The map of render context textures where this is bound\n *\n * @private\n */\n _glTextures: { [key: number]: GLTexture };\n\n /**\n * Used by TextureSystem to only update texture to the GPU when needed.\n * Please call `update()` to increment it.\n *\n * @readonly\n */\n dirtyId: number;\n\n /**\n * Used by TextureSystem to only update texture style when needed.\n *\n * @protected\n */\n dirtyStyleId: number;\n\n /**\n * Currently default cache ID.\n *\n * @member {string}\n */\n public cacheId: string;\n\n /**\n * Generally speaking means when resource is loaded.\n * @readonly\n * @member {boolean}\n */\n public valid: boolean;\n\n /**\n * The collection of alternative cache ids, since some BaseTextures\n * can have more than one ID, short name and longer full URL\n *\n * @member {Array}\n * @readonly\n */\n public textureCacheIds: Array;\n\n /**\n * Flag if BaseTexture has been destroyed.\n *\n * @member {boolean}\n * @readonly\n */\n public destroyed: boolean;\n\n /**\n * The resource used by this BaseTexture, there can only\n * be one resource per BaseTexture, but textures can share\n * resources.\n *\n * @member {PIXI.Resource}\n * @readonly\n */\n public resource: R;\n\n /**\n * Number of the texture batch, used by multi-texture renderers\n *\n * @member {number}\n */\n _batchEnabled: number;\n\n /**\n * Location inside texture batch, used by multi-texture renderers\n *\n * @member {number}\n */\n _batchLocation: number;\n\n /**\n * Whether its a part of another texture, handled by ArrayResource or CubeResource\n *\n * @member {PIXI.BaseTexture}\n */\n parentTextureArray: BaseTexture;\n\n private _mipmap?: MIPMAP_MODES;\n private _scaleMode?: SCALE_MODES;\n private _wrapMode?: WRAP_MODES;\n\n /**\n * @param {PIXI.Resource|string|HTMLImageElement|HTMLCanvasElement|HTMLVideoElement} [resource=null] -\n * The current resource to use, for things that aren't Resource objects, will be converted\n * into a Resource.\n * @param {Object} [options] - Collection of options\n * @param {PIXI.MIPMAP_MODES} [options.mipmap=PIXI.settings.MIPMAP_TEXTURES] - If mipmapping is enabled for texture\n * @param {number} [options.anisotropicLevel=PIXI.settings.ANISOTROPIC_LEVEL] - Anisotropic filtering level of texture\n * @param {PIXI.WRAP_MODES} [options.wrapMode=PIXI.settings.WRAP_MODE] - Wrap mode for textures\n * @param {PIXI.SCALE_MODES} [options.scaleMode=PIXI.settings.SCALE_MODE] - Default scale mode, linear, nearest\n * @param {PIXI.FORMATS} [options.format=PIXI.FORMATS.RGBA] - GL format type\n * @param {PIXI.TYPES} [options.type=PIXI.TYPES.UNSIGNED_BYTE] - GL data type\n * @param {PIXI.TARGETS} [options.target=PIXI.TARGETS.TEXTURE_2D] - GL texture target\n * @param {PIXI.ALPHA_MODES} [options.alphaMode=PIXI.ALPHA_MODES.UNPACK] - Pre multiply the image alpha\n * @param {number} [options.width=0] - Width of the texture\n * @param {number} [options.height=0] - Height of the texture\n * @param {number} [options.resolution=PIXI.settings.RESOLUTION] - Resolution of the base texture\n * @param {object} [options.resourceOptions] - Optional resource options,\n * see {@link PIXI.autoDetectResource autoDetectResource}\n */\n constructor(resource: R | ImageSource | string | any = null, options: IBaseTextureOptions = null)\n {\n super();\n\n options = options || {};\n\n const { alphaMode, mipmap, anisotropicLevel, scaleMode, width, height,\n wrapMode, format, type, target, resolution, resourceOptions } = options;\n\n // Convert the resource to a Resource object\n if (resource && !(resource instanceof Resource))\n {\n resource = autoDetectResource(resource, resourceOptions);\n resource.internal = true;\n }\n\n this.resolution = resolution || settings.RESOLUTION;\n this.width = Math.round((width || 0) * this.resolution) / this.resolution;\n this.height = Math.round((height || 0) * this.resolution) / this.resolution;\n this._mipmap = mipmap !== undefined ? mipmap : settings.MIPMAP_TEXTURES;\n this.anisotropicLevel = anisotropicLevel !== undefined ? anisotropicLevel : settings.ANISOTROPIC_LEVEL;\n this._wrapMode = wrapMode || settings.WRAP_MODE;\n this._scaleMode = scaleMode !== undefined ? scaleMode : settings.SCALE_MODE;\n this.format = format || FORMATS.RGBA;\n this.type = type || TYPES.UNSIGNED_BYTE;\n this.target = target || TARGETS.TEXTURE_2D;\n this.alphaMode = alphaMode !== undefined ? alphaMode : ALPHA_MODES.UNPACK;\n\n this.uid = uid();\n this.touched = 0;\n this.isPowerOfTwo = false;\n this._refreshPOT();\n\n this._glTextures = {};\n this.dirtyId = 0;\n this.dirtyStyleId = 0;\n this.cacheId = null;\n this.valid = width > 0 && height > 0;\n this.textureCacheIds = [];\n this.destroyed = false;\n this.resource = null;\n\n this._batchEnabled = 0;\n this._batchLocation = 0;\n this.parentTextureArray = null;\n\n /**\n * Fired when a not-immediately-available source finishes loading.\n *\n * @protected\n * @event PIXI.BaseTexture#loaded\n * @param {PIXI.BaseTexture} baseTexture - Resource loaded.\n */\n\n /**\n * Fired when a not-immediately-available source fails to load.\n *\n * @protected\n * @event PIXI.BaseTexture#error\n * @param {PIXI.BaseTexture} baseTexture - Resource errored.\n * @param {ErrorEvent} event - Load error event.\n */\n\n /**\n * Fired when BaseTexture is updated.\n *\n * @protected\n * @event PIXI.BaseTexture#loaded\n * @param {PIXI.BaseTexture} baseTexture - Resource loaded.\n */\n\n /**\n * Fired when BaseTexture is updated.\n *\n * @protected\n * @event PIXI.BaseTexture#update\n * @param {PIXI.BaseTexture} baseTexture - Instance of texture being updated.\n */\n\n /**\n * Fired when BaseTexture is destroyed.\n *\n * @protected\n * @event PIXI.BaseTexture#dispose\n * @param {PIXI.BaseTexture} baseTexture - Instance of texture being destroyed.\n */\n\n // Set the resource\n this.setResource(resource);\n }\n\n /**\n * Pixel width of the source of this texture\n *\n * @readonly\n * @member {number}\n */\n get realWidth(): number\n {\n return Math.round(this.width * this.resolution);\n }\n\n /**\n * Pixel height of the source of this texture\n *\n * @readonly\n * @member {number}\n */\n get realHeight(): number\n {\n return Math.round(this.height * this.resolution);\n }\n\n /**\n * Mipmap mode of the texture, affects downscaled images\n *\n * @member {PIXI.MIPMAP_MODES}\n * @default PIXI.settings.MIPMAP_TEXTURES\n */\n get mipmap(): MIPMAP_MODES\n {\n return this._mipmap;\n }\n set mipmap(value: MIPMAP_MODES)\n {\n if (this._mipmap !== value)\n {\n this._mipmap = value;\n this.dirtyStyleId++;\n }\n }\n\n /**\n * The scale mode to apply when scaling this texture\n *\n * @member {PIXI.SCALE_MODES}\n * @default PIXI.settings.SCALE_MODE\n */\n get scaleMode(): SCALE_MODES\n {\n return this._scaleMode;\n }\n set scaleMode(value: SCALE_MODES)\n {\n if (this._scaleMode !== value)\n {\n this._scaleMode = value;\n this.dirtyStyleId++;\n }\n }\n\n /**\n * How the texture wraps\n * @member {PIXI.WRAP_MODES}\n * @default PIXI.settings.WRAP_MODE\n */\n get wrapMode(): WRAP_MODES\n {\n return this._wrapMode;\n }\n set wrapMode(value: WRAP_MODES)\n {\n if (this._wrapMode !== value)\n {\n this._wrapMode = value;\n this.dirtyStyleId++;\n }\n }\n\n /**\n * Changes style options of BaseTexture\n *\n * @param {PIXI.SCALE_MODES} [scaleMode] - Pixi scalemode\n * @param {PIXI.MIPMAP_MODES} [mipmap] - enable mipmaps\n * @returns {PIXI.BaseTexture} this\n */\n setStyle(scaleMode?: SCALE_MODES, mipmap?: MIPMAP_MODES): this\n {\n let dirty;\n\n if (scaleMode !== undefined && scaleMode !== this.scaleMode)\n {\n this.scaleMode = scaleMode;\n dirty = true;\n }\n\n if (mipmap !== undefined && mipmap !== this.mipmap)\n {\n this.mipmap = mipmap;\n dirty = true;\n }\n\n if (dirty)\n {\n this.dirtyStyleId++;\n }\n\n return this;\n }\n\n /**\n * Changes w/h/resolution. Texture becomes valid if width and height are greater than zero.\n *\n * @param {number} desiredWidth - Desired visual width\n * @param {number} desiredHeight - Desired visual height\n * @param {number} [resolution] - Optionally set resolution\n * @returns {PIXI.BaseTexture} this\n */\n setSize(desiredWidth: number, desiredHeight: number, resolution?: number): this\n {\n resolution = resolution || this.resolution;\n\n return this.setRealSize(desiredWidth * resolution, desiredHeight * resolution, resolution);\n }\n\n /**\n * Sets real size of baseTexture, preserves current resolution.\n *\n * @param {number} realWidth - Full rendered width\n * @param {number} realHeight - Full rendered height\n * @param {number} [resolution] - Optionally set resolution\n * @returns {PIXI.BaseTexture} this\n */\n setRealSize(realWidth: number, realHeight: number, resolution?: number): this\n {\n this.resolution = resolution || this.resolution;\n this.width = Math.round(realWidth) / this.resolution;\n this.height = Math.round(realHeight) / this.resolution;\n this._refreshPOT();\n this.update();\n\n return this;\n }\n\n /**\n * Refresh check for isPowerOfTwo texture based on size\n *\n * @private\n */\n protected _refreshPOT(): void\n {\n this.isPowerOfTwo = isPow2(this.realWidth) && isPow2(this.realHeight);\n }\n\n /**\n * Changes resolution\n *\n * @param {number} resolution - res\n * @returns {PIXI.BaseTexture} this\n */\n setResolution(resolution: number): this\n {\n const oldResolution = this.resolution;\n\n if (oldResolution === resolution)\n {\n return this;\n }\n\n this.resolution = resolution;\n\n if (this.valid)\n {\n this.width = Math.round(this.width * oldResolution) / resolution;\n this.height = Math.round(this.height * oldResolution) / resolution;\n this.emit('update', this);\n }\n\n this._refreshPOT();\n\n return this;\n }\n\n /**\n * Sets the resource if it wasn't set. Throws error if resource already present\n *\n * @param {PIXI.Resource} resource - that is managing this BaseTexture\n * @returns {PIXI.BaseTexture} this\n */\n setResource(resource: R): this\n {\n if (this.resource === resource)\n {\n return this;\n }\n\n if (this.resource)\n {\n throw new Error('Resource can be set only once');\n }\n\n resource.bind(this);\n\n this.resource = resource;\n\n return this;\n }\n\n /**\n * Invalidates the object. Texture becomes valid if width and height are greater than zero.\n */\n update(): void\n {\n if (!this.valid)\n {\n if (this.width > 0 && this.height > 0)\n {\n this.valid = true;\n this.emit('loaded', this);\n this.emit('update', this);\n }\n }\n else\n {\n this.dirtyId++;\n this.dirtyStyleId++;\n this.emit('update', this);\n }\n }\n\n /**\n * Handle errors with resources.\n * @private\n * @param {ErrorEvent} event - Error event emitted.\n */\n onError(event: ErrorEvent): void\n {\n this.emit('error', this, event);\n }\n\n /**\n * Destroys this base texture.\n * The method stops if resource doesn't want this texture to be destroyed.\n * Removes texture from all caches.\n */\n destroy(): void\n {\n // remove and destroy the resource\n if (this.resource)\n {\n this.resource.unbind(this);\n // only destroy resourced created internally\n if (this.resource.internal)\n {\n this.resource.destroy();\n }\n this.resource = null;\n }\n\n if (this.cacheId)\n {\n delete BaseTextureCache[this.cacheId];\n delete TextureCache[this.cacheId];\n\n this.cacheId = null;\n }\n\n // finally let the WebGL renderer know..\n this.dispose();\n\n BaseTexture.removeFromCache(this);\n this.textureCacheIds = null;\n\n this.destroyed = true;\n }\n\n /**\n * Frees the texture from WebGL memory without destroying this texture object.\n * This means you can still use the texture later which will upload it to GPU\n * memory again.\n *\n * @fires PIXI.BaseTexture#dispose\n */\n dispose(): void\n {\n this.emit('dispose', this);\n }\n\n /**\n * Utility function for BaseTexture|Texture cast\n */\n castToBaseTexture(): BaseTexture\n {\n return this;\n }\n\n /**\n * Helper function that creates a base texture based on the source you provide.\n * The source can be - image url, image element, canvas element. If the\n * source is an image url or an image element and not in the base texture\n * cache, it will be created and loaded.\n *\n * @static\n * @param {string|HTMLImageElement|HTMLCanvasElement|SVGElement|HTMLVideoElement} source - The\n * source to create base texture from.\n * @param {object} [options] - See {@link PIXI.BaseTexture}'s constructor for options.\n * @param {string} [options.pixiIdPrefix=pixiid] - If a source has no id, this is the prefix of the generated id\n * @param {boolean} [strict] - Enforce strict-mode, see {@link PIXI.settings.STRICT_TEXTURE_CACHE}.\n * @returns {PIXI.BaseTexture} The new base texture.\n */\n static from(source: ImageSource|string,\n options?: IBaseTextureOptions, strict = settings.STRICT_TEXTURE_CACHE): BaseTexture\n {\n const isFrame = typeof source === 'string';\n let cacheId = null;\n\n if (isFrame)\n {\n cacheId = source;\n }\n else\n {\n if (!(source as any)._pixiId)\n {\n const prefix = (options && options.pixiIdPrefix) || 'pixiid';\n\n (source as any)._pixiId = `${prefix}_${uid()}`;\n }\n\n cacheId = (source as any)._pixiId;\n }\n\n let baseTexture = BaseTextureCache[cacheId] as BaseTexture;\n\n // Strict-mode rejects invalid cacheIds\n if (isFrame && strict && !baseTexture)\n {\n throw new Error(`The cacheId \"${cacheId}\" does not exist in BaseTextureCache.`);\n }\n\n if (!baseTexture)\n {\n baseTexture = new BaseTexture(source, options);\n baseTexture.cacheId = cacheId;\n BaseTexture.addToCache(baseTexture, cacheId);\n }\n\n return baseTexture;\n }\n\n /**\n * Create a new BaseTexture with a BufferResource from a Float32Array.\n * RGBA values are floats from 0 to 1.\n * @static\n * @param {Float32Array|Uint8Array} buffer - The optional array to use, if no data\n * is provided, a new Float32Array is created.\n * @param {number} width - Width of the resource\n * @param {number} height - Height of the resource\n * @param {object} [options] - See {@link PIXI.BaseTexture}'s constructor for options.\n * @return {PIXI.BaseTexture} The resulting new BaseTexture\n */\n static fromBuffer(buffer: Float32Array|Uint8Array,\n width: number, height: number, options?: IBaseTextureOptions): BaseTexture\n {\n buffer = buffer || new Float32Array(width * height * 4);\n\n const resource = new BufferResource(buffer, { width, height });\n const type = buffer instanceof Float32Array ? TYPES.FLOAT : TYPES.UNSIGNED_BYTE;\n\n return new BaseTexture(resource, Object.assign(defaultBufferOptions, options || { width, height, type }));\n }\n\n /**\n * Adds a BaseTexture to the global BaseTextureCache. This cache is shared across the whole PIXI object.\n *\n * @static\n * @param {PIXI.BaseTexture} baseTexture - The BaseTexture to add to the cache.\n * @param {string} id - The id that the BaseTexture will be stored against.\n */\n static addToCache(baseTexture: BaseTexture, id: string): void\n {\n if (id)\n {\n if (baseTexture.textureCacheIds.indexOf(id) === -1)\n {\n baseTexture.textureCacheIds.push(id);\n }\n\n if (BaseTextureCache[id])\n {\n // eslint-disable-next-line no-console\n console.warn(`BaseTexture added to the cache with an id [${id}] that already had an entry`);\n }\n\n BaseTextureCache[id] = baseTexture;\n }\n }\n\n /**\n * Remove a BaseTexture from the global BaseTextureCache.\n *\n * @static\n * @param {string|PIXI.BaseTexture} baseTexture - id of a BaseTexture to be removed, or a BaseTexture instance itself.\n * @return {PIXI.BaseTexture|null} The BaseTexture that was removed.\n */\n static removeFromCache(baseTexture: string | BaseTexture): BaseTexture|null\n {\n if (typeof baseTexture === 'string')\n {\n const baseTextureFromCache = BaseTextureCache[baseTexture];\n\n if (baseTextureFromCache)\n {\n const index = baseTextureFromCache.textureCacheIds.indexOf(baseTexture);\n\n if (index > -1)\n {\n baseTextureFromCache.textureCacheIds.splice(index, 1);\n }\n\n delete BaseTextureCache[baseTexture];\n\n return baseTextureFromCache;\n }\n }\n else if (baseTexture && baseTexture.textureCacheIds)\n {\n for (let i = 0; i < baseTexture.textureCacheIds.length; ++i)\n {\n delete BaseTextureCache[baseTexture.textureCacheIds[i]];\n }\n\n baseTexture.textureCacheIds.length = 0;\n\n return baseTexture;\n }\n\n return null;\n }\n\n /**\n * Global number of the texture batch, used by multi-texture renderers\n *\n * @static\n * @member {number}\n */\n static _globalBatch = 0;\n}\n","import { Resource } from './Resource';\nimport { BaseTexture } from '../BaseTexture';\nimport { ISize } from '@pixi/math';\nimport { autoDetectResource, IAutoDetectOptions } from './autoDetectResource';\n\n/**\n * Resource that can manage several resource (items) inside.\n * All resources need to have the same pixel size.\n * Parent class for CubeResource and ArrayResource\n *\n * @memberof PIXI\n */\nexport abstract class AbstractMultiResource extends Resource\n{\n /** Number of elements in array. */\n readonly length: number;\n\n /**\n * Collection of partial baseTextures that correspond to resources.\n *\n * @readonly\n */\n items: Array;\n\n /**\n * Dirty IDs for each part.\n *\n * @readonly\n */\n itemDirtyIds: Array;\n\n /**\n * Promise when loading.\n *\n * @default null\n */\n private _load: Promise;\n\n /** Bound baseTexture, there can only be one. */\n baseTexture: BaseTexture;\n\n /**\n * @param length\n * @param options - Options to for Resource constructor\n * @param {number} [options.width] - Width of the resource\n * @param {number} [options.height] - Height of the resource\n */\n constructor(length: number, options?: ISize)\n {\n const { width, height } = options || {};\n\n super(width, height);\n\n this.items = [];\n this.itemDirtyIds = [];\n\n for (let i = 0; i < length; i++)\n {\n const partTexture = new BaseTexture();\n\n this.items.push(partTexture);\n // -2 - first run of texture array upload\n // -1 - texture item was allocated\n // >=0 - texture item uploaded , in sync with items[i].dirtyId\n this.itemDirtyIds.push(-2);\n }\n\n this.length = length;\n this._load = null;\n this.baseTexture = null;\n }\n\n /**\n * Used from ArrayResource and CubeResource constructors.\n *\n * @param resources - Can be resources, image elements, canvas, etc. ,\n * length should be same as constructor length\n * @param options - Detect options for resources\n */\n protected initFromArray(resources: Array, options?: IAutoDetectOptions): void\n {\n for (let i = 0; i < this.length; i++)\n {\n if (!resources[i])\n {\n continue;\n }\n if (resources[i].castToBaseTexture)\n {\n this.addBaseTextureAt(resources[i].castToBaseTexture(), i);\n }\n else if (resources[i] instanceof Resource)\n {\n this.addResourceAt(resources[i], i);\n }\n else\n {\n this.addResourceAt(autoDetectResource(resources[i], options), i);\n }\n }\n }\n\n /** Destroy this BaseImageResource. */\n dispose(): void\n {\n for (let i = 0, len = this.length; i < len; i++)\n {\n this.items[i].destroy();\n }\n this.items = null;\n this.itemDirtyIds = null;\n this._load = null;\n }\n\n /**\n * Set a baseTexture by ID\n *\n * @param baseTexture\n * @param index - Zero-based index of resource to set\n * @return - Instance for chaining\n */\n abstract addBaseTextureAt(baseTexture: BaseTexture, index: number): this;\n\n /**\n * Set a resource by ID\n *\n * @param resource\n * @param index - Zero-based index of resource to set\n * @return - Instance for chaining\n */\n addResourceAt(resource: Resource, index: number): this\n {\n if (!this.items[index])\n {\n throw new Error(`Index ${index} is out of bounds`);\n }\n\n // Inherit the first resource dimensions\n if (resource.valid && !this.valid)\n {\n this.resize(resource.width, resource.height);\n }\n\n this.items[index].setResource(resource);\n\n return this;\n }\n\n /** Set the parent base texture. */\n bind(baseTexture: BaseTexture): void\n {\n if (this.baseTexture !== null)\n {\n throw new Error('Only one base texture per TextureArray is allowed');\n }\n super.bind(baseTexture);\n\n for (let i = 0; i < this.length; i++)\n {\n this.items[i].parentTextureArray = baseTexture;\n this.items[i].on('update', baseTexture.update, baseTexture);\n }\n }\n\n /** Unset the parent base texture. */\n unbind(baseTexture: BaseTexture): void\n {\n super.unbind(baseTexture);\n\n for (let i = 0; i < this.length; i++)\n {\n this.items[i].parentTextureArray = null;\n this.items[i].off('update', baseTexture.update, baseTexture);\n }\n }\n\n /**\n * Load all the resources simultaneously\n *\n * @return - When load is resolved\n */\n load(): Promise\n {\n if (this._load)\n {\n return this._load;\n }\n\n const resources = this.items.map((item) => item.resource).filter((item) => item);\n\n // TODO: also implement load part-by-part strategy\n const promises = resources.map((item) => item.load());\n\n this._load = Promise.all(promises)\n .then(() =>\n {\n const { realWidth, realHeight } = this.items[0];\n\n this.resize(realWidth, realHeight);\n\n return Promise.resolve(this);\n }\n );\n\n return this._load;\n }\n}\n","import { AbstractMultiResource } from './AbstractMultiResource';\nimport { TARGETS } from '@pixi/constants';\nimport { BaseTexture } from '../BaseTexture';\n\nimport type { BaseImageResource } from './BaseImageResource';\nimport type { Renderer } from '../../Renderer';\nimport type { GLTexture } from '../GLTexture';\nimport type { ISize } from '@pixi/math';\n\n/**\n * A resource that contains a number of sources.\n *\n * @memberof PIXI\n */\nexport class ArrayResource extends AbstractMultiResource\n{\n /**\n * @param source - Number of items in array or the collection\n * of image URLs to use. Can also be resources, image elements, canvas, etc.\n * @param options - Options to apply to {@link PIXI.autoDetectResource}\n * @param {number} [options.width] - Width of the resource\n * @param {number} [options.height] - Height of the resource\n */\n constructor(source: number|Array, options?: ISize)\n {\n const { width, height } = options || {};\n\n let urls;\n let length: number;\n\n if (Array.isArray(source))\n {\n urls = source;\n length = source.length;\n }\n else\n {\n length = source;\n }\n\n super(length, { width, height });\n\n if (urls)\n {\n this.initFromArray(urls, options);\n }\n }\n\n /**\n * Set a baseTexture by ID,\n * ArrayResource just takes resource from it, nothing more\n *\n * @param baseTexture\n * @param index - Zero-based index of resource to set\n * @return - Instance for chaining\n */\n addBaseTextureAt(baseTexture: BaseTexture, index: number): this\n {\n if (baseTexture.resource)\n {\n this.addResourceAt(baseTexture.resource, index);\n }\n else\n {\n throw new Error('ArrayResource does not support RenderTexture');\n }\n\n return this;\n }\n\n /** Add binding */\n bind(baseTexture: BaseTexture): void\n {\n super.bind(baseTexture);\n\n baseTexture.target = TARGETS.TEXTURE_2D_ARRAY;\n }\n\n /**\n * Upload the resources to the GPU.\n *\n * @param renderer\n * @param texture\n * @param glTexture\n * @returns - whether texture was uploaded\n */\n upload(renderer: Renderer, texture: BaseTexture, glTexture: GLTexture): boolean\n {\n const { length, itemDirtyIds, items } = this;\n const { gl } = renderer;\n\n if (glTexture.dirtyId < 0)\n {\n gl.texImage3D(\n gl.TEXTURE_2D_ARRAY,\n 0,\n glTexture.internalFormat,\n this._width,\n this._height,\n length,\n 0,\n texture.format,\n glTexture.type,\n null\n );\n }\n\n for (let i = 0; i < length; i++)\n {\n const item = items[i];\n\n if (itemDirtyIds[i] < item.dirtyId)\n {\n itemDirtyIds[i] = item.dirtyId;\n if (item.valid)\n {\n gl.texSubImage3D(\n gl.TEXTURE_2D_ARRAY,\n 0,\n 0, // xoffset\n 0, // yoffset\n i, // zoffset\n item.resource.width,\n item.resource.height,\n 1,\n texture.format,\n glTexture.type,\n (item.resource as BaseImageResource).source\n );\n }\n }\n }\n\n return true;\n }\n}\n","import { Resource } from './Resource';\nimport { determineCrossOrigin } from '@pixi/utils';\nimport { ALPHA_MODES } from '@pixi/constants';\n\nimport type { BaseTexture, ImageSource } from '../BaseTexture';\nimport type { Renderer } from '../../Renderer';\nimport type { GLTexture } from '../GLTexture';\n\n/**\n * Base for all the image/canvas resources.\n *\n * @memberof PIXI\n */\nexport class BaseImageResource extends Resource\n{\n /**\n * The source element.\n *\n * @member {HTMLImageElement|HTMLCanvasElement|HTMLVideoElement|SVGElement}\n * @readonly\n */\n public source: ImageSource;\n\n /**\n * If set to `true`, will force `texImage2D` over `texSubImage2D` for uploading.\n * Certain types of media (e.g. video) using `texImage2D` is more performant.\n *\n * @default false\n * @private\n */\n public noSubImage: boolean;\n\n /**\n * @param {HTMLImageElement|HTMLCanvasElement|HTMLVideoElement|SVGElement} source\n */\n constructor(source: ImageSource)\n {\n const sourceAny = source as any;\n const width = sourceAny.naturalWidth || sourceAny.videoWidth || sourceAny.width;\n const height = sourceAny.naturalHeight || sourceAny.videoHeight || sourceAny.height;\n\n super(width, height);\n\n this.source = source;\n this.noSubImage = false;\n }\n\n /**\n * Set cross origin based detecting the url and the crossorigin\n *\n * @param element - Element to apply crossOrigin\n * @param url - URL to check\n * @param crossorigin - Cross origin value to use\n */\n static crossOrigin(element: HTMLImageElement|HTMLVideoElement, url: string, crossorigin?: boolean|string): void\n {\n if (crossorigin === undefined && url.indexOf('data:') !== 0)\n {\n element.crossOrigin = determineCrossOrigin(url);\n }\n else if (crossorigin !== false)\n {\n element.crossOrigin = typeof crossorigin === 'string' ? crossorigin : 'anonymous';\n }\n }\n\n /**\n * Upload the texture to the GPU.\n *\n * @param renderer - Upload to the renderer\n * @param baseTexture - Reference to parent texture\n * @param glTexture\n * @param {HTMLImageElement|HTMLCanvasElement|HTMLVideoElement|SVGElement} [source] - (optional)\n * @returns - true is success\n */\n upload(renderer: Renderer, baseTexture: BaseTexture, glTexture: GLTexture, source?: ImageSource): boolean\n {\n const gl = renderer.gl;\n const width = baseTexture.realWidth;\n const height = baseTexture.realHeight;\n\n source = source || this.source;\n\n gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, baseTexture.alphaMode === ALPHA_MODES.UNPACK);\n\n if (!this.noSubImage\n && baseTexture.target === gl.TEXTURE_2D\n && glTexture.width === width\n && glTexture.height === height)\n {\n gl.texSubImage2D(gl.TEXTURE_2D, 0, 0, 0, baseTexture.format, glTexture.type, source);\n }\n else\n {\n glTexture.width = width;\n glTexture.height = height;\n\n gl.texImage2D(baseTexture.target, 0, glTexture.internalFormat, baseTexture.format, glTexture.type, source);\n }\n\n return true;\n }\n\n /**\n * Checks if source width/height was changed, resize can cause extra baseTexture update.\n * Triggers one update in any case.\n */\n update(): void\n {\n if (this.destroyed)\n {\n return;\n }\n\n const source = this.source as any;\n\n const width = source.naturalWidth || source.videoWidth || source.width;\n const height = source.naturalHeight || source.videoHeight || source.height;\n\n this.resize(width, height);\n\n super.update();\n }\n\n /** Destroy this {@link BaseImageResource} */\n dispose(): void\n {\n this.source = null;\n }\n}\n","import { BaseImageResource } from './BaseImageResource';\n\n/**\n * @interface OffscreenCanvas\n */\n\n/**\n * Resource type for HTMLCanvasElement.\n *\n * @memberof PIXI\n */\nexport class CanvasResource extends BaseImageResource\n{\n /**\n * @param source - Canvas element to use\n */\n // eslint-disable-next-line @typescript-eslint/no-useless-constructor\n constructor(source: HTMLCanvasElement)\n {\n super(source);\n }\n\n /**\n * Used to auto-detect the type of resource.\n *\n * @param {*} source - The source object\n * @return {boolean} `true` if source is HTMLCanvasElement or OffscreenCanvas\n */\n static test(source: unknown): source is OffscreenCanvas|HTMLCanvasElement\n {\n const { OffscreenCanvas } = self;\n\n // Check for browsers that don't yet support OffscreenCanvas\n if (OffscreenCanvas && source instanceof OffscreenCanvas)\n {\n return true;\n }\n\n return self.HTMLCanvasElement && source instanceof HTMLCanvasElement;\n }\n}\n","import { AbstractMultiResource } from './AbstractMultiResource';\nimport { TARGETS } from '@pixi/constants';\n\nimport type { Resource } from './Resource';\nimport type { ISize } from '@pixi/math';\nimport type { ArrayFixed } from '@pixi/utils';\nimport type { BaseTexture } from '../BaseTexture';\nimport type { Renderer } from '../../Renderer';\nimport type { GLTexture } from '../GLTexture';\n\n/**\n * Constructor options for CubeResource\n */\nexport interface ICubeResourceOptions extends ISize\n{\n /** Whether to auto-load resources */\n autoLoad?: boolean;\n\n /** In case BaseTextures are supplied, whether to copy them or use. */\n linkBaseTexture?: boolean;\n}\n\n/**\n * Resource for a CubeTexture which contains six resources.\n *\n * @memberof PIXI\n */\nexport class CubeResource extends AbstractMultiResource\n{\n items: ArrayFixed;\n\n /**\n * In case BaseTextures are supplied, whether to use same resource or bind baseTexture itself.\n *\n * @protected\n */\n linkBaseTexture: boolean;\n\n /**\n * @param {Array} [source] - Collection of URLs or resources\n * to use as the sides of the cube.\n * @param options - ImageResource options\n * @param {number} [options.width] - Width of resource\n * @param {number} [options.height] - Height of resource\n * @param {number} [options.autoLoad=true] - Whether to auto-load resources\n * @param {number} [options.linkBaseTexture=true] - In case BaseTextures are supplied,\n * whether to copy them or use\n */\n constructor(source?: ArrayFixed, options?: ICubeResourceOptions)\n {\n const { width, height, autoLoad, linkBaseTexture } = options || {};\n\n if (source && source.length !== CubeResource.SIDES)\n {\n throw new Error(`Invalid length. Got ${source.length}, expected 6`);\n }\n\n super(6, { width, height });\n\n for (let i = 0; i < CubeResource.SIDES; i++)\n {\n this.items[i].target = TARGETS.TEXTURE_CUBE_MAP_POSITIVE_X + i;\n }\n\n this.linkBaseTexture = linkBaseTexture !== false;\n\n if (source)\n {\n this.initFromArray(source, options);\n }\n\n if (autoLoad !== false)\n {\n this.load();\n }\n }\n\n /**\n * Add binding.\n *\n * @param baseTexture - parent base texture\n */\n bind(baseTexture: BaseTexture): void\n {\n super.bind(baseTexture);\n\n baseTexture.target = TARGETS.TEXTURE_CUBE_MAP;\n }\n\n addBaseTextureAt(baseTexture: BaseTexture, index: number, linkBaseTexture?: boolean): this\n {\n if (linkBaseTexture === undefined)\n {\n linkBaseTexture = this.linkBaseTexture;\n }\n\n if (!this.items[index])\n {\n throw new Error(`Index ${index} is out of bounds`);\n }\n\n if (!this.linkBaseTexture\n || baseTexture.parentTextureArray\n || Object.keys(baseTexture._glTextures).length > 0)\n {\n // copy mode\n if (baseTexture.resource)\n {\n this.addResourceAt(baseTexture.resource, index);\n }\n else\n {\n throw new Error(`CubeResource does not support copying of renderTexture.`);\n }\n }\n else\n {\n // link mode, the difficult one!\n baseTexture.target = TARGETS.TEXTURE_CUBE_MAP_POSITIVE_X + index;\n baseTexture.parentTextureArray = this.baseTexture;\n\n this.items[index] = baseTexture;\n }\n\n if (baseTexture.valid && !this.valid)\n {\n this.resize(baseTexture.realWidth, baseTexture.realHeight);\n }\n\n this.items[index] = baseTexture;\n\n return this;\n }\n\n /**\n * Upload the resource\n *\n * @returns {boolean} true is success\n */\n upload(renderer: Renderer, _baseTexture: BaseTexture, glTexture: GLTexture): boolean\n {\n const dirty = this.itemDirtyIds;\n\n for (let i = 0; i < CubeResource.SIDES; i++)\n {\n const side = this.items[i];\n\n if (dirty[i] < side.dirtyId)\n {\n if (side.valid && side.resource)\n {\n side.resource.upload(renderer, side, glTexture);\n dirty[i] = side.dirtyId;\n }\n else if (dirty[i] < -1)\n {\n // either item is not valid yet, either its a renderTexture\n // allocate the memory\n renderer.gl.texImage2D(side.target, 0,\n glTexture.internalFormat,\n _baseTexture.realWidth,\n _baseTexture.realHeight,\n 0,\n _baseTexture.format,\n glTexture.type,\n null);\n dirty[i] = -1;\n }\n }\n }\n\n return true;\n }\n\n /** Number of texture sides to store for CubeResources. */\n static SIDES = 6;\n\n /**\n * Used to auto-detect the type of resource.\n *\n * @param {*} source - The source object\n * @return {boolean} `true` if source is an array of 6 elements\n */\n static test(source: unknown): source is ArrayFixed\n {\n return Array.isArray(source) && source.length === CubeResource.SIDES;\n }\n}\n","import { BaseImageResource } from './BaseImageResource';\nimport { settings } from '@pixi/settings';\nimport { ALPHA_MODES } from '@pixi/constants';\n\nimport type { BaseTexture } from '../BaseTexture';\nimport type { Renderer } from '../../Renderer';\nimport type { GLTexture } from '../GLTexture';\n\nexport interface IImageResourceOptions\n{\n /** Start loading process */\n autoLoad?: boolean;\n\n /** Whether its required to create a bitmap before upload. */\n createBitmap?: boolean;\n\n /** Load image using cross origin. */\n crossorigin?: boolean|string;\n\n /** Premultiply image alpha in bitmap. */\n alphaMode?: ALPHA_MODES;\n}\n\n/**\n * Resource type for HTMLImageElement.\n *\n * @memberof PIXI\n */\nexport class ImageResource extends BaseImageResource\n{\n /** URL of the image source */\n url: string;\n\n /**\n * If the image should be disposed after upload\n *\n * @default false\n */\n preserveBitmap: boolean;\n\n /**\n * If capable, convert the image using createImageBitmap API.\n *\n * @default PIXI.settings.CREATE_IMAGE_BITMAP\n */\n createBitmap: boolean;\n\n /**\n * Controls texture alphaMode field\n * Copies from options\n * Default is `null`, copies option from baseTexture\n *\n * @readonly\n */\n alphaMode: ALPHA_MODES;\n\n /**\n * The ImageBitmap element created for a {@code HTMLImageElement}.\n *\n * @default null\n */\n bitmap: ImageBitmap;\n\n /**\n * Promise when loading.\n *\n * @default null\n */\n private _load: Promise;\n\n /** When process is completed */\n private _process: Promise;\n\n /**\n * @param source - image source or URL\n * @param options\n * @param {boolean} [options.autoLoad=true] - start loading process\n * @param {boolean} [options.createBitmap=PIXI.settings.CREATE_IMAGE_BITMAP] - whether its required to create\n * a bitmap before upload\n * @param {boolean} [options.crossorigin=true] - Load image using cross origin\n * @param {PIXI.ALPHA_MODES} [options.alphaMode=PIXI.ALPHA_MODES.UNPACK] - Premultiply image alpha in bitmap\n */\n constructor(source: HTMLImageElement|string, options?: IImageResourceOptions)\n {\n options = options || {};\n\n if (!(source instanceof HTMLImageElement))\n {\n const imageElement = new Image();\n\n BaseImageResource.crossOrigin(imageElement, source, options.crossorigin);\n\n imageElement.src = source;\n source = imageElement;\n }\n\n super(source);\n\n // FireFox 68, and possibly other versions, seems like setting the HTMLImageElement#width and #height\n // to non-zero values before its loading completes if images are in a cache.\n // Because of this, need to set the `_width` and the `_height` to zero to avoid uploading incomplete images.\n // Please refer to the issue #5968 (https://github.com/pixijs/pixi.js/issues/5968).\n if (!source.complete && !!this._width && !!this._height)\n {\n this._width = 0;\n this._height = 0;\n }\n\n this.url = source.src;\n\n this._process = null;\n\n this.preserveBitmap = false;\n this.createBitmap = (options.createBitmap !== undefined\n ? options.createBitmap : settings.CREATE_IMAGE_BITMAP) && !!self.createImageBitmap;\n this.alphaMode = typeof options.alphaMode === 'number' ? options.alphaMode : null;\n this.bitmap = null;\n\n this._load = null;\n\n if (options.autoLoad !== false)\n {\n this.load();\n }\n }\n\n /**\n * Returns a promise when image will be loaded and processed.\n *\n * @param createBitmap - whether process image into bitmap\n */\n load(createBitmap?: boolean): Promise\n {\n if (this._load)\n {\n return this._load;\n }\n\n if (createBitmap !== undefined)\n {\n this.createBitmap = createBitmap;\n }\n\n this._load = new Promise((resolve, reject): void =>\n {\n const source = this.source as HTMLImageElement;\n\n this.url = source.src;\n\n const completed = (): void =>\n {\n if (this.destroyed)\n {\n return;\n }\n source.onload = null;\n source.onerror = null;\n\n this.resize(source.width, source.height);\n this._load = null;\n\n if (this.createBitmap)\n {\n resolve(this.process());\n }\n else\n {\n resolve(this);\n }\n };\n\n if (source.complete && source.src)\n {\n completed();\n }\n else\n {\n source.onload = completed;\n source.onerror = (event): void =>\n {\n // Avoids Promise freezing when resource broken\n reject(event);\n this.onError.emit(event);\n };\n }\n });\n\n return this._load;\n }\n\n /**\n * Called when we need to convert image into BitmapImage.\n * Can be called multiple times, real promise is cached inside.\n *\n * @return - Cached promise to fill that bitmap\n */\n process(): Promise\n {\n const source = this.source as HTMLImageElement;\n\n if (this._process !== null)\n {\n return this._process;\n }\n if (this.bitmap !== null || !self.createImageBitmap)\n {\n return Promise.resolve(this);\n }\n\n const createImageBitmap = self.createImageBitmap as any;\n const cors = !source.crossOrigin || source.crossOrigin === 'anonymous';\n\n this._process = fetch(source.src,\n {\n mode: cors ? 'cors' : 'no-cors'\n })\n .then((r) => r.blob())\n .then((blob) => createImageBitmap(blob,\n 0, 0, source.width, source.height,\n {\n premultiplyAlpha: this.alphaMode === ALPHA_MODES.UNPACK ? 'premultiply' : 'none',\n }))\n .then((bitmap: ImageBitmap) =>\n {\n if (this.destroyed)\n {\n return Promise.reject();\n }\n this.bitmap = bitmap;\n this.update();\n this._process = null;\n\n return Promise.resolve(this);\n });\n\n return this._process;\n }\n\n /**\n * Upload the image resource to GPU.\n *\n * @param renderer - Renderer to upload to\n * @param baseTexture - BaseTexture for this resource\n * @param glTexture - GLTexture to use\n * @returns {boolean} true is success\n */\n upload(renderer: Renderer, baseTexture: BaseTexture, glTexture: GLTexture): boolean\n {\n if (typeof this.alphaMode === 'number')\n {\n // bitmap stores unpack premultiply flag, we dont have to notify texImage2D about it\n\n baseTexture.alphaMode = this.alphaMode;\n }\n\n if (!this.createBitmap)\n {\n return super.upload(renderer, baseTexture, glTexture);\n }\n if (!this.bitmap)\n {\n // yeah, ignore the output\n this.process();\n if (!this.bitmap)\n {\n return false;\n }\n }\n\n super.upload(renderer, baseTexture, glTexture, this.bitmap);\n\n if (!this.preserveBitmap)\n {\n // checks if there are other renderers that possibly need this bitmap\n\n let flag = true;\n\n const glTextures = baseTexture._glTextures;\n\n for (const key in glTextures)\n {\n const otherTex = glTextures[key];\n\n if (otherTex !== glTexture && otherTex.dirtyId !== baseTexture.dirtyId)\n {\n flag = false;\n break;\n }\n }\n\n if (flag)\n {\n if (this.bitmap.close)\n {\n this.bitmap.close();\n }\n\n this.bitmap = null;\n }\n }\n\n return true;\n }\n\n /** Destroys this resource. */\n dispose(): void\n {\n (this.source as HTMLImageElement).onload = null;\n (this.source as HTMLImageElement).onerror = null;\n\n super.dispose();\n\n if (this.bitmap)\n {\n this.bitmap.close();\n this.bitmap = null;\n }\n this._process = null;\n this._load = null;\n }\n\n /**\n * Used to auto-detect the type of resource.\n *\n * @param {*} source - The source object\n * @return {boolean} `true` if source is string or HTMLImageElement\n */\n static test(source: unknown): source is string|HTMLImageElement\n {\n return typeof source === 'string' || source instanceof HTMLImageElement;\n }\n}\n","import { uid } from '@pixi/utils';\nimport { BaseImageResource } from './BaseImageResource';\n\nimport type { ISize } from '@pixi/math';\n\nexport interface ISVGResourceOptions\n{\n source?: string;\n scale?: number;\n width?: number;\n height?: number;\n autoLoad?: boolean;\n crossorigin?: boolean|string;\n}\n/**\n * Resource type for SVG elements and graphics.\n *\n * @memberof PIXI\n */\nexport class SVGResource extends BaseImageResource\n{\n /** Base64 encoded SVG element or URL for SVG file. */\n public readonly svg: string;\n\n /** The source scale to apply when rasterizing on load. */\n public readonly scale: number;\n\n /** A width override for rasterization on load. */\n public readonly _overrideWidth: number;\n\n /** A height override for rasterization on load. */\n public readonly _overrideHeight: number;\n\n /** Call when completely loaded. */\n private _resolve: () => void;\n\n /** Promise when loading */\n private _load: Promise;\n\n /** Cross origin value to use */\n private _crossorigin?: boolean|string;\n\n /**\n * @param sourceBase64 - Base64 encoded SVG element or URL for SVG file.\n * @param {object} [options] - Options to use\n * @param {number} [options.scale=1] - Scale to apply to SVG. Overridden by...\n * @param {number} [options.width] - Rasterize SVG this wide. Aspect ratio preserved if height not specified.\n * @param {number} [options.height] - Rasterize SVG this high. Aspect ratio preserved if width not specified.\n * @param {boolean} [options.autoLoad=true] - Start loading right away.\n */\n constructor(sourceBase64: string, options?: ISVGResourceOptions)\n {\n options = options || {};\n\n super(document.createElement('canvas'));\n this._width = 0;\n this._height = 0;\n\n this.svg = sourceBase64;\n this.scale = options.scale || 1;\n this._overrideWidth = options.width;\n this._overrideHeight = options.height;\n\n this._resolve = null;\n this._crossorigin = options.crossorigin;\n this._load = null;\n\n if (options.autoLoad !== false)\n {\n this.load();\n }\n }\n\n load(): Promise\n {\n if (this._load)\n {\n return this._load;\n }\n\n this._load = new Promise((resolve): void =>\n {\n // Save this until after load is finished\n this._resolve = (): void =>\n {\n this.resize(this.source.width, this.source.height);\n resolve(this);\n };\n\n // Convert SVG inline string to data-uri\n if (SVGResource.SVG_XML.test(this.svg.trim()))\n {\n if (!btoa)\n {\n throw new Error('Your browser doesn\\'t support base64 conversions.');\n }\n (this as any).svg = `data:image/svg+xml;base64,${btoa(unescape(encodeURIComponent(this.svg)))}`;\n }\n\n this._loadSvg();\n });\n\n return this._load;\n }\n\n /** Loads an SVG image from `imageUrl` or `data URL`. */\n private _loadSvg(): void\n {\n const tempImage = new Image();\n\n BaseImageResource.crossOrigin(tempImage, this.svg, this._crossorigin);\n tempImage.src = this.svg;\n\n tempImage.onerror = (event): void =>\n {\n if (!this._resolve)\n {\n return;\n }\n\n tempImage.onerror = null;\n this.onError.emit(event);\n };\n\n tempImage.onload = (): void =>\n {\n if (!this._resolve)\n {\n return;\n }\n\n const svgWidth = tempImage.width;\n const svgHeight = tempImage.height;\n\n if (!svgWidth || !svgHeight)\n {\n throw new Error('The SVG image must have width and height defined (in pixels), canvas API needs them.');\n }\n\n // Set render size\n let width = svgWidth * this.scale;\n let height = svgHeight * this.scale;\n\n if (this._overrideWidth || this._overrideHeight)\n {\n width = this._overrideWidth || this._overrideHeight / svgHeight * svgWidth;\n height = this._overrideHeight || this._overrideWidth / svgWidth * svgHeight;\n }\n width = Math.round(width);\n height = Math.round(height);\n\n // Create a canvas element\n const canvas = this.source as HTMLCanvasElement;\n\n canvas.width = width;\n canvas.height = height;\n (canvas as any)._pixiId = `canvas_${uid()}`;\n\n // Draw the Svg to the canvas\n canvas\n .getContext('2d')\n .drawImage(tempImage, 0, 0, svgWidth, svgHeight, 0, 0, width, height);\n\n this._resolve();\n this._resolve = null;\n };\n }\n\n /**\n * Get size from an svg string using a regular expression.\n *\n * @param svgString - a serialized svg element\n * @return - image extension\n */\n static getSize(svgString?: string): ISize\n {\n const sizeMatch = SVGResource.SVG_SIZE.exec(svgString);\n const size: any = {};\n\n if (sizeMatch)\n {\n size[sizeMatch[1]] = Math.round(parseFloat(sizeMatch[3]));\n size[sizeMatch[5]] = Math.round(parseFloat(sizeMatch[7]));\n }\n\n return size;\n }\n\n /** Destroys this texture. */\n dispose(): void\n {\n super.dispose();\n this._resolve = null;\n this._crossorigin = null;\n }\n\n /**\n * Used to auto-detect the type of resource.\n *\n * @param {*} source - The source object\n * @param {string} extension - The extension of source, if set\n * @return {boolean} - If the source is a SVG source or data file\n */\n static test(source: unknown, extension?: string): boolean\n {\n // url file extension is SVG\n return extension === 'svg'\n // source is SVG data-uri\n || (typeof source === 'string' && (/^data:image\\/svg\\+xml(;(charset=utf8|utf8))?;base64/).test(source))\n // source is SVG inline\n || (typeof source === 'string' && SVGResource.SVG_XML.test(source));\n }\n\n /**\n * Regular expression for SVG XML document.\n *\n * @example <?xml version=\"1.0\" encoding=\"utf-8\" ?><!-- image/svg --><svg\n * @readonly\n */\n static SVG_XML = /^(<\\?xml[^?]+\\?>)?\\s*()]*-->)?\\s*\\]*(?:\\s(width|height)=('|\")(\\d*(?:\\.\\d+)?)(?:px)?('|\"))[^>]*(?:\\s(width|height)=('|\")(\\d*(?:\\.\\d+)?)(?:px)?('|\"))[^>]*>/i; // eslint-disable-line max-len\n}\n","import { BaseImageResource } from './BaseImageResource';\nimport { Ticker } from '@pixi/ticker';\n\nimport type { Dict } from '@pixi/utils';\n\nexport interface IVideoResourceOptions\n{\n autoLoad?: boolean;\n autoPlay?: boolean;\n updateFPS?: number;\n crossorigin?: boolean|string;\n}\n\nexport interface IVideoResourceOptionsElement\n{\n src: string;\n mime: string;\n}\n\n/**\n * Resource type for {@code HTMLVideoElement}.\n *\n * @memberof PIXI\n */\nexport class VideoResource extends BaseImageResource\n{\n /** Override the source to be the video element. */\n public source: HTMLVideoElement;\n\n /**\n * `true` to use PIXI.Ticker.shared to auto update the base texture.\n *\n * @default true\n */\n protected _autoUpdate: boolean;\n\n /**\n * `true` if the instance is currently connected to PIXI.Ticker.shared to auto update the base texture.\n *\n * @default false\n */\n protected _isConnectedToTicker: boolean;\n protected _updateFPS: number;\n protected _msToNextUpdate: number;\n\n /**\n * When set to true will automatically play videos used by this texture once\n * they are loaded. If false, it will not modify the playing state.\n *\n * @default true\n */\n protected autoPlay: boolean;\n\n /**\n * Promise when loading.\n *\n * @default null\n */\n private _load: Promise;\n\n /** Callback when completed with load. */\n private _resolve: (value?: VideoResource | PromiseLike) => void;\n\n /**\n * @param {HTMLVideoElement|object|string|Array} source - Video element to use.\n * @param {object} [options] - Options to use\n * @param {boolean} [options.autoLoad=true] - Start loading the video immediately\n * @param {boolean} [options.autoPlay=true] - Start playing video immediately\n * @param {number} [options.updateFPS=0] - How many times a second to update the texture from the video.\n * Leave at 0 to update at every render.\n * @param {boolean} [options.crossorigin=true] - Load image using cross origin\n */\n constructor(source?: HTMLVideoElement|Array|string, options?: IVideoResourceOptions)\n {\n options = options || {};\n\n if (!(source instanceof HTMLVideoElement))\n {\n const videoElement = document.createElement('video');\n\n // workaround for https://github.com/pixijs/pixi.js/issues/5996\n videoElement.setAttribute('preload', 'auto');\n videoElement.setAttribute('webkit-playsinline', '');\n videoElement.setAttribute('playsinline', '');\n\n if (typeof source === 'string')\n {\n source = [source];\n }\n\n const firstSrc = (source[0] as IVideoResourceOptionsElement).src || source[0] as string;\n\n BaseImageResource.crossOrigin(videoElement, firstSrc, options.crossorigin);\n\n // array of objects or strings\n for (let i = 0; i < source.length; ++i)\n {\n const sourceElement = document.createElement('source');\n\n let { src, mime } = source[i] as IVideoResourceOptionsElement;\n\n src = src || source[i] as string;\n\n const baseSrc = src.split('?').shift().toLowerCase();\n const ext = baseSrc.substr(baseSrc.lastIndexOf('.') + 1);\n\n mime = mime || VideoResource.MIME_TYPES[ext] || `video/${ext}`;\n\n sourceElement.src = src;\n sourceElement.type = mime;\n\n videoElement.appendChild(sourceElement);\n }\n\n // Override the source\n source = videoElement;\n }\n\n super(source);\n\n this.noSubImage = true;\n\n this._autoUpdate = true;\n this._isConnectedToTicker = false;\n\n this._updateFPS = options.updateFPS || 0;\n this._msToNextUpdate = 0;\n this.autoPlay = options.autoPlay !== false;\n\n this._load = null;\n this._resolve = null;\n\n // Bind for listeners\n this._onCanPlay = this._onCanPlay.bind(this);\n this._onError = this._onError.bind(this);\n\n if (options.autoLoad !== false)\n {\n this.load();\n }\n }\n\n /**\n * Trigger updating of the texture.\n *\n * @param deltaTime - time delta since last tick\n */\n update(_deltaTime = 0): void\n {\n if (!this.destroyed)\n {\n // account for if video has had its playbackRate changed\n const elapsedMS = Ticker.shared.elapsedMS * (this.source as HTMLVideoElement).playbackRate;\n\n this._msToNextUpdate = Math.floor(this._msToNextUpdate - elapsedMS);\n if (!this._updateFPS || this._msToNextUpdate <= 0)\n {\n super.update(/* deltaTime*/);\n this._msToNextUpdate = this._updateFPS ? Math.floor(1000 / this._updateFPS) : 0;\n }\n }\n }\n\n /**\n * Start preloading the video resource.\n *\n * @return {Promise} Handle the validate event\n */\n load(): Promise\n {\n if (this._load)\n {\n return this._load;\n }\n\n const source = this.source as HTMLVideoElement;\n\n if ((source.readyState === source.HAVE_ENOUGH_DATA || source.readyState === source.HAVE_FUTURE_DATA)\n && source.width && source.height)\n {\n (source as any).complete = true;\n }\n\n source.addEventListener('play', this._onPlayStart.bind(this));\n source.addEventListener('pause', this._onPlayStop.bind(this));\n\n if (!this._isSourceReady())\n {\n source.addEventListener('canplay', this._onCanPlay);\n source.addEventListener('canplaythrough', this._onCanPlay);\n source.addEventListener('error', this._onError, true);\n }\n else\n {\n this._onCanPlay();\n }\n\n this._load = new Promise((resolve): void =>\n {\n if (this.valid)\n {\n resolve(this);\n }\n else\n {\n this._resolve = resolve;\n\n source.load();\n }\n });\n\n return this._load;\n }\n\n /** Handle video error events. */\n private _onError(event: ErrorEvent): void\n {\n (this.source as HTMLVideoElement).removeEventListener('error', this._onError, true);\n this.onError.emit(event);\n }\n\n /**\n * Returns true if the underlying source is playing.\n *\n * @return - True if playing.\n */\n private _isSourcePlaying(): boolean\n {\n const source = this.source as HTMLVideoElement;\n\n return (source.currentTime > 0 && source.paused === false && source.ended === false && source.readyState > 2);\n }\n\n /**\n * Returns true if the underlying source is ready for playing.\n *\n * @return - True if ready.\n */\n private _isSourceReady(): boolean\n {\n const source = this.source as HTMLVideoElement;\n\n return source.readyState === 3 || source.readyState === 4;\n }\n\n /** Runs the update loop when the video is ready to play. */\n private _onPlayStart(): void\n {\n // Just in case the video has not received its can play even yet..\n if (!this.valid)\n {\n this._onCanPlay();\n }\n\n if (this.autoUpdate && !this._isConnectedToTicker)\n {\n Ticker.shared.add(this.update, this);\n this._isConnectedToTicker = true;\n }\n }\n\n /** Fired when a pause event is triggered, stops the update loop. */\n private _onPlayStop(): void\n {\n if (this._isConnectedToTicker)\n {\n Ticker.shared.remove(this.update, this);\n this._isConnectedToTicker = false;\n }\n }\n\n /** Fired when the video is loaded and ready to play. */\n private _onCanPlay(): void\n {\n const source = this.source as HTMLVideoElement;\n\n source.removeEventListener('canplay', this._onCanPlay);\n source.removeEventListener('canplaythrough', this._onCanPlay);\n\n const valid = this.valid;\n\n this.resize(source.videoWidth, source.videoHeight);\n\n // prevent multiple loaded dispatches..\n if (!valid && this._resolve)\n {\n this._resolve(this);\n this._resolve = null;\n }\n\n if (this._isSourcePlaying())\n {\n this._onPlayStart();\n }\n else if (this.autoPlay)\n {\n source.play();\n }\n }\n\n /** Destroys this texture. */\n dispose(): void\n {\n if (this._isConnectedToTicker)\n {\n Ticker.shared.remove(this.update, this);\n this._isConnectedToTicker = false;\n }\n\n const source = this.source as HTMLVideoElement;\n\n if (source)\n {\n source.removeEventListener('error', this._onError, true);\n source.pause();\n source.src = '';\n source.load();\n }\n super.dispose();\n }\n\n /** Should the base texture automatically update itself, set to true by default. */\n get autoUpdate(): boolean\n {\n return this._autoUpdate;\n }\n\n set autoUpdate(value: boolean)\n {\n if (value !== this._autoUpdate)\n {\n this._autoUpdate = value;\n\n if (!this._autoUpdate && this._isConnectedToTicker)\n {\n Ticker.shared.remove(this.update, this);\n this._isConnectedToTicker = false;\n }\n else if (this._autoUpdate && !this._isConnectedToTicker && this._isSourcePlaying())\n {\n Ticker.shared.add(this.update, this);\n this._isConnectedToTicker = true;\n }\n }\n }\n\n /**\n * How many times a second to update the texture from the video. Leave at 0 to update at every render.\n * A lower fps can help performance, as updating the texture at 60fps on a 30ps video may not be efficient.\n */\n get updateFPS(): number\n {\n return this._updateFPS;\n }\n\n set updateFPS(value: number)\n {\n if (value !== this._updateFPS)\n {\n this._updateFPS = value;\n }\n }\n\n /**\n * Used to auto-detect the type of resource.\n *\n * @param {*} source - The source object\n * @param {string} extension - The extension of source, if set\n * @return {boolean} `true` if video source\n */\n static test(source: unknown, extension?: string): source is HTMLVideoElement\n {\n return (self.HTMLVideoElement && source instanceof HTMLVideoElement)\n || VideoResource.TYPES.indexOf(extension) > -1;\n }\n\n /**\n * List of common video file extensions supported by VideoResource.\n *\n * @readonly\n */\n static TYPES: Array = ['mp4', 'm4v', 'webm', 'ogg', 'ogv', 'h264', 'avi', 'mov'];\n\n /**\n * Map of video MIME types that can't be directly derived from file extensions.\n *\n * @readonly\n */\n static MIME_TYPES: Dict = {\n ogv: 'video/ogg',\n mov: 'video/quicktime',\n m4v: 'video/mp4',\n };\n}\n","import { BaseImageResource } from './BaseImageResource';\n\n/**\n * Resource type for ImageBitmap.\n *\n * @memberof PIXI\n */\nexport class ImageBitmapResource extends BaseImageResource\n{\n /**\n * @param source - Image element to use\n */\n // eslint-disable-next-line @typescript-eslint/no-useless-constructor\n constructor(source: ImageBitmap)\n {\n super(source);\n }\n\n /**\n * Used to auto-detect the type of resource.\n *\n * @param {*} source - The source object\n * @return {boolean} `true` if source is an ImageBitmap\n */\n static test(source: unknown): source is ImageBitmap\n {\n return !!self.createImageBitmap && source instanceof ImageBitmap;\n }\n}\n","import { INSTALLED } from './autoDetectResource';\nimport { ArrayResource } from './ArrayResource';\nimport { BufferResource } from './BufferResource';\nimport { CanvasResource } from './CanvasResource';\nimport { CubeResource } from './CubeResource';\nimport { ImageResource } from './ImageResource';\nimport { SVGResource } from './SVGResource';\nimport { VideoResource } from './VideoResource';\nimport { ImageBitmapResource } from './ImageBitmapResource';\n\nexport * from './Resource';\nexport * from './BaseImageResource';\n\nINSTALLED.push(\n ImageResource,\n ImageBitmapResource,\n CanvasResource,\n VideoResource,\n SVGResource,\n BufferResource,\n CubeResource,\n ArrayResource\n);\n\nexport * from './autoDetectResource';\nexport * from './AbstractMultiResource';\nexport * from './ArrayResource';\nexport * from './BufferResource';\nexport * from './CanvasResource';\nexport * from './CubeResource';\nexport * from './ImageResource';\nexport * from './SVGResource';\nexport * from './VideoResource';\nexport * from './ImageBitmapResource';\n","import { ALPHA_MODES } from '@pixi/constants';\nimport { BufferResource } from './BufferResource';\n\nimport type { BaseTexture } from '../BaseTexture';\nimport type { Renderer } from '../../Renderer';\nimport type { GLTexture } from '../GLTexture';\n\n/**\n * Resource type for DepthTexture.\n *\n * @memberof PIXI\n */\nexport class DepthResource extends BufferResource\n{\n /**\n * Upload the texture to the GPU.\n *\n * @param renderer - Upload to the renderer\n * @param baseTexture - Reference to parent texture\n * @param glTexture - glTexture\n * @return - true is success\n */\n upload(renderer: Renderer, baseTexture: BaseTexture, glTexture: GLTexture): boolean\n {\n const gl = renderer.gl;\n\n gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, baseTexture.alphaMode === ALPHA_MODES.UNPACK);\n\n const width = baseTexture.realWidth;\n const height = baseTexture.realHeight;\n\n if (glTexture.width === width && glTexture.height === height)\n {\n gl.texSubImage2D(\n baseTexture.target,\n 0,\n 0,\n 0,\n width,\n height,\n baseTexture.format,\n glTexture.type,\n this.data,\n );\n }\n else\n {\n glTexture.width = width;\n glTexture.height = height;\n\n gl.texImage2D(\n baseTexture.target,\n 0,\n glTexture.internalFormat,\n width,\n height,\n 0,\n baseTexture.format,\n glTexture.type,\n this.data,\n );\n }\n\n return true;\n }\n}\n","import { Runner } from '@pixi/runner';\nimport { BaseTexture } from '../textures/BaseTexture';\nimport { DepthResource } from '../textures/resources/DepthResource';\nimport { FORMATS, MIPMAP_MODES, SCALE_MODES, TYPES, MSAA_QUALITY } from '@pixi/constants';\n\nimport type { GLFramebuffer } from './GLFramebuffer';\n\n/**\n * A framebuffer can be used to render contents off of the screen. {@link PIXI.BaseRenderTexture} uses\n * one internally to render into itself. You can attach a depth or stencil buffer to a framebuffer.\n *\n * On WebGL 2 machines, shaders can output to multiple textures simultaneously with GLSL 300 ES.\n *\n * @class\n * @memberof PIXI\n */\nexport class Framebuffer\n{\n public width: number;\n public height: number;\n public multisample: MSAA_QUALITY;\n\n stencil: boolean;\n depth: boolean;\n dirtyId: number;\n dirtyFormat: number;\n dirtySize: number;\n depthTexture: BaseTexture;\n colorTextures: Array;\n glFramebuffers: {[key: string]: GLFramebuffer};\n disposeRunner: Runner;\n\n /**\n * @param {number} width - Width of the frame buffer\n * @param {number} height - Height of the frame buffer\n */\n constructor(width: number, height: number)\n {\n /**\n * Width of framebuffer in pixels\n * @member {number}\n */\n this.width = Math.round(width || 100);\n\n /**\n * Height of framebuffer in pixels\n * @member {number}\n */\n this.height = Math.round(height || 100);\n\n this.stencil = false;\n this.depth = false;\n\n this.dirtyId = 0;\n this.dirtyFormat = 0;\n this.dirtySize = 0;\n\n this.depthTexture = null;\n this.colorTextures = [];\n\n this.glFramebuffers = {};\n\n this.disposeRunner = new Runner('disposeFramebuffer');\n\n /**\n * Desired number of samples for antialiasing. 0 means AA should not be used.\n *\n * Experimental WebGL2 feature, allows to use antialiasing in individual renderTextures.\n * Antialiasing is the same as for main buffer with renderer `antialias:true` options.\n * Seriously affects GPU memory consumption and GPU performance.\n *\n *```js\n * renderTexture.framebuffer.multisample = PIXI.MSAA_QUALITY.HIGH;\n * //...\n * renderer.render(myContainer, {renderTexture});\n * renderer.framebuffer.blit(); // copies data from MSAA framebuffer to texture\n * ```\n *\n * @member {PIXI.MSAA_QUALITY}\n * @default PIXI.MSAA_QUALITY.NONE\n */\n this.multisample = MSAA_QUALITY.NONE;\n }\n\n /**\n * Reference to the colorTexture.\n *\n * @member {PIXI.BaseTexture[]}\n * @readonly\n */\n get colorTexture(): BaseTexture\n {\n return this.colorTextures[0];\n }\n\n /**\n * Add texture to the colorTexture array\n *\n * @param {number} [index=0] - Index of the array to add the texture to\n * @param {PIXI.BaseTexture} [texture] - Texture to add to the array\n */\n addColorTexture(index = 0, texture?: BaseTexture): this\n {\n // TODO add some validation to the texture - same width / height etc?\n this.colorTextures[index] = texture || new BaseTexture(null, {\n scaleMode: SCALE_MODES.NEAREST,\n resolution: 1,\n mipmap: MIPMAP_MODES.OFF,\n width: this.width,\n height: this.height,\n });\n\n this.dirtyId++;\n this.dirtyFormat++;\n\n return this;\n }\n\n /**\n * Add a depth texture to the frame buffer\n *\n * @param {PIXI.BaseTexture} [texture] - Texture to add\n */\n addDepthTexture(texture?: BaseTexture): this\n {\n /* eslint-disable max-len */\n this.depthTexture = texture || new BaseTexture(new DepthResource(null, { width: this.width, height: this.height }), {\n scaleMode: SCALE_MODES.NEAREST,\n resolution: 1,\n width: this.width,\n height: this.height,\n mipmap: MIPMAP_MODES.OFF,\n format: FORMATS.DEPTH_COMPONENT,\n type: TYPES.UNSIGNED_SHORT,\n });\n\n this.dirtyId++;\n this.dirtyFormat++;\n\n return this;\n }\n\n /**\n * Enable depth on the frame buffer\n */\n enableDepth(): this\n {\n this.depth = true;\n\n this.dirtyId++;\n this.dirtyFormat++;\n\n return this;\n }\n\n /**\n * Enable stencil on the frame buffer\n */\n enableStencil(): this\n {\n this.stencil = true;\n\n this.dirtyId++;\n this.dirtyFormat++;\n\n return this;\n }\n\n /**\n * Resize the frame buffer\n *\n * @param {number} width - Width of the frame buffer to resize to\n * @param {number} height - Height of the frame buffer to resize to\n */\n resize(width: number, height: number): void\n {\n width = Math.round(width);\n height = Math.round(height);\n\n if (width === this.width && height === this.height) return;\n\n this.width = width;\n this.height = height;\n\n this.dirtyId++;\n this.dirtySize++;\n\n for (let i = 0; i < this.colorTextures.length; i++)\n {\n const texture = this.colorTextures[i];\n const resolution = texture.resolution;\n\n // take into account the fact the texture may have a different resolution..\n texture.setSize(width / resolution, height / resolution);\n }\n\n if (this.depthTexture)\n {\n const resolution = this.depthTexture.resolution;\n\n this.depthTexture.setSize(width / resolution, height / resolution);\n }\n }\n\n /**\n * Disposes WebGL resources that are connected to this geometry\n */\n dispose(): void\n {\n this.disposeRunner.emit(this, false);\n }\n\n /**\n * Destroys and removes the depth texture added to this framebuffer.\n */\n destroyDepthTexture(): void\n {\n if (this.depthTexture)\n {\n this.depthTexture.destroy();\n this.depthTexture = null;\n\n ++this.dirtyId;\n ++this.dirtyFormat;\n }\n }\n}\n","import { BaseTexture } from '../textures/BaseTexture';\nimport { Framebuffer } from '../framebuffer/Framebuffer';\nimport { MIPMAP_MODES, MSAA_QUALITY } from '@pixi/constants';\n\nimport type { IBaseTextureOptions } from '../textures/BaseTexture';\nimport type { MaskData } from '../mask/MaskData';\n\nexport interface BaseRenderTexture extends GlobalMixins.BaseRenderTexture, BaseTexture {}\n\n/**\n * A BaseRenderTexture is a special texture that allows any PixiJS display object to be rendered to it.\n *\n * __Hint__: All DisplayObjects (i.e. Sprites) that render to a BaseRenderTexture should be preloaded\n * otherwise black rectangles will be drawn instead.\n *\n * A BaseRenderTexture takes a snapshot of any Display Object given to its render method. The position\n * and rotation of the given Display Objects is ignored. For example:\n *\n * ```js\n * let renderer = PIXI.autoDetectRenderer();\n * let baseRenderTexture = new PIXI.BaseRenderTexture({ width: 800, height: 600 });\n * let renderTexture = new PIXI.RenderTexture(baseRenderTexture);\n * let sprite = PIXI.Sprite.from(\"spinObj_01.png\");\n *\n * sprite.position.x = 800/2;\n * sprite.position.y = 600/2;\n * sprite.anchor.x = 0.5;\n * sprite.anchor.y = 0.5;\n *\n * renderer.render(sprite, {renderTexture});\n * ```\n *\n * The Sprite in this case will be rendered using its local transform. To render this sprite at 0,0\n * you can clear the transform\n *\n * ```js\n *\n * sprite.setTransform()\n *\n * let baseRenderTexture = new PIXI.BaseRenderTexture({ width: 100, height: 100 });\n * let renderTexture = new PIXI.RenderTexture(baseRenderTexture);\n *\n * renderer.render(sprite, {renderTexture}); // Renders to center of RenderTexture\n * ```\n *\n * @class\n * @extends PIXI.BaseTexture\n * @memberof PIXI\n */\nexport class BaseRenderTexture extends BaseTexture\n{\n public clearColor: number[];\n public framebuffer: Framebuffer;\n maskStack: Array;\n filterStack: Array;\n\n /**\n * @param {object} [options]\n * @param {number} [options.width=100] - The width of the base render texture.\n * @param {number} [options.height=100] - The height of the base render texture.\n * @param {PIXI.SCALE_MODES} [options.scaleMode=PIXI.settings.SCALE_MODE] - See {@link PIXI.SCALE_MODES}\n * for possible values.\n * @param {number} [options.resolution=PIXI.settings.RESOLUTION] - The resolution / device pixel ratio\n * of the texture being generated.\n * @param {PIXI.MSAA_QUALITY} [options.multisample=PIXI.MSAA_QUALITY.NONE] - The number of samples of the frame buffer.\n */\n constructor(options?: IBaseTextureOptions)\n {\n if (typeof options === 'number')\n {\n /* eslint-disable prefer-rest-params */\n // Backward compatibility of signature\n const width = arguments[0];\n const height = arguments[1];\n const scaleMode = arguments[2];\n const resolution = arguments[3];\n\n options = { width, height, scaleMode, resolution };\n /* eslint-enable prefer-rest-params */\n }\n\n options.width = options.width || 100;\n options.height = options.height || 100;\n options.multisample = options.multisample !== undefined ? options.multisample : MSAA_QUALITY.NONE;\n\n super(null, options);\n\n // Set defaults\n this.mipmap = MIPMAP_MODES.OFF;\n this.valid = true;\n\n this.clearColor = [0, 0, 0, 0];\n\n this.framebuffer = new Framebuffer(this.realWidth, this.realHeight)\n .addColorTexture(0, this);\n this.framebuffer.multisample = options.multisample;\n\n // TODO - could this be added the systems?\n\n /**\n * The data structure for the stencil masks.\n *\n * @member {PIXI.MaskData[]}\n */\n this.maskStack = [];\n\n /**\n * The data structure for the filters.\n *\n * @member {Object[]}\n */\n this.filterStack = [{}];\n }\n\n /**\n * Resizes the BaseRenderTexture.\n *\n * @param {number} desiredWidth - The desired width to resize to.\n * @param {number} desiredHeight - The desired height to resize to.\n */\n resize(desiredWidth: number, desiredHeight: number): void\n {\n this.framebuffer.resize(desiredWidth * this.resolution, desiredHeight * this.resolution);\n this.setRealSize(this.framebuffer.width, this.framebuffer.height);\n }\n\n /**\n * Frees the texture and framebuffer from WebGL memory without destroying this texture object.\n * This means you can still use the texture later which will upload it to GPU\n * memory again.\n *\n * @fires PIXI.BaseTexture#dispose\n */\n dispose(): void\n {\n this.framebuffer.dispose();\n\n super.dispose();\n }\n\n /**\n * Destroys this texture.\n */\n destroy(): void\n {\n super.destroy();\n\n this.framebuffer.destroyDepthTexture();\n this.framebuffer = null;\n }\n}\n","import { groupD8 } from '@pixi/math';\n\nimport type { Rectangle, ISize } from '@pixi/math';\n\n/**\n * Stores a texture's frame in UV coordinates, in\n * which everything lies in the rectangle `[(0,0), (1,0),\n * (1,1), (0,1)]`.\n *\n * | Corner | Coordinates |\n * |--------------|-------------|\n * | Top-Left | `(x0,y0)` |\n * | Top-Right | `(x1,y1)` |\n * | Bottom-Right | `(x2,y2)` |\n * | Bottom-Left | `(x3,y3)` |\n *\n * @class\n * @protected\n * @memberof PIXI\n */\nexport class TextureUvs\n{\n public x0: number;\n public y0: number;\n public x1: number;\n public y1: number;\n public x2: number;\n public y2: number;\n public x3: number;\n public y3: number;\n public uvsFloat32: Float32Array;\n\n constructor()\n {\n /**\n * X-component of top-left corner `(x0,y0)`.\n *\n * @member {number}\n */\n this.x0 = 0;\n\n /**\n * Y-component of top-left corner `(x0,y0)`.\n *\n * @member {number}\n */\n this.y0 = 0;\n\n /**\n * X-component of top-right corner `(x1,y1)`.\n *\n * @member {number}\n */\n this.x1 = 1;\n\n /**\n * Y-component of top-right corner `(x1,y1)`.\n *\n * @member {number}\n */\n this.y1 = 0;\n\n /**\n * X-component of bottom-right corner `(x2,y2)`.\n *\n * @member {number}\n */\n this.x2 = 1;\n\n /**\n * Y-component of bottom-right corner `(x2,y2)`.\n *\n * @member {number}\n */\n this.y2 = 1;\n\n /**\n * X-component of bottom-left corner `(x3,y3)`.\n *\n * @member {number}\n */\n this.x3 = 0;\n\n /**\n * Y-component of bottom-right corner `(x3,y3)`.\n *\n * @member {number}\n */\n this.y3 = 1;\n\n this.uvsFloat32 = new Float32Array(8);\n }\n\n /**\n * Sets the texture Uvs based on the given frame information.\n *\n * @protected\n * @param {PIXI.Rectangle} frame - The frame of the texture\n * @param {PIXI.Rectangle} baseFrame - The base frame of the texture\n * @param {number} rotate - Rotation of frame, see {@link PIXI.groupD8}\n */\n set(frame: Rectangle, baseFrame: ISize, rotate: number): void\n {\n const tw = baseFrame.width;\n const th = baseFrame.height;\n\n if (rotate)\n {\n // width and height div 2 div baseFrame size\n const w2 = frame.width / 2 / tw;\n const h2 = frame.height / 2 / th;\n\n // coordinates of center\n const cX = (frame.x / tw) + w2;\n const cY = (frame.y / th) + h2;\n\n rotate = groupD8.add(rotate, groupD8.NW); // NW is top-left corner\n this.x0 = cX + (w2 * groupD8.uX(rotate));\n this.y0 = cY + (h2 * groupD8.uY(rotate));\n\n rotate = groupD8.add(rotate, 2); // rotate 90 degrees clockwise\n this.x1 = cX + (w2 * groupD8.uX(rotate));\n this.y1 = cY + (h2 * groupD8.uY(rotate));\n\n rotate = groupD8.add(rotate, 2);\n this.x2 = cX + (w2 * groupD8.uX(rotate));\n this.y2 = cY + (h2 * groupD8.uY(rotate));\n\n rotate = groupD8.add(rotate, 2);\n this.x3 = cX + (w2 * groupD8.uX(rotate));\n this.y3 = cY + (h2 * groupD8.uY(rotate));\n }\n else\n {\n this.x0 = frame.x / tw;\n this.y0 = frame.y / th;\n\n this.x1 = (frame.x + frame.width) / tw;\n this.y1 = frame.y / th;\n\n this.x2 = (frame.x + frame.width) / tw;\n this.y2 = (frame.y + frame.height) / th;\n\n this.x3 = frame.x / tw;\n this.y3 = (frame.y + frame.height) / th;\n }\n\n this.uvsFloat32[0] = this.x0;\n this.uvsFloat32[1] = this.y0;\n this.uvsFloat32[2] = this.x1;\n this.uvsFloat32[3] = this.y1;\n this.uvsFloat32[4] = this.x2;\n this.uvsFloat32[5] = this.y2;\n this.uvsFloat32[6] = this.x3;\n this.uvsFloat32[7] = this.y3;\n }\n\n // #if _DEBUG\n toString(): string\n {\n return `[@pixi/core:TextureUvs `\n + `x0=${this.x0} y0=${this.y0} `\n + `x1=${this.x1} y1=${this.y1} x2=${this.x2} `\n + `y2=${this.y2} x3=${this.x3} y3=${this.y3}`\n + `]`;\n }\n // #endif\n}\n","import { BaseTexture } from './BaseTexture';\nimport { ImageResource } from './resources/ImageResource';\nimport { CanvasResource } from './resources/CanvasResource';\nimport { TextureUvs } from './TextureUvs';\nimport { settings } from '@pixi/settings';\nimport { Rectangle, Point } from '@pixi/math';\nimport { uid, TextureCache, getResolutionOfUrl, EventEmitter } from '@pixi/utils';\n\nimport type { Resource } from './resources/Resource';\nimport type { BufferResource } from './resources/BufferResource';\nimport type { IPointData, ISize } from '@pixi/math';\nimport type { IBaseTextureOptions, ImageSource } from './BaseTexture';\nimport type { TextureMatrix } from './TextureMatrix';\n\nconst DEFAULT_UVS = new TextureUvs();\n\nexport type TextureSource = string|BaseTexture|ImageSource;\n\nexport interface Texture extends GlobalMixins.Texture, EventEmitter {}\n\n/**\n * A texture stores the information that represents an image or part of an image.\n *\n * It cannot be added to the display list directly; instead use it as the texture for a Sprite.\n * If no frame is provided for a texture, then the whole image is used.\n *\n * You can directly create a texture from an image and then reuse it multiple times like this :\n *\n * ```js\n * let texture = PIXI.Texture.from('assets/image.png');\n * let sprite1 = new PIXI.Sprite(texture);\n * let sprite2 = new PIXI.Sprite(texture);\n * ```\n *\n * If you didnt pass the texture frame to constructor, it enables `noFrame` mode:\n * it subscribes on baseTexture events, it automatically resizes at the same time as baseTexture.\n *\n * Textures made from SVGs, loaded or not, cannot be used before the file finishes processing.\n * You can check for this by checking the sprite's _textureID property.\n * ```js\n * var texture = PIXI.Texture.from('assets/image.svg');\n * var sprite1 = new PIXI.Sprite(texture);\n * //sprite1._textureID should not be undefined if the texture has finished processing the SVG file\n * ```\n * You can use a ticker or rAF to ensure your sprites load the finished textures after processing. See issue #3068.\n *\n * @class\n * @extends PIXI.utils.EventEmitter\n * @memberof PIXI\n * @typeParam R - The BaseTexture's Resource type.\n */\nexport class Texture extends EventEmitter\n{\n public baseTexture: BaseTexture;\n public orig: Rectangle;\n public trim: Rectangle;\n public valid: boolean;\n public noFrame: boolean;\n public defaultAnchor: Point;\n public uvMatrix: TextureMatrix;\n protected _rotate: number;\n _updateID: number;\n _frame: Rectangle;\n _uvs: TextureUvs;\n textureCacheIds: Array;\n\n /**\n * @param {PIXI.BaseTexture} baseTexture - The base texture source to create the texture from\n * @param {PIXI.Rectangle} [frame] - The rectangle frame of the texture to show\n * @param {PIXI.Rectangle} [orig] - The area of original texture\n * @param {PIXI.Rectangle} [trim] - Trimmed rectangle of original texture\n * @param {number} [rotate] - indicates how the texture was rotated by texture packer. See {@link PIXI.groupD8}\n * @param {PIXI.IPointData} [anchor] - Default anchor point used for sprite placement / rotation\n */\n constructor(baseTexture: BaseTexture, frame?: Rectangle,\n orig?: Rectangle, trim?: Rectangle, rotate?: number, anchor?: IPointData)\n {\n super();\n\n /**\n * Does this Texture have any frame data assigned to it?\n *\n * This mode is enabled automatically if no frame was passed inside constructor.\n *\n * In this mode texture is subscribed to baseTexture events, and fires `update` on any change.\n *\n * Beware, after loading or resize of baseTexture event can fired two times!\n * If you want more control, subscribe on baseTexture itself.\n *\n * ```js\n * texture.on('update', () => {});\n * ```\n *\n * Any assignment of `frame` switches off `noFrame` mode.\n *\n * @member {boolean}\n */\n this.noFrame = false;\n\n if (!frame)\n {\n this.noFrame = true;\n frame = new Rectangle(0, 0, 1, 1);\n }\n\n if (baseTexture instanceof Texture)\n {\n baseTexture = baseTexture.baseTexture;\n }\n\n /**\n * The base texture that this texture uses.\n *\n * @member {PIXI.BaseTexture}\n */\n this.baseTexture = baseTexture;\n\n /**\n * This is the area of the BaseTexture image to actually copy to the Canvas / WebGL when rendering,\n * irrespective of the actual frame size or placement (which can be influenced by trimmed texture atlases)\n *\n * @member {PIXI.Rectangle}\n */\n this._frame = frame;\n\n /**\n * This is the trimmed area of original texture, before it was put in atlas\n * Please call `updateUvs()` after you change coordinates of `trim` manually.\n *\n * @member {PIXI.Rectangle}\n */\n this.trim = trim;\n\n /**\n * This will let the renderer know if the texture is valid. If it's not then it cannot be rendered.\n *\n * @member {boolean}\n */\n this.valid = false;\n\n /**\n * The WebGL UV data cache. Can be used as quad UV\n *\n * @member {PIXI.TextureUvs}\n * @protected\n */\n this._uvs = DEFAULT_UVS;\n\n /**\n * Default TextureMatrix instance for this texture\n * By default that object is not created because its heavy\n *\n * @member {PIXI.TextureMatrix}\n */\n this.uvMatrix = null;\n\n /**\n * This is the area of original texture, before it was put in atlas\n *\n * @member {PIXI.Rectangle}\n */\n this.orig = orig || frame;// new Rectangle(0, 0, 1, 1);\n\n this._rotate = Number(rotate || 0);\n\n if (rotate as any === true)\n {\n // this is old texturepacker legacy, some games/libraries are passing \"true\" for rotated textures\n this._rotate = 2;\n }\n else if (this._rotate % 2 !== 0)\n {\n throw new Error('attempt to use diamond-shaped UVs. If you are sure, set rotation manually');\n }\n\n /**\n * Anchor point that is used as default if sprite is created with this texture.\n * Changing the `defaultAnchor` at a later point of time will not update Sprite's anchor point.\n * @member {PIXI.Point}\n * @default {0,0}\n */\n this.defaultAnchor = anchor ? new Point(anchor.x, anchor.y) : new Point(0, 0);\n\n /**\n * Update ID is observed by sprites and TextureMatrix instances.\n * Call updateUvs() to increment it.\n *\n * @member {number}\n * @protected\n */\n\n this._updateID = 0;\n\n /**\n * The ids under which this Texture has been added to the texture cache. This is\n * automatically set as long as Texture.addToCache is used, but may not be set if a\n * Texture is added directly to the TextureCache array.\n *\n * @member {string[]}\n */\n this.textureCacheIds = [];\n\n if (!baseTexture.valid)\n {\n baseTexture.once('loaded', this.onBaseTextureUpdated, this);\n }\n else if (this.noFrame)\n {\n // if there is no frame we should monitor for any base texture changes..\n if (baseTexture.valid)\n {\n this.onBaseTextureUpdated(baseTexture);\n }\n }\n else\n {\n this.frame = frame;\n }\n\n if (this.noFrame)\n {\n baseTexture.on('update', this.onBaseTextureUpdated, this);\n }\n }\n\n /**\n * Updates this texture on the gpu.\n *\n * Calls the TextureResource update.\n *\n * If you adjusted `frame` manually, please call `updateUvs()` instead.\n *\n */\n update(): void\n {\n if (this.baseTexture.resource)\n {\n this.baseTexture.resource.update();\n }\n }\n\n /**\n * Called when the base texture is updated\n *\n * @protected\n * @param {PIXI.BaseTexture} baseTexture - The base texture.\n */\n onBaseTextureUpdated(baseTexture: BaseTexture): void\n {\n if (this.noFrame)\n {\n if (!this.baseTexture.valid)\n {\n return;\n }\n\n this._frame.width = baseTexture.width;\n this._frame.height = baseTexture.height;\n this.valid = true;\n this.updateUvs();\n }\n else\n {\n // TODO this code looks confusing.. boo to abusing getters and setters!\n // if user gave us frame that has bigger size than resized texture it can be a problem\n this.frame = this._frame;\n }\n\n this.emit('update', this);\n }\n\n /**\n * Destroys this texture\n *\n * @param {boolean} [destroyBase=false] - Whether to destroy the base texture as well\n */\n destroy(destroyBase?: boolean): void\n {\n if (this.baseTexture)\n {\n if (destroyBase)\n {\n const { resource } = this.baseTexture as unknown as BaseTexture;\n\n // delete the texture if it exists in the texture cache..\n // this only needs to be removed if the base texture is actually destroyed too..\n if (resource && resource.url && TextureCache[resource.url])\n {\n Texture.removeFromCache(resource.url);\n }\n\n this.baseTexture.destroy();\n }\n\n this.baseTexture.off('loaded', this.onBaseTextureUpdated, this);\n this.baseTexture.off('update', this.onBaseTextureUpdated, this);\n\n this.baseTexture = null;\n }\n\n this._frame = null;\n this._uvs = null;\n this.trim = null;\n this.orig = null;\n\n this.valid = false;\n\n Texture.removeFromCache(this);\n this.textureCacheIds = null;\n }\n\n /**\n * Creates a new texture object that acts the same as this one.\n *\n * @return {PIXI.Texture} The new texture\n */\n clone(): Texture\n {\n const clonedFrame = this._frame.clone();\n const clonedOrig = this._frame === this.orig ? clonedFrame : this.orig.clone();\n const clonedTexture = new Texture(this.baseTexture,\n !this.noFrame && clonedFrame,\n clonedOrig,\n this.trim && this.trim.clone(),\n this.rotate,\n this.defaultAnchor\n );\n\n if (this.noFrame)\n {\n clonedTexture._frame = clonedFrame;\n }\n\n return clonedTexture;\n }\n\n /**\n * Updates the internal WebGL UV cache. Use it after you change `frame` or `trim` of the texture.\n * Call it after changing the frame\n */\n updateUvs(): void\n {\n if (this._uvs === DEFAULT_UVS)\n {\n this._uvs = new TextureUvs();\n }\n\n this._uvs.set(this._frame, this.baseTexture, this.rotate);\n\n this._updateID++;\n }\n\n /**\n * Helper function that creates a new Texture based on the source you provide.\n * The source can be - frame id, image url, video url, canvas element, video element, base texture\n *\n * @static\n * @param {string|HTMLImageElement|HTMLCanvasElement|HTMLVideoElement|PIXI.BaseTexture} source -\n * Source to create texture from\n * @param {object} [options] - See {@link PIXI.BaseTexture}'s constructor for options.\n * @param {string} [options.pixiIdPrefix=pixiid] - If a source has no id, this is the prefix of the generated id\n * @param {boolean} [strict] - Enforce strict-mode, see {@link PIXI.settings.STRICT_TEXTURE_CACHE}.\n * @return {PIXI.Texture} The newly created texture\n */\n static from(source: TextureSource, options: IBaseTextureOptions = {},\n strict = settings.STRICT_TEXTURE_CACHE): Texture\n {\n const isFrame = typeof source === 'string';\n let cacheId = null;\n\n if (isFrame)\n {\n cacheId = source;\n }\n else if (source instanceof BaseTexture)\n {\n if (!source.cacheId)\n {\n const prefix = (options && options.pixiIdPrefix) || 'pixiid';\n\n source.cacheId = `${prefix}-${uid()}`;\n BaseTexture.addToCache(source, source.cacheId);\n }\n\n cacheId = source.cacheId;\n }\n else\n {\n if (!(source as any)._pixiId)\n {\n const prefix = (options && options.pixiIdPrefix) || 'pixiid';\n\n (source as any)._pixiId = `${prefix}_${uid()}`;\n }\n\n cacheId = (source as any)._pixiId;\n }\n\n let texture = TextureCache[cacheId] as Texture;\n\n // Strict-mode rejects invalid cacheIds\n if (isFrame && strict && !texture)\n {\n throw new Error(`The cacheId \"${cacheId}\" does not exist in TextureCache.`);\n }\n\n if (!texture && !(source instanceof BaseTexture))\n {\n if (!options.resolution)\n {\n options.resolution = getResolutionOfUrl(source as string);\n }\n\n texture = new Texture(new BaseTexture(source, options));\n texture.baseTexture.cacheId = cacheId;\n\n BaseTexture.addToCache(texture.baseTexture, cacheId);\n Texture.addToCache(texture, cacheId);\n }\n else if (!texture && (source instanceof BaseTexture))\n {\n texture = new Texture(source as BaseTexture);\n\n Texture.addToCache(texture, cacheId);\n }\n\n // lets assume its a base texture!\n return texture;\n }\n\n /**\n * Useful for loading textures via URLs. Use instead of `Texture.from` because\n * it does a better job of handling failed URLs more effectively. This also ignores\n * `PIXI.settings.STRICT_TEXTURE_CACHE`. Works for Videos, SVGs, Images.\n * @param {string} url - The remote URL to load.\n * @param {object} [options] - Optional options to include\n * @return {Promise