app.mjs 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286
  1. /*!
  2. * @pixi/app - v6.5.10
  3. * Compiled Thu, 06 Jul 2023 15:25:11 UTC
  4. *
  5. * @pixi/app is licensed under the MIT License.
  6. * http://www.opensource.org/licenses/mit-license
  7. */
  8. import { ExtensionType, extensions, autoDetectRenderer } from '@pixi/core';
  9. import { Container } from '@pixi/display';
  10. import { deprecation } from '@pixi/utils';
  11. /**
  12. * Middleware for for Application's resize functionality
  13. * @private
  14. * @class
  15. */
  16. var ResizePlugin = /** @class */ (function () {
  17. function ResizePlugin() {
  18. }
  19. /**
  20. * Initialize the plugin with scope of application instance
  21. * @static
  22. * @private
  23. * @param {object} [options] - See application options
  24. */
  25. ResizePlugin.init = function (options) {
  26. var _this = this;
  27. Object.defineProperty(this, 'resizeTo',
  28. /**
  29. * The HTML element or window to automatically resize the
  30. * renderer's view element to match width and height.
  31. * @member {Window|HTMLElement}
  32. * @name resizeTo
  33. * @memberof PIXI.Application#
  34. */
  35. {
  36. set: function (dom) {
  37. globalThis.removeEventListener('resize', this.queueResize);
  38. this._resizeTo = dom;
  39. if (dom) {
  40. globalThis.addEventListener('resize', this.queueResize);
  41. this.resize();
  42. }
  43. },
  44. get: function () {
  45. return this._resizeTo;
  46. },
  47. });
  48. /**
  49. * Resize is throttled, so it's safe to call this multiple times per frame and it'll
  50. * only be called once.
  51. * @memberof PIXI.Application#
  52. * @method queueResize
  53. * @private
  54. */
  55. this.queueResize = function () {
  56. if (!_this._resizeTo) {
  57. return;
  58. }
  59. _this.cancelResize();
  60. // // Throttle resize events per raf
  61. _this._resizeId = requestAnimationFrame(function () { return _this.resize(); });
  62. };
  63. /**
  64. * Cancel the resize queue.
  65. * @memberof PIXI.Application#
  66. * @method cancelResize
  67. * @private
  68. */
  69. this.cancelResize = function () {
  70. if (_this._resizeId) {
  71. cancelAnimationFrame(_this._resizeId);
  72. _this._resizeId = null;
  73. }
  74. };
  75. /**
  76. * Execute an immediate resize on the renderer, this is not
  77. * throttled and can be expensive to call many times in a row.
  78. * Will resize only if `resizeTo` property is set.
  79. * @memberof PIXI.Application#
  80. * @method resize
  81. */
  82. this.resize = function () {
  83. if (!_this._resizeTo) {
  84. return;
  85. }
  86. // clear queue resize
  87. _this.cancelResize();
  88. var width;
  89. var height;
  90. // Resize to the window
  91. if (_this._resizeTo === globalThis.window) {
  92. width = globalThis.innerWidth;
  93. height = globalThis.innerHeight;
  94. }
  95. // Resize to other HTML entities
  96. else {
  97. var _a = _this._resizeTo, clientWidth = _a.clientWidth, clientHeight = _a.clientHeight;
  98. width = clientWidth;
  99. height = clientHeight;
  100. }
  101. _this.renderer.resize(width, height);
  102. };
  103. // On resize
  104. this._resizeId = null;
  105. this._resizeTo = null;
  106. this.resizeTo = options.resizeTo || null;
  107. };
  108. /**
  109. * Clean up the ticker, scoped to application
  110. * @static
  111. * @private
  112. */
  113. ResizePlugin.destroy = function () {
  114. globalThis.removeEventListener('resize', this.queueResize);
  115. this.cancelResize();
  116. this.cancelResize = null;
  117. this.queueResize = null;
  118. this.resizeTo = null;
  119. this.resize = null;
  120. };
  121. /** @ignore */
  122. ResizePlugin.extension = ExtensionType.Application;
  123. return ResizePlugin;
  124. }());
  125. /**
  126. * Convenience class to create a new PIXI application.
  127. *
  128. * This class automatically creates the renderer, ticker and root container.
  129. * @example
  130. * // Create the application
  131. * const app = new PIXI.Application();
  132. *
  133. * // Add the view to the DOM
  134. * document.body.appendChild(app.view);
  135. *
  136. * // ex, add display objects
  137. * app.stage.addChild(PIXI.Sprite.from('something.png'));
  138. * @class
  139. * @memberof PIXI
  140. */
  141. var Application = /** @class */ (function () {
  142. /**
  143. * @param {PIXI.IApplicationOptions} [options] - The optional application and renderer parameters.
  144. * @param {boolean} [options.antialias=false] -
  145. * **WebGL Only.** Whether to enable anti-aliasing. This may affect performance.
  146. * @param {boolean} [options.autoDensity=false] -
  147. * Whether the CSS dimensions of the renderer's view should be resized automatically.
  148. * @param {boolean} [options.autoStart=true] - Automatically starts the rendering after the construction.
  149. * **Note**: Setting this parameter to false does NOT stop the shared ticker even if you set
  150. * `options.sharedTicker` to `true` in case that it is already started. Stop it by your own.
  151. * @param {number} [options.backgroundAlpha=1] -
  152. * Transparency of the background color, value from `0` (fully transparent) to `1` (fully opaque).
  153. * @param {number} [options.backgroundColor=0x000000] -
  154. * The background color used to clear the canvas. It accepts hex numbers (e.g. `0xff0000`).
  155. * @param {boolean} [options.clearBeforeRender=true] - Whether to clear the canvas before new render passes.
  156. * @param {PIXI.IRenderingContext} [options.context] - **WebGL Only.** User-provided WebGL rendering context object.
  157. * @param {boolean} [options.forceCanvas=false] -
  158. * Force using {@link PIXI.CanvasRenderer}, even if WebGL is available. This option only is available when
  159. * using **pixi.js-legacy** or **@pixi/canvas-renderer** packages, otherwise it is ignored.
  160. * @param {number} [options.height=600] - The height of the renderer's view.
  161. * @param {string} [options.powerPreference] -
  162. * **WebGL Only.** A hint indicating what configuration of GPU is suitable for the WebGL context,
  163. * can be `'default'`, `'high-performance'` or `'low-power'`.
  164. * Setting to `'high-performance'` will prioritize rendering performance over power consumption,
  165. * while setting to `'low-power'` will prioritize power saving over rendering performance.
  166. * @param {boolean} [options.premultipliedAlpha=true] -
  167. * **WebGL Only.** Whether the compositor will assume the drawing buffer contains colors with premultiplied alpha.
  168. * @param {boolean} [options.preserveDrawingBuffer=false] -
  169. * **WebGL Only.** Whether to enable drawing buffer preservation. If enabled, the drawing buffer will preserve
  170. * its value until cleared or overwritten. Enable this if you need to call `toDataUrl` on the WebGL context.
  171. * @param {Window|HTMLElement} [options.resizeTo] - Element to automatically resize stage to.
  172. * @param {number} [options.resolution=PIXI.settings.RESOLUTION] -
  173. * The resolution / device pixel ratio of the renderer.
  174. * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.Loader.shared, `false` to create new Loader.
  175. * @param {boolean} [options.sharedTicker=false] - `true` to use PIXI.Ticker.shared, `false` to create new ticker.
  176. * If set to `false`, you cannot register a handler to occur before anything that runs on the shared ticker.
  177. * The system ticker will always run before both the shared ticker and the app ticker.
  178. * @param {boolean} [options.transparent] -
  179. * **Deprecated since 6.0.0, Use `backgroundAlpha` instead.** \
  180. * `true` sets `backgroundAlpha` to `0`, `false` sets `backgroundAlpha` to `1`.
  181. * @param {boolean|'notMultiplied'} [options.useContextAlpha=true] -
  182. * Pass-through value for canvas' context attribute `alpha`. This option is for cases where the
  183. * canvas needs to be opaque, possibly for performance reasons on some older devices.
  184. * If you want to set transparency, please use `backgroundAlpha`. \
  185. * **WebGL Only:** When set to `'notMultiplied'`, the canvas' context attribute `alpha` will be
  186. * set to `true` and `premultipliedAlpha` will be to `false`.
  187. * @param {HTMLCanvasElement} [options.view=null] -
  188. * The canvas to use as the view. If omitted, a new canvas will be created.
  189. * @param {number} [options.width=800] - The width of the renderer's view.
  190. */
  191. function Application(options) {
  192. var _this = this;
  193. /**
  194. * The root display container that's rendered.
  195. * @member {PIXI.Container}
  196. */
  197. this.stage = new Container();
  198. // The default options
  199. options = Object.assign({
  200. forceCanvas: false,
  201. }, options);
  202. this.renderer = autoDetectRenderer(options);
  203. // install plugins here
  204. Application._plugins.forEach(function (plugin) {
  205. plugin.init.call(_this, options);
  206. });
  207. }
  208. /**
  209. * Use the {@link PIXI.extensions.add} API to register plugins.
  210. * @deprecated since 6.5.0
  211. * @static
  212. * @param {PIXI.IApplicationPlugin} plugin - Plugin being installed
  213. */
  214. Application.registerPlugin = function (plugin) {
  215. deprecation('6.5.0', 'Application.registerPlugin() is deprecated, use extensions.add()');
  216. extensions.add({
  217. type: ExtensionType.Application,
  218. ref: plugin,
  219. });
  220. };
  221. /** Render the current stage. */
  222. Application.prototype.render = function () {
  223. this.renderer.render(this.stage);
  224. };
  225. Object.defineProperty(Application.prototype, "view", {
  226. /**
  227. * Reference to the renderer's canvas element.
  228. * @member {HTMLCanvasElement}
  229. * @readonly
  230. */
  231. get: function () {
  232. return this.renderer.view;
  233. },
  234. enumerable: false,
  235. configurable: true
  236. });
  237. Object.defineProperty(Application.prototype, "screen", {
  238. /**
  239. * Reference to the renderer's screen rectangle. Its safe to use as `filterArea` or `hitArea` for the whole screen.
  240. * @member {PIXI.Rectangle}
  241. * @readonly
  242. */
  243. get: function () {
  244. return this.renderer.screen;
  245. },
  246. enumerable: false,
  247. configurable: true
  248. });
  249. /**
  250. * Destroy and don't use after this.
  251. * @param {boolean} [removeView=false] - Automatically remove canvas from DOM.
  252. * @param {object|boolean} [stageOptions] - Options parameter. A boolean will act as if all options
  253. * have been set to that value
  254. * @param {boolean} [stageOptions.children=false] - if set to true, all the children will have their destroy
  255. * method called as well. 'stageOptions' will be passed on to those calls.
  256. * @param {boolean} [stageOptions.texture=false] - Only used for child Sprites if stageOptions.children is set
  257. * to true. Should it destroy the texture of the child sprite
  258. * @param {boolean} [stageOptions.baseTexture=false] - Only used for child Sprites if stageOptions.children is set
  259. * to true. Should it destroy the base texture of the child sprite
  260. */
  261. Application.prototype.destroy = function (removeView, stageOptions) {
  262. var _this = this;
  263. // Destroy plugins in the opposite order
  264. // which they were constructed
  265. var plugins = Application._plugins.slice(0);
  266. plugins.reverse();
  267. plugins.forEach(function (plugin) {
  268. plugin.destroy.call(_this);
  269. });
  270. this.stage.destroy(stageOptions);
  271. this.stage = null;
  272. this.renderer.destroy(removeView);
  273. this.renderer = null;
  274. };
  275. /** Collection of installed plugins. */
  276. Application._plugins = [];
  277. return Application;
  278. }());
  279. extensions.handleByList(ExtensionType.Application, Application._plugins);
  280. extensions.add(ResizePlugin);
  281. export { Application, ResizePlugin };
  282. //# sourceMappingURL=app.mjs.map