display.js 72 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787
  1. /*!
  2. * @pixi/display - v6.5.10
  3. * Compiled Thu, 06 Jul 2023 15:25:11 UTC
  4. *
  5. * @pixi/display is licensed under the MIT License.
  6. * http://www.opensource.org/licenses/mit-license
  7. */
  8. 'use strict';
  9. Object.defineProperty(exports, '__esModule', { value: true });
  10. var settings = require('@pixi/settings');
  11. var math = require('@pixi/math');
  12. var utils = require('@pixi/utils');
  13. var constants = require('@pixi/constants');
  14. /**
  15. * Sets the default value for the container property 'sortableChildren'.
  16. * If set to true, the container will sort its children by zIndex value
  17. * when updateTransform() is called, or manually if sortChildren() is called.
  18. *
  19. * This actually changes the order of elements in the array, so should be treated
  20. * as a basic solution that is not performant compared to other solutions,
  21. * such as @link https://github.com/pixijs/pixi-display
  22. *
  23. * Also be aware of that this may not work nicely with the addChildAt() function,
  24. * as the zIndex sorting may cause the child to automatically sorted to another position.
  25. * @static
  26. * @constant
  27. * @name SORTABLE_CHILDREN
  28. * @memberof PIXI.settings
  29. * @type {boolean}
  30. * @default false
  31. */
  32. settings.settings.SORTABLE_CHILDREN = false;
  33. /**
  34. * 'Builder' pattern for bounds rectangles.
  35. *
  36. * This could be called an Axis-Aligned Bounding Box.
  37. * It is not an actual shape. It is a mutable thing; no 'EMPTY' or those kind of problems.
  38. * @memberof PIXI
  39. */
  40. var Bounds = /** @class */ (function () {
  41. function Bounds() {
  42. this.minX = Infinity;
  43. this.minY = Infinity;
  44. this.maxX = -Infinity;
  45. this.maxY = -Infinity;
  46. this.rect = null;
  47. this.updateID = -1;
  48. }
  49. /**
  50. * Checks if bounds are empty.
  51. * @returns - True if empty.
  52. */
  53. Bounds.prototype.isEmpty = function () {
  54. return this.minX > this.maxX || this.minY > this.maxY;
  55. };
  56. /** Clears the bounds and resets. */
  57. Bounds.prototype.clear = function () {
  58. this.minX = Infinity;
  59. this.minY = Infinity;
  60. this.maxX = -Infinity;
  61. this.maxY = -Infinity;
  62. };
  63. /**
  64. * Can return Rectangle.EMPTY constant, either construct new rectangle, either use your rectangle
  65. * It is not guaranteed that it will return tempRect
  66. * @param rect - Temporary object will be used if AABB is not empty
  67. * @returns - A rectangle of the bounds
  68. */
  69. Bounds.prototype.getRectangle = function (rect) {
  70. if (this.minX > this.maxX || this.minY > this.maxY) {
  71. return math.Rectangle.EMPTY;
  72. }
  73. rect = rect || new math.Rectangle(0, 0, 1, 1);
  74. rect.x = this.minX;
  75. rect.y = this.minY;
  76. rect.width = this.maxX - this.minX;
  77. rect.height = this.maxY - this.minY;
  78. return rect;
  79. };
  80. /**
  81. * This function should be inlined when its possible.
  82. * @param point - The point to add.
  83. */
  84. Bounds.prototype.addPoint = function (point) {
  85. this.minX = Math.min(this.minX, point.x);
  86. this.maxX = Math.max(this.maxX, point.x);
  87. this.minY = Math.min(this.minY, point.y);
  88. this.maxY = Math.max(this.maxY, point.y);
  89. };
  90. /**
  91. * Adds a point, after transformed. This should be inlined when its possible.
  92. * @param matrix
  93. * @param point
  94. */
  95. Bounds.prototype.addPointMatrix = function (matrix, point) {
  96. var a = matrix.a, b = matrix.b, c = matrix.c, d = matrix.d, tx = matrix.tx, ty = matrix.ty;
  97. var x = (a * point.x) + (c * point.y) + tx;
  98. var y = (b * point.x) + (d * point.y) + ty;
  99. this.minX = Math.min(this.minX, x);
  100. this.maxX = Math.max(this.maxX, x);
  101. this.minY = Math.min(this.minY, y);
  102. this.maxY = Math.max(this.maxY, y);
  103. };
  104. /**
  105. * Adds a quad, not transformed
  106. * @param vertices - The verts to add.
  107. */
  108. Bounds.prototype.addQuad = function (vertices) {
  109. var minX = this.minX;
  110. var minY = this.minY;
  111. var maxX = this.maxX;
  112. var maxY = this.maxY;
  113. var x = vertices[0];
  114. var y = vertices[1];
  115. minX = x < minX ? x : minX;
  116. minY = y < minY ? y : minY;
  117. maxX = x > maxX ? x : maxX;
  118. maxY = y > maxY ? y : maxY;
  119. x = vertices[2];
  120. y = vertices[3];
  121. minX = x < minX ? x : minX;
  122. minY = y < minY ? y : minY;
  123. maxX = x > maxX ? x : maxX;
  124. maxY = y > maxY ? y : maxY;
  125. x = vertices[4];
  126. y = vertices[5];
  127. minX = x < minX ? x : minX;
  128. minY = y < minY ? y : minY;
  129. maxX = x > maxX ? x : maxX;
  130. maxY = y > maxY ? y : maxY;
  131. x = vertices[6];
  132. y = vertices[7];
  133. minX = x < minX ? x : minX;
  134. minY = y < minY ? y : minY;
  135. maxX = x > maxX ? x : maxX;
  136. maxY = y > maxY ? y : maxY;
  137. this.minX = minX;
  138. this.minY = minY;
  139. this.maxX = maxX;
  140. this.maxY = maxY;
  141. };
  142. /**
  143. * Adds sprite frame, transformed.
  144. * @param transform - transform to apply
  145. * @param x0 - left X of frame
  146. * @param y0 - top Y of frame
  147. * @param x1 - right X of frame
  148. * @param y1 - bottom Y of frame
  149. */
  150. Bounds.prototype.addFrame = function (transform, x0, y0, x1, y1) {
  151. this.addFrameMatrix(transform.worldTransform, x0, y0, x1, y1);
  152. };
  153. /**
  154. * Adds sprite frame, multiplied by matrix
  155. * @param matrix - matrix to apply
  156. * @param x0 - left X of frame
  157. * @param y0 - top Y of frame
  158. * @param x1 - right X of frame
  159. * @param y1 - bottom Y of frame
  160. */
  161. Bounds.prototype.addFrameMatrix = function (matrix, x0, y0, x1, y1) {
  162. var a = matrix.a;
  163. var b = matrix.b;
  164. var c = matrix.c;
  165. var d = matrix.d;
  166. var tx = matrix.tx;
  167. var ty = matrix.ty;
  168. var minX = this.minX;
  169. var minY = this.minY;
  170. var maxX = this.maxX;
  171. var maxY = this.maxY;
  172. var x = (a * x0) + (c * y0) + tx;
  173. var y = (b * x0) + (d * y0) + ty;
  174. minX = x < minX ? x : minX;
  175. minY = y < minY ? y : minY;
  176. maxX = x > maxX ? x : maxX;
  177. maxY = y > maxY ? y : maxY;
  178. x = (a * x1) + (c * y0) + tx;
  179. y = (b * x1) + (d * y0) + ty;
  180. minX = x < minX ? x : minX;
  181. minY = y < minY ? y : minY;
  182. maxX = x > maxX ? x : maxX;
  183. maxY = y > maxY ? y : maxY;
  184. x = (a * x0) + (c * y1) + tx;
  185. y = (b * x0) + (d * y1) + ty;
  186. minX = x < minX ? x : minX;
  187. minY = y < minY ? y : minY;
  188. maxX = x > maxX ? x : maxX;
  189. maxY = y > maxY ? y : maxY;
  190. x = (a * x1) + (c * y1) + tx;
  191. y = (b * x1) + (d * y1) + ty;
  192. minX = x < minX ? x : minX;
  193. minY = y < minY ? y : minY;
  194. maxX = x > maxX ? x : maxX;
  195. maxY = y > maxY ? y : maxY;
  196. this.minX = minX;
  197. this.minY = minY;
  198. this.maxX = maxX;
  199. this.maxY = maxY;
  200. };
  201. /**
  202. * Adds screen vertices from array
  203. * @param vertexData - calculated vertices
  204. * @param beginOffset - begin offset
  205. * @param endOffset - end offset, excluded
  206. */
  207. Bounds.prototype.addVertexData = function (vertexData, beginOffset, endOffset) {
  208. var minX = this.minX;
  209. var minY = this.minY;
  210. var maxX = this.maxX;
  211. var maxY = this.maxY;
  212. for (var i = beginOffset; i < endOffset; i += 2) {
  213. var x = vertexData[i];
  214. var y = vertexData[i + 1];
  215. minX = x < minX ? x : minX;
  216. minY = y < minY ? y : minY;
  217. maxX = x > maxX ? x : maxX;
  218. maxY = y > maxY ? y : maxY;
  219. }
  220. this.minX = minX;
  221. this.minY = minY;
  222. this.maxX = maxX;
  223. this.maxY = maxY;
  224. };
  225. /**
  226. * Add an array of mesh vertices
  227. * @param transform - mesh transform
  228. * @param vertices - mesh coordinates in array
  229. * @param beginOffset - begin offset
  230. * @param endOffset - end offset, excluded
  231. */
  232. Bounds.prototype.addVertices = function (transform, vertices, beginOffset, endOffset) {
  233. this.addVerticesMatrix(transform.worldTransform, vertices, beginOffset, endOffset);
  234. };
  235. /**
  236. * Add an array of mesh vertices.
  237. * @param matrix - mesh matrix
  238. * @param vertices - mesh coordinates in array
  239. * @param beginOffset - begin offset
  240. * @param endOffset - end offset, excluded
  241. * @param padX - x padding
  242. * @param padY - y padding
  243. */
  244. Bounds.prototype.addVerticesMatrix = function (matrix, vertices, beginOffset, endOffset, padX, padY) {
  245. if (padX === void 0) { padX = 0; }
  246. if (padY === void 0) { padY = padX; }
  247. var a = matrix.a;
  248. var b = matrix.b;
  249. var c = matrix.c;
  250. var d = matrix.d;
  251. var tx = matrix.tx;
  252. var ty = matrix.ty;
  253. var minX = this.minX;
  254. var minY = this.minY;
  255. var maxX = this.maxX;
  256. var maxY = this.maxY;
  257. for (var i = beginOffset; i < endOffset; i += 2) {
  258. var rawX = vertices[i];
  259. var rawY = vertices[i + 1];
  260. var x = (a * rawX) + (c * rawY) + tx;
  261. var y = (d * rawY) + (b * rawX) + ty;
  262. minX = Math.min(minX, x - padX);
  263. maxX = Math.max(maxX, x + padX);
  264. minY = Math.min(minY, y - padY);
  265. maxY = Math.max(maxY, y + padY);
  266. }
  267. this.minX = minX;
  268. this.minY = minY;
  269. this.maxX = maxX;
  270. this.maxY = maxY;
  271. };
  272. /**
  273. * Adds other {@link Bounds}.
  274. * @param bounds - The Bounds to be added
  275. */
  276. Bounds.prototype.addBounds = function (bounds) {
  277. var minX = this.minX;
  278. var minY = this.minY;
  279. var maxX = this.maxX;
  280. var maxY = this.maxY;
  281. this.minX = bounds.minX < minX ? bounds.minX : minX;
  282. this.minY = bounds.minY < minY ? bounds.minY : minY;
  283. this.maxX = bounds.maxX > maxX ? bounds.maxX : maxX;
  284. this.maxY = bounds.maxY > maxY ? bounds.maxY : maxY;
  285. };
  286. /**
  287. * Adds other Bounds, masked with Bounds.
  288. * @param bounds - The Bounds to be added.
  289. * @param mask - TODO
  290. */
  291. Bounds.prototype.addBoundsMask = function (bounds, mask) {
  292. var _minX = bounds.minX > mask.minX ? bounds.minX : mask.minX;
  293. var _minY = bounds.minY > mask.minY ? bounds.minY : mask.minY;
  294. var _maxX = bounds.maxX < mask.maxX ? bounds.maxX : mask.maxX;
  295. var _maxY = bounds.maxY < mask.maxY ? bounds.maxY : mask.maxY;
  296. if (_minX <= _maxX && _minY <= _maxY) {
  297. var minX = this.minX;
  298. var minY = this.minY;
  299. var maxX = this.maxX;
  300. var maxY = this.maxY;
  301. this.minX = _minX < minX ? _minX : minX;
  302. this.minY = _minY < minY ? _minY : minY;
  303. this.maxX = _maxX > maxX ? _maxX : maxX;
  304. this.maxY = _maxY > maxY ? _maxY : maxY;
  305. }
  306. };
  307. /**
  308. * Adds other Bounds, multiplied by matrix. Bounds shouldn't be empty.
  309. * @param bounds - other bounds
  310. * @param matrix - multiplicator
  311. */
  312. Bounds.prototype.addBoundsMatrix = function (bounds, matrix) {
  313. this.addFrameMatrix(matrix, bounds.minX, bounds.minY, bounds.maxX, bounds.maxY);
  314. };
  315. /**
  316. * Adds other Bounds, masked with Rectangle.
  317. * @param bounds - TODO
  318. * @param area - TODO
  319. */
  320. Bounds.prototype.addBoundsArea = function (bounds, area) {
  321. var _minX = bounds.minX > area.x ? bounds.minX : area.x;
  322. var _minY = bounds.minY > area.y ? bounds.minY : area.y;
  323. var _maxX = bounds.maxX < area.x + area.width ? bounds.maxX : (area.x + area.width);
  324. var _maxY = bounds.maxY < area.y + area.height ? bounds.maxY : (area.y + area.height);
  325. if (_minX <= _maxX && _minY <= _maxY) {
  326. var minX = this.minX;
  327. var minY = this.minY;
  328. var maxX = this.maxX;
  329. var maxY = this.maxY;
  330. this.minX = _minX < minX ? _minX : minX;
  331. this.minY = _minY < minY ? _minY : minY;
  332. this.maxX = _maxX > maxX ? _maxX : maxX;
  333. this.maxY = _maxY > maxY ? _maxY : maxY;
  334. }
  335. };
  336. /**
  337. * Pads bounds object, making it grow in all directions.
  338. * If paddingY is omitted, both paddingX and paddingY will be set to paddingX.
  339. * @param paddingX - The horizontal padding amount.
  340. * @param paddingY - The vertical padding amount.
  341. */
  342. Bounds.prototype.pad = function (paddingX, paddingY) {
  343. if (paddingX === void 0) { paddingX = 0; }
  344. if (paddingY === void 0) { paddingY = paddingX; }
  345. if (!this.isEmpty()) {
  346. this.minX -= paddingX;
  347. this.maxX += paddingX;
  348. this.minY -= paddingY;
  349. this.maxY += paddingY;
  350. }
  351. };
  352. /**
  353. * Adds padded frame. (x0, y0) should be strictly less than (x1, y1)
  354. * @param x0 - left X of frame
  355. * @param y0 - top Y of frame
  356. * @param x1 - right X of frame
  357. * @param y1 - bottom Y of frame
  358. * @param padX - padding X
  359. * @param padY - padding Y
  360. */
  361. Bounds.prototype.addFramePad = function (x0, y0, x1, y1, padX, padY) {
  362. x0 -= padX;
  363. y0 -= padY;
  364. x1 += padX;
  365. y1 += padY;
  366. this.minX = this.minX < x0 ? this.minX : x0;
  367. this.maxX = this.maxX > x1 ? this.maxX : x1;
  368. this.minY = this.minY < y0 ? this.minY : y0;
  369. this.maxY = this.maxY > y1 ? this.maxY : y1;
  370. };
  371. return Bounds;
  372. }());
  373. /*! *****************************************************************************
  374. Copyright (c) Microsoft Corporation.
  375. Permission to use, copy, modify, and/or distribute this software for any
  376. purpose with or without fee is hereby granted.
  377. THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
  378. REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
  379. AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
  380. INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
  381. LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
  382. OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
  383. PERFORMANCE OF THIS SOFTWARE.
  384. ***************************************************************************** */
  385. /* global Reflect, Promise */
  386. var extendStatics = function(d, b) {
  387. extendStatics = Object.setPrototypeOf ||
  388. ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
  389. function (d, b) { for (var p in b) { if (b.hasOwnProperty(p)) { d[p] = b[p]; } } };
  390. return extendStatics(d, b);
  391. };
  392. function __extends(d, b) {
  393. extendStatics(d, b);
  394. function __() { this.constructor = d; }
  395. d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
  396. }
  397. /**
  398. * The base class for all objects that are rendered on the screen.
  399. *
  400. * This is an abstract class and can not be used on its own; rather it should be extended.
  401. *
  402. * ## Display objects implemented in PixiJS
  403. *
  404. * | Display Object | Description |
  405. * | ------------------------------- | --------------------------------------------------------------------- |
  406. * | {@link PIXI.Container} | Adds support for `children` to DisplayObject |
  407. * | {@link PIXI.Graphics} | Shape-drawing display object similar to the Canvas API |
  408. * | {@link PIXI.Sprite} | Draws textures (i.e. images) |
  409. * | {@link PIXI.Text} | Draws text using the Canvas API internally |
  410. * | {@link PIXI.BitmapText} | More scaleable solution for text rendering, reusing glyph textures |
  411. * | {@link PIXI.TilingSprite} | Draws textures/images in a tiled fashion |
  412. * | {@link PIXI.AnimatedSprite} | Draws an animation of multiple images |
  413. * | {@link PIXI.Mesh} | Provides a lower-level API for drawing meshes with custom data |
  414. * | {@link PIXI.NineSlicePlane} | Mesh-related |
  415. * | {@link PIXI.SimpleMesh} | v4-compatible mesh |
  416. * | {@link PIXI.SimplePlane} | Mesh-related |
  417. * | {@link PIXI.SimpleRope} | Mesh-related |
  418. *
  419. * ## Transforms
  420. *
  421. * The [transform]{@link DisplayObject#transform} of a display object describes the projection from its
  422. * local coordinate space to its parent's local coordinate space. The following properties are derived
  423. * from the transform:
  424. *
  425. * <table>
  426. * <thead>
  427. * <tr>
  428. * <th>Property</th>
  429. * <th>Description</th>
  430. * </tr>
  431. * </thead>
  432. * <tbody>
  433. * <tr>
  434. * <td>[pivot]{@link PIXI.DisplayObject#pivot}</td>
  435. * <td>
  436. * Invariant under rotation, scaling, and skewing. The projection of into the parent's space of the pivot
  437. * is equal to position, regardless of the other three transformations. In other words, It is the center of
  438. * rotation, scaling, and skewing.
  439. * </td>
  440. * </tr>
  441. * <tr>
  442. * <td>[position]{@link PIXI.DisplayObject#position}</td>
  443. * <td>
  444. * Translation. This is the position of the [pivot]{@link PIXI.DisplayObject#pivot} in the parent's local
  445. * space. The default value of the pivot is the origin (0,0). If the top-left corner of your display object
  446. * is (0,0) in its local space, then the position will be its top-left corner in the parent's local space.
  447. * </td>
  448. * </tr>
  449. * <tr>
  450. * <td>[scale]{@link PIXI.DisplayObject#scale}</td>
  451. * <td>
  452. * Scaling. This will stretch (or compress) the display object's projection. The scale factors are along the
  453. * local coordinate axes. In other words, the display object is scaled before rotated or skewed. The center
  454. * of scaling is the [pivot]{@link PIXI.DisplayObject#pivot}.
  455. * </td>
  456. * </tr>
  457. * <tr>
  458. * <td>[rotation]{@link PIXI.DisplayObject#rotation}</td>
  459. * <td>
  460. * Rotation. This will rotate the display object's projection by this angle (in radians).
  461. * </td>
  462. * </tr>
  463. * <tr>
  464. * <td>[skew]{@link PIXI.DisplayObject#skew}</td>
  465. * <td>
  466. * <p>Skewing. This can be used to deform a rectangular display object into a parallelogram.</p>
  467. * <p>
  468. * In PixiJS, skew has a slightly different behaviour than the conventional meaning. It can be
  469. * thought of the net rotation applied to the coordinate axes (separately). For example, if "skew.x" is
  470. * ⍺ and "skew.y" is β, then the line x = 0 will be rotated by ⍺ (y = -x*cot⍺) and the line y = 0 will be
  471. * rotated by β (y = x*tanβ). A line y = x*tanϴ (i.e. a line at angle ϴ to the x-axis in local-space) will
  472. * be rotated by an angle between ⍺ and β.
  473. * </p>
  474. * <p>
  475. * It can be observed that if skew is applied equally to both axes, then it will be equivalent to applying
  476. * a rotation. Indeed, if "skew.x" = -ϴ and "skew.y" = ϴ, it will produce an equivalent of "rotation" = ϴ.
  477. * </p>
  478. * <p>
  479. * Another quite interesting observation is that "skew.x", "skew.y", rotation are communtative operations. Indeed,
  480. * because rotation is essentially a careful combination of the two.
  481. * </p>
  482. * </td>
  483. * </tr>
  484. * <tr>
  485. * <td>angle</td>
  486. * <td>Rotation. This is an alias for [rotation]{@link PIXI.DisplayObject#rotation}, but in degrees.</td>
  487. * </tr>
  488. * <tr>
  489. * <td>x</td>
  490. * <td>Translation. This is an alias for position.x!</td>
  491. * </tr>
  492. * <tr>
  493. * <td>y</td>
  494. * <td>Translation. This is an alias for position.y!</td>
  495. * </tr>
  496. * <tr>
  497. * <td>width</td>
  498. * <td>
  499. * Implemented in [Container]{@link PIXI.Container}. Scaling. The width property calculates scale.x by dividing
  500. * the "requested" width by the local bounding box width. It is indirectly an abstraction over scale.x, and there
  501. * is no concept of user-defined width.
  502. * </td>
  503. * </tr>
  504. * <tr>
  505. * <td>height</td>
  506. * <td>
  507. * Implemented in [Container]{@link PIXI.Container}. Scaling. The height property calculates scale.y by dividing
  508. * the "requested" height by the local bounding box height. It is indirectly an abstraction over scale.y, and there
  509. * is no concept of user-defined height.
  510. * </td>
  511. * </tr>
  512. * </tbody>
  513. * </table>
  514. *
  515. * ## Bounds
  516. *
  517. * The bounds of a display object is defined by the minimum axis-aligned rectangle in world space that can fit
  518. * around it. The abstract `calculateBounds` method is responsible for providing it (and it should use the
  519. * `worldTransform` to calculate in world space).
  520. *
  521. * There are a few additional types of bounding boxes:
  522. *
  523. * | Bounds | Description |
  524. * | --------------------- | ---------------------------------------------------------------------------------------- |
  525. * | World Bounds | This is synonymous is the regular bounds described above. See `getBounds()`. |
  526. * | Local Bounds | This the axis-aligned bounding box in the parent's local space. See `getLocalBounds()`. |
  527. * | Render Bounds | The bounds, but including extra rendering effects like filter padding. |
  528. * | Projected Bounds | The bounds of the projected display object onto the screen. Usually equals world bounds. |
  529. * | Relative Bounds | The bounds of a display object when projected onto a ancestor's (or parent's) space. |
  530. * | Natural Bounds | The bounds of an object in its own local space (not parent's space, like in local bounds)|
  531. * | Content Bounds | The natural bounds when excluding all children of a `Container`. |
  532. *
  533. * ### calculateBounds
  534. *
  535. * [Container]{@link Container} already implements `calculateBounds` in a manner that includes children.
  536. *
  537. * But for a non-Container display object, the `calculateBounds` method must be overridden in order for `getBounds` and
  538. * `getLocalBounds` to work. This method must write the bounds into `this._bounds`.
  539. *
  540. * Generally, the following technique works for most simple cases: take the list of points
  541. * forming the "hull" of the object (i.e. outline of the object's shape), and then add them
  542. * using {@link PIXI.Bounds#addPointMatrix}.
  543. *
  544. * ```js
  545. * calculateBounds(): void
  546. * {
  547. * const points = [...];
  548. *
  549. * for (let i = 0, j = points.length; i < j; i++)
  550. * {
  551. * this._bounds.addPointMatrix(this.worldTransform, points[i]);
  552. * }
  553. * }
  554. * ```
  555. *
  556. * You can optimize this for a large number of points by using {@link PIXI.Bounds#addVerticesMatrix} to pass them
  557. * in one array together.
  558. *
  559. * ## Alpha
  560. *
  561. * This alpha sets a display object's **relative opacity** w.r.t its parent. For example, if the alpha of a display
  562. * object is 0.5 and its parent's alpha is 0.5, then it will be rendered with 25% opacity (assuming alpha is not
  563. * applied on any ancestor further up the chain).
  564. *
  565. * The alpha with which the display object will be rendered is called the [worldAlpha]{@link PIXI.DisplayObject#worldAlpha}.
  566. *
  567. * ## Renderable vs Visible
  568. *
  569. * The `renderable` and `visible` properties can be used to prevent a display object from being rendered to the
  570. * screen. However, there is a subtle difference between the two. When using `renderable`, the transforms of the display
  571. * object (and its children subtree) will continue to be calculated. When using `visible`, the transforms will not
  572. * be calculated.
  573. *
  574. * It is recommended that applications use the `renderable` property for culling. See
  575. * [@pixi-essentials/cull]{@link https://www.npmjs.com/package/@pixi-essentials/cull} or
  576. * [pixi-cull]{@link https://www.npmjs.com/package/pixi-cull} for more details.
  577. *
  578. * Otherwise, to prevent an object from rendering in the general-purpose sense - `visible` is the property to use. This
  579. * one is also better in terms of performance.
  580. * @memberof PIXI
  581. */
  582. var DisplayObject = /** @class */ (function (_super) {
  583. __extends(DisplayObject, _super);
  584. function DisplayObject() {
  585. var _this = _super.call(this) || this;
  586. _this.tempDisplayObjectParent = null;
  587. // TODO: need to create Transform from factory
  588. _this.transform = new math.Transform();
  589. _this.alpha = 1;
  590. _this.visible = true;
  591. _this.renderable = true;
  592. _this.cullable = false;
  593. _this.cullArea = null;
  594. _this.parent = null;
  595. _this.worldAlpha = 1;
  596. _this._lastSortedIndex = 0;
  597. _this._zIndex = 0;
  598. _this.filterArea = null;
  599. _this.filters = null;
  600. _this._enabledFilters = null;
  601. _this._bounds = new Bounds();
  602. _this._localBounds = null;
  603. _this._boundsID = 0;
  604. _this._boundsRect = null;
  605. _this._localBoundsRect = null;
  606. _this._mask = null;
  607. _this._maskRefCount = 0;
  608. _this._destroyed = false;
  609. _this.isSprite = false;
  610. _this.isMask = false;
  611. return _this;
  612. }
  613. /**
  614. * Mixes all enumerable properties and methods from a source object to DisplayObject.
  615. * @param source - The source of properties and methods to mix in.
  616. */
  617. DisplayObject.mixin = function (source) {
  618. // in ES8/ES2017, this would be really easy:
  619. // Object.defineProperties(DisplayObject.prototype, Object.getOwnPropertyDescriptors(source));
  620. // get all the enumerable property keys
  621. var keys = Object.keys(source);
  622. // loop through properties
  623. for (var i = 0; i < keys.length; ++i) {
  624. var propertyName = keys[i];
  625. // Set the property using the property descriptor - this works for accessors and normal value properties
  626. Object.defineProperty(DisplayObject.prototype, propertyName, Object.getOwnPropertyDescriptor(source, propertyName));
  627. }
  628. };
  629. Object.defineProperty(DisplayObject.prototype, "destroyed", {
  630. /**
  631. * Fired when this DisplayObject is added to a Container.
  632. * @instance
  633. * @event added
  634. * @param {PIXI.Container} container - The container added to.
  635. */
  636. /**
  637. * Fired when this DisplayObject is removed from a Container.
  638. * @instance
  639. * @event removed
  640. * @param {PIXI.Container} container - The container removed from.
  641. */
  642. /**
  643. * Fired when this DisplayObject is destroyed. This event is emitted once
  644. * destroy is finished.
  645. * @instance
  646. * @event destroyed
  647. */
  648. /** Readonly flag for destroyed display objects. */
  649. get: function () {
  650. return this._destroyed;
  651. },
  652. enumerable: false,
  653. configurable: true
  654. });
  655. /** Recursively updates transform of all objects from the root to this one internal function for toLocal() */
  656. DisplayObject.prototype._recursivePostUpdateTransform = function () {
  657. if (this.parent) {
  658. this.parent._recursivePostUpdateTransform();
  659. this.transform.updateTransform(this.parent.transform);
  660. }
  661. else {
  662. this.transform.updateTransform(this._tempDisplayObjectParent.transform);
  663. }
  664. };
  665. /** Updates the object transform for rendering. TODO - Optimization pass! */
  666. DisplayObject.prototype.updateTransform = function () {
  667. this._boundsID++;
  668. this.transform.updateTransform(this.parent.transform);
  669. // multiply the alphas..
  670. this.worldAlpha = this.alpha * this.parent.worldAlpha;
  671. };
  672. /**
  673. * Calculates and returns the (world) bounds of the display object as a [Rectangle]{@link PIXI.Rectangle}.
  674. *
  675. * This method is expensive on containers with a large subtree (like the stage). This is because the bounds
  676. * of a container depend on its children's bounds, which recursively causes all bounds in the subtree to
  677. * be recalculated. The upside, however, is that calling `getBounds` once on a container will indeed update
  678. * the bounds of all children (the whole subtree, in fact). This side effect should be exploited by using
  679. * `displayObject._bounds.getRectangle()` when traversing through all the bounds in a scene graph. Otherwise,
  680. * calling `getBounds` on each object in a subtree will cause the total cost to increase quadratically as
  681. * its height increases.
  682. *
  683. * The transforms of all objects in a container's **subtree** and of all **ancestors** are updated.
  684. * The world bounds of all display objects in a container's **subtree** will also be recalculated.
  685. *
  686. * The `_bounds` object stores the last calculation of the bounds. You can use to entirely skip bounds
  687. * calculation if needed.
  688. *
  689. * ```js
  690. * const lastCalculatedBounds = displayObject._bounds.getRectangle(optionalRect);
  691. * ```
  692. *
  693. * Do know that usage of `getLocalBounds` can corrupt the `_bounds` of children (the whole subtree, actually). This
  694. * is a known issue that has not been solved. See [getLocalBounds]{@link PIXI.DisplayObject#getLocalBounds} for more
  695. * details.
  696. *
  697. * `getBounds` should be called with `skipUpdate` equal to `true` in a render() call. This is because the transforms
  698. * are guaranteed to be update-to-date. In fact, recalculating inside a render() call may cause corruption in certain
  699. * cases.
  700. * @param skipUpdate - Setting to `true` will stop the transforms of the scene graph from
  701. * being updated. This means the calculation returned MAY be out of date BUT will give you a
  702. * nice performance boost.
  703. * @param rect - Optional rectangle to store the result of the bounds calculation.
  704. * @returns - The minimum axis-aligned rectangle in world space that fits around this object.
  705. */
  706. DisplayObject.prototype.getBounds = function (skipUpdate, rect) {
  707. if (!skipUpdate) {
  708. if (!this.parent) {
  709. this.parent = this._tempDisplayObjectParent;
  710. this.updateTransform();
  711. this.parent = null;
  712. }
  713. else {
  714. this._recursivePostUpdateTransform();
  715. this.updateTransform();
  716. }
  717. }
  718. if (this._bounds.updateID !== this._boundsID) {
  719. this.calculateBounds();
  720. this._bounds.updateID = this._boundsID;
  721. }
  722. if (!rect) {
  723. if (!this._boundsRect) {
  724. this._boundsRect = new math.Rectangle();
  725. }
  726. rect = this._boundsRect;
  727. }
  728. return this._bounds.getRectangle(rect);
  729. };
  730. /**
  731. * Retrieves the local bounds of the displayObject as a rectangle object.
  732. * @param rect - Optional rectangle to store the result of the bounds calculation.
  733. * @returns - The rectangular bounding area.
  734. */
  735. DisplayObject.prototype.getLocalBounds = function (rect) {
  736. if (!rect) {
  737. if (!this._localBoundsRect) {
  738. this._localBoundsRect = new math.Rectangle();
  739. }
  740. rect = this._localBoundsRect;
  741. }
  742. if (!this._localBounds) {
  743. this._localBounds = new Bounds();
  744. }
  745. var transformRef = this.transform;
  746. var parentRef = this.parent;
  747. this.parent = null;
  748. this.transform = this._tempDisplayObjectParent.transform;
  749. var worldBounds = this._bounds;
  750. var worldBoundsID = this._boundsID;
  751. this._bounds = this._localBounds;
  752. var bounds = this.getBounds(false, rect);
  753. this.parent = parentRef;
  754. this.transform = transformRef;
  755. this._bounds = worldBounds;
  756. this._bounds.updateID += this._boundsID - worldBoundsID; // reflect side-effects
  757. return bounds;
  758. };
  759. /**
  760. * Calculates the global position of the display object.
  761. * @param position - The world origin to calculate from.
  762. * @param point - A Point object in which to store the value, optional
  763. * (otherwise will create a new Point).
  764. * @param skipUpdate - Should we skip the update transform.
  765. * @returns - A point object representing the position of this object.
  766. */
  767. DisplayObject.prototype.toGlobal = function (position, point, skipUpdate) {
  768. if (skipUpdate === void 0) { skipUpdate = false; }
  769. if (!skipUpdate) {
  770. this._recursivePostUpdateTransform();
  771. // this parent check is for just in case the item is a root object.
  772. // If it is we need to give it a temporary parent so that displayObjectUpdateTransform works correctly
  773. // this is mainly to avoid a parent check in the main loop. Every little helps for performance :)
  774. if (!this.parent) {
  775. this.parent = this._tempDisplayObjectParent;
  776. this.displayObjectUpdateTransform();
  777. this.parent = null;
  778. }
  779. else {
  780. this.displayObjectUpdateTransform();
  781. }
  782. }
  783. // don't need to update the lot
  784. return this.worldTransform.apply(position, point);
  785. };
  786. /**
  787. * Calculates the local position of the display object relative to another point.
  788. * @param position - The world origin to calculate from.
  789. * @param from - The DisplayObject to calculate the global position from.
  790. * @param point - A Point object in which to store the value, optional
  791. * (otherwise will create a new Point).
  792. * @param skipUpdate - Should we skip the update transform
  793. * @returns - A point object representing the position of this object
  794. */
  795. DisplayObject.prototype.toLocal = function (position, from, point, skipUpdate) {
  796. if (from) {
  797. position = from.toGlobal(position, point, skipUpdate);
  798. }
  799. if (!skipUpdate) {
  800. this._recursivePostUpdateTransform();
  801. // this parent check is for just in case the item is a root object.
  802. // If it is we need to give it a temporary parent so that displayObjectUpdateTransform works correctly
  803. // this is mainly to avoid a parent check in the main loop. Every little helps for performance :)
  804. if (!this.parent) {
  805. this.parent = this._tempDisplayObjectParent;
  806. this.displayObjectUpdateTransform();
  807. this.parent = null;
  808. }
  809. else {
  810. this.displayObjectUpdateTransform();
  811. }
  812. }
  813. // simply apply the matrix..
  814. return this.worldTransform.applyInverse(position, point);
  815. };
  816. /**
  817. * Set the parent Container of this DisplayObject.
  818. * @param container - The Container to add this DisplayObject to.
  819. * @returns - The Container that this DisplayObject was added to.
  820. */
  821. DisplayObject.prototype.setParent = function (container) {
  822. if (!container || !container.addChild) {
  823. throw new Error('setParent: Argument must be a Container');
  824. }
  825. container.addChild(this);
  826. return container;
  827. };
  828. /**
  829. * Convenience function to set the position, scale, skew and pivot at once.
  830. * @param x - The X position
  831. * @param y - The Y position
  832. * @param scaleX - The X scale value
  833. * @param scaleY - The Y scale value
  834. * @param rotation - The rotation
  835. * @param skewX - The X skew value
  836. * @param skewY - The Y skew value
  837. * @param pivotX - The X pivot value
  838. * @param pivotY - The Y pivot value
  839. * @returns - The DisplayObject instance
  840. */
  841. DisplayObject.prototype.setTransform = function (x, y, scaleX, scaleY, rotation, skewX, skewY, pivotX, pivotY) {
  842. if (x === void 0) { x = 0; }
  843. if (y === void 0) { y = 0; }
  844. if (scaleX === void 0) { scaleX = 1; }
  845. if (scaleY === void 0) { scaleY = 1; }
  846. if (rotation === void 0) { rotation = 0; }
  847. if (skewX === void 0) { skewX = 0; }
  848. if (skewY === void 0) { skewY = 0; }
  849. if (pivotX === void 0) { pivotX = 0; }
  850. if (pivotY === void 0) { pivotY = 0; }
  851. this.position.x = x;
  852. this.position.y = y;
  853. this.scale.x = !scaleX ? 1 : scaleX;
  854. this.scale.y = !scaleY ? 1 : scaleY;
  855. this.rotation = rotation;
  856. this.skew.x = skewX;
  857. this.skew.y = skewY;
  858. this.pivot.x = pivotX;
  859. this.pivot.y = pivotY;
  860. return this;
  861. };
  862. /**
  863. * Base destroy method for generic display objects. This will automatically
  864. * remove the display object from its parent Container as well as remove
  865. * all current event listeners and internal references. Do not use a DisplayObject
  866. * after calling `destroy()`.
  867. * @param _options
  868. */
  869. DisplayObject.prototype.destroy = function (_options) {
  870. if (this.parent) {
  871. this.parent.removeChild(this);
  872. }
  873. this._destroyed = true;
  874. this.transform = null;
  875. this.parent = null;
  876. this._bounds = null;
  877. this.mask = null;
  878. this.cullArea = null;
  879. this.filters = null;
  880. this.filterArea = null;
  881. this.hitArea = null;
  882. this.interactive = false;
  883. this.interactiveChildren = false;
  884. this.emit('destroyed');
  885. this.removeAllListeners();
  886. };
  887. Object.defineProperty(DisplayObject.prototype, "_tempDisplayObjectParent", {
  888. /**
  889. * @protected
  890. * @member {PIXI.Container}
  891. */
  892. get: function () {
  893. if (this.tempDisplayObjectParent === null) {
  894. // eslint-disable-next-line @typescript-eslint/no-use-before-define
  895. this.tempDisplayObjectParent = new TemporaryDisplayObject();
  896. }
  897. return this.tempDisplayObjectParent;
  898. },
  899. enumerable: false,
  900. configurable: true
  901. });
  902. /**
  903. * Used in Renderer, cacheAsBitmap and other places where you call an `updateTransform` on root
  904. *
  905. * ```
  906. * const cacheParent = elem.enableTempParent();
  907. * elem.updateTransform();
  908. * elem.disableTempParent(cacheParent);
  909. * ```
  910. * @returns - current parent
  911. */
  912. DisplayObject.prototype.enableTempParent = function () {
  913. var myParent = this.parent;
  914. this.parent = this._tempDisplayObjectParent;
  915. return myParent;
  916. };
  917. /**
  918. * Pair method for `enableTempParent`
  919. * @param cacheParent - Actual parent of element
  920. */
  921. DisplayObject.prototype.disableTempParent = function (cacheParent) {
  922. this.parent = cacheParent;
  923. };
  924. Object.defineProperty(DisplayObject.prototype, "x", {
  925. /**
  926. * The position of the displayObject on the x axis relative to the local coordinates of the parent.
  927. * An alias to position.x
  928. */
  929. get: function () {
  930. return this.position.x;
  931. },
  932. set: function (value) {
  933. this.transform.position.x = value;
  934. },
  935. enumerable: false,
  936. configurable: true
  937. });
  938. Object.defineProperty(DisplayObject.prototype, "y", {
  939. /**
  940. * The position of the displayObject on the y axis relative to the local coordinates of the parent.
  941. * An alias to position.y
  942. */
  943. get: function () {
  944. return this.position.y;
  945. },
  946. set: function (value) {
  947. this.transform.position.y = value;
  948. },
  949. enumerable: false,
  950. configurable: true
  951. });
  952. Object.defineProperty(DisplayObject.prototype, "worldTransform", {
  953. /**
  954. * Current transform of the object based on world (parent) factors.
  955. * @readonly
  956. */
  957. get: function () {
  958. return this.transform.worldTransform;
  959. },
  960. enumerable: false,
  961. configurable: true
  962. });
  963. Object.defineProperty(DisplayObject.prototype, "localTransform", {
  964. /**
  965. * Current transform of the object based on local factors: position, scale, other stuff.
  966. * @readonly
  967. */
  968. get: function () {
  969. return this.transform.localTransform;
  970. },
  971. enumerable: false,
  972. configurable: true
  973. });
  974. Object.defineProperty(DisplayObject.prototype, "position", {
  975. /**
  976. * The coordinate of the object relative to the local coordinates of the parent.
  977. * @since 4.0.0
  978. */
  979. get: function () {
  980. return this.transform.position;
  981. },
  982. set: function (value) {
  983. this.transform.position.copyFrom(value);
  984. },
  985. enumerable: false,
  986. configurable: true
  987. });
  988. Object.defineProperty(DisplayObject.prototype, "scale", {
  989. /**
  990. * The scale factors of this object along the local coordinate axes.
  991. *
  992. * The default scale is (1, 1).
  993. * @since 4.0.0
  994. */
  995. get: function () {
  996. return this.transform.scale;
  997. },
  998. set: function (value) {
  999. this.transform.scale.copyFrom(value);
  1000. },
  1001. enumerable: false,
  1002. configurable: true
  1003. });
  1004. Object.defineProperty(DisplayObject.prototype, "pivot", {
  1005. /**
  1006. * The center of rotation, scaling, and skewing for this display object in its local space. The `position`
  1007. * is the projection of `pivot` in the parent's local space.
  1008. *
  1009. * By default, the pivot is the origin (0, 0).
  1010. * @since 4.0.0
  1011. */
  1012. get: function () {
  1013. return this.transform.pivot;
  1014. },
  1015. set: function (value) {
  1016. this.transform.pivot.copyFrom(value);
  1017. },
  1018. enumerable: false,
  1019. configurable: true
  1020. });
  1021. Object.defineProperty(DisplayObject.prototype, "skew", {
  1022. /**
  1023. * The skew factor for the object in radians.
  1024. * @since 4.0.0
  1025. */
  1026. get: function () {
  1027. return this.transform.skew;
  1028. },
  1029. set: function (value) {
  1030. this.transform.skew.copyFrom(value);
  1031. },
  1032. enumerable: false,
  1033. configurable: true
  1034. });
  1035. Object.defineProperty(DisplayObject.prototype, "rotation", {
  1036. /**
  1037. * The rotation of the object in radians.
  1038. * 'rotation' and 'angle' have the same effect on a display object; rotation is in radians, angle is in degrees.
  1039. */
  1040. get: function () {
  1041. return this.transform.rotation;
  1042. },
  1043. set: function (value) {
  1044. this.transform.rotation = value;
  1045. },
  1046. enumerable: false,
  1047. configurable: true
  1048. });
  1049. Object.defineProperty(DisplayObject.prototype, "angle", {
  1050. /**
  1051. * The angle of the object in degrees.
  1052. * 'rotation' and 'angle' have the same effect on a display object; rotation is in radians, angle is in degrees.
  1053. */
  1054. get: function () {
  1055. return this.transform.rotation * math.RAD_TO_DEG;
  1056. },
  1057. set: function (value) {
  1058. this.transform.rotation = value * math.DEG_TO_RAD;
  1059. },
  1060. enumerable: false,
  1061. configurable: true
  1062. });
  1063. Object.defineProperty(DisplayObject.prototype, "zIndex", {
  1064. /**
  1065. * The zIndex of the displayObject.
  1066. *
  1067. * If a container has the sortableChildren property set to true, children will be automatically
  1068. * sorted by zIndex value; a higher value will mean it will be moved towards the end of the array,
  1069. * and thus rendered on top of other display objects within the same container.
  1070. * @see PIXI.Container#sortableChildren
  1071. */
  1072. get: function () {
  1073. return this._zIndex;
  1074. },
  1075. set: function (value) {
  1076. this._zIndex = value;
  1077. if (this.parent) {
  1078. this.parent.sortDirty = true;
  1079. }
  1080. },
  1081. enumerable: false,
  1082. configurable: true
  1083. });
  1084. Object.defineProperty(DisplayObject.prototype, "worldVisible", {
  1085. /**
  1086. * Indicates if the object is globally visible.
  1087. * @readonly
  1088. */
  1089. get: function () {
  1090. var item = this;
  1091. do {
  1092. if (!item.visible) {
  1093. return false;
  1094. }
  1095. item = item.parent;
  1096. } while (item);
  1097. return true;
  1098. },
  1099. enumerable: false,
  1100. configurable: true
  1101. });
  1102. Object.defineProperty(DisplayObject.prototype, "mask", {
  1103. /**
  1104. * Sets a mask for the displayObject. A mask is an object that limits the visibility of an
  1105. * object to the shape of the mask applied to it. In PixiJS a regular mask must be a
  1106. * {@link PIXI.Graphics} or a {@link PIXI.Sprite} object. This allows for much faster masking in canvas as it
  1107. * utilities shape clipping. Furthermore, a mask of an object must be in the subtree of its parent.
  1108. * Otherwise, `getLocalBounds` may calculate incorrect bounds, which makes the container's width and height wrong.
  1109. * To remove a mask, set this property to `null`.
  1110. *
  1111. * For sprite mask both alpha and red channel are used. Black mask is the same as transparent mask.
  1112. * @example
  1113. * const graphics = new PIXI.Graphics();
  1114. * graphics.beginFill(0xFF3300);
  1115. * graphics.drawRect(50, 250, 100, 100);
  1116. * graphics.endFill();
  1117. *
  1118. * const sprite = new PIXI.Sprite(texture);
  1119. * sprite.mask = graphics;
  1120. * @todo At the moment, PIXI.CanvasRenderer doesn't support PIXI.Sprite as mask.
  1121. */
  1122. get: function () {
  1123. return this._mask;
  1124. },
  1125. set: function (value) {
  1126. if (this._mask === value) {
  1127. return;
  1128. }
  1129. if (this._mask) {
  1130. var maskObject = (this._mask.isMaskData
  1131. ? this._mask.maskObject : this._mask);
  1132. if (maskObject) {
  1133. maskObject._maskRefCount--;
  1134. if (maskObject._maskRefCount === 0) {
  1135. maskObject.renderable = true;
  1136. maskObject.isMask = false;
  1137. }
  1138. }
  1139. }
  1140. this._mask = value;
  1141. if (this._mask) {
  1142. var maskObject = (this._mask.isMaskData
  1143. ? this._mask.maskObject : this._mask);
  1144. if (maskObject) {
  1145. if (maskObject._maskRefCount === 0) {
  1146. maskObject.renderable = false;
  1147. maskObject.isMask = true;
  1148. }
  1149. maskObject._maskRefCount++;
  1150. }
  1151. }
  1152. },
  1153. enumerable: false,
  1154. configurable: true
  1155. });
  1156. return DisplayObject;
  1157. }(utils.EventEmitter));
  1158. /**
  1159. * @private
  1160. */
  1161. var TemporaryDisplayObject = /** @class */ (function (_super) {
  1162. __extends(TemporaryDisplayObject, _super);
  1163. function TemporaryDisplayObject() {
  1164. var _this = _super !== null && _super.apply(this, arguments) || this;
  1165. _this.sortDirty = null;
  1166. return _this;
  1167. }
  1168. return TemporaryDisplayObject;
  1169. }(DisplayObject));
  1170. /**
  1171. * DisplayObject default updateTransform, does not update children of container.
  1172. * Will crash if there's no parent element.
  1173. * @memberof PIXI.DisplayObject#
  1174. * @method displayObjectUpdateTransform
  1175. */
  1176. DisplayObject.prototype.displayObjectUpdateTransform = DisplayObject.prototype.updateTransform;
  1177. function sortChildren(a, b) {
  1178. if (a.zIndex === b.zIndex) {
  1179. return a._lastSortedIndex - b._lastSortedIndex;
  1180. }
  1181. return a.zIndex - b.zIndex;
  1182. }
  1183. /**
  1184. * Container is a general-purpose display object that holds children. It also adds built-in support for advanced
  1185. * rendering features like masking and filtering.
  1186. *
  1187. * It is the base class of all display objects that act as a container for other objects, including Graphics
  1188. * and Sprite.
  1189. *
  1190. * ```js
  1191. * import { BlurFilter } from '@pixi/filter-blur';
  1192. * import { Container } from '@pixi/display';
  1193. * import { Graphics } from '@pixi/graphics';
  1194. * import { Sprite } from '@pixi/sprite';
  1195. *
  1196. * let container = new Container();
  1197. * let sprite = Sprite.from("https://s3-us-west-2.amazonaws.com/s.cdpn.io/693612/IaUrttj.png");
  1198. *
  1199. * sprite.width = 512;
  1200. * sprite.height = 512;
  1201. *
  1202. * // Adds a sprite as a child to this container. As a result, the sprite will be rendered whenever the container
  1203. * // is rendered.
  1204. * container.addChild(sprite);
  1205. *
  1206. * // Blurs whatever is rendered by the container
  1207. * container.filters = [new BlurFilter()];
  1208. *
  1209. * // Only the contents within a circle at the center should be rendered onto the screen.
  1210. * container.mask = new Graphics()
  1211. * .beginFill(0xffffff)
  1212. * .drawCircle(sprite.width / 2, sprite.height / 2, Math.min(sprite.width, sprite.height) / 2)
  1213. * .endFill();
  1214. * ```
  1215. * @memberof PIXI
  1216. */
  1217. var Container = /** @class */ (function (_super) {
  1218. __extends(Container, _super);
  1219. function Container() {
  1220. var _this = _super.call(this) || this;
  1221. _this.children = [];
  1222. _this.sortableChildren = settings.settings.SORTABLE_CHILDREN;
  1223. _this.sortDirty = false;
  1224. return _this;
  1225. /**
  1226. * Fired when a DisplayObject is added to this Container.
  1227. * @event PIXI.Container#childAdded
  1228. * @param {PIXI.DisplayObject} child - The child added to the Container.
  1229. * @param {PIXI.Container} container - The container that added the child.
  1230. * @param {number} index - The children's index of the added child.
  1231. */
  1232. /**
  1233. * Fired when a DisplayObject is removed from this Container.
  1234. * @event PIXI.DisplayObject#childRemoved
  1235. * @param {PIXI.DisplayObject} child - The child removed from the Container.
  1236. * @param {PIXI.Container} container - The container that removed the child.
  1237. * @param {number} index - The former children's index of the removed child
  1238. */
  1239. }
  1240. /**
  1241. * Overridable method that can be used by Container subclasses whenever the children array is modified.
  1242. * @param _length
  1243. */
  1244. Container.prototype.onChildrenChange = function (_length) {
  1245. /* empty */
  1246. };
  1247. /**
  1248. * Adds one or more children to the container.
  1249. *
  1250. * Multiple items can be added like so: `myContainer.addChild(thingOne, thingTwo, thingThree)`
  1251. * @param {...PIXI.DisplayObject} children - The DisplayObject(s) to add to the container
  1252. * @returns {PIXI.DisplayObject} - The first child that was added.
  1253. */
  1254. Container.prototype.addChild = function () {
  1255. var arguments$1 = arguments;
  1256. var children = [];
  1257. for (var _i = 0; _i < arguments.length; _i++) {
  1258. children[_i] = arguments$1[_i];
  1259. }
  1260. // if there is only one argument we can bypass looping through the them
  1261. if (children.length > 1) {
  1262. // loop through the array and add all children
  1263. for (var i = 0; i < children.length; i++) {
  1264. // eslint-disable-next-line prefer-rest-params
  1265. this.addChild(children[i]);
  1266. }
  1267. }
  1268. else {
  1269. var child = children[0];
  1270. // if the child has a parent then lets remove it as PixiJS objects can only exist in one place
  1271. if (child.parent) {
  1272. child.parent.removeChild(child);
  1273. }
  1274. child.parent = this;
  1275. this.sortDirty = true;
  1276. // ensure child transform will be recalculated
  1277. child.transform._parentID = -1;
  1278. this.children.push(child);
  1279. // ensure bounds will be recalculated
  1280. this._boundsID++;
  1281. // TODO - lets either do all callbacks or all events.. not both!
  1282. this.onChildrenChange(this.children.length - 1);
  1283. this.emit('childAdded', child, this, this.children.length - 1);
  1284. child.emit('added', this);
  1285. }
  1286. return children[0];
  1287. };
  1288. /**
  1289. * Adds a child to the container at a specified index. If the index is out of bounds an error will be thrown
  1290. * @param {PIXI.DisplayObject} child - The child to add
  1291. * @param {number} index - The index to place the child in
  1292. * @returns {PIXI.DisplayObject} The child that was added.
  1293. */
  1294. Container.prototype.addChildAt = function (child, index) {
  1295. if (index < 0 || index > this.children.length) {
  1296. throw new Error(child + "addChildAt: The index " + index + " supplied is out of bounds " + this.children.length);
  1297. }
  1298. if (child.parent) {
  1299. child.parent.removeChild(child);
  1300. }
  1301. child.parent = this;
  1302. this.sortDirty = true;
  1303. // ensure child transform will be recalculated
  1304. child.transform._parentID = -1;
  1305. this.children.splice(index, 0, child);
  1306. // ensure bounds will be recalculated
  1307. this._boundsID++;
  1308. // TODO - lets either do all callbacks or all events.. not both!
  1309. this.onChildrenChange(index);
  1310. child.emit('added', this);
  1311. this.emit('childAdded', child, this, index);
  1312. return child;
  1313. };
  1314. /**
  1315. * Swaps the position of 2 Display Objects within this container.
  1316. * @param child - First display object to swap
  1317. * @param child2 - Second display object to swap
  1318. */
  1319. Container.prototype.swapChildren = function (child, child2) {
  1320. if (child === child2) {
  1321. return;
  1322. }
  1323. var index1 = this.getChildIndex(child);
  1324. var index2 = this.getChildIndex(child2);
  1325. this.children[index1] = child2;
  1326. this.children[index2] = child;
  1327. this.onChildrenChange(index1 < index2 ? index1 : index2);
  1328. };
  1329. /**
  1330. * Returns the index position of a child DisplayObject instance
  1331. * @param child - The DisplayObject instance to identify
  1332. * @returns - The index position of the child display object to identify
  1333. */
  1334. Container.prototype.getChildIndex = function (child) {
  1335. var index = this.children.indexOf(child);
  1336. if (index === -1) {
  1337. throw new Error('The supplied DisplayObject must be a child of the caller');
  1338. }
  1339. return index;
  1340. };
  1341. /**
  1342. * Changes the position of an existing child in the display object container
  1343. * @param child - The child DisplayObject instance for which you want to change the index number
  1344. * @param index - The resulting index number for the child display object
  1345. */
  1346. Container.prototype.setChildIndex = function (child, index) {
  1347. if (index < 0 || index >= this.children.length) {
  1348. throw new Error("The index " + index + " supplied is out of bounds " + this.children.length);
  1349. }
  1350. var currentIndex = this.getChildIndex(child);
  1351. utils.removeItems(this.children, currentIndex, 1); // remove from old position
  1352. this.children.splice(index, 0, child); // add at new position
  1353. this.onChildrenChange(index);
  1354. };
  1355. /**
  1356. * Returns the child at the specified index
  1357. * @param index - The index to get the child at
  1358. * @returns - The child at the given index, if any.
  1359. */
  1360. Container.prototype.getChildAt = function (index) {
  1361. if (index < 0 || index >= this.children.length) {
  1362. throw new Error("getChildAt: Index (" + index + ") does not exist.");
  1363. }
  1364. return this.children[index];
  1365. };
  1366. /**
  1367. * Removes one or more children from the container.
  1368. * @param {...PIXI.DisplayObject} children - The DisplayObject(s) to remove
  1369. * @returns {PIXI.DisplayObject} The first child that was removed.
  1370. */
  1371. Container.prototype.removeChild = function () {
  1372. var arguments$1 = arguments;
  1373. var children = [];
  1374. for (var _i = 0; _i < arguments.length; _i++) {
  1375. children[_i] = arguments$1[_i];
  1376. }
  1377. // if there is only one argument we can bypass looping through the them
  1378. if (children.length > 1) {
  1379. // loop through the arguments property and remove all children
  1380. for (var i = 0; i < children.length; i++) {
  1381. this.removeChild(children[i]);
  1382. }
  1383. }
  1384. else {
  1385. var child = children[0];
  1386. var index = this.children.indexOf(child);
  1387. if (index === -1)
  1388. { return null; }
  1389. child.parent = null;
  1390. // ensure child transform will be recalculated
  1391. child.transform._parentID = -1;
  1392. utils.removeItems(this.children, index, 1);
  1393. // ensure bounds will be recalculated
  1394. this._boundsID++;
  1395. // TODO - lets either do all callbacks or all events.. not both!
  1396. this.onChildrenChange(index);
  1397. child.emit('removed', this);
  1398. this.emit('childRemoved', child, this, index);
  1399. }
  1400. return children[0];
  1401. };
  1402. /**
  1403. * Removes a child from the specified index position.
  1404. * @param index - The index to get the child from
  1405. * @returns The child that was removed.
  1406. */
  1407. Container.prototype.removeChildAt = function (index) {
  1408. var child = this.getChildAt(index);
  1409. // ensure child transform will be recalculated..
  1410. child.parent = null;
  1411. child.transform._parentID = -1;
  1412. utils.removeItems(this.children, index, 1);
  1413. // ensure bounds will be recalculated
  1414. this._boundsID++;
  1415. // TODO - lets either do all callbacks or all events.. not both!
  1416. this.onChildrenChange(index);
  1417. child.emit('removed', this);
  1418. this.emit('childRemoved', child, this, index);
  1419. return child;
  1420. };
  1421. /**
  1422. * Removes all children from this container that are within the begin and end indexes.
  1423. * @param beginIndex - The beginning position.
  1424. * @param endIndex - The ending position. Default value is size of the container.
  1425. * @returns - List of removed children
  1426. */
  1427. Container.prototype.removeChildren = function (beginIndex, endIndex) {
  1428. if (beginIndex === void 0) { beginIndex = 0; }
  1429. if (endIndex === void 0) { endIndex = this.children.length; }
  1430. var begin = beginIndex;
  1431. var end = endIndex;
  1432. var range = end - begin;
  1433. var removed;
  1434. if (range > 0 && range <= end) {
  1435. removed = this.children.splice(begin, range);
  1436. for (var i = 0; i < removed.length; ++i) {
  1437. removed[i].parent = null;
  1438. if (removed[i].transform) {
  1439. removed[i].transform._parentID = -1;
  1440. }
  1441. }
  1442. this._boundsID++;
  1443. this.onChildrenChange(beginIndex);
  1444. for (var i = 0; i < removed.length; ++i) {
  1445. removed[i].emit('removed', this);
  1446. this.emit('childRemoved', removed[i], this, i);
  1447. }
  1448. return removed;
  1449. }
  1450. else if (range === 0 && this.children.length === 0) {
  1451. return [];
  1452. }
  1453. throw new RangeError('removeChildren: numeric values are outside the acceptable range.');
  1454. };
  1455. /** Sorts children by zIndex. Previous order is maintained for 2 children with the same zIndex. */
  1456. Container.prototype.sortChildren = function () {
  1457. var sortRequired = false;
  1458. for (var i = 0, j = this.children.length; i < j; ++i) {
  1459. var child = this.children[i];
  1460. child._lastSortedIndex = i;
  1461. if (!sortRequired && child.zIndex !== 0) {
  1462. sortRequired = true;
  1463. }
  1464. }
  1465. if (sortRequired && this.children.length > 1) {
  1466. this.children.sort(sortChildren);
  1467. }
  1468. this.sortDirty = false;
  1469. };
  1470. /** Updates the transform on all children of this container for rendering. */
  1471. Container.prototype.updateTransform = function () {
  1472. if (this.sortableChildren && this.sortDirty) {
  1473. this.sortChildren();
  1474. }
  1475. this._boundsID++;
  1476. this.transform.updateTransform(this.parent.transform);
  1477. // TODO: check render flags, how to process stuff here
  1478. this.worldAlpha = this.alpha * this.parent.worldAlpha;
  1479. for (var i = 0, j = this.children.length; i < j; ++i) {
  1480. var child = this.children[i];
  1481. if (child.visible) {
  1482. child.updateTransform();
  1483. }
  1484. }
  1485. };
  1486. /**
  1487. * Recalculates the bounds of the container.
  1488. *
  1489. * This implementation will automatically fit the children's bounds into the calculation. Each child's bounds
  1490. * is limited to its mask's bounds or filterArea, if any is applied.
  1491. */
  1492. Container.prototype.calculateBounds = function () {
  1493. this._bounds.clear();
  1494. this._calculateBounds();
  1495. for (var i = 0; i < this.children.length; i++) {
  1496. var child = this.children[i];
  1497. if (!child.visible || !child.renderable) {
  1498. continue;
  1499. }
  1500. child.calculateBounds();
  1501. // TODO: filter+mask, need to mask both somehow
  1502. if (child._mask) {
  1503. var maskObject = (child._mask.isMaskData
  1504. ? child._mask.maskObject : child._mask);
  1505. if (maskObject) {
  1506. maskObject.calculateBounds();
  1507. this._bounds.addBoundsMask(child._bounds, maskObject._bounds);
  1508. }
  1509. else {
  1510. this._bounds.addBounds(child._bounds);
  1511. }
  1512. }
  1513. else if (child.filterArea) {
  1514. this._bounds.addBoundsArea(child._bounds, child.filterArea);
  1515. }
  1516. else {
  1517. this._bounds.addBounds(child._bounds);
  1518. }
  1519. }
  1520. this._bounds.updateID = this._boundsID;
  1521. };
  1522. /**
  1523. * Retrieves the local bounds of the displayObject as a rectangle object.
  1524. *
  1525. * Calling `getLocalBounds` may invalidate the `_bounds` of the whole subtree below. If using it inside a render()
  1526. * call, it is advised to call `getBounds()` immediately after to recalculate the world bounds of the subtree.
  1527. * @param rect - Optional rectangle to store the result of the bounds calculation.
  1528. * @param skipChildrenUpdate - Setting to `true` will stop re-calculation of children transforms,
  1529. * it was default behaviour of pixi 4.0-5.2 and caused many problems to users.
  1530. * @returns - The rectangular bounding area.
  1531. */
  1532. Container.prototype.getLocalBounds = function (rect, skipChildrenUpdate) {
  1533. if (skipChildrenUpdate === void 0) { skipChildrenUpdate = false; }
  1534. var result = _super.prototype.getLocalBounds.call(this, rect);
  1535. if (!skipChildrenUpdate) {
  1536. for (var i = 0, j = this.children.length; i < j; ++i) {
  1537. var child = this.children[i];
  1538. if (child.visible) {
  1539. child.updateTransform();
  1540. }
  1541. }
  1542. }
  1543. return result;
  1544. };
  1545. /**
  1546. * Recalculates the content bounds of this object. This should be overriden to
  1547. * calculate the bounds of this specific object (not including children).
  1548. * @protected
  1549. */
  1550. Container.prototype._calculateBounds = function () {
  1551. // FILL IN//
  1552. };
  1553. /**
  1554. * Renders this object and its children with culling.
  1555. * @protected
  1556. * @param {PIXI.Renderer} renderer - The renderer
  1557. */
  1558. Container.prototype._renderWithCulling = function (renderer) {
  1559. var sourceFrame = renderer.renderTexture.sourceFrame;
  1560. // If the source frame is empty, stop rendering.
  1561. if (!(sourceFrame.width > 0 && sourceFrame.height > 0)) {
  1562. return;
  1563. }
  1564. // Render the content of the container only if its bounds intersect with the source frame.
  1565. // All filters are on the stack at this point, and the filter source frame is bound:
  1566. // therefore, even if the bounds to non intersect the filter frame, the filter
  1567. // is still applied and any filter padding that is in the frame is rendered correctly.
  1568. var bounds;
  1569. var transform;
  1570. // If cullArea is set, we use this rectangle instead of the bounds of the object. The cullArea
  1571. // rectangle must completely contain the container and its children including filter padding.
  1572. if (this.cullArea) {
  1573. bounds = this.cullArea;
  1574. transform = this.worldTransform;
  1575. }
  1576. // If the container doesn't override _render, we can skip the bounds calculation and intersection test.
  1577. else if (this._render !== Container.prototype._render) {
  1578. bounds = this.getBounds(true);
  1579. }
  1580. // Render the container if the source frame intersects the bounds.
  1581. if (bounds && sourceFrame.intersects(bounds, transform)) {
  1582. this._render(renderer);
  1583. }
  1584. // If the bounds are defined by cullArea and do not intersect with the source frame, stop rendering.
  1585. else if (this.cullArea) {
  1586. return;
  1587. }
  1588. // Unless cullArea is set, we cannot skip the children if the bounds of the container do not intersect
  1589. // the source frame, because the children might have filters with nonzero padding, which may intersect
  1590. // with the source frame while the bounds do not: filter padding is not included in the bounds.
  1591. // If cullArea is not set, render the children with culling temporarily enabled so that they are not rendered
  1592. // if they are out of frame; otherwise, render the children normally.
  1593. for (var i = 0, j = this.children.length; i < j; ++i) {
  1594. var child = this.children[i];
  1595. var childCullable = child.cullable;
  1596. child.cullable = childCullable || !this.cullArea;
  1597. child.render(renderer);
  1598. child.cullable = childCullable;
  1599. }
  1600. };
  1601. /**
  1602. * Renders the object using the WebGL renderer.
  1603. *
  1604. * The [_render]{@link PIXI.Container#_render} method is be overriden for rendering the contents of the
  1605. * container itself. This `render` method will invoke it, and also invoke the `render` methods of all
  1606. * children afterward.
  1607. *
  1608. * If `renderable` or `visible` is false or if `worldAlpha` is not positive or if `cullable` is true and
  1609. * the bounds of this object are out of frame, this implementation will entirely skip rendering.
  1610. * See {@link PIXI.DisplayObject} for choosing between `renderable` or `visible`. Generally,
  1611. * setting alpha to zero is not recommended for purely skipping rendering.
  1612. *
  1613. * When your scene becomes large (especially when it is larger than can be viewed in a single screen), it is
  1614. * advised to employ **culling** to automatically skip rendering objects outside of the current screen.
  1615. * See [cullable]{@link PIXI.DisplayObject#cullable} and [cullArea]{@link PIXI.DisplayObject#cullArea}.
  1616. * Other culling methods might be better suited for a large number static objects; see
  1617. * [@pixi-essentials/cull]{@link https://www.npmjs.com/package/@pixi-essentials/cull} and
  1618. * [pixi-cull]{@link https://www.npmjs.com/package/pixi-cull}.
  1619. *
  1620. * The [renderAdvanced]{@link PIXI.Container#renderAdvanced} method is internally used when when masking or
  1621. * filtering is applied on a container. This does, however, break batching and can affect performance when
  1622. * masking and filtering is applied extensively throughout the scene graph.
  1623. * @param renderer - The renderer
  1624. */
  1625. Container.prototype.render = function (renderer) {
  1626. // if the object is not visible or the alpha is 0 then no need to render this element
  1627. if (!this.visible || this.worldAlpha <= 0 || !this.renderable) {
  1628. return;
  1629. }
  1630. // do a quick check to see if this element has a mask or a filter.
  1631. if (this._mask || (this.filters && this.filters.length)) {
  1632. this.renderAdvanced(renderer);
  1633. }
  1634. else if (this.cullable) {
  1635. this._renderWithCulling(renderer);
  1636. }
  1637. else {
  1638. this._render(renderer);
  1639. for (var i = 0, j = this.children.length; i < j; ++i) {
  1640. this.children[i].render(renderer);
  1641. }
  1642. }
  1643. };
  1644. /**
  1645. * Render the object using the WebGL renderer and advanced features.
  1646. * @param renderer - The renderer
  1647. */
  1648. Container.prototype.renderAdvanced = function (renderer) {
  1649. var filters = this.filters;
  1650. var mask = this._mask;
  1651. // push filter first as we need to ensure the stencil buffer is correct for any masking
  1652. if (filters) {
  1653. if (!this._enabledFilters) {
  1654. this._enabledFilters = [];
  1655. }
  1656. this._enabledFilters.length = 0;
  1657. for (var i = 0; i < filters.length; i++) {
  1658. if (filters[i].enabled) {
  1659. this._enabledFilters.push(filters[i]);
  1660. }
  1661. }
  1662. }
  1663. var flush = (filters && this._enabledFilters && this._enabledFilters.length)
  1664. || (mask && (!mask.isMaskData
  1665. || (mask.enabled && (mask.autoDetect || mask.type !== constants.MASK_TYPES.NONE))));
  1666. if (flush) {
  1667. renderer.batch.flush();
  1668. }
  1669. if (filters && this._enabledFilters && this._enabledFilters.length) {
  1670. renderer.filter.push(this, this._enabledFilters);
  1671. }
  1672. if (mask) {
  1673. renderer.mask.push(this, this._mask);
  1674. }
  1675. if (this.cullable) {
  1676. this._renderWithCulling(renderer);
  1677. }
  1678. else {
  1679. this._render(renderer);
  1680. for (var i = 0, j = this.children.length; i < j; ++i) {
  1681. this.children[i].render(renderer);
  1682. }
  1683. }
  1684. if (flush) {
  1685. renderer.batch.flush();
  1686. }
  1687. if (mask) {
  1688. renderer.mask.pop(this);
  1689. }
  1690. if (filters && this._enabledFilters && this._enabledFilters.length) {
  1691. renderer.filter.pop();
  1692. }
  1693. };
  1694. /**
  1695. * To be overridden by the subclasses.
  1696. * @param _renderer - The renderer
  1697. */
  1698. Container.prototype._render = function (_renderer) {
  1699. // this is where content itself gets rendered...
  1700. };
  1701. /**
  1702. * Removes all internal references and listeners as well as removes children from the display list.
  1703. * Do not use a Container after calling `destroy`.
  1704. * @param options - Options parameter. A boolean will act as if all options
  1705. * have been set to that value
  1706. * @param {boolean} [options.children=false] - if set to true, all the children will have their destroy
  1707. * method called as well. 'options' will be passed on to those calls.
  1708. * @param {boolean} [options.texture=false] - Only used for child Sprites if options.children is set to true
  1709. * Should it destroy the texture of the child sprite
  1710. * @param {boolean} [options.baseTexture=false] - Only used for child Sprites if options.children is set to true
  1711. * Should it destroy the base texture of the child sprite
  1712. */
  1713. Container.prototype.destroy = function (options) {
  1714. _super.prototype.destroy.call(this);
  1715. this.sortDirty = false;
  1716. var destroyChildren = typeof options === 'boolean' ? options : options && options.children;
  1717. var oldChildren = this.removeChildren(0, this.children.length);
  1718. if (destroyChildren) {
  1719. for (var i = 0; i < oldChildren.length; ++i) {
  1720. oldChildren[i].destroy(options);
  1721. }
  1722. }
  1723. };
  1724. Object.defineProperty(Container.prototype, "width", {
  1725. /** The width of the Container, setting this will actually modify the scale to achieve the value set. */
  1726. get: function () {
  1727. return this.scale.x * this.getLocalBounds().width;
  1728. },
  1729. set: function (value) {
  1730. var width = this.getLocalBounds().width;
  1731. if (width !== 0) {
  1732. this.scale.x = value / width;
  1733. }
  1734. else {
  1735. this.scale.x = 1;
  1736. }
  1737. this._width = value;
  1738. },
  1739. enumerable: false,
  1740. configurable: true
  1741. });
  1742. Object.defineProperty(Container.prototype, "height", {
  1743. /** The height of the Container, setting this will actually modify the scale to achieve the value set. */
  1744. get: function () {
  1745. return this.scale.y * this.getLocalBounds().height;
  1746. },
  1747. set: function (value) {
  1748. var height = this.getLocalBounds().height;
  1749. if (height !== 0) {
  1750. this.scale.y = value / height;
  1751. }
  1752. else {
  1753. this.scale.y = 1;
  1754. }
  1755. this._height = value;
  1756. },
  1757. enumerable: false,
  1758. configurable: true
  1759. });
  1760. return Container;
  1761. }(DisplayObject));
  1762. /**
  1763. * Container default updateTransform, does update children of container.
  1764. * Will crash if there's no parent element.
  1765. * @memberof PIXI.Container#
  1766. * @method containerUpdateTransform
  1767. */
  1768. Container.prototype.containerUpdateTransform = Container.prototype.updateTransform;
  1769. exports.Bounds = Bounds;
  1770. exports.Container = Container;
  1771. exports.DisplayObject = DisplayObject;
  1772. exports.TemporaryDisplayObject = TemporaryDisplayObject;
  1773. //# sourceMappingURL=display.js.map