diff --git a/bundles/pixi.js-legacy/test/index.js b/bundles/pixi.js-legacy/test/index.js index c7cc855..a29651e 100755 --- a/bundles/pixi.js-legacy/test/index.js +++ b/bundles/pixi.js-legacy/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js-legacy/test/index.js b/bundles/pixi.js-legacy/test/index.js index c7cc855..a29651e 100755 --- a/bundles/pixi.js-legacy/test/index.js +++ b/bundles/pixi.js-legacy/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js/src/PIXI.js b/bundles/pixi.js/src/PIXI.js index 75e5658..ae40c7e 100644 --- a/bundles/pixi.js/src/PIXI.js +++ b/bundles/pixi.js/src/PIXI.js @@ -12,6 +12,7 @@ export * from '@pixi/display'; export * from '@pixi/mesh'; export * from '@pixi/ticker'; +export * from '@pixi/loaders'; import { Renderer } from '@pixi/core'; import * as interaction from '@pixi/interaction'; @@ -22,10 +23,12 @@ import { TilingSpriteRenderer } from '@pixi/sprite-tiling'; import { GraphicsRenderer } from '@pixi/graphics'; import * as accessibility from '@pixi/accessibility'; -import * as loaders from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; import * as filters from './filters'; import * as utils from '@pixi/utils'; import { settings } from '@pixi/settings'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager); Renderer.registerPlugin('extract', extract.Extract); @@ -36,6 +39,9 @@ Renderer.registerPlugin('sprite', SpriteRenderer); Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer); +Loader.registerPlugin(SpritesheetLoader); +Loader.registerPlugin(BitmapFontLoader); + import '@pixi/mixin-cache-as-bitmap'; import '@pixi/mixin-get-child-by-name'; import '@pixi/mixin-get-global-position'; @@ -43,20 +49,11 @@ utils.mixins.performMixins(); -/** - * Alias for {@link PIXI.loaders.shared}. - * @name loader - * @memberof PIXI - * @type {PIXI.loader.Loader} - */ -export const loader = loaders.shared; - export { accessibility, extract, filters, interaction, - loaders, prepare, utils, settings, diff --git a/bundles/pixi.js-legacy/test/index.js b/bundles/pixi.js-legacy/test/index.js index c7cc855..a29651e 100755 --- a/bundles/pixi.js-legacy/test/index.js +++ b/bundles/pixi.js-legacy/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js/src/PIXI.js b/bundles/pixi.js/src/PIXI.js index 75e5658..ae40c7e 100644 --- a/bundles/pixi.js/src/PIXI.js +++ b/bundles/pixi.js/src/PIXI.js @@ -12,6 +12,7 @@ export * from '@pixi/display'; export * from '@pixi/mesh'; export * from '@pixi/ticker'; +export * from '@pixi/loaders'; import { Renderer } from '@pixi/core'; import * as interaction from '@pixi/interaction'; @@ -22,10 +23,12 @@ import { TilingSpriteRenderer } from '@pixi/sprite-tiling'; import { GraphicsRenderer } from '@pixi/graphics'; import * as accessibility from '@pixi/accessibility'; -import * as loaders from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; import * as filters from './filters'; import * as utils from '@pixi/utils'; import { settings } from '@pixi/settings'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager); Renderer.registerPlugin('extract', extract.Extract); @@ -36,6 +39,9 @@ Renderer.registerPlugin('sprite', SpriteRenderer); Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer); +Loader.registerPlugin(SpritesheetLoader); +Loader.registerPlugin(BitmapFontLoader); + import '@pixi/mixin-cache-as-bitmap'; import '@pixi/mixin-get-child-by-name'; import '@pixi/mixin-get-global-position'; @@ -43,20 +49,11 @@ utils.mixins.performMixins(); -/** - * Alias for {@link PIXI.loaders.shared}. - * @name loader - * @memberof PIXI - * @type {PIXI.loader.Loader} - */ -export const loader = loaders.shared; - export { accessibility, extract, filters, interaction, - loaders, prepare, utils, settings, diff --git a/bundles/pixi.js/src/deprecated.js b/bundles/pixi.js/src/deprecated.js index 402176f..e59c66a 100644 --- a/bundles/pixi.js/src/deprecated.js +++ b/bundles/pixi.js/src/deprecated.js @@ -131,6 +131,22 @@ return PIXI.utils.CanvasRenderTarget; }, }, + + /** + * @memberof PIXI + * @name loader + * @type {PIXI.Loader} + * @see PIXI.Loader.shared + * @deprecated since 5.0.0 + */ + loader: { + get() + { + warn('PIXI.loader has moved to PIXI.Loader.shared'); + + return PIXI.Loader.shared; + }, + }, }); /** @@ -351,34 +367,51 @@ }, }); - Object.defineProperties(PIXI.loaders.Loader, { - /** - * @function PIXI.loaders.Loader.addPixiMiddleware - * @see PIXI.loaders.Loader.useMiddleware - * @deprecated since 5.0.0 - */ - addPixiMiddleware: { - get() - { - warn('PIXI.loaders.Loader.addPixiMiddleware has moved to PIXI.loaders.Loader.useMiddleware'); - - return PIXI.loaders.Loader.useMiddleware; - }, - }, - }); + /** + * All classes on this namespace have moved to the high-level `PIXI` object. + * @namespace PIXI.loaders + * @deprecated since 5.0.0 + */ + PIXI.loaders = {}; Object.defineProperties(PIXI.loaders, { /** + * @class PIXI.loaders.Loader + * @see PIXI.Loader + * @deprecated since 5.0.0 + */ + Loader: { + get() + { + warn('PIXI.loaders.Loader has moved to PIXI.Loader'); + + return PIXI.Loader; + }, + }, + /** + * @class PIXI.loaders.Resource + * @see PIXI.LoaderResource + * @deprecated since 5.0.0 + */ + Resource: { + get() + { + warn('PIXI.loaders.Resource has moved to PIXI.LoaderResource'); + + return PIXI.LoaderResource; + }, + }, + /** * @function PIXI.loaders.bitmapFontParser - * @see PIXI.BitmapFontLoader.middleware + * @see PIXI.BitmapFontLoader.use * @deprecated since 5.0.0 */ bitmapFontParser: { get() { - warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.middleware'); + warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.use'); - return PIXI.BitmapFontLoader.middleware; + return PIXI.BitmapFontLoader.use; }, }, /** @@ -396,15 +429,15 @@ }, /** * @function PIXI.loaders.spritesheetParser - * @see PIXI.SpritesheetLoader.middleware + * @see PIXI.SpritesheetLoader.use * @deprecated since 5.0.0 */ spritesheetParser: { get() { - warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.middleware'); + warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.use'); - return PIXI.SpritesheetLoader.middleware; + return PIXI.SpritesheetLoader.use; }, }, /** @@ -423,6 +456,19 @@ }); /** + * @function PIXI.loaders.Loader.addPixiMiddleware + * @see PIXI.Loader.registerPlugin + * @deprecated since 5.0.0 + * @param {function} middleware + */ + PIXI.Loader.addPixiMiddleware = function addPixiMiddleware(middleware) + { + warn('PIXI.loaders.Loader.addPixiMiddleware is deprecated, use PIXI.loaders.Loader.registerPlugin'); + + return PIXI.loaders.Loader.registerPlugin({ use: middleware() }); + }; + + /** * @class PIXI.extract.WebGLExtract * @deprecated since 5.0.0 * @see PIXI.extract.Prepare diff --git a/bundles/pixi.js-legacy/test/index.js b/bundles/pixi.js-legacy/test/index.js index c7cc855..a29651e 100755 --- a/bundles/pixi.js-legacy/test/index.js +++ b/bundles/pixi.js-legacy/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js/src/PIXI.js b/bundles/pixi.js/src/PIXI.js index 75e5658..ae40c7e 100644 --- a/bundles/pixi.js/src/PIXI.js +++ b/bundles/pixi.js/src/PIXI.js @@ -12,6 +12,7 @@ export * from '@pixi/display'; export * from '@pixi/mesh'; export * from '@pixi/ticker'; +export * from '@pixi/loaders'; import { Renderer } from '@pixi/core'; import * as interaction from '@pixi/interaction'; @@ -22,10 +23,12 @@ import { TilingSpriteRenderer } from '@pixi/sprite-tiling'; import { GraphicsRenderer } from '@pixi/graphics'; import * as accessibility from '@pixi/accessibility'; -import * as loaders from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; import * as filters from './filters'; import * as utils from '@pixi/utils'; import { settings } from '@pixi/settings'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager); Renderer.registerPlugin('extract', extract.Extract); @@ -36,6 +39,9 @@ Renderer.registerPlugin('sprite', SpriteRenderer); Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer); +Loader.registerPlugin(SpritesheetLoader); +Loader.registerPlugin(BitmapFontLoader); + import '@pixi/mixin-cache-as-bitmap'; import '@pixi/mixin-get-child-by-name'; import '@pixi/mixin-get-global-position'; @@ -43,20 +49,11 @@ utils.mixins.performMixins(); -/** - * Alias for {@link PIXI.loaders.shared}. - * @name loader - * @memberof PIXI - * @type {PIXI.loader.Loader} - */ -export const loader = loaders.shared; - export { accessibility, extract, filters, interaction, - loaders, prepare, utils, settings, diff --git a/bundles/pixi.js/src/deprecated.js b/bundles/pixi.js/src/deprecated.js index 402176f..e59c66a 100644 --- a/bundles/pixi.js/src/deprecated.js +++ b/bundles/pixi.js/src/deprecated.js @@ -131,6 +131,22 @@ return PIXI.utils.CanvasRenderTarget; }, }, + + /** + * @memberof PIXI + * @name loader + * @type {PIXI.Loader} + * @see PIXI.Loader.shared + * @deprecated since 5.0.0 + */ + loader: { + get() + { + warn('PIXI.loader has moved to PIXI.Loader.shared'); + + return PIXI.Loader.shared; + }, + }, }); /** @@ -351,34 +367,51 @@ }, }); - Object.defineProperties(PIXI.loaders.Loader, { - /** - * @function PIXI.loaders.Loader.addPixiMiddleware - * @see PIXI.loaders.Loader.useMiddleware - * @deprecated since 5.0.0 - */ - addPixiMiddleware: { - get() - { - warn('PIXI.loaders.Loader.addPixiMiddleware has moved to PIXI.loaders.Loader.useMiddleware'); - - return PIXI.loaders.Loader.useMiddleware; - }, - }, - }); + /** + * All classes on this namespace have moved to the high-level `PIXI` object. + * @namespace PIXI.loaders + * @deprecated since 5.0.0 + */ + PIXI.loaders = {}; Object.defineProperties(PIXI.loaders, { /** + * @class PIXI.loaders.Loader + * @see PIXI.Loader + * @deprecated since 5.0.0 + */ + Loader: { + get() + { + warn('PIXI.loaders.Loader has moved to PIXI.Loader'); + + return PIXI.Loader; + }, + }, + /** + * @class PIXI.loaders.Resource + * @see PIXI.LoaderResource + * @deprecated since 5.0.0 + */ + Resource: { + get() + { + warn('PIXI.loaders.Resource has moved to PIXI.LoaderResource'); + + return PIXI.LoaderResource; + }, + }, + /** * @function PIXI.loaders.bitmapFontParser - * @see PIXI.BitmapFontLoader.middleware + * @see PIXI.BitmapFontLoader.use * @deprecated since 5.0.0 */ bitmapFontParser: { get() { - warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.middleware'); + warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.use'); - return PIXI.BitmapFontLoader.middleware; + return PIXI.BitmapFontLoader.use; }, }, /** @@ -396,15 +429,15 @@ }, /** * @function PIXI.loaders.spritesheetParser - * @see PIXI.SpritesheetLoader.middleware + * @see PIXI.SpritesheetLoader.use * @deprecated since 5.0.0 */ spritesheetParser: { get() { - warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.middleware'); + warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.use'); - return PIXI.SpritesheetLoader.middleware; + return PIXI.SpritesheetLoader.use; }, }, /** @@ -423,6 +456,19 @@ }); /** + * @function PIXI.loaders.Loader.addPixiMiddleware + * @see PIXI.Loader.registerPlugin + * @deprecated since 5.0.0 + * @param {function} middleware + */ + PIXI.Loader.addPixiMiddleware = function addPixiMiddleware(middleware) + { + warn('PIXI.loaders.Loader.addPixiMiddleware is deprecated, use PIXI.loaders.Loader.registerPlugin'); + + return PIXI.loaders.Loader.registerPlugin({ use: middleware() }); + }; + + /** * @class PIXI.extract.WebGLExtract * @deprecated since 5.0.0 * @see PIXI.extract.Prepare diff --git a/bundles/pixi.js/test/index.js b/bundles/pixi.js/test/index.js index c7cc855..a29651e 100644 --- a/bundles/pixi.js/test/index.js +++ b/bundles/pixi.js/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js-legacy/test/index.js b/bundles/pixi.js-legacy/test/index.js index c7cc855..a29651e 100755 --- a/bundles/pixi.js-legacy/test/index.js +++ b/bundles/pixi.js-legacy/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js/src/PIXI.js b/bundles/pixi.js/src/PIXI.js index 75e5658..ae40c7e 100644 --- a/bundles/pixi.js/src/PIXI.js +++ b/bundles/pixi.js/src/PIXI.js @@ -12,6 +12,7 @@ export * from '@pixi/display'; export * from '@pixi/mesh'; export * from '@pixi/ticker'; +export * from '@pixi/loaders'; import { Renderer } from '@pixi/core'; import * as interaction from '@pixi/interaction'; @@ -22,10 +23,12 @@ import { TilingSpriteRenderer } from '@pixi/sprite-tiling'; import { GraphicsRenderer } from '@pixi/graphics'; import * as accessibility from '@pixi/accessibility'; -import * as loaders from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; import * as filters from './filters'; import * as utils from '@pixi/utils'; import { settings } from '@pixi/settings'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager); Renderer.registerPlugin('extract', extract.Extract); @@ -36,6 +39,9 @@ Renderer.registerPlugin('sprite', SpriteRenderer); Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer); +Loader.registerPlugin(SpritesheetLoader); +Loader.registerPlugin(BitmapFontLoader); + import '@pixi/mixin-cache-as-bitmap'; import '@pixi/mixin-get-child-by-name'; import '@pixi/mixin-get-global-position'; @@ -43,20 +49,11 @@ utils.mixins.performMixins(); -/** - * Alias for {@link PIXI.loaders.shared}. - * @name loader - * @memberof PIXI - * @type {PIXI.loader.Loader} - */ -export const loader = loaders.shared; - export { accessibility, extract, filters, interaction, - loaders, prepare, utils, settings, diff --git a/bundles/pixi.js/src/deprecated.js b/bundles/pixi.js/src/deprecated.js index 402176f..e59c66a 100644 --- a/bundles/pixi.js/src/deprecated.js +++ b/bundles/pixi.js/src/deprecated.js @@ -131,6 +131,22 @@ return PIXI.utils.CanvasRenderTarget; }, }, + + /** + * @memberof PIXI + * @name loader + * @type {PIXI.Loader} + * @see PIXI.Loader.shared + * @deprecated since 5.0.0 + */ + loader: { + get() + { + warn('PIXI.loader has moved to PIXI.Loader.shared'); + + return PIXI.Loader.shared; + }, + }, }); /** @@ -351,34 +367,51 @@ }, }); - Object.defineProperties(PIXI.loaders.Loader, { - /** - * @function PIXI.loaders.Loader.addPixiMiddleware - * @see PIXI.loaders.Loader.useMiddleware - * @deprecated since 5.0.0 - */ - addPixiMiddleware: { - get() - { - warn('PIXI.loaders.Loader.addPixiMiddleware has moved to PIXI.loaders.Loader.useMiddleware'); - - return PIXI.loaders.Loader.useMiddleware; - }, - }, - }); + /** + * All classes on this namespace have moved to the high-level `PIXI` object. + * @namespace PIXI.loaders + * @deprecated since 5.0.0 + */ + PIXI.loaders = {}; Object.defineProperties(PIXI.loaders, { /** + * @class PIXI.loaders.Loader + * @see PIXI.Loader + * @deprecated since 5.0.0 + */ + Loader: { + get() + { + warn('PIXI.loaders.Loader has moved to PIXI.Loader'); + + return PIXI.Loader; + }, + }, + /** + * @class PIXI.loaders.Resource + * @see PIXI.LoaderResource + * @deprecated since 5.0.0 + */ + Resource: { + get() + { + warn('PIXI.loaders.Resource has moved to PIXI.LoaderResource'); + + return PIXI.LoaderResource; + }, + }, + /** * @function PIXI.loaders.bitmapFontParser - * @see PIXI.BitmapFontLoader.middleware + * @see PIXI.BitmapFontLoader.use * @deprecated since 5.0.0 */ bitmapFontParser: { get() { - warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.middleware'); + warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.use'); - return PIXI.BitmapFontLoader.middleware; + return PIXI.BitmapFontLoader.use; }, }, /** @@ -396,15 +429,15 @@ }, /** * @function PIXI.loaders.spritesheetParser - * @see PIXI.SpritesheetLoader.middleware + * @see PIXI.SpritesheetLoader.use * @deprecated since 5.0.0 */ spritesheetParser: { get() { - warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.middleware'); + warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.use'); - return PIXI.SpritesheetLoader.middleware; + return PIXI.SpritesheetLoader.use; }, }, /** @@ -423,6 +456,19 @@ }); /** + * @function PIXI.loaders.Loader.addPixiMiddleware + * @see PIXI.Loader.registerPlugin + * @deprecated since 5.0.0 + * @param {function} middleware + */ + PIXI.Loader.addPixiMiddleware = function addPixiMiddleware(middleware) + { + warn('PIXI.loaders.Loader.addPixiMiddleware is deprecated, use PIXI.loaders.Loader.registerPlugin'); + + return PIXI.loaders.Loader.registerPlugin({ use: middleware() }); + }; + + /** * @class PIXI.extract.WebGLExtract * @deprecated since 5.0.0 * @see PIXI.extract.Prepare diff --git a/bundles/pixi.js/test/index.js b/bundles/pixi.js/test/index.js index c7cc855..a29651e 100644 --- a/bundles/pixi.js/test/index.js +++ b/bundles/pixi.js/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/packages/app/src/Application.js b/packages/app/src/Application.js index 50f9fa1..ef40610 100644 --- a/packages/app/src/Application.js +++ b/packages/app/src/Application.js @@ -51,7 +51,7 @@ * @param {string} [options.powerPreference] - Parameter passed to webgl context, set to "high-performance" * for devices with dual graphics card **webgl only** * @param {boolean} [options.sharedTicker=false] - `true` to use PIXI.Ticker.shared, `false` to create new ticker. - * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.loaders.shared, `false` to create new Loader. + * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.Loaders.shared, `false` to create new Loader. */ constructor(options, arg2, arg3, arg4, arg5) { diff --git a/bundles/pixi.js-legacy/test/index.js b/bundles/pixi.js-legacy/test/index.js index c7cc855..a29651e 100755 --- a/bundles/pixi.js-legacy/test/index.js +++ b/bundles/pixi.js-legacy/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js/src/PIXI.js b/bundles/pixi.js/src/PIXI.js index 75e5658..ae40c7e 100644 --- a/bundles/pixi.js/src/PIXI.js +++ b/bundles/pixi.js/src/PIXI.js @@ -12,6 +12,7 @@ export * from '@pixi/display'; export * from '@pixi/mesh'; export * from '@pixi/ticker'; +export * from '@pixi/loaders'; import { Renderer } from '@pixi/core'; import * as interaction from '@pixi/interaction'; @@ -22,10 +23,12 @@ import { TilingSpriteRenderer } from '@pixi/sprite-tiling'; import { GraphicsRenderer } from '@pixi/graphics'; import * as accessibility from '@pixi/accessibility'; -import * as loaders from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; import * as filters from './filters'; import * as utils from '@pixi/utils'; import { settings } from '@pixi/settings'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager); Renderer.registerPlugin('extract', extract.Extract); @@ -36,6 +39,9 @@ Renderer.registerPlugin('sprite', SpriteRenderer); Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer); +Loader.registerPlugin(SpritesheetLoader); +Loader.registerPlugin(BitmapFontLoader); + import '@pixi/mixin-cache-as-bitmap'; import '@pixi/mixin-get-child-by-name'; import '@pixi/mixin-get-global-position'; @@ -43,20 +49,11 @@ utils.mixins.performMixins(); -/** - * Alias for {@link PIXI.loaders.shared}. - * @name loader - * @memberof PIXI - * @type {PIXI.loader.Loader} - */ -export const loader = loaders.shared; - export { accessibility, extract, filters, interaction, - loaders, prepare, utils, settings, diff --git a/bundles/pixi.js/src/deprecated.js b/bundles/pixi.js/src/deprecated.js index 402176f..e59c66a 100644 --- a/bundles/pixi.js/src/deprecated.js +++ b/bundles/pixi.js/src/deprecated.js @@ -131,6 +131,22 @@ return PIXI.utils.CanvasRenderTarget; }, }, + + /** + * @memberof PIXI + * @name loader + * @type {PIXI.Loader} + * @see PIXI.Loader.shared + * @deprecated since 5.0.0 + */ + loader: { + get() + { + warn('PIXI.loader has moved to PIXI.Loader.shared'); + + return PIXI.Loader.shared; + }, + }, }); /** @@ -351,34 +367,51 @@ }, }); - Object.defineProperties(PIXI.loaders.Loader, { - /** - * @function PIXI.loaders.Loader.addPixiMiddleware - * @see PIXI.loaders.Loader.useMiddleware - * @deprecated since 5.0.0 - */ - addPixiMiddleware: { - get() - { - warn('PIXI.loaders.Loader.addPixiMiddleware has moved to PIXI.loaders.Loader.useMiddleware'); - - return PIXI.loaders.Loader.useMiddleware; - }, - }, - }); + /** + * All classes on this namespace have moved to the high-level `PIXI` object. + * @namespace PIXI.loaders + * @deprecated since 5.0.0 + */ + PIXI.loaders = {}; Object.defineProperties(PIXI.loaders, { /** + * @class PIXI.loaders.Loader + * @see PIXI.Loader + * @deprecated since 5.0.0 + */ + Loader: { + get() + { + warn('PIXI.loaders.Loader has moved to PIXI.Loader'); + + return PIXI.Loader; + }, + }, + /** + * @class PIXI.loaders.Resource + * @see PIXI.LoaderResource + * @deprecated since 5.0.0 + */ + Resource: { + get() + { + warn('PIXI.loaders.Resource has moved to PIXI.LoaderResource'); + + return PIXI.LoaderResource; + }, + }, + /** * @function PIXI.loaders.bitmapFontParser - * @see PIXI.BitmapFontLoader.middleware + * @see PIXI.BitmapFontLoader.use * @deprecated since 5.0.0 */ bitmapFontParser: { get() { - warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.middleware'); + warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.use'); - return PIXI.BitmapFontLoader.middleware; + return PIXI.BitmapFontLoader.use; }, }, /** @@ -396,15 +429,15 @@ }, /** * @function PIXI.loaders.spritesheetParser - * @see PIXI.SpritesheetLoader.middleware + * @see PIXI.SpritesheetLoader.use * @deprecated since 5.0.0 */ spritesheetParser: { get() { - warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.middleware'); + warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.use'); - return PIXI.SpritesheetLoader.middleware; + return PIXI.SpritesheetLoader.use; }, }, /** @@ -423,6 +456,19 @@ }); /** + * @function PIXI.loaders.Loader.addPixiMiddleware + * @see PIXI.Loader.registerPlugin + * @deprecated since 5.0.0 + * @param {function} middleware + */ + PIXI.Loader.addPixiMiddleware = function addPixiMiddleware(middleware) + { + warn('PIXI.loaders.Loader.addPixiMiddleware is deprecated, use PIXI.loaders.Loader.registerPlugin'); + + return PIXI.loaders.Loader.registerPlugin({ use: middleware() }); + }; + + /** * @class PIXI.extract.WebGLExtract * @deprecated since 5.0.0 * @see PIXI.extract.Prepare diff --git a/bundles/pixi.js/test/index.js b/bundles/pixi.js/test/index.js index c7cc855..a29651e 100644 --- a/bundles/pixi.js/test/index.js +++ b/bundles/pixi.js/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/packages/app/src/Application.js b/packages/app/src/Application.js index 50f9fa1..ef40610 100644 --- a/packages/app/src/Application.js +++ b/packages/app/src/Application.js @@ -51,7 +51,7 @@ * @param {string} [options.powerPreference] - Parameter passed to webgl context, set to "high-performance" * for devices with dual graphics card **webgl only** * @param {boolean} [options.sharedTicker=false] - `true` to use PIXI.Ticker.shared, `false` to create new ticker. - * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.loaders.shared, `false` to create new Loader. + * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.Loaders.shared, `false` to create new Loader. */ constructor(options, arg2, arg3, arg4, arg5) { diff --git a/packages/loaders/src/Loader.js b/packages/loaders/src/Loader.js index 6f6e9bd..ecba1b0 100644 --- a/packages/loaders/src/Loader.js +++ b/packages/loaders/src/Loader.js @@ -1,16 +1,16 @@ import ResourceLoader from 'resource-loader'; import EventEmitter from 'eventemitter3'; import { blobMiddlewareFactory } from 'resource-loader/lib/middlewares/parsing/blob'; -import textureParser from './textureParser'; +import TextureLoader from './TextureLoader'; /** * * The new loader, extends Resource Loader by Chad Engler: https://github.com/englercj/resource-loader * * ```js - * const loader = PIXI.loader; // PixiJS exposes a premade instance for you to use. + * const loader = PIXI.Loader.shared; // PixiJS exposes a premade instance for you to use. * //or - * const loader = new PIXI.loaders.Loader(); // you can also create your own if you want + * const loader = new PIXI.Loader(); // you can also create your own if you want * * const sprites = {}; * @@ -52,20 +52,31 @@ * * @class Loader * @extends module:resource-loader.ResourceLoader - * @memberof PIXI.loaders + * @memberof PIXI * @param {string} [baseUrl=''] - The base url for all resources loaded by this loader. * @param {number} [concurrency=10] - The number of resources to load concurrently. */ -export class Loader extends ResourceLoader +export default class Loader extends ResourceLoader { constructor(baseUrl, concurrency) { super(baseUrl, concurrency); EventEmitter.call(this); - for (let i = 0; i < Loader._middleware.length; ++i) + for (let i = 0; i < Loader._plugins.length; ++i) { - this.use(Loader._middleware[i]()); + const plugin = Loader._plugins[i]; + const { pre, use } = plugin; + + if (pre) + { + this.pre(pre.bind(plugin)); + } + + if (use) + { + this.use(use.bind(plugin)); + } } // Compat layer, translate the new v2 signals into old v1 events. @@ -95,50 +106,82 @@ this.reset(); } } + + /** + * A premade instance of the loader that can be used to load resources. + * @name shared + * @type {PIXI.Loader} + * @static + * @memberof PIXI.Loader + */ + static get shared() + { + let shared = Loader._shared; + + if (!shared) + { + shared = new Loader(); + shared._protected = true; + Loader._shared = shared; + } + + return shared; + } } // Copy EE3 prototype (mixin) Object.assign(Loader.prototype, EventEmitter.prototype); /** - * Collection of all installed middleware for Loader. + * Collection of all installed `use` middleware for Loader. * * @static - * @member {Array} - * @memberof PIXI.loaders.Loader + * @member {Array} + * @memberof PIXI.Loader * @private */ -Loader._middleware = []; +Loader._plugins = []; /** - * A premade instance of the loader that can be used to load resources. - * @name shared - * @memberof PIXI.loaders - * @type {PIXI.loaders.Loader} - */ -export const shared = new Loader(); -shared._protected = true; - -/** - * Adds a middleware for the global shared loader and all + * Adds a Loader plugin for the global shared loader and all * new Loader instances created. * * @static - * @method useMiddleware - * @memberof PIXI.loaders.Loader - * @param {Function} fn - The middleware to add. + * @method registerPlugin + * @memberof PIXI.Loader + * @param {PIXI.Loader~LoaderPlugin} plugin - The plugin to add + * @return {PIXI.Loader} Reference to PIXI.Loader for chaining */ -Loader.useMiddleware = function useMiddleware(fn) +Loader.registerPlugin = function registerPlugin(plugin) { - // Install for current shared loader - shared.use(fn); + Loader._plugins.push(plugin); - // Install for all future loaders - Loader._middleware.push(fn); + if (plugin.add) + { + plugin.add(); + } + + return Loader; }; // parse any blob into more usable objects (e.g. Image) -Loader.useMiddleware(blobMiddlewareFactory); +Loader.registerPlugin({ use: blobMiddlewareFactory() }); // parse any Image objects into textures -Loader.useMiddleware(textureParser); +Loader.registerPlugin(TextureLoader); + +/** + * Plugin to be installed for handling specific Loader resources. + * @typedef {object} PIXI.Loader~LoaderPlugin + * @property {function} [plugin.add] - Function to call immediate after registering plugin. + * @property {PIXI.Loader~loaderMiddleware} [plugin.pre] - Middleware function to run before load, the + * arguments for this are `(resource, next)` + * @property {PIXI.Loader~loaderMiddleware} [plugin.use] - Middleware function to run after load, the + * arguments for this are `(resource, next)` + */ + +/** + * @callback PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ diff --git a/bundles/pixi.js-legacy/test/index.js b/bundles/pixi.js-legacy/test/index.js index c7cc855..a29651e 100755 --- a/bundles/pixi.js-legacy/test/index.js +++ b/bundles/pixi.js-legacy/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js/src/PIXI.js b/bundles/pixi.js/src/PIXI.js index 75e5658..ae40c7e 100644 --- a/bundles/pixi.js/src/PIXI.js +++ b/bundles/pixi.js/src/PIXI.js @@ -12,6 +12,7 @@ export * from '@pixi/display'; export * from '@pixi/mesh'; export * from '@pixi/ticker'; +export * from '@pixi/loaders'; import { Renderer } from '@pixi/core'; import * as interaction from '@pixi/interaction'; @@ -22,10 +23,12 @@ import { TilingSpriteRenderer } from '@pixi/sprite-tiling'; import { GraphicsRenderer } from '@pixi/graphics'; import * as accessibility from '@pixi/accessibility'; -import * as loaders from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; import * as filters from './filters'; import * as utils from '@pixi/utils'; import { settings } from '@pixi/settings'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager); Renderer.registerPlugin('extract', extract.Extract); @@ -36,6 +39,9 @@ Renderer.registerPlugin('sprite', SpriteRenderer); Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer); +Loader.registerPlugin(SpritesheetLoader); +Loader.registerPlugin(BitmapFontLoader); + import '@pixi/mixin-cache-as-bitmap'; import '@pixi/mixin-get-child-by-name'; import '@pixi/mixin-get-global-position'; @@ -43,20 +49,11 @@ utils.mixins.performMixins(); -/** - * Alias for {@link PIXI.loaders.shared}. - * @name loader - * @memberof PIXI - * @type {PIXI.loader.Loader} - */ -export const loader = loaders.shared; - export { accessibility, extract, filters, interaction, - loaders, prepare, utils, settings, diff --git a/bundles/pixi.js/src/deprecated.js b/bundles/pixi.js/src/deprecated.js index 402176f..e59c66a 100644 --- a/bundles/pixi.js/src/deprecated.js +++ b/bundles/pixi.js/src/deprecated.js @@ -131,6 +131,22 @@ return PIXI.utils.CanvasRenderTarget; }, }, + + /** + * @memberof PIXI + * @name loader + * @type {PIXI.Loader} + * @see PIXI.Loader.shared + * @deprecated since 5.0.0 + */ + loader: { + get() + { + warn('PIXI.loader has moved to PIXI.Loader.shared'); + + return PIXI.Loader.shared; + }, + }, }); /** @@ -351,34 +367,51 @@ }, }); - Object.defineProperties(PIXI.loaders.Loader, { - /** - * @function PIXI.loaders.Loader.addPixiMiddleware - * @see PIXI.loaders.Loader.useMiddleware - * @deprecated since 5.0.0 - */ - addPixiMiddleware: { - get() - { - warn('PIXI.loaders.Loader.addPixiMiddleware has moved to PIXI.loaders.Loader.useMiddleware'); - - return PIXI.loaders.Loader.useMiddleware; - }, - }, - }); + /** + * All classes on this namespace have moved to the high-level `PIXI` object. + * @namespace PIXI.loaders + * @deprecated since 5.0.0 + */ + PIXI.loaders = {}; Object.defineProperties(PIXI.loaders, { /** + * @class PIXI.loaders.Loader + * @see PIXI.Loader + * @deprecated since 5.0.0 + */ + Loader: { + get() + { + warn('PIXI.loaders.Loader has moved to PIXI.Loader'); + + return PIXI.Loader; + }, + }, + /** + * @class PIXI.loaders.Resource + * @see PIXI.LoaderResource + * @deprecated since 5.0.0 + */ + Resource: { + get() + { + warn('PIXI.loaders.Resource has moved to PIXI.LoaderResource'); + + return PIXI.LoaderResource; + }, + }, + /** * @function PIXI.loaders.bitmapFontParser - * @see PIXI.BitmapFontLoader.middleware + * @see PIXI.BitmapFontLoader.use * @deprecated since 5.0.0 */ bitmapFontParser: { get() { - warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.middleware'); + warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.use'); - return PIXI.BitmapFontLoader.middleware; + return PIXI.BitmapFontLoader.use; }, }, /** @@ -396,15 +429,15 @@ }, /** * @function PIXI.loaders.spritesheetParser - * @see PIXI.SpritesheetLoader.middleware + * @see PIXI.SpritesheetLoader.use * @deprecated since 5.0.0 */ spritesheetParser: { get() { - warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.middleware'); + warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.use'); - return PIXI.SpritesheetLoader.middleware; + return PIXI.SpritesheetLoader.use; }, }, /** @@ -423,6 +456,19 @@ }); /** + * @function PIXI.loaders.Loader.addPixiMiddleware + * @see PIXI.Loader.registerPlugin + * @deprecated since 5.0.0 + * @param {function} middleware + */ + PIXI.Loader.addPixiMiddleware = function addPixiMiddleware(middleware) + { + warn('PIXI.loaders.Loader.addPixiMiddleware is deprecated, use PIXI.loaders.Loader.registerPlugin'); + + return PIXI.loaders.Loader.registerPlugin({ use: middleware() }); + }; + + /** * @class PIXI.extract.WebGLExtract * @deprecated since 5.0.0 * @see PIXI.extract.Prepare diff --git a/bundles/pixi.js/test/index.js b/bundles/pixi.js/test/index.js index c7cc855..a29651e 100644 --- a/bundles/pixi.js/test/index.js +++ b/bundles/pixi.js/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/packages/app/src/Application.js b/packages/app/src/Application.js index 50f9fa1..ef40610 100644 --- a/packages/app/src/Application.js +++ b/packages/app/src/Application.js @@ -51,7 +51,7 @@ * @param {string} [options.powerPreference] - Parameter passed to webgl context, set to "high-performance" * for devices with dual graphics card **webgl only** * @param {boolean} [options.sharedTicker=false] - `true` to use PIXI.Ticker.shared, `false` to create new ticker. - * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.loaders.shared, `false` to create new Loader. + * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.Loaders.shared, `false` to create new Loader. */ constructor(options, arg2, arg3, arg4, arg5) { diff --git a/packages/loaders/src/Loader.js b/packages/loaders/src/Loader.js index 6f6e9bd..ecba1b0 100644 --- a/packages/loaders/src/Loader.js +++ b/packages/loaders/src/Loader.js @@ -1,16 +1,16 @@ import ResourceLoader from 'resource-loader'; import EventEmitter from 'eventemitter3'; import { blobMiddlewareFactory } from 'resource-loader/lib/middlewares/parsing/blob'; -import textureParser from './textureParser'; +import TextureLoader from './TextureLoader'; /** * * The new loader, extends Resource Loader by Chad Engler: https://github.com/englercj/resource-loader * * ```js - * const loader = PIXI.loader; // PixiJS exposes a premade instance for you to use. + * const loader = PIXI.Loader.shared; // PixiJS exposes a premade instance for you to use. * //or - * const loader = new PIXI.loaders.Loader(); // you can also create your own if you want + * const loader = new PIXI.Loader(); // you can also create your own if you want * * const sprites = {}; * @@ -52,20 +52,31 @@ * * @class Loader * @extends module:resource-loader.ResourceLoader - * @memberof PIXI.loaders + * @memberof PIXI * @param {string} [baseUrl=''] - The base url for all resources loaded by this loader. * @param {number} [concurrency=10] - The number of resources to load concurrently. */ -export class Loader extends ResourceLoader +export default class Loader extends ResourceLoader { constructor(baseUrl, concurrency) { super(baseUrl, concurrency); EventEmitter.call(this); - for (let i = 0; i < Loader._middleware.length; ++i) + for (let i = 0; i < Loader._plugins.length; ++i) { - this.use(Loader._middleware[i]()); + const plugin = Loader._plugins[i]; + const { pre, use } = plugin; + + if (pre) + { + this.pre(pre.bind(plugin)); + } + + if (use) + { + this.use(use.bind(plugin)); + } } // Compat layer, translate the new v2 signals into old v1 events. @@ -95,50 +106,82 @@ this.reset(); } } + + /** + * A premade instance of the loader that can be used to load resources. + * @name shared + * @type {PIXI.Loader} + * @static + * @memberof PIXI.Loader + */ + static get shared() + { + let shared = Loader._shared; + + if (!shared) + { + shared = new Loader(); + shared._protected = true; + Loader._shared = shared; + } + + return shared; + } } // Copy EE3 prototype (mixin) Object.assign(Loader.prototype, EventEmitter.prototype); /** - * Collection of all installed middleware for Loader. + * Collection of all installed `use` middleware for Loader. * * @static - * @member {Array} - * @memberof PIXI.loaders.Loader + * @member {Array} + * @memberof PIXI.Loader * @private */ -Loader._middleware = []; +Loader._plugins = []; /** - * A premade instance of the loader that can be used to load resources. - * @name shared - * @memberof PIXI.loaders - * @type {PIXI.loaders.Loader} - */ -export const shared = new Loader(); -shared._protected = true; - -/** - * Adds a middleware for the global shared loader and all + * Adds a Loader plugin for the global shared loader and all * new Loader instances created. * * @static - * @method useMiddleware - * @memberof PIXI.loaders.Loader - * @param {Function} fn - The middleware to add. + * @method registerPlugin + * @memberof PIXI.Loader + * @param {PIXI.Loader~LoaderPlugin} plugin - The plugin to add + * @return {PIXI.Loader} Reference to PIXI.Loader for chaining */ -Loader.useMiddleware = function useMiddleware(fn) +Loader.registerPlugin = function registerPlugin(plugin) { - // Install for current shared loader - shared.use(fn); + Loader._plugins.push(plugin); - // Install for all future loaders - Loader._middleware.push(fn); + if (plugin.add) + { + plugin.add(); + } + + return Loader; }; // parse any blob into more usable objects (e.g. Image) -Loader.useMiddleware(blobMiddlewareFactory); +Loader.registerPlugin({ use: blobMiddlewareFactory() }); // parse any Image objects into textures -Loader.useMiddleware(textureParser); +Loader.registerPlugin(TextureLoader); + +/** + * Plugin to be installed for handling specific Loader resources. + * @typedef {object} PIXI.Loader~LoaderPlugin + * @property {function} [plugin.add] - Function to call immediate after registering plugin. + * @property {PIXI.Loader~loaderMiddleware} [plugin.pre] - Middleware function to run before load, the + * arguments for this are `(resource, next)` + * @property {PIXI.Loader~loaderMiddleware} [plugin.use] - Middleware function to run after load, the + * arguments for this are `(resource, next)` + */ + +/** + * @callback PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ diff --git a/packages/loaders/src/TextureLoader.js b/packages/loaders/src/TextureLoader.js new file mode 100644 index 0000000..5094c8e --- /dev/null +++ b/packages/loaders/src/TextureLoader.js @@ -0,0 +1,31 @@ +import { Resource } from 'resource-loader'; +import { Texture } from '@pixi/core'; + +/** + * Loader plugin for handling Texture resources. + * @class + * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin + */ +export default class TextureLoader +{ + /** + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ + static use(resource, next) + { + // create a new texture if the data is an Image object + if (resource.data && resource.type === Resource.TYPE.IMAGE) + { + resource.texture = Texture.fromLoader( + resource.data, + resource.url, + resource.name + ); + } + next(); + } +} diff --git a/bundles/pixi.js-legacy/test/index.js b/bundles/pixi.js-legacy/test/index.js index c7cc855..a29651e 100755 --- a/bundles/pixi.js-legacy/test/index.js +++ b/bundles/pixi.js-legacy/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js/src/PIXI.js b/bundles/pixi.js/src/PIXI.js index 75e5658..ae40c7e 100644 --- a/bundles/pixi.js/src/PIXI.js +++ b/bundles/pixi.js/src/PIXI.js @@ -12,6 +12,7 @@ export * from '@pixi/display'; export * from '@pixi/mesh'; export * from '@pixi/ticker'; +export * from '@pixi/loaders'; import { Renderer } from '@pixi/core'; import * as interaction from '@pixi/interaction'; @@ -22,10 +23,12 @@ import { TilingSpriteRenderer } from '@pixi/sprite-tiling'; import { GraphicsRenderer } from '@pixi/graphics'; import * as accessibility from '@pixi/accessibility'; -import * as loaders from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; import * as filters from './filters'; import * as utils from '@pixi/utils'; import { settings } from '@pixi/settings'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager); Renderer.registerPlugin('extract', extract.Extract); @@ -36,6 +39,9 @@ Renderer.registerPlugin('sprite', SpriteRenderer); Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer); +Loader.registerPlugin(SpritesheetLoader); +Loader.registerPlugin(BitmapFontLoader); + import '@pixi/mixin-cache-as-bitmap'; import '@pixi/mixin-get-child-by-name'; import '@pixi/mixin-get-global-position'; @@ -43,20 +49,11 @@ utils.mixins.performMixins(); -/** - * Alias for {@link PIXI.loaders.shared}. - * @name loader - * @memberof PIXI - * @type {PIXI.loader.Loader} - */ -export const loader = loaders.shared; - export { accessibility, extract, filters, interaction, - loaders, prepare, utils, settings, diff --git a/bundles/pixi.js/src/deprecated.js b/bundles/pixi.js/src/deprecated.js index 402176f..e59c66a 100644 --- a/bundles/pixi.js/src/deprecated.js +++ b/bundles/pixi.js/src/deprecated.js @@ -131,6 +131,22 @@ return PIXI.utils.CanvasRenderTarget; }, }, + + /** + * @memberof PIXI + * @name loader + * @type {PIXI.Loader} + * @see PIXI.Loader.shared + * @deprecated since 5.0.0 + */ + loader: { + get() + { + warn('PIXI.loader has moved to PIXI.Loader.shared'); + + return PIXI.Loader.shared; + }, + }, }); /** @@ -351,34 +367,51 @@ }, }); - Object.defineProperties(PIXI.loaders.Loader, { - /** - * @function PIXI.loaders.Loader.addPixiMiddleware - * @see PIXI.loaders.Loader.useMiddleware - * @deprecated since 5.0.0 - */ - addPixiMiddleware: { - get() - { - warn('PIXI.loaders.Loader.addPixiMiddleware has moved to PIXI.loaders.Loader.useMiddleware'); - - return PIXI.loaders.Loader.useMiddleware; - }, - }, - }); + /** + * All classes on this namespace have moved to the high-level `PIXI` object. + * @namespace PIXI.loaders + * @deprecated since 5.0.0 + */ + PIXI.loaders = {}; Object.defineProperties(PIXI.loaders, { /** + * @class PIXI.loaders.Loader + * @see PIXI.Loader + * @deprecated since 5.0.0 + */ + Loader: { + get() + { + warn('PIXI.loaders.Loader has moved to PIXI.Loader'); + + return PIXI.Loader; + }, + }, + /** + * @class PIXI.loaders.Resource + * @see PIXI.LoaderResource + * @deprecated since 5.0.0 + */ + Resource: { + get() + { + warn('PIXI.loaders.Resource has moved to PIXI.LoaderResource'); + + return PIXI.LoaderResource; + }, + }, + /** * @function PIXI.loaders.bitmapFontParser - * @see PIXI.BitmapFontLoader.middleware + * @see PIXI.BitmapFontLoader.use * @deprecated since 5.0.0 */ bitmapFontParser: { get() { - warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.middleware'); + warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.use'); - return PIXI.BitmapFontLoader.middleware; + return PIXI.BitmapFontLoader.use; }, }, /** @@ -396,15 +429,15 @@ }, /** * @function PIXI.loaders.spritesheetParser - * @see PIXI.SpritesheetLoader.middleware + * @see PIXI.SpritesheetLoader.use * @deprecated since 5.0.0 */ spritesheetParser: { get() { - warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.middleware'); + warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.use'); - return PIXI.SpritesheetLoader.middleware; + return PIXI.SpritesheetLoader.use; }, }, /** @@ -423,6 +456,19 @@ }); /** + * @function PIXI.loaders.Loader.addPixiMiddleware + * @see PIXI.Loader.registerPlugin + * @deprecated since 5.0.0 + * @param {function} middleware + */ + PIXI.Loader.addPixiMiddleware = function addPixiMiddleware(middleware) + { + warn('PIXI.loaders.Loader.addPixiMiddleware is deprecated, use PIXI.loaders.Loader.registerPlugin'); + + return PIXI.loaders.Loader.registerPlugin({ use: middleware() }); + }; + + /** * @class PIXI.extract.WebGLExtract * @deprecated since 5.0.0 * @see PIXI.extract.Prepare diff --git a/bundles/pixi.js/test/index.js b/bundles/pixi.js/test/index.js index c7cc855..a29651e 100644 --- a/bundles/pixi.js/test/index.js +++ b/bundles/pixi.js/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/packages/app/src/Application.js b/packages/app/src/Application.js index 50f9fa1..ef40610 100644 --- a/packages/app/src/Application.js +++ b/packages/app/src/Application.js @@ -51,7 +51,7 @@ * @param {string} [options.powerPreference] - Parameter passed to webgl context, set to "high-performance" * for devices with dual graphics card **webgl only** * @param {boolean} [options.sharedTicker=false] - `true` to use PIXI.Ticker.shared, `false` to create new ticker. - * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.loaders.shared, `false` to create new Loader. + * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.Loaders.shared, `false` to create new Loader. */ constructor(options, arg2, arg3, arg4, arg5) { diff --git a/packages/loaders/src/Loader.js b/packages/loaders/src/Loader.js index 6f6e9bd..ecba1b0 100644 --- a/packages/loaders/src/Loader.js +++ b/packages/loaders/src/Loader.js @@ -1,16 +1,16 @@ import ResourceLoader from 'resource-loader'; import EventEmitter from 'eventemitter3'; import { blobMiddlewareFactory } from 'resource-loader/lib/middlewares/parsing/blob'; -import textureParser from './textureParser'; +import TextureLoader from './TextureLoader'; /** * * The new loader, extends Resource Loader by Chad Engler: https://github.com/englercj/resource-loader * * ```js - * const loader = PIXI.loader; // PixiJS exposes a premade instance for you to use. + * const loader = PIXI.Loader.shared; // PixiJS exposes a premade instance for you to use. * //or - * const loader = new PIXI.loaders.Loader(); // you can also create your own if you want + * const loader = new PIXI.Loader(); // you can also create your own if you want * * const sprites = {}; * @@ -52,20 +52,31 @@ * * @class Loader * @extends module:resource-loader.ResourceLoader - * @memberof PIXI.loaders + * @memberof PIXI * @param {string} [baseUrl=''] - The base url for all resources loaded by this loader. * @param {number} [concurrency=10] - The number of resources to load concurrently. */ -export class Loader extends ResourceLoader +export default class Loader extends ResourceLoader { constructor(baseUrl, concurrency) { super(baseUrl, concurrency); EventEmitter.call(this); - for (let i = 0; i < Loader._middleware.length; ++i) + for (let i = 0; i < Loader._plugins.length; ++i) { - this.use(Loader._middleware[i]()); + const plugin = Loader._plugins[i]; + const { pre, use } = plugin; + + if (pre) + { + this.pre(pre.bind(plugin)); + } + + if (use) + { + this.use(use.bind(plugin)); + } } // Compat layer, translate the new v2 signals into old v1 events. @@ -95,50 +106,82 @@ this.reset(); } } + + /** + * A premade instance of the loader that can be used to load resources. + * @name shared + * @type {PIXI.Loader} + * @static + * @memberof PIXI.Loader + */ + static get shared() + { + let shared = Loader._shared; + + if (!shared) + { + shared = new Loader(); + shared._protected = true; + Loader._shared = shared; + } + + return shared; + } } // Copy EE3 prototype (mixin) Object.assign(Loader.prototype, EventEmitter.prototype); /** - * Collection of all installed middleware for Loader. + * Collection of all installed `use` middleware for Loader. * * @static - * @member {Array} - * @memberof PIXI.loaders.Loader + * @member {Array} + * @memberof PIXI.Loader * @private */ -Loader._middleware = []; +Loader._plugins = []; /** - * A premade instance of the loader that can be used to load resources. - * @name shared - * @memberof PIXI.loaders - * @type {PIXI.loaders.Loader} - */ -export const shared = new Loader(); -shared._protected = true; - -/** - * Adds a middleware for the global shared loader and all + * Adds a Loader plugin for the global shared loader and all * new Loader instances created. * * @static - * @method useMiddleware - * @memberof PIXI.loaders.Loader - * @param {Function} fn - The middleware to add. + * @method registerPlugin + * @memberof PIXI.Loader + * @param {PIXI.Loader~LoaderPlugin} plugin - The plugin to add + * @return {PIXI.Loader} Reference to PIXI.Loader for chaining */ -Loader.useMiddleware = function useMiddleware(fn) +Loader.registerPlugin = function registerPlugin(plugin) { - // Install for current shared loader - shared.use(fn); + Loader._plugins.push(plugin); - // Install for all future loaders - Loader._middleware.push(fn); + if (plugin.add) + { + plugin.add(); + } + + return Loader; }; // parse any blob into more usable objects (e.g. Image) -Loader.useMiddleware(blobMiddlewareFactory); +Loader.registerPlugin({ use: blobMiddlewareFactory() }); // parse any Image objects into textures -Loader.useMiddleware(textureParser); +Loader.registerPlugin(TextureLoader); + +/** + * Plugin to be installed for handling specific Loader resources. + * @typedef {object} PIXI.Loader~LoaderPlugin + * @property {function} [plugin.add] - Function to call immediate after registering plugin. + * @property {PIXI.Loader~loaderMiddleware} [plugin.pre] - Middleware function to run before load, the + * arguments for this are `(resource, next)` + * @property {PIXI.Loader~loaderMiddleware} [plugin.use] - Middleware function to run after load, the + * arguments for this are `(resource, next)` + */ + +/** + * @callback PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ diff --git a/packages/loaders/src/TextureLoader.js b/packages/loaders/src/TextureLoader.js new file mode 100644 index 0000000..5094c8e --- /dev/null +++ b/packages/loaders/src/TextureLoader.js @@ -0,0 +1,31 @@ +import { Resource } from 'resource-loader'; +import { Texture } from '@pixi/core'; + +/** + * Loader plugin for handling Texture resources. + * @class + * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin + */ +export default class TextureLoader +{ + /** + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ + static use(resource, next) + { + // create a new texture if the data is an Image object + if (resource.data && resource.type === Resource.TYPE.IMAGE) + { + resource.texture = Texture.fromLoader( + resource.data, + resource.url, + resource.name + ); + } + next(); + } +} diff --git a/packages/loaders/src/index.js b/packages/loaders/src/index.js index 8e816cc..3e877fe 100644 --- a/packages/loaders/src/index.js +++ b/packages/loaders/src/index.js @@ -1,24 +1,11 @@ +import { Resource } from 'resource-loader'; /** * Reference to **{@link https://github.com/englercj/resource-loader * resource-loader}**'s Resource class. * @see http://englercj.github.io/resource-loader/Resource.html - * @class Resource - * @memberof PIXI.loaders + * @class LoaderResource + * @memberof PIXI */ -export { Resource } from 'resource-loader'; - -/** - * This namespace contains APIs which extends the {@link https://github.com/englercj/resource-loader resource-loader} module - * for loading assets, data, and other resources dynamically. - * @example - * const loader = new PIXI.loaders.Loader(); - * loader.add('bunny', 'data/bunny.png') - * .add('spaceship', 'assets/spritesheet.json'); - * loader.load((loader, resources) => { - * // resources.bunny - * // resources.spaceship - * }); - * @namespace PIXI.loaders - */ -export { Loader, shared } from './Loader'; -export { default as textureParser } from './textureParser'; +export const LoaderResource = Resource; +export { default as Loader } from './Loader'; +export { default as TextureLoader } from './TextureLoader'; diff --git a/bundles/pixi.js-legacy/test/index.js b/bundles/pixi.js-legacy/test/index.js index c7cc855..a29651e 100755 --- a/bundles/pixi.js-legacy/test/index.js +++ b/bundles/pixi.js-legacy/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js/src/PIXI.js b/bundles/pixi.js/src/PIXI.js index 75e5658..ae40c7e 100644 --- a/bundles/pixi.js/src/PIXI.js +++ b/bundles/pixi.js/src/PIXI.js @@ -12,6 +12,7 @@ export * from '@pixi/display'; export * from '@pixi/mesh'; export * from '@pixi/ticker'; +export * from '@pixi/loaders'; import { Renderer } from '@pixi/core'; import * as interaction from '@pixi/interaction'; @@ -22,10 +23,12 @@ import { TilingSpriteRenderer } from '@pixi/sprite-tiling'; import { GraphicsRenderer } from '@pixi/graphics'; import * as accessibility from '@pixi/accessibility'; -import * as loaders from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; import * as filters from './filters'; import * as utils from '@pixi/utils'; import { settings } from '@pixi/settings'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager); Renderer.registerPlugin('extract', extract.Extract); @@ -36,6 +39,9 @@ Renderer.registerPlugin('sprite', SpriteRenderer); Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer); +Loader.registerPlugin(SpritesheetLoader); +Loader.registerPlugin(BitmapFontLoader); + import '@pixi/mixin-cache-as-bitmap'; import '@pixi/mixin-get-child-by-name'; import '@pixi/mixin-get-global-position'; @@ -43,20 +49,11 @@ utils.mixins.performMixins(); -/** - * Alias for {@link PIXI.loaders.shared}. - * @name loader - * @memberof PIXI - * @type {PIXI.loader.Loader} - */ -export const loader = loaders.shared; - export { accessibility, extract, filters, interaction, - loaders, prepare, utils, settings, diff --git a/bundles/pixi.js/src/deprecated.js b/bundles/pixi.js/src/deprecated.js index 402176f..e59c66a 100644 --- a/bundles/pixi.js/src/deprecated.js +++ b/bundles/pixi.js/src/deprecated.js @@ -131,6 +131,22 @@ return PIXI.utils.CanvasRenderTarget; }, }, + + /** + * @memberof PIXI + * @name loader + * @type {PIXI.Loader} + * @see PIXI.Loader.shared + * @deprecated since 5.0.0 + */ + loader: { + get() + { + warn('PIXI.loader has moved to PIXI.Loader.shared'); + + return PIXI.Loader.shared; + }, + }, }); /** @@ -351,34 +367,51 @@ }, }); - Object.defineProperties(PIXI.loaders.Loader, { - /** - * @function PIXI.loaders.Loader.addPixiMiddleware - * @see PIXI.loaders.Loader.useMiddleware - * @deprecated since 5.0.0 - */ - addPixiMiddleware: { - get() - { - warn('PIXI.loaders.Loader.addPixiMiddleware has moved to PIXI.loaders.Loader.useMiddleware'); - - return PIXI.loaders.Loader.useMiddleware; - }, - }, - }); + /** + * All classes on this namespace have moved to the high-level `PIXI` object. + * @namespace PIXI.loaders + * @deprecated since 5.0.0 + */ + PIXI.loaders = {}; Object.defineProperties(PIXI.loaders, { /** + * @class PIXI.loaders.Loader + * @see PIXI.Loader + * @deprecated since 5.0.0 + */ + Loader: { + get() + { + warn('PIXI.loaders.Loader has moved to PIXI.Loader'); + + return PIXI.Loader; + }, + }, + /** + * @class PIXI.loaders.Resource + * @see PIXI.LoaderResource + * @deprecated since 5.0.0 + */ + Resource: { + get() + { + warn('PIXI.loaders.Resource has moved to PIXI.LoaderResource'); + + return PIXI.LoaderResource; + }, + }, + /** * @function PIXI.loaders.bitmapFontParser - * @see PIXI.BitmapFontLoader.middleware + * @see PIXI.BitmapFontLoader.use * @deprecated since 5.0.0 */ bitmapFontParser: { get() { - warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.middleware'); + warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.use'); - return PIXI.BitmapFontLoader.middleware; + return PIXI.BitmapFontLoader.use; }, }, /** @@ -396,15 +429,15 @@ }, /** * @function PIXI.loaders.spritesheetParser - * @see PIXI.SpritesheetLoader.middleware + * @see PIXI.SpritesheetLoader.use * @deprecated since 5.0.0 */ spritesheetParser: { get() { - warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.middleware'); + warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.use'); - return PIXI.SpritesheetLoader.middleware; + return PIXI.SpritesheetLoader.use; }, }, /** @@ -423,6 +456,19 @@ }); /** + * @function PIXI.loaders.Loader.addPixiMiddleware + * @see PIXI.Loader.registerPlugin + * @deprecated since 5.0.0 + * @param {function} middleware + */ + PIXI.Loader.addPixiMiddleware = function addPixiMiddleware(middleware) + { + warn('PIXI.loaders.Loader.addPixiMiddleware is deprecated, use PIXI.loaders.Loader.registerPlugin'); + + return PIXI.loaders.Loader.registerPlugin({ use: middleware() }); + }; + + /** * @class PIXI.extract.WebGLExtract * @deprecated since 5.0.0 * @see PIXI.extract.Prepare diff --git a/bundles/pixi.js/test/index.js b/bundles/pixi.js/test/index.js index c7cc855..a29651e 100644 --- a/bundles/pixi.js/test/index.js +++ b/bundles/pixi.js/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/packages/app/src/Application.js b/packages/app/src/Application.js index 50f9fa1..ef40610 100644 --- a/packages/app/src/Application.js +++ b/packages/app/src/Application.js @@ -51,7 +51,7 @@ * @param {string} [options.powerPreference] - Parameter passed to webgl context, set to "high-performance" * for devices with dual graphics card **webgl only** * @param {boolean} [options.sharedTicker=false] - `true` to use PIXI.Ticker.shared, `false` to create new ticker. - * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.loaders.shared, `false` to create new Loader. + * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.Loaders.shared, `false` to create new Loader. */ constructor(options, arg2, arg3, arg4, arg5) { diff --git a/packages/loaders/src/Loader.js b/packages/loaders/src/Loader.js index 6f6e9bd..ecba1b0 100644 --- a/packages/loaders/src/Loader.js +++ b/packages/loaders/src/Loader.js @@ -1,16 +1,16 @@ import ResourceLoader from 'resource-loader'; import EventEmitter from 'eventemitter3'; import { blobMiddlewareFactory } from 'resource-loader/lib/middlewares/parsing/blob'; -import textureParser from './textureParser'; +import TextureLoader from './TextureLoader'; /** * * The new loader, extends Resource Loader by Chad Engler: https://github.com/englercj/resource-loader * * ```js - * const loader = PIXI.loader; // PixiJS exposes a premade instance for you to use. + * const loader = PIXI.Loader.shared; // PixiJS exposes a premade instance for you to use. * //or - * const loader = new PIXI.loaders.Loader(); // you can also create your own if you want + * const loader = new PIXI.Loader(); // you can also create your own if you want * * const sprites = {}; * @@ -52,20 +52,31 @@ * * @class Loader * @extends module:resource-loader.ResourceLoader - * @memberof PIXI.loaders + * @memberof PIXI * @param {string} [baseUrl=''] - The base url for all resources loaded by this loader. * @param {number} [concurrency=10] - The number of resources to load concurrently. */ -export class Loader extends ResourceLoader +export default class Loader extends ResourceLoader { constructor(baseUrl, concurrency) { super(baseUrl, concurrency); EventEmitter.call(this); - for (let i = 0; i < Loader._middleware.length; ++i) + for (let i = 0; i < Loader._plugins.length; ++i) { - this.use(Loader._middleware[i]()); + const plugin = Loader._plugins[i]; + const { pre, use } = plugin; + + if (pre) + { + this.pre(pre.bind(plugin)); + } + + if (use) + { + this.use(use.bind(plugin)); + } } // Compat layer, translate the new v2 signals into old v1 events. @@ -95,50 +106,82 @@ this.reset(); } } + + /** + * A premade instance of the loader that can be used to load resources. + * @name shared + * @type {PIXI.Loader} + * @static + * @memberof PIXI.Loader + */ + static get shared() + { + let shared = Loader._shared; + + if (!shared) + { + shared = new Loader(); + shared._protected = true; + Loader._shared = shared; + } + + return shared; + } } // Copy EE3 prototype (mixin) Object.assign(Loader.prototype, EventEmitter.prototype); /** - * Collection of all installed middleware for Loader. + * Collection of all installed `use` middleware for Loader. * * @static - * @member {Array} - * @memberof PIXI.loaders.Loader + * @member {Array} + * @memberof PIXI.Loader * @private */ -Loader._middleware = []; +Loader._plugins = []; /** - * A premade instance of the loader that can be used to load resources. - * @name shared - * @memberof PIXI.loaders - * @type {PIXI.loaders.Loader} - */ -export const shared = new Loader(); -shared._protected = true; - -/** - * Adds a middleware for the global shared loader and all + * Adds a Loader plugin for the global shared loader and all * new Loader instances created. * * @static - * @method useMiddleware - * @memberof PIXI.loaders.Loader - * @param {Function} fn - The middleware to add. + * @method registerPlugin + * @memberof PIXI.Loader + * @param {PIXI.Loader~LoaderPlugin} plugin - The plugin to add + * @return {PIXI.Loader} Reference to PIXI.Loader for chaining */ -Loader.useMiddleware = function useMiddleware(fn) +Loader.registerPlugin = function registerPlugin(plugin) { - // Install for current shared loader - shared.use(fn); + Loader._plugins.push(plugin); - // Install for all future loaders - Loader._middleware.push(fn); + if (plugin.add) + { + plugin.add(); + } + + return Loader; }; // parse any blob into more usable objects (e.g. Image) -Loader.useMiddleware(blobMiddlewareFactory); +Loader.registerPlugin({ use: blobMiddlewareFactory() }); // parse any Image objects into textures -Loader.useMiddleware(textureParser); +Loader.registerPlugin(TextureLoader); + +/** + * Plugin to be installed for handling specific Loader resources. + * @typedef {object} PIXI.Loader~LoaderPlugin + * @property {function} [plugin.add] - Function to call immediate after registering plugin. + * @property {PIXI.Loader~loaderMiddleware} [plugin.pre] - Middleware function to run before load, the + * arguments for this are `(resource, next)` + * @property {PIXI.Loader~loaderMiddleware} [plugin.use] - Middleware function to run after load, the + * arguments for this are `(resource, next)` + */ + +/** + * @callback PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ diff --git a/packages/loaders/src/TextureLoader.js b/packages/loaders/src/TextureLoader.js new file mode 100644 index 0000000..5094c8e --- /dev/null +++ b/packages/loaders/src/TextureLoader.js @@ -0,0 +1,31 @@ +import { Resource } from 'resource-loader'; +import { Texture } from '@pixi/core'; + +/** + * Loader plugin for handling Texture resources. + * @class + * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin + */ +export default class TextureLoader +{ + /** + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ + static use(resource, next) + { + // create a new texture if the data is an Image object + if (resource.data && resource.type === Resource.TYPE.IMAGE) + { + resource.texture = Texture.fromLoader( + resource.data, + resource.url, + resource.name + ); + } + next(); + } +} diff --git a/packages/loaders/src/index.js b/packages/loaders/src/index.js index 8e816cc..3e877fe 100644 --- a/packages/loaders/src/index.js +++ b/packages/loaders/src/index.js @@ -1,24 +1,11 @@ +import { Resource } from 'resource-loader'; /** * Reference to **{@link https://github.com/englercj/resource-loader * resource-loader}**'s Resource class. * @see http://englercj.github.io/resource-loader/Resource.html - * @class Resource - * @memberof PIXI.loaders + * @class LoaderResource + * @memberof PIXI */ -export { Resource } from 'resource-loader'; - -/** - * This namespace contains APIs which extends the {@link https://github.com/englercj/resource-loader resource-loader} module - * for loading assets, data, and other resources dynamically. - * @example - * const loader = new PIXI.loaders.Loader(); - * loader.add('bunny', 'data/bunny.png') - * .add('spaceship', 'assets/spritesheet.json'); - * loader.load((loader, resources) => { - * // resources.bunny - * // resources.spaceship - * }); - * @namespace PIXI.loaders - */ -export { Loader, shared } from './Loader'; -export { default as textureParser } from './textureParser'; +export const LoaderResource = Resource; +export { default as Loader } from './Loader'; +export { default as TextureLoader } from './TextureLoader'; diff --git a/packages/loaders/src/textureParser.js b/packages/loaders/src/textureParser.js deleted file mode 100644 index 9dba8bd..0000000 --- a/packages/loaders/src/textureParser.js +++ /dev/null @@ -1,19 +0,0 @@ -import { Resource } from 'resource-loader'; -import { Texture } from '@pixi/core'; - -export default function () -{ - return function textureParser(resource, next) - { - // create a new texture if the data is an Image object - if (resource.data && resource.type === Resource.TYPE.IMAGE) - { - resource.texture = Texture.fromLoader( - resource.data, - resource.url, - resource.name - ); - } - next(); - }; -} diff --git a/bundles/pixi.js-legacy/test/index.js b/bundles/pixi.js-legacy/test/index.js index c7cc855..a29651e 100755 --- a/bundles/pixi.js-legacy/test/index.js +++ b/bundles/pixi.js-legacy/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js/src/PIXI.js b/bundles/pixi.js/src/PIXI.js index 75e5658..ae40c7e 100644 --- a/bundles/pixi.js/src/PIXI.js +++ b/bundles/pixi.js/src/PIXI.js @@ -12,6 +12,7 @@ export * from '@pixi/display'; export * from '@pixi/mesh'; export * from '@pixi/ticker'; +export * from '@pixi/loaders'; import { Renderer } from '@pixi/core'; import * as interaction from '@pixi/interaction'; @@ -22,10 +23,12 @@ import { TilingSpriteRenderer } from '@pixi/sprite-tiling'; import { GraphicsRenderer } from '@pixi/graphics'; import * as accessibility from '@pixi/accessibility'; -import * as loaders from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; import * as filters from './filters'; import * as utils from '@pixi/utils'; import { settings } from '@pixi/settings'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager); Renderer.registerPlugin('extract', extract.Extract); @@ -36,6 +39,9 @@ Renderer.registerPlugin('sprite', SpriteRenderer); Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer); +Loader.registerPlugin(SpritesheetLoader); +Loader.registerPlugin(BitmapFontLoader); + import '@pixi/mixin-cache-as-bitmap'; import '@pixi/mixin-get-child-by-name'; import '@pixi/mixin-get-global-position'; @@ -43,20 +49,11 @@ utils.mixins.performMixins(); -/** - * Alias for {@link PIXI.loaders.shared}. - * @name loader - * @memberof PIXI - * @type {PIXI.loader.Loader} - */ -export const loader = loaders.shared; - export { accessibility, extract, filters, interaction, - loaders, prepare, utils, settings, diff --git a/bundles/pixi.js/src/deprecated.js b/bundles/pixi.js/src/deprecated.js index 402176f..e59c66a 100644 --- a/bundles/pixi.js/src/deprecated.js +++ b/bundles/pixi.js/src/deprecated.js @@ -131,6 +131,22 @@ return PIXI.utils.CanvasRenderTarget; }, }, + + /** + * @memberof PIXI + * @name loader + * @type {PIXI.Loader} + * @see PIXI.Loader.shared + * @deprecated since 5.0.0 + */ + loader: { + get() + { + warn('PIXI.loader has moved to PIXI.Loader.shared'); + + return PIXI.Loader.shared; + }, + }, }); /** @@ -351,34 +367,51 @@ }, }); - Object.defineProperties(PIXI.loaders.Loader, { - /** - * @function PIXI.loaders.Loader.addPixiMiddleware - * @see PIXI.loaders.Loader.useMiddleware - * @deprecated since 5.0.0 - */ - addPixiMiddleware: { - get() - { - warn('PIXI.loaders.Loader.addPixiMiddleware has moved to PIXI.loaders.Loader.useMiddleware'); - - return PIXI.loaders.Loader.useMiddleware; - }, - }, - }); + /** + * All classes on this namespace have moved to the high-level `PIXI` object. + * @namespace PIXI.loaders + * @deprecated since 5.0.0 + */ + PIXI.loaders = {}; Object.defineProperties(PIXI.loaders, { /** + * @class PIXI.loaders.Loader + * @see PIXI.Loader + * @deprecated since 5.0.0 + */ + Loader: { + get() + { + warn('PIXI.loaders.Loader has moved to PIXI.Loader'); + + return PIXI.Loader; + }, + }, + /** + * @class PIXI.loaders.Resource + * @see PIXI.LoaderResource + * @deprecated since 5.0.0 + */ + Resource: { + get() + { + warn('PIXI.loaders.Resource has moved to PIXI.LoaderResource'); + + return PIXI.LoaderResource; + }, + }, + /** * @function PIXI.loaders.bitmapFontParser - * @see PIXI.BitmapFontLoader.middleware + * @see PIXI.BitmapFontLoader.use * @deprecated since 5.0.0 */ bitmapFontParser: { get() { - warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.middleware'); + warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.use'); - return PIXI.BitmapFontLoader.middleware; + return PIXI.BitmapFontLoader.use; }, }, /** @@ -396,15 +429,15 @@ }, /** * @function PIXI.loaders.spritesheetParser - * @see PIXI.SpritesheetLoader.middleware + * @see PIXI.SpritesheetLoader.use * @deprecated since 5.0.0 */ spritesheetParser: { get() { - warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.middleware'); + warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.use'); - return PIXI.SpritesheetLoader.middleware; + return PIXI.SpritesheetLoader.use; }, }, /** @@ -423,6 +456,19 @@ }); /** + * @function PIXI.loaders.Loader.addPixiMiddleware + * @see PIXI.Loader.registerPlugin + * @deprecated since 5.0.0 + * @param {function} middleware + */ + PIXI.Loader.addPixiMiddleware = function addPixiMiddleware(middleware) + { + warn('PIXI.loaders.Loader.addPixiMiddleware is deprecated, use PIXI.loaders.Loader.registerPlugin'); + + return PIXI.loaders.Loader.registerPlugin({ use: middleware() }); + }; + + /** * @class PIXI.extract.WebGLExtract * @deprecated since 5.0.0 * @see PIXI.extract.Prepare diff --git a/bundles/pixi.js/test/index.js b/bundles/pixi.js/test/index.js index c7cc855..a29651e 100644 --- a/bundles/pixi.js/test/index.js +++ b/bundles/pixi.js/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/packages/app/src/Application.js b/packages/app/src/Application.js index 50f9fa1..ef40610 100644 --- a/packages/app/src/Application.js +++ b/packages/app/src/Application.js @@ -51,7 +51,7 @@ * @param {string} [options.powerPreference] - Parameter passed to webgl context, set to "high-performance" * for devices with dual graphics card **webgl only** * @param {boolean} [options.sharedTicker=false] - `true` to use PIXI.Ticker.shared, `false` to create new ticker. - * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.loaders.shared, `false` to create new Loader. + * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.Loaders.shared, `false` to create new Loader. */ constructor(options, arg2, arg3, arg4, arg5) { diff --git a/packages/loaders/src/Loader.js b/packages/loaders/src/Loader.js index 6f6e9bd..ecba1b0 100644 --- a/packages/loaders/src/Loader.js +++ b/packages/loaders/src/Loader.js @@ -1,16 +1,16 @@ import ResourceLoader from 'resource-loader'; import EventEmitter from 'eventemitter3'; import { blobMiddlewareFactory } from 'resource-loader/lib/middlewares/parsing/blob'; -import textureParser from './textureParser'; +import TextureLoader from './TextureLoader'; /** * * The new loader, extends Resource Loader by Chad Engler: https://github.com/englercj/resource-loader * * ```js - * const loader = PIXI.loader; // PixiJS exposes a premade instance for you to use. + * const loader = PIXI.Loader.shared; // PixiJS exposes a premade instance for you to use. * //or - * const loader = new PIXI.loaders.Loader(); // you can also create your own if you want + * const loader = new PIXI.Loader(); // you can also create your own if you want * * const sprites = {}; * @@ -52,20 +52,31 @@ * * @class Loader * @extends module:resource-loader.ResourceLoader - * @memberof PIXI.loaders + * @memberof PIXI * @param {string} [baseUrl=''] - The base url for all resources loaded by this loader. * @param {number} [concurrency=10] - The number of resources to load concurrently. */ -export class Loader extends ResourceLoader +export default class Loader extends ResourceLoader { constructor(baseUrl, concurrency) { super(baseUrl, concurrency); EventEmitter.call(this); - for (let i = 0; i < Loader._middleware.length; ++i) + for (let i = 0; i < Loader._plugins.length; ++i) { - this.use(Loader._middleware[i]()); + const plugin = Loader._plugins[i]; + const { pre, use } = plugin; + + if (pre) + { + this.pre(pre.bind(plugin)); + } + + if (use) + { + this.use(use.bind(plugin)); + } } // Compat layer, translate the new v2 signals into old v1 events. @@ -95,50 +106,82 @@ this.reset(); } } + + /** + * A premade instance of the loader that can be used to load resources. + * @name shared + * @type {PIXI.Loader} + * @static + * @memberof PIXI.Loader + */ + static get shared() + { + let shared = Loader._shared; + + if (!shared) + { + shared = new Loader(); + shared._protected = true; + Loader._shared = shared; + } + + return shared; + } } // Copy EE3 prototype (mixin) Object.assign(Loader.prototype, EventEmitter.prototype); /** - * Collection of all installed middleware for Loader. + * Collection of all installed `use` middleware for Loader. * * @static - * @member {Array} - * @memberof PIXI.loaders.Loader + * @member {Array} + * @memberof PIXI.Loader * @private */ -Loader._middleware = []; +Loader._plugins = []; /** - * A premade instance of the loader that can be used to load resources. - * @name shared - * @memberof PIXI.loaders - * @type {PIXI.loaders.Loader} - */ -export const shared = new Loader(); -shared._protected = true; - -/** - * Adds a middleware for the global shared loader and all + * Adds a Loader plugin for the global shared loader and all * new Loader instances created. * * @static - * @method useMiddleware - * @memberof PIXI.loaders.Loader - * @param {Function} fn - The middleware to add. + * @method registerPlugin + * @memberof PIXI.Loader + * @param {PIXI.Loader~LoaderPlugin} plugin - The plugin to add + * @return {PIXI.Loader} Reference to PIXI.Loader for chaining */ -Loader.useMiddleware = function useMiddleware(fn) +Loader.registerPlugin = function registerPlugin(plugin) { - // Install for current shared loader - shared.use(fn); + Loader._plugins.push(plugin); - // Install for all future loaders - Loader._middleware.push(fn); + if (plugin.add) + { + plugin.add(); + } + + return Loader; }; // parse any blob into more usable objects (e.g. Image) -Loader.useMiddleware(blobMiddlewareFactory); +Loader.registerPlugin({ use: blobMiddlewareFactory() }); // parse any Image objects into textures -Loader.useMiddleware(textureParser); +Loader.registerPlugin(TextureLoader); + +/** + * Plugin to be installed for handling specific Loader resources. + * @typedef {object} PIXI.Loader~LoaderPlugin + * @property {function} [plugin.add] - Function to call immediate after registering plugin. + * @property {PIXI.Loader~loaderMiddleware} [plugin.pre] - Middleware function to run before load, the + * arguments for this are `(resource, next)` + * @property {PIXI.Loader~loaderMiddleware} [plugin.use] - Middleware function to run after load, the + * arguments for this are `(resource, next)` + */ + +/** + * @callback PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ diff --git a/packages/loaders/src/TextureLoader.js b/packages/loaders/src/TextureLoader.js new file mode 100644 index 0000000..5094c8e --- /dev/null +++ b/packages/loaders/src/TextureLoader.js @@ -0,0 +1,31 @@ +import { Resource } from 'resource-loader'; +import { Texture } from '@pixi/core'; + +/** + * Loader plugin for handling Texture resources. + * @class + * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin + */ +export default class TextureLoader +{ + /** + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ + static use(resource, next) + { + // create a new texture if the data is an Image object + if (resource.data && resource.type === Resource.TYPE.IMAGE) + { + resource.texture = Texture.fromLoader( + resource.data, + resource.url, + resource.name + ); + } + next(); + } +} diff --git a/packages/loaders/src/index.js b/packages/loaders/src/index.js index 8e816cc..3e877fe 100644 --- a/packages/loaders/src/index.js +++ b/packages/loaders/src/index.js @@ -1,24 +1,11 @@ +import { Resource } from 'resource-loader'; /** * Reference to **{@link https://github.com/englercj/resource-loader * resource-loader}**'s Resource class. * @see http://englercj.github.io/resource-loader/Resource.html - * @class Resource - * @memberof PIXI.loaders + * @class LoaderResource + * @memberof PIXI */ -export { Resource } from 'resource-loader'; - -/** - * This namespace contains APIs which extends the {@link https://github.com/englercj/resource-loader resource-loader} module - * for loading assets, data, and other resources dynamically. - * @example - * const loader = new PIXI.loaders.Loader(); - * loader.add('bunny', 'data/bunny.png') - * .add('spaceship', 'assets/spritesheet.json'); - * loader.load((loader, resources) => { - * // resources.bunny - * // resources.spaceship - * }); - * @namespace PIXI.loaders - */ -export { Loader, shared } from './Loader'; -export { default as textureParser } from './textureParser'; +export const LoaderResource = Resource; +export { default as Loader } from './Loader'; +export { default as TextureLoader } from './TextureLoader'; diff --git a/packages/loaders/src/textureParser.js b/packages/loaders/src/textureParser.js deleted file mode 100644 index 9dba8bd..0000000 --- a/packages/loaders/src/textureParser.js +++ /dev/null @@ -1,19 +0,0 @@ -import { Resource } from 'resource-loader'; -import { Texture } from '@pixi/core'; - -export default function () -{ - return function textureParser(resource, next) - { - // create a new texture if the data is an Image object - if (resource.data && resource.type === Resource.TYPE.IMAGE) - { - resource.texture = Texture.fromLoader( - resource.data, - resource.url, - resource.name - ); - } - next(); - }; -} diff --git a/packages/loaders/test/Loader.js b/packages/loaders/test/Loader.js new file mode 100644 index 0000000..1a62a86 --- /dev/null +++ b/packages/loaders/test/Loader.js @@ -0,0 +1,15 @@ +const { Loader } = require('../'); + +describe('PIXI.Loader', function () +{ + it('should exist', function () + { + expect(Loader).to.be.a('function'); + }); + + it('should have shared loader', function () + { + expect(Loader.shared).to.not.be.undefined; + expect(Loader.shared).to.be.instanceof(Loader); + }); +}); diff --git a/bundles/pixi.js-legacy/test/index.js b/bundles/pixi.js-legacy/test/index.js index c7cc855..a29651e 100755 --- a/bundles/pixi.js-legacy/test/index.js +++ b/bundles/pixi.js-legacy/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js/src/PIXI.js b/bundles/pixi.js/src/PIXI.js index 75e5658..ae40c7e 100644 --- a/bundles/pixi.js/src/PIXI.js +++ b/bundles/pixi.js/src/PIXI.js @@ -12,6 +12,7 @@ export * from '@pixi/display'; export * from '@pixi/mesh'; export * from '@pixi/ticker'; +export * from '@pixi/loaders'; import { Renderer } from '@pixi/core'; import * as interaction from '@pixi/interaction'; @@ -22,10 +23,12 @@ import { TilingSpriteRenderer } from '@pixi/sprite-tiling'; import { GraphicsRenderer } from '@pixi/graphics'; import * as accessibility from '@pixi/accessibility'; -import * as loaders from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; import * as filters from './filters'; import * as utils from '@pixi/utils'; import { settings } from '@pixi/settings'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager); Renderer.registerPlugin('extract', extract.Extract); @@ -36,6 +39,9 @@ Renderer.registerPlugin('sprite', SpriteRenderer); Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer); +Loader.registerPlugin(SpritesheetLoader); +Loader.registerPlugin(BitmapFontLoader); + import '@pixi/mixin-cache-as-bitmap'; import '@pixi/mixin-get-child-by-name'; import '@pixi/mixin-get-global-position'; @@ -43,20 +49,11 @@ utils.mixins.performMixins(); -/** - * Alias for {@link PIXI.loaders.shared}. - * @name loader - * @memberof PIXI - * @type {PIXI.loader.Loader} - */ -export const loader = loaders.shared; - export { accessibility, extract, filters, interaction, - loaders, prepare, utils, settings, diff --git a/bundles/pixi.js/src/deprecated.js b/bundles/pixi.js/src/deprecated.js index 402176f..e59c66a 100644 --- a/bundles/pixi.js/src/deprecated.js +++ b/bundles/pixi.js/src/deprecated.js @@ -131,6 +131,22 @@ return PIXI.utils.CanvasRenderTarget; }, }, + + /** + * @memberof PIXI + * @name loader + * @type {PIXI.Loader} + * @see PIXI.Loader.shared + * @deprecated since 5.0.0 + */ + loader: { + get() + { + warn('PIXI.loader has moved to PIXI.Loader.shared'); + + return PIXI.Loader.shared; + }, + }, }); /** @@ -351,34 +367,51 @@ }, }); - Object.defineProperties(PIXI.loaders.Loader, { - /** - * @function PIXI.loaders.Loader.addPixiMiddleware - * @see PIXI.loaders.Loader.useMiddleware - * @deprecated since 5.0.0 - */ - addPixiMiddleware: { - get() - { - warn('PIXI.loaders.Loader.addPixiMiddleware has moved to PIXI.loaders.Loader.useMiddleware'); - - return PIXI.loaders.Loader.useMiddleware; - }, - }, - }); + /** + * All classes on this namespace have moved to the high-level `PIXI` object. + * @namespace PIXI.loaders + * @deprecated since 5.0.0 + */ + PIXI.loaders = {}; Object.defineProperties(PIXI.loaders, { /** + * @class PIXI.loaders.Loader + * @see PIXI.Loader + * @deprecated since 5.0.0 + */ + Loader: { + get() + { + warn('PIXI.loaders.Loader has moved to PIXI.Loader'); + + return PIXI.Loader; + }, + }, + /** + * @class PIXI.loaders.Resource + * @see PIXI.LoaderResource + * @deprecated since 5.0.0 + */ + Resource: { + get() + { + warn('PIXI.loaders.Resource has moved to PIXI.LoaderResource'); + + return PIXI.LoaderResource; + }, + }, + /** * @function PIXI.loaders.bitmapFontParser - * @see PIXI.BitmapFontLoader.middleware + * @see PIXI.BitmapFontLoader.use * @deprecated since 5.0.0 */ bitmapFontParser: { get() { - warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.middleware'); + warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.use'); - return PIXI.BitmapFontLoader.middleware; + return PIXI.BitmapFontLoader.use; }, }, /** @@ -396,15 +429,15 @@ }, /** * @function PIXI.loaders.spritesheetParser - * @see PIXI.SpritesheetLoader.middleware + * @see PIXI.SpritesheetLoader.use * @deprecated since 5.0.0 */ spritesheetParser: { get() { - warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.middleware'); + warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.use'); - return PIXI.SpritesheetLoader.middleware; + return PIXI.SpritesheetLoader.use; }, }, /** @@ -423,6 +456,19 @@ }); /** + * @function PIXI.loaders.Loader.addPixiMiddleware + * @see PIXI.Loader.registerPlugin + * @deprecated since 5.0.0 + * @param {function} middleware + */ + PIXI.Loader.addPixiMiddleware = function addPixiMiddleware(middleware) + { + warn('PIXI.loaders.Loader.addPixiMiddleware is deprecated, use PIXI.loaders.Loader.registerPlugin'); + + return PIXI.loaders.Loader.registerPlugin({ use: middleware() }); + }; + + /** * @class PIXI.extract.WebGLExtract * @deprecated since 5.0.0 * @see PIXI.extract.Prepare diff --git a/bundles/pixi.js/test/index.js b/bundles/pixi.js/test/index.js index c7cc855..a29651e 100644 --- a/bundles/pixi.js/test/index.js +++ b/bundles/pixi.js/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/packages/app/src/Application.js b/packages/app/src/Application.js index 50f9fa1..ef40610 100644 --- a/packages/app/src/Application.js +++ b/packages/app/src/Application.js @@ -51,7 +51,7 @@ * @param {string} [options.powerPreference] - Parameter passed to webgl context, set to "high-performance" * for devices with dual graphics card **webgl only** * @param {boolean} [options.sharedTicker=false] - `true` to use PIXI.Ticker.shared, `false` to create new ticker. - * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.loaders.shared, `false` to create new Loader. + * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.Loaders.shared, `false` to create new Loader. */ constructor(options, arg2, arg3, arg4, arg5) { diff --git a/packages/loaders/src/Loader.js b/packages/loaders/src/Loader.js index 6f6e9bd..ecba1b0 100644 --- a/packages/loaders/src/Loader.js +++ b/packages/loaders/src/Loader.js @@ -1,16 +1,16 @@ import ResourceLoader from 'resource-loader'; import EventEmitter from 'eventemitter3'; import { blobMiddlewareFactory } from 'resource-loader/lib/middlewares/parsing/blob'; -import textureParser from './textureParser'; +import TextureLoader from './TextureLoader'; /** * * The new loader, extends Resource Loader by Chad Engler: https://github.com/englercj/resource-loader * * ```js - * const loader = PIXI.loader; // PixiJS exposes a premade instance for you to use. + * const loader = PIXI.Loader.shared; // PixiJS exposes a premade instance for you to use. * //or - * const loader = new PIXI.loaders.Loader(); // you can also create your own if you want + * const loader = new PIXI.Loader(); // you can also create your own if you want * * const sprites = {}; * @@ -52,20 +52,31 @@ * * @class Loader * @extends module:resource-loader.ResourceLoader - * @memberof PIXI.loaders + * @memberof PIXI * @param {string} [baseUrl=''] - The base url for all resources loaded by this loader. * @param {number} [concurrency=10] - The number of resources to load concurrently. */ -export class Loader extends ResourceLoader +export default class Loader extends ResourceLoader { constructor(baseUrl, concurrency) { super(baseUrl, concurrency); EventEmitter.call(this); - for (let i = 0; i < Loader._middleware.length; ++i) + for (let i = 0; i < Loader._plugins.length; ++i) { - this.use(Loader._middleware[i]()); + const plugin = Loader._plugins[i]; + const { pre, use } = plugin; + + if (pre) + { + this.pre(pre.bind(plugin)); + } + + if (use) + { + this.use(use.bind(plugin)); + } } // Compat layer, translate the new v2 signals into old v1 events. @@ -95,50 +106,82 @@ this.reset(); } } + + /** + * A premade instance of the loader that can be used to load resources. + * @name shared + * @type {PIXI.Loader} + * @static + * @memberof PIXI.Loader + */ + static get shared() + { + let shared = Loader._shared; + + if (!shared) + { + shared = new Loader(); + shared._protected = true; + Loader._shared = shared; + } + + return shared; + } } // Copy EE3 prototype (mixin) Object.assign(Loader.prototype, EventEmitter.prototype); /** - * Collection of all installed middleware for Loader. + * Collection of all installed `use` middleware for Loader. * * @static - * @member {Array} - * @memberof PIXI.loaders.Loader + * @member {Array} + * @memberof PIXI.Loader * @private */ -Loader._middleware = []; +Loader._plugins = []; /** - * A premade instance of the loader that can be used to load resources. - * @name shared - * @memberof PIXI.loaders - * @type {PIXI.loaders.Loader} - */ -export const shared = new Loader(); -shared._protected = true; - -/** - * Adds a middleware for the global shared loader and all + * Adds a Loader plugin for the global shared loader and all * new Loader instances created. * * @static - * @method useMiddleware - * @memberof PIXI.loaders.Loader - * @param {Function} fn - The middleware to add. + * @method registerPlugin + * @memberof PIXI.Loader + * @param {PIXI.Loader~LoaderPlugin} plugin - The plugin to add + * @return {PIXI.Loader} Reference to PIXI.Loader for chaining */ -Loader.useMiddleware = function useMiddleware(fn) +Loader.registerPlugin = function registerPlugin(plugin) { - // Install for current shared loader - shared.use(fn); + Loader._plugins.push(plugin); - // Install for all future loaders - Loader._middleware.push(fn); + if (plugin.add) + { + plugin.add(); + } + + return Loader; }; // parse any blob into more usable objects (e.g. Image) -Loader.useMiddleware(blobMiddlewareFactory); +Loader.registerPlugin({ use: blobMiddlewareFactory() }); // parse any Image objects into textures -Loader.useMiddleware(textureParser); +Loader.registerPlugin(TextureLoader); + +/** + * Plugin to be installed for handling specific Loader resources. + * @typedef {object} PIXI.Loader~LoaderPlugin + * @property {function} [plugin.add] - Function to call immediate after registering plugin. + * @property {PIXI.Loader~loaderMiddleware} [plugin.pre] - Middleware function to run before load, the + * arguments for this are `(resource, next)` + * @property {PIXI.Loader~loaderMiddleware} [plugin.use] - Middleware function to run after load, the + * arguments for this are `(resource, next)` + */ + +/** + * @callback PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ diff --git a/packages/loaders/src/TextureLoader.js b/packages/loaders/src/TextureLoader.js new file mode 100644 index 0000000..5094c8e --- /dev/null +++ b/packages/loaders/src/TextureLoader.js @@ -0,0 +1,31 @@ +import { Resource } from 'resource-loader'; +import { Texture } from '@pixi/core'; + +/** + * Loader plugin for handling Texture resources. + * @class + * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin + */ +export default class TextureLoader +{ + /** + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ + static use(resource, next) + { + // create a new texture if the data is an Image object + if (resource.data && resource.type === Resource.TYPE.IMAGE) + { + resource.texture = Texture.fromLoader( + resource.data, + resource.url, + resource.name + ); + } + next(); + } +} diff --git a/packages/loaders/src/index.js b/packages/loaders/src/index.js index 8e816cc..3e877fe 100644 --- a/packages/loaders/src/index.js +++ b/packages/loaders/src/index.js @@ -1,24 +1,11 @@ +import { Resource } from 'resource-loader'; /** * Reference to **{@link https://github.com/englercj/resource-loader * resource-loader}**'s Resource class. * @see http://englercj.github.io/resource-loader/Resource.html - * @class Resource - * @memberof PIXI.loaders + * @class LoaderResource + * @memberof PIXI */ -export { Resource } from 'resource-loader'; - -/** - * This namespace contains APIs which extends the {@link https://github.com/englercj/resource-loader resource-loader} module - * for loading assets, data, and other resources dynamically. - * @example - * const loader = new PIXI.loaders.Loader(); - * loader.add('bunny', 'data/bunny.png') - * .add('spaceship', 'assets/spritesheet.json'); - * loader.load((loader, resources) => { - * // resources.bunny - * // resources.spaceship - * }); - * @namespace PIXI.loaders - */ -export { Loader, shared } from './Loader'; -export { default as textureParser } from './textureParser'; +export const LoaderResource = Resource; +export { default as Loader } from './Loader'; +export { default as TextureLoader } from './TextureLoader'; diff --git a/packages/loaders/src/textureParser.js b/packages/loaders/src/textureParser.js deleted file mode 100644 index 9dba8bd..0000000 --- a/packages/loaders/src/textureParser.js +++ /dev/null @@ -1,19 +0,0 @@ -import { Resource } from 'resource-loader'; -import { Texture } from '@pixi/core'; - -export default function () -{ - return function textureParser(resource, next) - { - // create a new texture if the data is an Image object - if (resource.data && resource.type === Resource.TYPE.IMAGE) - { - resource.texture = Texture.fromLoader( - resource.data, - resource.url, - resource.name - ); - } - next(); - }; -} diff --git a/packages/loaders/test/Loader.js b/packages/loaders/test/Loader.js new file mode 100644 index 0000000..1a62a86 --- /dev/null +++ b/packages/loaders/test/Loader.js @@ -0,0 +1,15 @@ +const { Loader } = require('../'); + +describe('PIXI.Loader', function () +{ + it('should exist', function () + { + expect(Loader).to.be.a('function'); + }); + + it('should have shared loader', function () + { + expect(Loader.shared).to.not.be.undefined; + expect(Loader.shared).to.be.instanceof(Loader); + }); +}); diff --git a/packages/loaders/test/TextureLoader.js b/packages/loaders/test/TextureLoader.js new file mode 100644 index 0000000..db53f7c --- /dev/null +++ b/packages/loaders/test/TextureLoader.js @@ -0,0 +1,52 @@ +const { TextureLoader, LoaderResource } = require('../'); +const { Texture } = require('@pixi/core'); +const { BaseTextureCache, TextureCache } = require('@pixi/utils'); + +describe('PIXI.TextureLoader', function () +{ + it('should exist and return a function', function () + { + expect(TextureLoader).to.not.be.undefined; + expect(TextureLoader.use).to.be.a('function'); + }); + + it('should do nothing if the resource is not an image', function () + { + const spy = sinon.spy(); + const res = {}; + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.undefined; + }); + + it('should create a texture if resource is an image', function () + { + const spy = sinon.spy(); + const res = createMockResource(LoaderResource.TYPE.IMAGE, new Image()); + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.an.instanceof(Texture); + + expect(BaseTextureCache).to.have.property(res.name, res.texture.baseTexture); + expect(BaseTextureCache).to.have.property(res.url, res.texture.baseTexture); + + expect(TextureCache).to.have.property(res.name, res.texture); + expect(TextureCache).to.have.property(res.url, res.texture); + }); +}); + +function createMockResource(type, data) +{ + const name = `${Math.floor(Date.now() * Math.random())}`; + + return { + url: `http://localhost/doesnt_exist/${name}`, + name, + type, + data, + }; +} diff --git a/bundles/pixi.js-legacy/test/index.js b/bundles/pixi.js-legacy/test/index.js index c7cc855..a29651e 100755 --- a/bundles/pixi.js-legacy/test/index.js +++ b/bundles/pixi.js-legacy/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js/src/PIXI.js b/bundles/pixi.js/src/PIXI.js index 75e5658..ae40c7e 100644 --- a/bundles/pixi.js/src/PIXI.js +++ b/bundles/pixi.js/src/PIXI.js @@ -12,6 +12,7 @@ export * from '@pixi/display'; export * from '@pixi/mesh'; export * from '@pixi/ticker'; +export * from '@pixi/loaders'; import { Renderer } from '@pixi/core'; import * as interaction from '@pixi/interaction'; @@ -22,10 +23,12 @@ import { TilingSpriteRenderer } from '@pixi/sprite-tiling'; import { GraphicsRenderer } from '@pixi/graphics'; import * as accessibility from '@pixi/accessibility'; -import * as loaders from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; import * as filters from './filters'; import * as utils from '@pixi/utils'; import { settings } from '@pixi/settings'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager); Renderer.registerPlugin('extract', extract.Extract); @@ -36,6 +39,9 @@ Renderer.registerPlugin('sprite', SpriteRenderer); Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer); +Loader.registerPlugin(SpritesheetLoader); +Loader.registerPlugin(BitmapFontLoader); + import '@pixi/mixin-cache-as-bitmap'; import '@pixi/mixin-get-child-by-name'; import '@pixi/mixin-get-global-position'; @@ -43,20 +49,11 @@ utils.mixins.performMixins(); -/** - * Alias for {@link PIXI.loaders.shared}. - * @name loader - * @memberof PIXI - * @type {PIXI.loader.Loader} - */ -export const loader = loaders.shared; - export { accessibility, extract, filters, interaction, - loaders, prepare, utils, settings, diff --git a/bundles/pixi.js/src/deprecated.js b/bundles/pixi.js/src/deprecated.js index 402176f..e59c66a 100644 --- a/bundles/pixi.js/src/deprecated.js +++ b/bundles/pixi.js/src/deprecated.js @@ -131,6 +131,22 @@ return PIXI.utils.CanvasRenderTarget; }, }, + + /** + * @memberof PIXI + * @name loader + * @type {PIXI.Loader} + * @see PIXI.Loader.shared + * @deprecated since 5.0.0 + */ + loader: { + get() + { + warn('PIXI.loader has moved to PIXI.Loader.shared'); + + return PIXI.Loader.shared; + }, + }, }); /** @@ -351,34 +367,51 @@ }, }); - Object.defineProperties(PIXI.loaders.Loader, { - /** - * @function PIXI.loaders.Loader.addPixiMiddleware - * @see PIXI.loaders.Loader.useMiddleware - * @deprecated since 5.0.0 - */ - addPixiMiddleware: { - get() - { - warn('PIXI.loaders.Loader.addPixiMiddleware has moved to PIXI.loaders.Loader.useMiddleware'); - - return PIXI.loaders.Loader.useMiddleware; - }, - }, - }); + /** + * All classes on this namespace have moved to the high-level `PIXI` object. + * @namespace PIXI.loaders + * @deprecated since 5.0.0 + */ + PIXI.loaders = {}; Object.defineProperties(PIXI.loaders, { /** + * @class PIXI.loaders.Loader + * @see PIXI.Loader + * @deprecated since 5.0.0 + */ + Loader: { + get() + { + warn('PIXI.loaders.Loader has moved to PIXI.Loader'); + + return PIXI.Loader; + }, + }, + /** + * @class PIXI.loaders.Resource + * @see PIXI.LoaderResource + * @deprecated since 5.0.0 + */ + Resource: { + get() + { + warn('PIXI.loaders.Resource has moved to PIXI.LoaderResource'); + + return PIXI.LoaderResource; + }, + }, + /** * @function PIXI.loaders.bitmapFontParser - * @see PIXI.BitmapFontLoader.middleware + * @see PIXI.BitmapFontLoader.use * @deprecated since 5.0.0 */ bitmapFontParser: { get() { - warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.middleware'); + warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.use'); - return PIXI.BitmapFontLoader.middleware; + return PIXI.BitmapFontLoader.use; }, }, /** @@ -396,15 +429,15 @@ }, /** * @function PIXI.loaders.spritesheetParser - * @see PIXI.SpritesheetLoader.middleware + * @see PIXI.SpritesheetLoader.use * @deprecated since 5.0.0 */ spritesheetParser: { get() { - warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.middleware'); + warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.use'); - return PIXI.SpritesheetLoader.middleware; + return PIXI.SpritesheetLoader.use; }, }, /** @@ -423,6 +456,19 @@ }); /** + * @function PIXI.loaders.Loader.addPixiMiddleware + * @see PIXI.Loader.registerPlugin + * @deprecated since 5.0.0 + * @param {function} middleware + */ + PIXI.Loader.addPixiMiddleware = function addPixiMiddleware(middleware) + { + warn('PIXI.loaders.Loader.addPixiMiddleware is deprecated, use PIXI.loaders.Loader.registerPlugin'); + + return PIXI.loaders.Loader.registerPlugin({ use: middleware() }); + }; + + /** * @class PIXI.extract.WebGLExtract * @deprecated since 5.0.0 * @see PIXI.extract.Prepare diff --git a/bundles/pixi.js/test/index.js b/bundles/pixi.js/test/index.js index c7cc855..a29651e 100644 --- a/bundles/pixi.js/test/index.js +++ b/bundles/pixi.js/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/packages/app/src/Application.js b/packages/app/src/Application.js index 50f9fa1..ef40610 100644 --- a/packages/app/src/Application.js +++ b/packages/app/src/Application.js @@ -51,7 +51,7 @@ * @param {string} [options.powerPreference] - Parameter passed to webgl context, set to "high-performance" * for devices with dual graphics card **webgl only** * @param {boolean} [options.sharedTicker=false] - `true` to use PIXI.Ticker.shared, `false` to create new ticker. - * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.loaders.shared, `false` to create new Loader. + * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.Loaders.shared, `false` to create new Loader. */ constructor(options, arg2, arg3, arg4, arg5) { diff --git a/packages/loaders/src/Loader.js b/packages/loaders/src/Loader.js index 6f6e9bd..ecba1b0 100644 --- a/packages/loaders/src/Loader.js +++ b/packages/loaders/src/Loader.js @@ -1,16 +1,16 @@ import ResourceLoader from 'resource-loader'; import EventEmitter from 'eventemitter3'; import { blobMiddlewareFactory } from 'resource-loader/lib/middlewares/parsing/blob'; -import textureParser from './textureParser'; +import TextureLoader from './TextureLoader'; /** * * The new loader, extends Resource Loader by Chad Engler: https://github.com/englercj/resource-loader * * ```js - * const loader = PIXI.loader; // PixiJS exposes a premade instance for you to use. + * const loader = PIXI.Loader.shared; // PixiJS exposes a premade instance for you to use. * //or - * const loader = new PIXI.loaders.Loader(); // you can also create your own if you want + * const loader = new PIXI.Loader(); // you can also create your own if you want * * const sprites = {}; * @@ -52,20 +52,31 @@ * * @class Loader * @extends module:resource-loader.ResourceLoader - * @memberof PIXI.loaders + * @memberof PIXI * @param {string} [baseUrl=''] - The base url for all resources loaded by this loader. * @param {number} [concurrency=10] - The number of resources to load concurrently. */ -export class Loader extends ResourceLoader +export default class Loader extends ResourceLoader { constructor(baseUrl, concurrency) { super(baseUrl, concurrency); EventEmitter.call(this); - for (let i = 0; i < Loader._middleware.length; ++i) + for (let i = 0; i < Loader._plugins.length; ++i) { - this.use(Loader._middleware[i]()); + const plugin = Loader._plugins[i]; + const { pre, use } = plugin; + + if (pre) + { + this.pre(pre.bind(plugin)); + } + + if (use) + { + this.use(use.bind(plugin)); + } } // Compat layer, translate the new v2 signals into old v1 events. @@ -95,50 +106,82 @@ this.reset(); } } + + /** + * A premade instance of the loader that can be used to load resources. + * @name shared + * @type {PIXI.Loader} + * @static + * @memberof PIXI.Loader + */ + static get shared() + { + let shared = Loader._shared; + + if (!shared) + { + shared = new Loader(); + shared._protected = true; + Loader._shared = shared; + } + + return shared; + } } // Copy EE3 prototype (mixin) Object.assign(Loader.prototype, EventEmitter.prototype); /** - * Collection of all installed middleware for Loader. + * Collection of all installed `use` middleware for Loader. * * @static - * @member {Array} - * @memberof PIXI.loaders.Loader + * @member {Array} + * @memberof PIXI.Loader * @private */ -Loader._middleware = []; +Loader._plugins = []; /** - * A premade instance of the loader that can be used to load resources. - * @name shared - * @memberof PIXI.loaders - * @type {PIXI.loaders.Loader} - */ -export const shared = new Loader(); -shared._protected = true; - -/** - * Adds a middleware for the global shared loader and all + * Adds a Loader plugin for the global shared loader and all * new Loader instances created. * * @static - * @method useMiddleware - * @memberof PIXI.loaders.Loader - * @param {Function} fn - The middleware to add. + * @method registerPlugin + * @memberof PIXI.Loader + * @param {PIXI.Loader~LoaderPlugin} plugin - The plugin to add + * @return {PIXI.Loader} Reference to PIXI.Loader for chaining */ -Loader.useMiddleware = function useMiddleware(fn) +Loader.registerPlugin = function registerPlugin(plugin) { - // Install for current shared loader - shared.use(fn); + Loader._plugins.push(plugin); - // Install for all future loaders - Loader._middleware.push(fn); + if (plugin.add) + { + plugin.add(); + } + + return Loader; }; // parse any blob into more usable objects (e.g. Image) -Loader.useMiddleware(blobMiddlewareFactory); +Loader.registerPlugin({ use: blobMiddlewareFactory() }); // parse any Image objects into textures -Loader.useMiddleware(textureParser); +Loader.registerPlugin(TextureLoader); + +/** + * Plugin to be installed for handling specific Loader resources. + * @typedef {object} PIXI.Loader~LoaderPlugin + * @property {function} [plugin.add] - Function to call immediate after registering plugin. + * @property {PIXI.Loader~loaderMiddleware} [plugin.pre] - Middleware function to run before load, the + * arguments for this are `(resource, next)` + * @property {PIXI.Loader~loaderMiddleware} [plugin.use] - Middleware function to run after load, the + * arguments for this are `(resource, next)` + */ + +/** + * @callback PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ diff --git a/packages/loaders/src/TextureLoader.js b/packages/loaders/src/TextureLoader.js new file mode 100644 index 0000000..5094c8e --- /dev/null +++ b/packages/loaders/src/TextureLoader.js @@ -0,0 +1,31 @@ +import { Resource } from 'resource-loader'; +import { Texture } from '@pixi/core'; + +/** + * Loader plugin for handling Texture resources. + * @class + * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin + */ +export default class TextureLoader +{ + /** + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ + static use(resource, next) + { + // create a new texture if the data is an Image object + if (resource.data && resource.type === Resource.TYPE.IMAGE) + { + resource.texture = Texture.fromLoader( + resource.data, + resource.url, + resource.name + ); + } + next(); + } +} diff --git a/packages/loaders/src/index.js b/packages/loaders/src/index.js index 8e816cc..3e877fe 100644 --- a/packages/loaders/src/index.js +++ b/packages/loaders/src/index.js @@ -1,24 +1,11 @@ +import { Resource } from 'resource-loader'; /** * Reference to **{@link https://github.com/englercj/resource-loader * resource-loader}**'s Resource class. * @see http://englercj.github.io/resource-loader/Resource.html - * @class Resource - * @memberof PIXI.loaders + * @class LoaderResource + * @memberof PIXI */ -export { Resource } from 'resource-loader'; - -/** - * This namespace contains APIs which extends the {@link https://github.com/englercj/resource-loader resource-loader} module - * for loading assets, data, and other resources dynamically. - * @example - * const loader = new PIXI.loaders.Loader(); - * loader.add('bunny', 'data/bunny.png') - * .add('spaceship', 'assets/spritesheet.json'); - * loader.load((loader, resources) => { - * // resources.bunny - * // resources.spaceship - * }); - * @namespace PIXI.loaders - */ -export { Loader, shared } from './Loader'; -export { default as textureParser } from './textureParser'; +export const LoaderResource = Resource; +export { default as Loader } from './Loader'; +export { default as TextureLoader } from './TextureLoader'; diff --git a/packages/loaders/src/textureParser.js b/packages/loaders/src/textureParser.js deleted file mode 100644 index 9dba8bd..0000000 --- a/packages/loaders/src/textureParser.js +++ /dev/null @@ -1,19 +0,0 @@ -import { Resource } from 'resource-loader'; -import { Texture } from '@pixi/core'; - -export default function () -{ - return function textureParser(resource, next) - { - // create a new texture if the data is an Image object - if (resource.data && resource.type === Resource.TYPE.IMAGE) - { - resource.texture = Texture.fromLoader( - resource.data, - resource.url, - resource.name - ); - } - next(); - }; -} diff --git a/packages/loaders/test/Loader.js b/packages/loaders/test/Loader.js new file mode 100644 index 0000000..1a62a86 --- /dev/null +++ b/packages/loaders/test/Loader.js @@ -0,0 +1,15 @@ +const { Loader } = require('../'); + +describe('PIXI.Loader', function () +{ + it('should exist', function () + { + expect(Loader).to.be.a('function'); + }); + + it('should have shared loader', function () + { + expect(Loader.shared).to.not.be.undefined; + expect(Loader.shared).to.be.instanceof(Loader); + }); +}); diff --git a/packages/loaders/test/TextureLoader.js b/packages/loaders/test/TextureLoader.js new file mode 100644 index 0000000..db53f7c --- /dev/null +++ b/packages/loaders/test/TextureLoader.js @@ -0,0 +1,52 @@ +const { TextureLoader, LoaderResource } = require('../'); +const { Texture } = require('@pixi/core'); +const { BaseTextureCache, TextureCache } = require('@pixi/utils'); + +describe('PIXI.TextureLoader', function () +{ + it('should exist and return a function', function () + { + expect(TextureLoader).to.not.be.undefined; + expect(TextureLoader.use).to.be.a('function'); + }); + + it('should do nothing if the resource is not an image', function () + { + const spy = sinon.spy(); + const res = {}; + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.undefined; + }); + + it('should create a texture if resource is an image', function () + { + const spy = sinon.spy(); + const res = createMockResource(LoaderResource.TYPE.IMAGE, new Image()); + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.an.instanceof(Texture); + + expect(BaseTextureCache).to.have.property(res.name, res.texture.baseTexture); + expect(BaseTextureCache).to.have.property(res.url, res.texture.baseTexture); + + expect(TextureCache).to.have.property(res.name, res.texture); + expect(TextureCache).to.have.property(res.url, res.texture); + }); +}); + +function createMockResource(type, data) +{ + const name = `${Math.floor(Date.now() * Math.random())}`; + + return { + url: `http://localhost/doesnt_exist/${name}`, + name, + type, + data, + }; +} diff --git a/packages/loaders/test/index.js b/packages/loaders/test/index.js index 72c6554..8913167 100644 --- a/packages/loaders/test/index.js +++ b/packages/loaders/test/index.js @@ -1,2 +1,2 @@ -require('./loader'); -require('./textureParser'); +require('./Loader'); +require('./TextureLoader'); diff --git a/bundles/pixi.js-legacy/test/index.js b/bundles/pixi.js-legacy/test/index.js index c7cc855..a29651e 100755 --- a/bundles/pixi.js-legacy/test/index.js +++ b/bundles/pixi.js-legacy/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js/src/PIXI.js b/bundles/pixi.js/src/PIXI.js index 75e5658..ae40c7e 100644 --- a/bundles/pixi.js/src/PIXI.js +++ b/bundles/pixi.js/src/PIXI.js @@ -12,6 +12,7 @@ export * from '@pixi/display'; export * from '@pixi/mesh'; export * from '@pixi/ticker'; +export * from '@pixi/loaders'; import { Renderer } from '@pixi/core'; import * as interaction from '@pixi/interaction'; @@ -22,10 +23,12 @@ import { TilingSpriteRenderer } from '@pixi/sprite-tiling'; import { GraphicsRenderer } from '@pixi/graphics'; import * as accessibility from '@pixi/accessibility'; -import * as loaders from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; import * as filters from './filters'; import * as utils from '@pixi/utils'; import { settings } from '@pixi/settings'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager); Renderer.registerPlugin('extract', extract.Extract); @@ -36,6 +39,9 @@ Renderer.registerPlugin('sprite', SpriteRenderer); Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer); +Loader.registerPlugin(SpritesheetLoader); +Loader.registerPlugin(BitmapFontLoader); + import '@pixi/mixin-cache-as-bitmap'; import '@pixi/mixin-get-child-by-name'; import '@pixi/mixin-get-global-position'; @@ -43,20 +49,11 @@ utils.mixins.performMixins(); -/** - * Alias for {@link PIXI.loaders.shared}. - * @name loader - * @memberof PIXI - * @type {PIXI.loader.Loader} - */ -export const loader = loaders.shared; - export { accessibility, extract, filters, interaction, - loaders, prepare, utils, settings, diff --git a/bundles/pixi.js/src/deprecated.js b/bundles/pixi.js/src/deprecated.js index 402176f..e59c66a 100644 --- a/bundles/pixi.js/src/deprecated.js +++ b/bundles/pixi.js/src/deprecated.js @@ -131,6 +131,22 @@ return PIXI.utils.CanvasRenderTarget; }, }, + + /** + * @memberof PIXI + * @name loader + * @type {PIXI.Loader} + * @see PIXI.Loader.shared + * @deprecated since 5.0.0 + */ + loader: { + get() + { + warn('PIXI.loader has moved to PIXI.Loader.shared'); + + return PIXI.Loader.shared; + }, + }, }); /** @@ -351,34 +367,51 @@ }, }); - Object.defineProperties(PIXI.loaders.Loader, { - /** - * @function PIXI.loaders.Loader.addPixiMiddleware - * @see PIXI.loaders.Loader.useMiddleware - * @deprecated since 5.0.0 - */ - addPixiMiddleware: { - get() - { - warn('PIXI.loaders.Loader.addPixiMiddleware has moved to PIXI.loaders.Loader.useMiddleware'); - - return PIXI.loaders.Loader.useMiddleware; - }, - }, - }); + /** + * All classes on this namespace have moved to the high-level `PIXI` object. + * @namespace PIXI.loaders + * @deprecated since 5.0.0 + */ + PIXI.loaders = {}; Object.defineProperties(PIXI.loaders, { /** + * @class PIXI.loaders.Loader + * @see PIXI.Loader + * @deprecated since 5.0.0 + */ + Loader: { + get() + { + warn('PIXI.loaders.Loader has moved to PIXI.Loader'); + + return PIXI.Loader; + }, + }, + /** + * @class PIXI.loaders.Resource + * @see PIXI.LoaderResource + * @deprecated since 5.0.0 + */ + Resource: { + get() + { + warn('PIXI.loaders.Resource has moved to PIXI.LoaderResource'); + + return PIXI.LoaderResource; + }, + }, + /** * @function PIXI.loaders.bitmapFontParser - * @see PIXI.BitmapFontLoader.middleware + * @see PIXI.BitmapFontLoader.use * @deprecated since 5.0.0 */ bitmapFontParser: { get() { - warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.middleware'); + warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.use'); - return PIXI.BitmapFontLoader.middleware; + return PIXI.BitmapFontLoader.use; }, }, /** @@ -396,15 +429,15 @@ }, /** * @function PIXI.loaders.spritesheetParser - * @see PIXI.SpritesheetLoader.middleware + * @see PIXI.SpritesheetLoader.use * @deprecated since 5.0.0 */ spritesheetParser: { get() { - warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.middleware'); + warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.use'); - return PIXI.SpritesheetLoader.middleware; + return PIXI.SpritesheetLoader.use; }, }, /** @@ -423,6 +456,19 @@ }); /** + * @function PIXI.loaders.Loader.addPixiMiddleware + * @see PIXI.Loader.registerPlugin + * @deprecated since 5.0.0 + * @param {function} middleware + */ + PIXI.Loader.addPixiMiddleware = function addPixiMiddleware(middleware) + { + warn('PIXI.loaders.Loader.addPixiMiddleware is deprecated, use PIXI.loaders.Loader.registerPlugin'); + + return PIXI.loaders.Loader.registerPlugin({ use: middleware() }); + }; + + /** * @class PIXI.extract.WebGLExtract * @deprecated since 5.0.0 * @see PIXI.extract.Prepare diff --git a/bundles/pixi.js/test/index.js b/bundles/pixi.js/test/index.js index c7cc855..a29651e 100644 --- a/bundles/pixi.js/test/index.js +++ b/bundles/pixi.js/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/packages/app/src/Application.js b/packages/app/src/Application.js index 50f9fa1..ef40610 100644 --- a/packages/app/src/Application.js +++ b/packages/app/src/Application.js @@ -51,7 +51,7 @@ * @param {string} [options.powerPreference] - Parameter passed to webgl context, set to "high-performance" * for devices with dual graphics card **webgl only** * @param {boolean} [options.sharedTicker=false] - `true` to use PIXI.Ticker.shared, `false` to create new ticker. - * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.loaders.shared, `false` to create new Loader. + * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.Loaders.shared, `false` to create new Loader. */ constructor(options, arg2, arg3, arg4, arg5) { diff --git a/packages/loaders/src/Loader.js b/packages/loaders/src/Loader.js index 6f6e9bd..ecba1b0 100644 --- a/packages/loaders/src/Loader.js +++ b/packages/loaders/src/Loader.js @@ -1,16 +1,16 @@ import ResourceLoader from 'resource-loader'; import EventEmitter from 'eventemitter3'; import { blobMiddlewareFactory } from 'resource-loader/lib/middlewares/parsing/blob'; -import textureParser from './textureParser'; +import TextureLoader from './TextureLoader'; /** * * The new loader, extends Resource Loader by Chad Engler: https://github.com/englercj/resource-loader * * ```js - * const loader = PIXI.loader; // PixiJS exposes a premade instance for you to use. + * const loader = PIXI.Loader.shared; // PixiJS exposes a premade instance for you to use. * //or - * const loader = new PIXI.loaders.Loader(); // you can also create your own if you want + * const loader = new PIXI.Loader(); // you can also create your own if you want * * const sprites = {}; * @@ -52,20 +52,31 @@ * * @class Loader * @extends module:resource-loader.ResourceLoader - * @memberof PIXI.loaders + * @memberof PIXI * @param {string} [baseUrl=''] - The base url for all resources loaded by this loader. * @param {number} [concurrency=10] - The number of resources to load concurrently. */ -export class Loader extends ResourceLoader +export default class Loader extends ResourceLoader { constructor(baseUrl, concurrency) { super(baseUrl, concurrency); EventEmitter.call(this); - for (let i = 0; i < Loader._middleware.length; ++i) + for (let i = 0; i < Loader._plugins.length; ++i) { - this.use(Loader._middleware[i]()); + const plugin = Loader._plugins[i]; + const { pre, use } = plugin; + + if (pre) + { + this.pre(pre.bind(plugin)); + } + + if (use) + { + this.use(use.bind(plugin)); + } } // Compat layer, translate the new v2 signals into old v1 events. @@ -95,50 +106,82 @@ this.reset(); } } + + /** + * A premade instance of the loader that can be used to load resources. + * @name shared + * @type {PIXI.Loader} + * @static + * @memberof PIXI.Loader + */ + static get shared() + { + let shared = Loader._shared; + + if (!shared) + { + shared = new Loader(); + shared._protected = true; + Loader._shared = shared; + } + + return shared; + } } // Copy EE3 prototype (mixin) Object.assign(Loader.prototype, EventEmitter.prototype); /** - * Collection of all installed middleware for Loader. + * Collection of all installed `use` middleware for Loader. * * @static - * @member {Array} - * @memberof PIXI.loaders.Loader + * @member {Array} + * @memberof PIXI.Loader * @private */ -Loader._middleware = []; +Loader._plugins = []; /** - * A premade instance of the loader that can be used to load resources. - * @name shared - * @memberof PIXI.loaders - * @type {PIXI.loaders.Loader} - */ -export const shared = new Loader(); -shared._protected = true; - -/** - * Adds a middleware for the global shared loader and all + * Adds a Loader plugin for the global shared loader and all * new Loader instances created. * * @static - * @method useMiddleware - * @memberof PIXI.loaders.Loader - * @param {Function} fn - The middleware to add. + * @method registerPlugin + * @memberof PIXI.Loader + * @param {PIXI.Loader~LoaderPlugin} plugin - The plugin to add + * @return {PIXI.Loader} Reference to PIXI.Loader for chaining */ -Loader.useMiddleware = function useMiddleware(fn) +Loader.registerPlugin = function registerPlugin(plugin) { - // Install for current shared loader - shared.use(fn); + Loader._plugins.push(plugin); - // Install for all future loaders - Loader._middleware.push(fn); + if (plugin.add) + { + plugin.add(); + } + + return Loader; }; // parse any blob into more usable objects (e.g. Image) -Loader.useMiddleware(blobMiddlewareFactory); +Loader.registerPlugin({ use: blobMiddlewareFactory() }); // parse any Image objects into textures -Loader.useMiddleware(textureParser); +Loader.registerPlugin(TextureLoader); + +/** + * Plugin to be installed for handling specific Loader resources. + * @typedef {object} PIXI.Loader~LoaderPlugin + * @property {function} [plugin.add] - Function to call immediate after registering plugin. + * @property {PIXI.Loader~loaderMiddleware} [plugin.pre] - Middleware function to run before load, the + * arguments for this are `(resource, next)` + * @property {PIXI.Loader~loaderMiddleware} [plugin.use] - Middleware function to run after load, the + * arguments for this are `(resource, next)` + */ + +/** + * @callback PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ diff --git a/packages/loaders/src/TextureLoader.js b/packages/loaders/src/TextureLoader.js new file mode 100644 index 0000000..5094c8e --- /dev/null +++ b/packages/loaders/src/TextureLoader.js @@ -0,0 +1,31 @@ +import { Resource } from 'resource-loader'; +import { Texture } from '@pixi/core'; + +/** + * Loader plugin for handling Texture resources. + * @class + * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin + */ +export default class TextureLoader +{ + /** + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ + static use(resource, next) + { + // create a new texture if the data is an Image object + if (resource.data && resource.type === Resource.TYPE.IMAGE) + { + resource.texture = Texture.fromLoader( + resource.data, + resource.url, + resource.name + ); + } + next(); + } +} diff --git a/packages/loaders/src/index.js b/packages/loaders/src/index.js index 8e816cc..3e877fe 100644 --- a/packages/loaders/src/index.js +++ b/packages/loaders/src/index.js @@ -1,24 +1,11 @@ +import { Resource } from 'resource-loader'; /** * Reference to **{@link https://github.com/englercj/resource-loader * resource-loader}**'s Resource class. * @see http://englercj.github.io/resource-loader/Resource.html - * @class Resource - * @memberof PIXI.loaders + * @class LoaderResource + * @memberof PIXI */ -export { Resource } from 'resource-loader'; - -/** - * This namespace contains APIs which extends the {@link https://github.com/englercj/resource-loader resource-loader} module - * for loading assets, data, and other resources dynamically. - * @example - * const loader = new PIXI.loaders.Loader(); - * loader.add('bunny', 'data/bunny.png') - * .add('spaceship', 'assets/spritesheet.json'); - * loader.load((loader, resources) => { - * // resources.bunny - * // resources.spaceship - * }); - * @namespace PIXI.loaders - */ -export { Loader, shared } from './Loader'; -export { default as textureParser } from './textureParser'; +export const LoaderResource = Resource; +export { default as Loader } from './Loader'; +export { default as TextureLoader } from './TextureLoader'; diff --git a/packages/loaders/src/textureParser.js b/packages/loaders/src/textureParser.js deleted file mode 100644 index 9dba8bd..0000000 --- a/packages/loaders/src/textureParser.js +++ /dev/null @@ -1,19 +0,0 @@ -import { Resource } from 'resource-loader'; -import { Texture } from '@pixi/core'; - -export default function () -{ - return function textureParser(resource, next) - { - // create a new texture if the data is an Image object - if (resource.data && resource.type === Resource.TYPE.IMAGE) - { - resource.texture = Texture.fromLoader( - resource.data, - resource.url, - resource.name - ); - } - next(); - }; -} diff --git a/packages/loaders/test/Loader.js b/packages/loaders/test/Loader.js new file mode 100644 index 0000000..1a62a86 --- /dev/null +++ b/packages/loaders/test/Loader.js @@ -0,0 +1,15 @@ +const { Loader } = require('../'); + +describe('PIXI.Loader', function () +{ + it('should exist', function () + { + expect(Loader).to.be.a('function'); + }); + + it('should have shared loader', function () + { + expect(Loader.shared).to.not.be.undefined; + expect(Loader.shared).to.be.instanceof(Loader); + }); +}); diff --git a/packages/loaders/test/TextureLoader.js b/packages/loaders/test/TextureLoader.js new file mode 100644 index 0000000..db53f7c --- /dev/null +++ b/packages/loaders/test/TextureLoader.js @@ -0,0 +1,52 @@ +const { TextureLoader, LoaderResource } = require('../'); +const { Texture } = require('@pixi/core'); +const { BaseTextureCache, TextureCache } = require('@pixi/utils'); + +describe('PIXI.TextureLoader', function () +{ + it('should exist and return a function', function () + { + expect(TextureLoader).to.not.be.undefined; + expect(TextureLoader.use).to.be.a('function'); + }); + + it('should do nothing if the resource is not an image', function () + { + const spy = sinon.spy(); + const res = {}; + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.undefined; + }); + + it('should create a texture if resource is an image', function () + { + const spy = sinon.spy(); + const res = createMockResource(LoaderResource.TYPE.IMAGE, new Image()); + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.an.instanceof(Texture); + + expect(BaseTextureCache).to.have.property(res.name, res.texture.baseTexture); + expect(BaseTextureCache).to.have.property(res.url, res.texture.baseTexture); + + expect(TextureCache).to.have.property(res.name, res.texture); + expect(TextureCache).to.have.property(res.url, res.texture); + }); +}); + +function createMockResource(type, data) +{ + const name = `${Math.floor(Date.now() * Math.random())}`; + + return { + url: `http://localhost/doesnt_exist/${name}`, + name, + type, + data, + }; +} diff --git a/packages/loaders/test/index.js b/packages/loaders/test/index.js index 72c6554..8913167 100644 --- a/packages/loaders/test/index.js +++ b/packages/loaders/test/index.js @@ -1,2 +1,2 @@ -require('./loader'); -require('./textureParser'); +require('./Loader'); +require('./TextureLoader'); diff --git a/packages/loaders/test/loader.js b/packages/loaders/test/loader.js deleted file mode 100644 index 5b8571b..0000000 --- a/packages/loaders/test/loader.js +++ /dev/null @@ -1,9 +0,0 @@ -const { Loader } = require('../'); - -describe('PIXI.loaders.Loader', function () -{ - it('should exist', function () - { - expect(Loader).to.be.a('function'); - }); -}); diff --git a/bundles/pixi.js-legacy/test/index.js b/bundles/pixi.js-legacy/test/index.js index c7cc855..a29651e 100755 --- a/bundles/pixi.js-legacy/test/index.js +++ b/bundles/pixi.js-legacy/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js/src/PIXI.js b/bundles/pixi.js/src/PIXI.js index 75e5658..ae40c7e 100644 --- a/bundles/pixi.js/src/PIXI.js +++ b/bundles/pixi.js/src/PIXI.js @@ -12,6 +12,7 @@ export * from '@pixi/display'; export * from '@pixi/mesh'; export * from '@pixi/ticker'; +export * from '@pixi/loaders'; import { Renderer } from '@pixi/core'; import * as interaction from '@pixi/interaction'; @@ -22,10 +23,12 @@ import { TilingSpriteRenderer } from '@pixi/sprite-tiling'; import { GraphicsRenderer } from '@pixi/graphics'; import * as accessibility from '@pixi/accessibility'; -import * as loaders from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; import * as filters from './filters'; import * as utils from '@pixi/utils'; import { settings } from '@pixi/settings'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager); Renderer.registerPlugin('extract', extract.Extract); @@ -36,6 +39,9 @@ Renderer.registerPlugin('sprite', SpriteRenderer); Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer); +Loader.registerPlugin(SpritesheetLoader); +Loader.registerPlugin(BitmapFontLoader); + import '@pixi/mixin-cache-as-bitmap'; import '@pixi/mixin-get-child-by-name'; import '@pixi/mixin-get-global-position'; @@ -43,20 +49,11 @@ utils.mixins.performMixins(); -/** - * Alias for {@link PIXI.loaders.shared}. - * @name loader - * @memberof PIXI - * @type {PIXI.loader.Loader} - */ -export const loader = loaders.shared; - export { accessibility, extract, filters, interaction, - loaders, prepare, utils, settings, diff --git a/bundles/pixi.js/src/deprecated.js b/bundles/pixi.js/src/deprecated.js index 402176f..e59c66a 100644 --- a/bundles/pixi.js/src/deprecated.js +++ b/bundles/pixi.js/src/deprecated.js @@ -131,6 +131,22 @@ return PIXI.utils.CanvasRenderTarget; }, }, + + /** + * @memberof PIXI + * @name loader + * @type {PIXI.Loader} + * @see PIXI.Loader.shared + * @deprecated since 5.0.0 + */ + loader: { + get() + { + warn('PIXI.loader has moved to PIXI.Loader.shared'); + + return PIXI.Loader.shared; + }, + }, }); /** @@ -351,34 +367,51 @@ }, }); - Object.defineProperties(PIXI.loaders.Loader, { - /** - * @function PIXI.loaders.Loader.addPixiMiddleware - * @see PIXI.loaders.Loader.useMiddleware - * @deprecated since 5.0.0 - */ - addPixiMiddleware: { - get() - { - warn('PIXI.loaders.Loader.addPixiMiddleware has moved to PIXI.loaders.Loader.useMiddleware'); - - return PIXI.loaders.Loader.useMiddleware; - }, - }, - }); + /** + * All classes on this namespace have moved to the high-level `PIXI` object. + * @namespace PIXI.loaders + * @deprecated since 5.0.0 + */ + PIXI.loaders = {}; Object.defineProperties(PIXI.loaders, { /** + * @class PIXI.loaders.Loader + * @see PIXI.Loader + * @deprecated since 5.0.0 + */ + Loader: { + get() + { + warn('PIXI.loaders.Loader has moved to PIXI.Loader'); + + return PIXI.Loader; + }, + }, + /** + * @class PIXI.loaders.Resource + * @see PIXI.LoaderResource + * @deprecated since 5.0.0 + */ + Resource: { + get() + { + warn('PIXI.loaders.Resource has moved to PIXI.LoaderResource'); + + return PIXI.LoaderResource; + }, + }, + /** * @function PIXI.loaders.bitmapFontParser - * @see PIXI.BitmapFontLoader.middleware + * @see PIXI.BitmapFontLoader.use * @deprecated since 5.0.0 */ bitmapFontParser: { get() { - warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.middleware'); + warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.use'); - return PIXI.BitmapFontLoader.middleware; + return PIXI.BitmapFontLoader.use; }, }, /** @@ -396,15 +429,15 @@ }, /** * @function PIXI.loaders.spritesheetParser - * @see PIXI.SpritesheetLoader.middleware + * @see PIXI.SpritesheetLoader.use * @deprecated since 5.0.0 */ spritesheetParser: { get() { - warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.middleware'); + warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.use'); - return PIXI.SpritesheetLoader.middleware; + return PIXI.SpritesheetLoader.use; }, }, /** @@ -423,6 +456,19 @@ }); /** + * @function PIXI.loaders.Loader.addPixiMiddleware + * @see PIXI.Loader.registerPlugin + * @deprecated since 5.0.0 + * @param {function} middleware + */ + PIXI.Loader.addPixiMiddleware = function addPixiMiddleware(middleware) + { + warn('PIXI.loaders.Loader.addPixiMiddleware is deprecated, use PIXI.loaders.Loader.registerPlugin'); + + return PIXI.loaders.Loader.registerPlugin({ use: middleware() }); + }; + + /** * @class PIXI.extract.WebGLExtract * @deprecated since 5.0.0 * @see PIXI.extract.Prepare diff --git a/bundles/pixi.js/test/index.js b/bundles/pixi.js/test/index.js index c7cc855..a29651e 100644 --- a/bundles/pixi.js/test/index.js +++ b/bundles/pixi.js/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/packages/app/src/Application.js b/packages/app/src/Application.js index 50f9fa1..ef40610 100644 --- a/packages/app/src/Application.js +++ b/packages/app/src/Application.js @@ -51,7 +51,7 @@ * @param {string} [options.powerPreference] - Parameter passed to webgl context, set to "high-performance" * for devices with dual graphics card **webgl only** * @param {boolean} [options.sharedTicker=false] - `true` to use PIXI.Ticker.shared, `false` to create new ticker. - * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.loaders.shared, `false` to create new Loader. + * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.Loaders.shared, `false` to create new Loader. */ constructor(options, arg2, arg3, arg4, arg5) { diff --git a/packages/loaders/src/Loader.js b/packages/loaders/src/Loader.js index 6f6e9bd..ecba1b0 100644 --- a/packages/loaders/src/Loader.js +++ b/packages/loaders/src/Loader.js @@ -1,16 +1,16 @@ import ResourceLoader from 'resource-loader'; import EventEmitter from 'eventemitter3'; import { blobMiddlewareFactory } from 'resource-loader/lib/middlewares/parsing/blob'; -import textureParser from './textureParser'; +import TextureLoader from './TextureLoader'; /** * * The new loader, extends Resource Loader by Chad Engler: https://github.com/englercj/resource-loader * * ```js - * const loader = PIXI.loader; // PixiJS exposes a premade instance for you to use. + * const loader = PIXI.Loader.shared; // PixiJS exposes a premade instance for you to use. * //or - * const loader = new PIXI.loaders.Loader(); // you can also create your own if you want + * const loader = new PIXI.Loader(); // you can also create your own if you want * * const sprites = {}; * @@ -52,20 +52,31 @@ * * @class Loader * @extends module:resource-loader.ResourceLoader - * @memberof PIXI.loaders + * @memberof PIXI * @param {string} [baseUrl=''] - The base url for all resources loaded by this loader. * @param {number} [concurrency=10] - The number of resources to load concurrently. */ -export class Loader extends ResourceLoader +export default class Loader extends ResourceLoader { constructor(baseUrl, concurrency) { super(baseUrl, concurrency); EventEmitter.call(this); - for (let i = 0; i < Loader._middleware.length; ++i) + for (let i = 0; i < Loader._plugins.length; ++i) { - this.use(Loader._middleware[i]()); + const plugin = Loader._plugins[i]; + const { pre, use } = plugin; + + if (pre) + { + this.pre(pre.bind(plugin)); + } + + if (use) + { + this.use(use.bind(plugin)); + } } // Compat layer, translate the new v2 signals into old v1 events. @@ -95,50 +106,82 @@ this.reset(); } } + + /** + * A premade instance of the loader that can be used to load resources. + * @name shared + * @type {PIXI.Loader} + * @static + * @memberof PIXI.Loader + */ + static get shared() + { + let shared = Loader._shared; + + if (!shared) + { + shared = new Loader(); + shared._protected = true; + Loader._shared = shared; + } + + return shared; + } } // Copy EE3 prototype (mixin) Object.assign(Loader.prototype, EventEmitter.prototype); /** - * Collection of all installed middleware for Loader. + * Collection of all installed `use` middleware for Loader. * * @static - * @member {Array} - * @memberof PIXI.loaders.Loader + * @member {Array} + * @memberof PIXI.Loader * @private */ -Loader._middleware = []; +Loader._plugins = []; /** - * A premade instance of the loader that can be used to load resources. - * @name shared - * @memberof PIXI.loaders - * @type {PIXI.loaders.Loader} - */ -export const shared = new Loader(); -shared._protected = true; - -/** - * Adds a middleware for the global shared loader and all + * Adds a Loader plugin for the global shared loader and all * new Loader instances created. * * @static - * @method useMiddleware - * @memberof PIXI.loaders.Loader - * @param {Function} fn - The middleware to add. + * @method registerPlugin + * @memberof PIXI.Loader + * @param {PIXI.Loader~LoaderPlugin} plugin - The plugin to add + * @return {PIXI.Loader} Reference to PIXI.Loader for chaining */ -Loader.useMiddleware = function useMiddleware(fn) +Loader.registerPlugin = function registerPlugin(plugin) { - // Install for current shared loader - shared.use(fn); + Loader._plugins.push(plugin); - // Install for all future loaders - Loader._middleware.push(fn); + if (plugin.add) + { + plugin.add(); + } + + return Loader; }; // parse any blob into more usable objects (e.g. Image) -Loader.useMiddleware(blobMiddlewareFactory); +Loader.registerPlugin({ use: blobMiddlewareFactory() }); // parse any Image objects into textures -Loader.useMiddleware(textureParser); +Loader.registerPlugin(TextureLoader); + +/** + * Plugin to be installed for handling specific Loader resources. + * @typedef {object} PIXI.Loader~LoaderPlugin + * @property {function} [plugin.add] - Function to call immediate after registering plugin. + * @property {PIXI.Loader~loaderMiddleware} [plugin.pre] - Middleware function to run before load, the + * arguments for this are `(resource, next)` + * @property {PIXI.Loader~loaderMiddleware} [plugin.use] - Middleware function to run after load, the + * arguments for this are `(resource, next)` + */ + +/** + * @callback PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ diff --git a/packages/loaders/src/TextureLoader.js b/packages/loaders/src/TextureLoader.js new file mode 100644 index 0000000..5094c8e --- /dev/null +++ b/packages/loaders/src/TextureLoader.js @@ -0,0 +1,31 @@ +import { Resource } from 'resource-loader'; +import { Texture } from '@pixi/core'; + +/** + * Loader plugin for handling Texture resources. + * @class + * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin + */ +export default class TextureLoader +{ + /** + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ + static use(resource, next) + { + // create a new texture if the data is an Image object + if (resource.data && resource.type === Resource.TYPE.IMAGE) + { + resource.texture = Texture.fromLoader( + resource.data, + resource.url, + resource.name + ); + } + next(); + } +} diff --git a/packages/loaders/src/index.js b/packages/loaders/src/index.js index 8e816cc..3e877fe 100644 --- a/packages/loaders/src/index.js +++ b/packages/loaders/src/index.js @@ -1,24 +1,11 @@ +import { Resource } from 'resource-loader'; /** * Reference to **{@link https://github.com/englercj/resource-loader * resource-loader}**'s Resource class. * @see http://englercj.github.io/resource-loader/Resource.html - * @class Resource - * @memberof PIXI.loaders + * @class LoaderResource + * @memberof PIXI */ -export { Resource } from 'resource-loader'; - -/** - * This namespace contains APIs which extends the {@link https://github.com/englercj/resource-loader resource-loader} module - * for loading assets, data, and other resources dynamically. - * @example - * const loader = new PIXI.loaders.Loader(); - * loader.add('bunny', 'data/bunny.png') - * .add('spaceship', 'assets/spritesheet.json'); - * loader.load((loader, resources) => { - * // resources.bunny - * // resources.spaceship - * }); - * @namespace PIXI.loaders - */ -export { Loader, shared } from './Loader'; -export { default as textureParser } from './textureParser'; +export const LoaderResource = Resource; +export { default as Loader } from './Loader'; +export { default as TextureLoader } from './TextureLoader'; diff --git a/packages/loaders/src/textureParser.js b/packages/loaders/src/textureParser.js deleted file mode 100644 index 9dba8bd..0000000 --- a/packages/loaders/src/textureParser.js +++ /dev/null @@ -1,19 +0,0 @@ -import { Resource } from 'resource-loader'; -import { Texture } from '@pixi/core'; - -export default function () -{ - return function textureParser(resource, next) - { - // create a new texture if the data is an Image object - if (resource.data && resource.type === Resource.TYPE.IMAGE) - { - resource.texture = Texture.fromLoader( - resource.data, - resource.url, - resource.name - ); - } - next(); - }; -} diff --git a/packages/loaders/test/Loader.js b/packages/loaders/test/Loader.js new file mode 100644 index 0000000..1a62a86 --- /dev/null +++ b/packages/loaders/test/Loader.js @@ -0,0 +1,15 @@ +const { Loader } = require('../'); + +describe('PIXI.Loader', function () +{ + it('should exist', function () + { + expect(Loader).to.be.a('function'); + }); + + it('should have shared loader', function () + { + expect(Loader.shared).to.not.be.undefined; + expect(Loader.shared).to.be.instanceof(Loader); + }); +}); diff --git a/packages/loaders/test/TextureLoader.js b/packages/loaders/test/TextureLoader.js new file mode 100644 index 0000000..db53f7c --- /dev/null +++ b/packages/loaders/test/TextureLoader.js @@ -0,0 +1,52 @@ +const { TextureLoader, LoaderResource } = require('../'); +const { Texture } = require('@pixi/core'); +const { BaseTextureCache, TextureCache } = require('@pixi/utils'); + +describe('PIXI.TextureLoader', function () +{ + it('should exist and return a function', function () + { + expect(TextureLoader).to.not.be.undefined; + expect(TextureLoader.use).to.be.a('function'); + }); + + it('should do nothing if the resource is not an image', function () + { + const spy = sinon.spy(); + const res = {}; + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.undefined; + }); + + it('should create a texture if resource is an image', function () + { + const spy = sinon.spy(); + const res = createMockResource(LoaderResource.TYPE.IMAGE, new Image()); + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.an.instanceof(Texture); + + expect(BaseTextureCache).to.have.property(res.name, res.texture.baseTexture); + expect(BaseTextureCache).to.have.property(res.url, res.texture.baseTexture); + + expect(TextureCache).to.have.property(res.name, res.texture); + expect(TextureCache).to.have.property(res.url, res.texture); + }); +}); + +function createMockResource(type, data) +{ + const name = `${Math.floor(Date.now() * Math.random())}`; + + return { + url: `http://localhost/doesnt_exist/${name}`, + name, + type, + data, + }; +} diff --git a/packages/loaders/test/index.js b/packages/loaders/test/index.js index 72c6554..8913167 100644 --- a/packages/loaders/test/index.js +++ b/packages/loaders/test/index.js @@ -1,2 +1,2 @@ -require('./loader'); -require('./textureParser'); +require('./Loader'); +require('./TextureLoader'); diff --git a/packages/loaders/test/loader.js b/packages/loaders/test/loader.js deleted file mode 100644 index 5b8571b..0000000 --- a/packages/loaders/test/loader.js +++ /dev/null @@ -1,9 +0,0 @@ -const { Loader } = require('../'); - -describe('PIXI.loaders.Loader', function () -{ - it('should exist', function () - { - expect(Loader).to.be.a('function'); - }); -}); diff --git a/packages/loaders/test/textureParser.js b/packages/loaders/test/textureParser.js deleted file mode 100644 index b5b2179..0000000 --- a/packages/loaders/test/textureParser.js +++ /dev/null @@ -1,52 +0,0 @@ -const { textureParser, Resource } = require('../'); -const { Texture } = require('@pixi/core'); -const { BaseTextureCache, TextureCache } = require('@pixi/utils'); - -describe('PIXI.loaders.textureParser', function () -{ - it('should exist and return a function', function () - { - expect(textureParser).to.be.a('function'); - expect(textureParser()).to.be.a('function'); - }); - - it('should do nothing if the resource is not an image', function () - { - const spy = sinon.spy(); - const res = {}; - - textureParser()(res, spy); - - expect(spy).to.have.been.calledOnce; - expect(res.texture).to.be.undefined; - }); - - it('should create a texture if resource is an image', function () - { - const spy = sinon.spy(); - const res = createMockResource(Resource.TYPE.IMAGE, new Image()); - - textureParser()(res, spy); - - expect(spy).to.have.been.calledOnce; - expect(res.texture).to.be.an.instanceof(Texture); - - expect(BaseTextureCache).to.have.property(res.name, res.texture.baseTexture); - expect(BaseTextureCache).to.have.property(res.url, res.texture.baseTexture); - - expect(TextureCache).to.have.property(res.name, res.texture); - expect(TextureCache).to.have.property(res.url, res.texture); - }); -}); - -function createMockResource(type, data) -{ - const name = `${Math.floor(Date.now() * Math.random())}`; - - return { - url: `http://localhost/doesnt_exist/${name}`, - name, - type, - data, - }; -} diff --git a/bundles/pixi.js-legacy/test/index.js b/bundles/pixi.js-legacy/test/index.js index c7cc855..a29651e 100755 --- a/bundles/pixi.js-legacy/test/index.js +++ b/bundles/pixi.js-legacy/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js/src/PIXI.js b/bundles/pixi.js/src/PIXI.js index 75e5658..ae40c7e 100644 --- a/bundles/pixi.js/src/PIXI.js +++ b/bundles/pixi.js/src/PIXI.js @@ -12,6 +12,7 @@ export * from '@pixi/display'; export * from '@pixi/mesh'; export * from '@pixi/ticker'; +export * from '@pixi/loaders'; import { Renderer } from '@pixi/core'; import * as interaction from '@pixi/interaction'; @@ -22,10 +23,12 @@ import { TilingSpriteRenderer } from '@pixi/sprite-tiling'; import { GraphicsRenderer } from '@pixi/graphics'; import * as accessibility from '@pixi/accessibility'; -import * as loaders from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; import * as filters from './filters'; import * as utils from '@pixi/utils'; import { settings } from '@pixi/settings'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager); Renderer.registerPlugin('extract', extract.Extract); @@ -36,6 +39,9 @@ Renderer.registerPlugin('sprite', SpriteRenderer); Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer); +Loader.registerPlugin(SpritesheetLoader); +Loader.registerPlugin(BitmapFontLoader); + import '@pixi/mixin-cache-as-bitmap'; import '@pixi/mixin-get-child-by-name'; import '@pixi/mixin-get-global-position'; @@ -43,20 +49,11 @@ utils.mixins.performMixins(); -/** - * Alias for {@link PIXI.loaders.shared}. - * @name loader - * @memberof PIXI - * @type {PIXI.loader.Loader} - */ -export const loader = loaders.shared; - export { accessibility, extract, filters, interaction, - loaders, prepare, utils, settings, diff --git a/bundles/pixi.js/src/deprecated.js b/bundles/pixi.js/src/deprecated.js index 402176f..e59c66a 100644 --- a/bundles/pixi.js/src/deprecated.js +++ b/bundles/pixi.js/src/deprecated.js @@ -131,6 +131,22 @@ return PIXI.utils.CanvasRenderTarget; }, }, + + /** + * @memberof PIXI + * @name loader + * @type {PIXI.Loader} + * @see PIXI.Loader.shared + * @deprecated since 5.0.0 + */ + loader: { + get() + { + warn('PIXI.loader has moved to PIXI.Loader.shared'); + + return PIXI.Loader.shared; + }, + }, }); /** @@ -351,34 +367,51 @@ }, }); - Object.defineProperties(PIXI.loaders.Loader, { - /** - * @function PIXI.loaders.Loader.addPixiMiddleware - * @see PIXI.loaders.Loader.useMiddleware - * @deprecated since 5.0.0 - */ - addPixiMiddleware: { - get() - { - warn('PIXI.loaders.Loader.addPixiMiddleware has moved to PIXI.loaders.Loader.useMiddleware'); - - return PIXI.loaders.Loader.useMiddleware; - }, - }, - }); + /** + * All classes on this namespace have moved to the high-level `PIXI` object. + * @namespace PIXI.loaders + * @deprecated since 5.0.0 + */ + PIXI.loaders = {}; Object.defineProperties(PIXI.loaders, { /** + * @class PIXI.loaders.Loader + * @see PIXI.Loader + * @deprecated since 5.0.0 + */ + Loader: { + get() + { + warn('PIXI.loaders.Loader has moved to PIXI.Loader'); + + return PIXI.Loader; + }, + }, + /** + * @class PIXI.loaders.Resource + * @see PIXI.LoaderResource + * @deprecated since 5.0.0 + */ + Resource: { + get() + { + warn('PIXI.loaders.Resource has moved to PIXI.LoaderResource'); + + return PIXI.LoaderResource; + }, + }, + /** * @function PIXI.loaders.bitmapFontParser - * @see PIXI.BitmapFontLoader.middleware + * @see PIXI.BitmapFontLoader.use * @deprecated since 5.0.0 */ bitmapFontParser: { get() { - warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.middleware'); + warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.use'); - return PIXI.BitmapFontLoader.middleware; + return PIXI.BitmapFontLoader.use; }, }, /** @@ -396,15 +429,15 @@ }, /** * @function PIXI.loaders.spritesheetParser - * @see PIXI.SpritesheetLoader.middleware + * @see PIXI.SpritesheetLoader.use * @deprecated since 5.0.0 */ spritesheetParser: { get() { - warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.middleware'); + warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.use'); - return PIXI.SpritesheetLoader.middleware; + return PIXI.SpritesheetLoader.use; }, }, /** @@ -423,6 +456,19 @@ }); /** + * @function PIXI.loaders.Loader.addPixiMiddleware + * @see PIXI.Loader.registerPlugin + * @deprecated since 5.0.0 + * @param {function} middleware + */ + PIXI.Loader.addPixiMiddleware = function addPixiMiddleware(middleware) + { + warn('PIXI.loaders.Loader.addPixiMiddleware is deprecated, use PIXI.loaders.Loader.registerPlugin'); + + return PIXI.loaders.Loader.registerPlugin({ use: middleware() }); + }; + + /** * @class PIXI.extract.WebGLExtract * @deprecated since 5.0.0 * @see PIXI.extract.Prepare diff --git a/bundles/pixi.js/test/index.js b/bundles/pixi.js/test/index.js index c7cc855..a29651e 100644 --- a/bundles/pixi.js/test/index.js +++ b/bundles/pixi.js/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/packages/app/src/Application.js b/packages/app/src/Application.js index 50f9fa1..ef40610 100644 --- a/packages/app/src/Application.js +++ b/packages/app/src/Application.js @@ -51,7 +51,7 @@ * @param {string} [options.powerPreference] - Parameter passed to webgl context, set to "high-performance" * for devices with dual graphics card **webgl only** * @param {boolean} [options.sharedTicker=false] - `true` to use PIXI.Ticker.shared, `false` to create new ticker. - * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.loaders.shared, `false` to create new Loader. + * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.Loaders.shared, `false` to create new Loader. */ constructor(options, arg2, arg3, arg4, arg5) { diff --git a/packages/loaders/src/Loader.js b/packages/loaders/src/Loader.js index 6f6e9bd..ecba1b0 100644 --- a/packages/loaders/src/Loader.js +++ b/packages/loaders/src/Loader.js @@ -1,16 +1,16 @@ import ResourceLoader from 'resource-loader'; import EventEmitter from 'eventemitter3'; import { blobMiddlewareFactory } from 'resource-loader/lib/middlewares/parsing/blob'; -import textureParser from './textureParser'; +import TextureLoader from './TextureLoader'; /** * * The new loader, extends Resource Loader by Chad Engler: https://github.com/englercj/resource-loader * * ```js - * const loader = PIXI.loader; // PixiJS exposes a premade instance for you to use. + * const loader = PIXI.Loader.shared; // PixiJS exposes a premade instance for you to use. * //or - * const loader = new PIXI.loaders.Loader(); // you can also create your own if you want + * const loader = new PIXI.Loader(); // you can also create your own if you want * * const sprites = {}; * @@ -52,20 +52,31 @@ * * @class Loader * @extends module:resource-loader.ResourceLoader - * @memberof PIXI.loaders + * @memberof PIXI * @param {string} [baseUrl=''] - The base url for all resources loaded by this loader. * @param {number} [concurrency=10] - The number of resources to load concurrently. */ -export class Loader extends ResourceLoader +export default class Loader extends ResourceLoader { constructor(baseUrl, concurrency) { super(baseUrl, concurrency); EventEmitter.call(this); - for (let i = 0; i < Loader._middleware.length; ++i) + for (let i = 0; i < Loader._plugins.length; ++i) { - this.use(Loader._middleware[i]()); + const plugin = Loader._plugins[i]; + const { pre, use } = plugin; + + if (pre) + { + this.pre(pre.bind(plugin)); + } + + if (use) + { + this.use(use.bind(plugin)); + } } // Compat layer, translate the new v2 signals into old v1 events. @@ -95,50 +106,82 @@ this.reset(); } } + + /** + * A premade instance of the loader that can be used to load resources. + * @name shared + * @type {PIXI.Loader} + * @static + * @memberof PIXI.Loader + */ + static get shared() + { + let shared = Loader._shared; + + if (!shared) + { + shared = new Loader(); + shared._protected = true; + Loader._shared = shared; + } + + return shared; + } } // Copy EE3 prototype (mixin) Object.assign(Loader.prototype, EventEmitter.prototype); /** - * Collection of all installed middleware for Loader. + * Collection of all installed `use` middleware for Loader. * * @static - * @member {Array} - * @memberof PIXI.loaders.Loader + * @member {Array} + * @memberof PIXI.Loader * @private */ -Loader._middleware = []; +Loader._plugins = []; /** - * A premade instance of the loader that can be used to load resources. - * @name shared - * @memberof PIXI.loaders - * @type {PIXI.loaders.Loader} - */ -export const shared = new Loader(); -shared._protected = true; - -/** - * Adds a middleware for the global shared loader and all + * Adds a Loader plugin for the global shared loader and all * new Loader instances created. * * @static - * @method useMiddleware - * @memberof PIXI.loaders.Loader - * @param {Function} fn - The middleware to add. + * @method registerPlugin + * @memberof PIXI.Loader + * @param {PIXI.Loader~LoaderPlugin} plugin - The plugin to add + * @return {PIXI.Loader} Reference to PIXI.Loader for chaining */ -Loader.useMiddleware = function useMiddleware(fn) +Loader.registerPlugin = function registerPlugin(plugin) { - // Install for current shared loader - shared.use(fn); + Loader._plugins.push(plugin); - // Install for all future loaders - Loader._middleware.push(fn); + if (plugin.add) + { + plugin.add(); + } + + return Loader; }; // parse any blob into more usable objects (e.g. Image) -Loader.useMiddleware(blobMiddlewareFactory); +Loader.registerPlugin({ use: blobMiddlewareFactory() }); // parse any Image objects into textures -Loader.useMiddleware(textureParser); +Loader.registerPlugin(TextureLoader); + +/** + * Plugin to be installed for handling specific Loader resources. + * @typedef {object} PIXI.Loader~LoaderPlugin + * @property {function} [plugin.add] - Function to call immediate after registering plugin. + * @property {PIXI.Loader~loaderMiddleware} [plugin.pre] - Middleware function to run before load, the + * arguments for this are `(resource, next)` + * @property {PIXI.Loader~loaderMiddleware} [plugin.use] - Middleware function to run after load, the + * arguments for this are `(resource, next)` + */ + +/** + * @callback PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ diff --git a/packages/loaders/src/TextureLoader.js b/packages/loaders/src/TextureLoader.js new file mode 100644 index 0000000..5094c8e --- /dev/null +++ b/packages/loaders/src/TextureLoader.js @@ -0,0 +1,31 @@ +import { Resource } from 'resource-loader'; +import { Texture } from '@pixi/core'; + +/** + * Loader plugin for handling Texture resources. + * @class + * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin + */ +export default class TextureLoader +{ + /** + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ + static use(resource, next) + { + // create a new texture if the data is an Image object + if (resource.data && resource.type === Resource.TYPE.IMAGE) + { + resource.texture = Texture.fromLoader( + resource.data, + resource.url, + resource.name + ); + } + next(); + } +} diff --git a/packages/loaders/src/index.js b/packages/loaders/src/index.js index 8e816cc..3e877fe 100644 --- a/packages/loaders/src/index.js +++ b/packages/loaders/src/index.js @@ -1,24 +1,11 @@ +import { Resource } from 'resource-loader'; /** * Reference to **{@link https://github.com/englercj/resource-loader * resource-loader}**'s Resource class. * @see http://englercj.github.io/resource-loader/Resource.html - * @class Resource - * @memberof PIXI.loaders + * @class LoaderResource + * @memberof PIXI */ -export { Resource } from 'resource-loader'; - -/** - * This namespace contains APIs which extends the {@link https://github.com/englercj/resource-loader resource-loader} module - * for loading assets, data, and other resources dynamically. - * @example - * const loader = new PIXI.loaders.Loader(); - * loader.add('bunny', 'data/bunny.png') - * .add('spaceship', 'assets/spritesheet.json'); - * loader.load((loader, resources) => { - * // resources.bunny - * // resources.spaceship - * }); - * @namespace PIXI.loaders - */ -export { Loader, shared } from './Loader'; -export { default as textureParser } from './textureParser'; +export const LoaderResource = Resource; +export { default as Loader } from './Loader'; +export { default as TextureLoader } from './TextureLoader'; diff --git a/packages/loaders/src/textureParser.js b/packages/loaders/src/textureParser.js deleted file mode 100644 index 9dba8bd..0000000 --- a/packages/loaders/src/textureParser.js +++ /dev/null @@ -1,19 +0,0 @@ -import { Resource } from 'resource-loader'; -import { Texture } from '@pixi/core'; - -export default function () -{ - return function textureParser(resource, next) - { - // create a new texture if the data is an Image object - if (resource.data && resource.type === Resource.TYPE.IMAGE) - { - resource.texture = Texture.fromLoader( - resource.data, - resource.url, - resource.name - ); - } - next(); - }; -} diff --git a/packages/loaders/test/Loader.js b/packages/loaders/test/Loader.js new file mode 100644 index 0000000..1a62a86 --- /dev/null +++ b/packages/loaders/test/Loader.js @@ -0,0 +1,15 @@ +const { Loader } = require('../'); + +describe('PIXI.Loader', function () +{ + it('should exist', function () + { + expect(Loader).to.be.a('function'); + }); + + it('should have shared loader', function () + { + expect(Loader.shared).to.not.be.undefined; + expect(Loader.shared).to.be.instanceof(Loader); + }); +}); diff --git a/packages/loaders/test/TextureLoader.js b/packages/loaders/test/TextureLoader.js new file mode 100644 index 0000000..db53f7c --- /dev/null +++ b/packages/loaders/test/TextureLoader.js @@ -0,0 +1,52 @@ +const { TextureLoader, LoaderResource } = require('../'); +const { Texture } = require('@pixi/core'); +const { BaseTextureCache, TextureCache } = require('@pixi/utils'); + +describe('PIXI.TextureLoader', function () +{ + it('should exist and return a function', function () + { + expect(TextureLoader).to.not.be.undefined; + expect(TextureLoader.use).to.be.a('function'); + }); + + it('should do nothing if the resource is not an image', function () + { + const spy = sinon.spy(); + const res = {}; + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.undefined; + }); + + it('should create a texture if resource is an image', function () + { + const spy = sinon.spy(); + const res = createMockResource(LoaderResource.TYPE.IMAGE, new Image()); + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.an.instanceof(Texture); + + expect(BaseTextureCache).to.have.property(res.name, res.texture.baseTexture); + expect(BaseTextureCache).to.have.property(res.url, res.texture.baseTexture); + + expect(TextureCache).to.have.property(res.name, res.texture); + expect(TextureCache).to.have.property(res.url, res.texture); + }); +}); + +function createMockResource(type, data) +{ + const name = `${Math.floor(Date.now() * Math.random())}`; + + return { + url: `http://localhost/doesnt_exist/${name}`, + name, + type, + data, + }; +} diff --git a/packages/loaders/test/index.js b/packages/loaders/test/index.js index 72c6554..8913167 100644 --- a/packages/loaders/test/index.js +++ b/packages/loaders/test/index.js @@ -1,2 +1,2 @@ -require('./loader'); -require('./textureParser'); +require('./Loader'); +require('./TextureLoader'); diff --git a/packages/loaders/test/loader.js b/packages/loaders/test/loader.js deleted file mode 100644 index 5b8571b..0000000 --- a/packages/loaders/test/loader.js +++ /dev/null @@ -1,9 +0,0 @@ -const { Loader } = require('../'); - -describe('PIXI.loaders.Loader', function () -{ - it('should exist', function () - { - expect(Loader).to.be.a('function'); - }); -}); diff --git a/packages/loaders/test/textureParser.js b/packages/loaders/test/textureParser.js deleted file mode 100644 index b5b2179..0000000 --- a/packages/loaders/test/textureParser.js +++ /dev/null @@ -1,52 +0,0 @@ -const { textureParser, Resource } = require('../'); -const { Texture } = require('@pixi/core'); -const { BaseTextureCache, TextureCache } = require('@pixi/utils'); - -describe('PIXI.loaders.textureParser', function () -{ - it('should exist and return a function', function () - { - expect(textureParser).to.be.a('function'); - expect(textureParser()).to.be.a('function'); - }); - - it('should do nothing if the resource is not an image', function () - { - const spy = sinon.spy(); - const res = {}; - - textureParser()(res, spy); - - expect(spy).to.have.been.calledOnce; - expect(res.texture).to.be.undefined; - }); - - it('should create a texture if resource is an image', function () - { - const spy = sinon.spy(); - const res = createMockResource(Resource.TYPE.IMAGE, new Image()); - - textureParser()(res, spy); - - expect(spy).to.have.been.calledOnce; - expect(res.texture).to.be.an.instanceof(Texture); - - expect(BaseTextureCache).to.have.property(res.name, res.texture.baseTexture); - expect(BaseTextureCache).to.have.property(res.url, res.texture.baseTexture); - - expect(TextureCache).to.have.property(res.name, res.texture); - expect(TextureCache).to.have.property(res.url, res.texture); - }); -}); - -function createMockResource(type, data) -{ - const name = `${Math.floor(Date.now() * Math.random())}`; - - return { - url: `http://localhost/doesnt_exist/${name}`, - name, - type, - data, - }; -} diff --git a/packages/mixin-app-loader/src/index.js b/packages/mixin-app-loader/src/index.js index 354997a..ab28882 100644 --- a/packages/mixin-app-loader/src/index.js +++ b/packages/mixin-app-loader/src/index.js @@ -1,12 +1,12 @@ import { Application } from '@pixi/app'; -import { Loader, shared } from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; Application.prototype._loader = null; /** * Loader instance to help with asset loading. * @name PIXI.Application#loader - * @type {PIXI.loaders.Loader} + * @type {PIXI.Loader} */ Object.defineProperties(Application.prototype, { loader: { @@ -16,7 +16,7 @@ { const { sharedLoader } = this._options; - this._loader = sharedLoader ? shared : new Loader(); + this._loader = sharedLoader ? Loader.shared : new Loader(); } return this._loader; diff --git a/bundles/pixi.js-legacy/test/index.js b/bundles/pixi.js-legacy/test/index.js index c7cc855..a29651e 100755 --- a/bundles/pixi.js-legacy/test/index.js +++ b/bundles/pixi.js-legacy/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js/src/PIXI.js b/bundles/pixi.js/src/PIXI.js index 75e5658..ae40c7e 100644 --- a/bundles/pixi.js/src/PIXI.js +++ b/bundles/pixi.js/src/PIXI.js @@ -12,6 +12,7 @@ export * from '@pixi/display'; export * from '@pixi/mesh'; export * from '@pixi/ticker'; +export * from '@pixi/loaders'; import { Renderer } from '@pixi/core'; import * as interaction from '@pixi/interaction'; @@ -22,10 +23,12 @@ import { TilingSpriteRenderer } from '@pixi/sprite-tiling'; import { GraphicsRenderer } from '@pixi/graphics'; import * as accessibility from '@pixi/accessibility'; -import * as loaders from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; import * as filters from './filters'; import * as utils from '@pixi/utils'; import { settings } from '@pixi/settings'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager); Renderer.registerPlugin('extract', extract.Extract); @@ -36,6 +39,9 @@ Renderer.registerPlugin('sprite', SpriteRenderer); Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer); +Loader.registerPlugin(SpritesheetLoader); +Loader.registerPlugin(BitmapFontLoader); + import '@pixi/mixin-cache-as-bitmap'; import '@pixi/mixin-get-child-by-name'; import '@pixi/mixin-get-global-position'; @@ -43,20 +49,11 @@ utils.mixins.performMixins(); -/** - * Alias for {@link PIXI.loaders.shared}. - * @name loader - * @memberof PIXI - * @type {PIXI.loader.Loader} - */ -export const loader = loaders.shared; - export { accessibility, extract, filters, interaction, - loaders, prepare, utils, settings, diff --git a/bundles/pixi.js/src/deprecated.js b/bundles/pixi.js/src/deprecated.js index 402176f..e59c66a 100644 --- a/bundles/pixi.js/src/deprecated.js +++ b/bundles/pixi.js/src/deprecated.js @@ -131,6 +131,22 @@ return PIXI.utils.CanvasRenderTarget; }, }, + + /** + * @memberof PIXI + * @name loader + * @type {PIXI.Loader} + * @see PIXI.Loader.shared + * @deprecated since 5.0.0 + */ + loader: { + get() + { + warn('PIXI.loader has moved to PIXI.Loader.shared'); + + return PIXI.Loader.shared; + }, + }, }); /** @@ -351,34 +367,51 @@ }, }); - Object.defineProperties(PIXI.loaders.Loader, { - /** - * @function PIXI.loaders.Loader.addPixiMiddleware - * @see PIXI.loaders.Loader.useMiddleware - * @deprecated since 5.0.0 - */ - addPixiMiddleware: { - get() - { - warn('PIXI.loaders.Loader.addPixiMiddleware has moved to PIXI.loaders.Loader.useMiddleware'); - - return PIXI.loaders.Loader.useMiddleware; - }, - }, - }); + /** + * All classes on this namespace have moved to the high-level `PIXI` object. + * @namespace PIXI.loaders + * @deprecated since 5.0.0 + */ + PIXI.loaders = {}; Object.defineProperties(PIXI.loaders, { /** + * @class PIXI.loaders.Loader + * @see PIXI.Loader + * @deprecated since 5.0.0 + */ + Loader: { + get() + { + warn('PIXI.loaders.Loader has moved to PIXI.Loader'); + + return PIXI.Loader; + }, + }, + /** + * @class PIXI.loaders.Resource + * @see PIXI.LoaderResource + * @deprecated since 5.0.0 + */ + Resource: { + get() + { + warn('PIXI.loaders.Resource has moved to PIXI.LoaderResource'); + + return PIXI.LoaderResource; + }, + }, + /** * @function PIXI.loaders.bitmapFontParser - * @see PIXI.BitmapFontLoader.middleware + * @see PIXI.BitmapFontLoader.use * @deprecated since 5.0.0 */ bitmapFontParser: { get() { - warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.middleware'); + warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.use'); - return PIXI.BitmapFontLoader.middleware; + return PIXI.BitmapFontLoader.use; }, }, /** @@ -396,15 +429,15 @@ }, /** * @function PIXI.loaders.spritesheetParser - * @see PIXI.SpritesheetLoader.middleware + * @see PIXI.SpritesheetLoader.use * @deprecated since 5.0.0 */ spritesheetParser: { get() { - warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.middleware'); + warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.use'); - return PIXI.SpritesheetLoader.middleware; + return PIXI.SpritesheetLoader.use; }, }, /** @@ -423,6 +456,19 @@ }); /** + * @function PIXI.loaders.Loader.addPixiMiddleware + * @see PIXI.Loader.registerPlugin + * @deprecated since 5.0.0 + * @param {function} middleware + */ + PIXI.Loader.addPixiMiddleware = function addPixiMiddleware(middleware) + { + warn('PIXI.loaders.Loader.addPixiMiddleware is deprecated, use PIXI.loaders.Loader.registerPlugin'); + + return PIXI.loaders.Loader.registerPlugin({ use: middleware() }); + }; + + /** * @class PIXI.extract.WebGLExtract * @deprecated since 5.0.0 * @see PIXI.extract.Prepare diff --git a/bundles/pixi.js/test/index.js b/bundles/pixi.js/test/index.js index c7cc855..a29651e 100644 --- a/bundles/pixi.js/test/index.js +++ b/bundles/pixi.js/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/packages/app/src/Application.js b/packages/app/src/Application.js index 50f9fa1..ef40610 100644 --- a/packages/app/src/Application.js +++ b/packages/app/src/Application.js @@ -51,7 +51,7 @@ * @param {string} [options.powerPreference] - Parameter passed to webgl context, set to "high-performance" * for devices with dual graphics card **webgl only** * @param {boolean} [options.sharedTicker=false] - `true` to use PIXI.Ticker.shared, `false` to create new ticker. - * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.loaders.shared, `false` to create new Loader. + * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.Loaders.shared, `false` to create new Loader. */ constructor(options, arg2, arg3, arg4, arg5) { diff --git a/packages/loaders/src/Loader.js b/packages/loaders/src/Loader.js index 6f6e9bd..ecba1b0 100644 --- a/packages/loaders/src/Loader.js +++ b/packages/loaders/src/Loader.js @@ -1,16 +1,16 @@ import ResourceLoader from 'resource-loader'; import EventEmitter from 'eventemitter3'; import { blobMiddlewareFactory } from 'resource-loader/lib/middlewares/parsing/blob'; -import textureParser from './textureParser'; +import TextureLoader from './TextureLoader'; /** * * The new loader, extends Resource Loader by Chad Engler: https://github.com/englercj/resource-loader * * ```js - * const loader = PIXI.loader; // PixiJS exposes a premade instance for you to use. + * const loader = PIXI.Loader.shared; // PixiJS exposes a premade instance for you to use. * //or - * const loader = new PIXI.loaders.Loader(); // you can also create your own if you want + * const loader = new PIXI.Loader(); // you can also create your own if you want * * const sprites = {}; * @@ -52,20 +52,31 @@ * * @class Loader * @extends module:resource-loader.ResourceLoader - * @memberof PIXI.loaders + * @memberof PIXI * @param {string} [baseUrl=''] - The base url for all resources loaded by this loader. * @param {number} [concurrency=10] - The number of resources to load concurrently. */ -export class Loader extends ResourceLoader +export default class Loader extends ResourceLoader { constructor(baseUrl, concurrency) { super(baseUrl, concurrency); EventEmitter.call(this); - for (let i = 0; i < Loader._middleware.length; ++i) + for (let i = 0; i < Loader._plugins.length; ++i) { - this.use(Loader._middleware[i]()); + const plugin = Loader._plugins[i]; + const { pre, use } = plugin; + + if (pre) + { + this.pre(pre.bind(plugin)); + } + + if (use) + { + this.use(use.bind(plugin)); + } } // Compat layer, translate the new v2 signals into old v1 events. @@ -95,50 +106,82 @@ this.reset(); } } + + /** + * A premade instance of the loader that can be used to load resources. + * @name shared + * @type {PIXI.Loader} + * @static + * @memberof PIXI.Loader + */ + static get shared() + { + let shared = Loader._shared; + + if (!shared) + { + shared = new Loader(); + shared._protected = true; + Loader._shared = shared; + } + + return shared; + } } // Copy EE3 prototype (mixin) Object.assign(Loader.prototype, EventEmitter.prototype); /** - * Collection of all installed middleware for Loader. + * Collection of all installed `use` middleware for Loader. * * @static - * @member {Array} - * @memberof PIXI.loaders.Loader + * @member {Array} + * @memberof PIXI.Loader * @private */ -Loader._middleware = []; +Loader._plugins = []; /** - * A premade instance of the loader that can be used to load resources. - * @name shared - * @memberof PIXI.loaders - * @type {PIXI.loaders.Loader} - */ -export const shared = new Loader(); -shared._protected = true; - -/** - * Adds a middleware for the global shared loader and all + * Adds a Loader plugin for the global shared loader and all * new Loader instances created. * * @static - * @method useMiddleware - * @memberof PIXI.loaders.Loader - * @param {Function} fn - The middleware to add. + * @method registerPlugin + * @memberof PIXI.Loader + * @param {PIXI.Loader~LoaderPlugin} plugin - The plugin to add + * @return {PIXI.Loader} Reference to PIXI.Loader for chaining */ -Loader.useMiddleware = function useMiddleware(fn) +Loader.registerPlugin = function registerPlugin(plugin) { - // Install for current shared loader - shared.use(fn); + Loader._plugins.push(plugin); - // Install for all future loaders - Loader._middleware.push(fn); + if (plugin.add) + { + plugin.add(); + } + + return Loader; }; // parse any blob into more usable objects (e.g. Image) -Loader.useMiddleware(blobMiddlewareFactory); +Loader.registerPlugin({ use: blobMiddlewareFactory() }); // parse any Image objects into textures -Loader.useMiddleware(textureParser); +Loader.registerPlugin(TextureLoader); + +/** + * Plugin to be installed for handling specific Loader resources. + * @typedef {object} PIXI.Loader~LoaderPlugin + * @property {function} [plugin.add] - Function to call immediate after registering plugin. + * @property {PIXI.Loader~loaderMiddleware} [plugin.pre] - Middleware function to run before load, the + * arguments for this are `(resource, next)` + * @property {PIXI.Loader~loaderMiddleware} [plugin.use] - Middleware function to run after load, the + * arguments for this are `(resource, next)` + */ + +/** + * @callback PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ diff --git a/packages/loaders/src/TextureLoader.js b/packages/loaders/src/TextureLoader.js new file mode 100644 index 0000000..5094c8e --- /dev/null +++ b/packages/loaders/src/TextureLoader.js @@ -0,0 +1,31 @@ +import { Resource } from 'resource-loader'; +import { Texture } from '@pixi/core'; + +/** + * Loader plugin for handling Texture resources. + * @class + * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin + */ +export default class TextureLoader +{ + /** + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ + static use(resource, next) + { + // create a new texture if the data is an Image object + if (resource.data && resource.type === Resource.TYPE.IMAGE) + { + resource.texture = Texture.fromLoader( + resource.data, + resource.url, + resource.name + ); + } + next(); + } +} diff --git a/packages/loaders/src/index.js b/packages/loaders/src/index.js index 8e816cc..3e877fe 100644 --- a/packages/loaders/src/index.js +++ b/packages/loaders/src/index.js @@ -1,24 +1,11 @@ +import { Resource } from 'resource-loader'; /** * Reference to **{@link https://github.com/englercj/resource-loader * resource-loader}**'s Resource class. * @see http://englercj.github.io/resource-loader/Resource.html - * @class Resource - * @memberof PIXI.loaders + * @class LoaderResource + * @memberof PIXI */ -export { Resource } from 'resource-loader'; - -/** - * This namespace contains APIs which extends the {@link https://github.com/englercj/resource-loader resource-loader} module - * for loading assets, data, and other resources dynamically. - * @example - * const loader = new PIXI.loaders.Loader(); - * loader.add('bunny', 'data/bunny.png') - * .add('spaceship', 'assets/spritesheet.json'); - * loader.load((loader, resources) => { - * // resources.bunny - * // resources.spaceship - * }); - * @namespace PIXI.loaders - */ -export { Loader, shared } from './Loader'; -export { default as textureParser } from './textureParser'; +export const LoaderResource = Resource; +export { default as Loader } from './Loader'; +export { default as TextureLoader } from './TextureLoader'; diff --git a/packages/loaders/src/textureParser.js b/packages/loaders/src/textureParser.js deleted file mode 100644 index 9dba8bd..0000000 --- a/packages/loaders/src/textureParser.js +++ /dev/null @@ -1,19 +0,0 @@ -import { Resource } from 'resource-loader'; -import { Texture } from '@pixi/core'; - -export default function () -{ - return function textureParser(resource, next) - { - // create a new texture if the data is an Image object - if (resource.data && resource.type === Resource.TYPE.IMAGE) - { - resource.texture = Texture.fromLoader( - resource.data, - resource.url, - resource.name - ); - } - next(); - }; -} diff --git a/packages/loaders/test/Loader.js b/packages/loaders/test/Loader.js new file mode 100644 index 0000000..1a62a86 --- /dev/null +++ b/packages/loaders/test/Loader.js @@ -0,0 +1,15 @@ +const { Loader } = require('../'); + +describe('PIXI.Loader', function () +{ + it('should exist', function () + { + expect(Loader).to.be.a('function'); + }); + + it('should have shared loader', function () + { + expect(Loader.shared).to.not.be.undefined; + expect(Loader.shared).to.be.instanceof(Loader); + }); +}); diff --git a/packages/loaders/test/TextureLoader.js b/packages/loaders/test/TextureLoader.js new file mode 100644 index 0000000..db53f7c --- /dev/null +++ b/packages/loaders/test/TextureLoader.js @@ -0,0 +1,52 @@ +const { TextureLoader, LoaderResource } = require('../'); +const { Texture } = require('@pixi/core'); +const { BaseTextureCache, TextureCache } = require('@pixi/utils'); + +describe('PIXI.TextureLoader', function () +{ + it('should exist and return a function', function () + { + expect(TextureLoader).to.not.be.undefined; + expect(TextureLoader.use).to.be.a('function'); + }); + + it('should do nothing if the resource is not an image', function () + { + const spy = sinon.spy(); + const res = {}; + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.undefined; + }); + + it('should create a texture if resource is an image', function () + { + const spy = sinon.spy(); + const res = createMockResource(LoaderResource.TYPE.IMAGE, new Image()); + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.an.instanceof(Texture); + + expect(BaseTextureCache).to.have.property(res.name, res.texture.baseTexture); + expect(BaseTextureCache).to.have.property(res.url, res.texture.baseTexture); + + expect(TextureCache).to.have.property(res.name, res.texture); + expect(TextureCache).to.have.property(res.url, res.texture); + }); +}); + +function createMockResource(type, data) +{ + const name = `${Math.floor(Date.now() * Math.random())}`; + + return { + url: `http://localhost/doesnt_exist/${name}`, + name, + type, + data, + }; +} diff --git a/packages/loaders/test/index.js b/packages/loaders/test/index.js index 72c6554..8913167 100644 --- a/packages/loaders/test/index.js +++ b/packages/loaders/test/index.js @@ -1,2 +1,2 @@ -require('./loader'); -require('./textureParser'); +require('./Loader'); +require('./TextureLoader'); diff --git a/packages/loaders/test/loader.js b/packages/loaders/test/loader.js deleted file mode 100644 index 5b8571b..0000000 --- a/packages/loaders/test/loader.js +++ /dev/null @@ -1,9 +0,0 @@ -const { Loader } = require('../'); - -describe('PIXI.loaders.Loader', function () -{ - it('should exist', function () - { - expect(Loader).to.be.a('function'); - }); -}); diff --git a/packages/loaders/test/textureParser.js b/packages/loaders/test/textureParser.js deleted file mode 100644 index b5b2179..0000000 --- a/packages/loaders/test/textureParser.js +++ /dev/null @@ -1,52 +0,0 @@ -const { textureParser, Resource } = require('../'); -const { Texture } = require('@pixi/core'); -const { BaseTextureCache, TextureCache } = require('@pixi/utils'); - -describe('PIXI.loaders.textureParser', function () -{ - it('should exist and return a function', function () - { - expect(textureParser).to.be.a('function'); - expect(textureParser()).to.be.a('function'); - }); - - it('should do nothing if the resource is not an image', function () - { - const spy = sinon.spy(); - const res = {}; - - textureParser()(res, spy); - - expect(spy).to.have.been.calledOnce; - expect(res.texture).to.be.undefined; - }); - - it('should create a texture if resource is an image', function () - { - const spy = sinon.spy(); - const res = createMockResource(Resource.TYPE.IMAGE, new Image()); - - textureParser()(res, spy); - - expect(spy).to.have.been.calledOnce; - expect(res.texture).to.be.an.instanceof(Texture); - - expect(BaseTextureCache).to.have.property(res.name, res.texture.baseTexture); - expect(BaseTextureCache).to.have.property(res.url, res.texture.baseTexture); - - expect(TextureCache).to.have.property(res.name, res.texture); - expect(TextureCache).to.have.property(res.url, res.texture); - }); -}); - -function createMockResource(type, data) -{ - const name = `${Math.floor(Date.now() * Math.random())}`; - - return { - url: `http://localhost/doesnt_exist/${name}`, - name, - type, - data, - }; -} diff --git a/packages/mixin-app-loader/src/index.js b/packages/mixin-app-loader/src/index.js index 354997a..ab28882 100644 --- a/packages/mixin-app-loader/src/index.js +++ b/packages/mixin-app-loader/src/index.js @@ -1,12 +1,12 @@ import { Application } from '@pixi/app'; -import { Loader, shared } from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; Application.prototype._loader = null; /** * Loader instance to help with asset loading. * @name PIXI.Application#loader - * @type {PIXI.loaders.Loader} + * @type {PIXI.Loader} */ Object.defineProperties(Application.prototype, { loader: { @@ -16,7 +16,7 @@ { const { sharedLoader } = this._options; - this._loader = sharedLoader ? shared : new Loader(); + this._loader = sharedLoader ? Loader.shared : new Loader(); } return this._loader; diff --git a/packages/mixin-app-loader/test/index.js b/packages/mixin-app-loader/test/index.js index 4739863..7eb948b 100644 --- a/packages/mixin-app-loader/test/index.js +++ b/packages/mixin-app-loader/test/index.js @@ -1,5 +1,5 @@ const { Application } = require('@pixi/app'); -const { Loader, shared } = require('@pixi/loaders'); +const { Loader } = require('@pixi/loaders'); const { skipHello } = require('@pixi/utils'); const { autoDetectRenderer } = require('@pixi/canvas-renderer'); @@ -30,7 +30,7 @@ expect(obj.loader).to.be.not.undefined; expect(obj.loader).to.be.instanceof(Loader); - expect(obj.loader).to.equal(shared); + expect(obj.loader).to.equal(Loader.shared); obj.destroy(); diff --git a/bundles/pixi.js-legacy/test/index.js b/bundles/pixi.js-legacy/test/index.js index c7cc855..a29651e 100755 --- a/bundles/pixi.js-legacy/test/index.js +++ b/bundles/pixi.js-legacy/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js/src/PIXI.js b/bundles/pixi.js/src/PIXI.js index 75e5658..ae40c7e 100644 --- a/bundles/pixi.js/src/PIXI.js +++ b/bundles/pixi.js/src/PIXI.js @@ -12,6 +12,7 @@ export * from '@pixi/display'; export * from '@pixi/mesh'; export * from '@pixi/ticker'; +export * from '@pixi/loaders'; import { Renderer } from '@pixi/core'; import * as interaction from '@pixi/interaction'; @@ -22,10 +23,12 @@ import { TilingSpriteRenderer } from '@pixi/sprite-tiling'; import { GraphicsRenderer } from '@pixi/graphics'; import * as accessibility from '@pixi/accessibility'; -import * as loaders from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; import * as filters from './filters'; import * as utils from '@pixi/utils'; import { settings } from '@pixi/settings'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager); Renderer.registerPlugin('extract', extract.Extract); @@ -36,6 +39,9 @@ Renderer.registerPlugin('sprite', SpriteRenderer); Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer); +Loader.registerPlugin(SpritesheetLoader); +Loader.registerPlugin(BitmapFontLoader); + import '@pixi/mixin-cache-as-bitmap'; import '@pixi/mixin-get-child-by-name'; import '@pixi/mixin-get-global-position'; @@ -43,20 +49,11 @@ utils.mixins.performMixins(); -/** - * Alias for {@link PIXI.loaders.shared}. - * @name loader - * @memberof PIXI - * @type {PIXI.loader.Loader} - */ -export const loader = loaders.shared; - export { accessibility, extract, filters, interaction, - loaders, prepare, utils, settings, diff --git a/bundles/pixi.js/src/deprecated.js b/bundles/pixi.js/src/deprecated.js index 402176f..e59c66a 100644 --- a/bundles/pixi.js/src/deprecated.js +++ b/bundles/pixi.js/src/deprecated.js @@ -131,6 +131,22 @@ return PIXI.utils.CanvasRenderTarget; }, }, + + /** + * @memberof PIXI + * @name loader + * @type {PIXI.Loader} + * @see PIXI.Loader.shared + * @deprecated since 5.0.0 + */ + loader: { + get() + { + warn('PIXI.loader has moved to PIXI.Loader.shared'); + + return PIXI.Loader.shared; + }, + }, }); /** @@ -351,34 +367,51 @@ }, }); - Object.defineProperties(PIXI.loaders.Loader, { - /** - * @function PIXI.loaders.Loader.addPixiMiddleware - * @see PIXI.loaders.Loader.useMiddleware - * @deprecated since 5.0.0 - */ - addPixiMiddleware: { - get() - { - warn('PIXI.loaders.Loader.addPixiMiddleware has moved to PIXI.loaders.Loader.useMiddleware'); - - return PIXI.loaders.Loader.useMiddleware; - }, - }, - }); + /** + * All classes on this namespace have moved to the high-level `PIXI` object. + * @namespace PIXI.loaders + * @deprecated since 5.0.0 + */ + PIXI.loaders = {}; Object.defineProperties(PIXI.loaders, { /** + * @class PIXI.loaders.Loader + * @see PIXI.Loader + * @deprecated since 5.0.0 + */ + Loader: { + get() + { + warn('PIXI.loaders.Loader has moved to PIXI.Loader'); + + return PIXI.Loader; + }, + }, + /** + * @class PIXI.loaders.Resource + * @see PIXI.LoaderResource + * @deprecated since 5.0.0 + */ + Resource: { + get() + { + warn('PIXI.loaders.Resource has moved to PIXI.LoaderResource'); + + return PIXI.LoaderResource; + }, + }, + /** * @function PIXI.loaders.bitmapFontParser - * @see PIXI.BitmapFontLoader.middleware + * @see PIXI.BitmapFontLoader.use * @deprecated since 5.0.0 */ bitmapFontParser: { get() { - warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.middleware'); + warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.use'); - return PIXI.BitmapFontLoader.middleware; + return PIXI.BitmapFontLoader.use; }, }, /** @@ -396,15 +429,15 @@ }, /** * @function PIXI.loaders.spritesheetParser - * @see PIXI.SpritesheetLoader.middleware + * @see PIXI.SpritesheetLoader.use * @deprecated since 5.0.0 */ spritesheetParser: { get() { - warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.middleware'); + warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.use'); - return PIXI.SpritesheetLoader.middleware; + return PIXI.SpritesheetLoader.use; }, }, /** @@ -423,6 +456,19 @@ }); /** + * @function PIXI.loaders.Loader.addPixiMiddleware + * @see PIXI.Loader.registerPlugin + * @deprecated since 5.0.0 + * @param {function} middleware + */ + PIXI.Loader.addPixiMiddleware = function addPixiMiddleware(middleware) + { + warn('PIXI.loaders.Loader.addPixiMiddleware is deprecated, use PIXI.loaders.Loader.registerPlugin'); + + return PIXI.loaders.Loader.registerPlugin({ use: middleware() }); + }; + + /** * @class PIXI.extract.WebGLExtract * @deprecated since 5.0.0 * @see PIXI.extract.Prepare diff --git a/bundles/pixi.js/test/index.js b/bundles/pixi.js/test/index.js index c7cc855..a29651e 100644 --- a/bundles/pixi.js/test/index.js +++ b/bundles/pixi.js/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/packages/app/src/Application.js b/packages/app/src/Application.js index 50f9fa1..ef40610 100644 --- a/packages/app/src/Application.js +++ b/packages/app/src/Application.js @@ -51,7 +51,7 @@ * @param {string} [options.powerPreference] - Parameter passed to webgl context, set to "high-performance" * for devices with dual graphics card **webgl only** * @param {boolean} [options.sharedTicker=false] - `true` to use PIXI.Ticker.shared, `false` to create new ticker. - * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.loaders.shared, `false` to create new Loader. + * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.Loaders.shared, `false` to create new Loader. */ constructor(options, arg2, arg3, arg4, arg5) { diff --git a/packages/loaders/src/Loader.js b/packages/loaders/src/Loader.js index 6f6e9bd..ecba1b0 100644 --- a/packages/loaders/src/Loader.js +++ b/packages/loaders/src/Loader.js @@ -1,16 +1,16 @@ import ResourceLoader from 'resource-loader'; import EventEmitter from 'eventemitter3'; import { blobMiddlewareFactory } from 'resource-loader/lib/middlewares/parsing/blob'; -import textureParser from './textureParser'; +import TextureLoader from './TextureLoader'; /** * * The new loader, extends Resource Loader by Chad Engler: https://github.com/englercj/resource-loader * * ```js - * const loader = PIXI.loader; // PixiJS exposes a premade instance for you to use. + * const loader = PIXI.Loader.shared; // PixiJS exposes a premade instance for you to use. * //or - * const loader = new PIXI.loaders.Loader(); // you can also create your own if you want + * const loader = new PIXI.Loader(); // you can also create your own if you want * * const sprites = {}; * @@ -52,20 +52,31 @@ * * @class Loader * @extends module:resource-loader.ResourceLoader - * @memberof PIXI.loaders + * @memberof PIXI * @param {string} [baseUrl=''] - The base url for all resources loaded by this loader. * @param {number} [concurrency=10] - The number of resources to load concurrently. */ -export class Loader extends ResourceLoader +export default class Loader extends ResourceLoader { constructor(baseUrl, concurrency) { super(baseUrl, concurrency); EventEmitter.call(this); - for (let i = 0; i < Loader._middleware.length; ++i) + for (let i = 0; i < Loader._plugins.length; ++i) { - this.use(Loader._middleware[i]()); + const plugin = Loader._plugins[i]; + const { pre, use } = plugin; + + if (pre) + { + this.pre(pre.bind(plugin)); + } + + if (use) + { + this.use(use.bind(plugin)); + } } // Compat layer, translate the new v2 signals into old v1 events. @@ -95,50 +106,82 @@ this.reset(); } } + + /** + * A premade instance of the loader that can be used to load resources. + * @name shared + * @type {PIXI.Loader} + * @static + * @memberof PIXI.Loader + */ + static get shared() + { + let shared = Loader._shared; + + if (!shared) + { + shared = new Loader(); + shared._protected = true; + Loader._shared = shared; + } + + return shared; + } } // Copy EE3 prototype (mixin) Object.assign(Loader.prototype, EventEmitter.prototype); /** - * Collection of all installed middleware for Loader. + * Collection of all installed `use` middleware for Loader. * * @static - * @member {Array} - * @memberof PIXI.loaders.Loader + * @member {Array} + * @memberof PIXI.Loader * @private */ -Loader._middleware = []; +Loader._plugins = []; /** - * A premade instance of the loader that can be used to load resources. - * @name shared - * @memberof PIXI.loaders - * @type {PIXI.loaders.Loader} - */ -export const shared = new Loader(); -shared._protected = true; - -/** - * Adds a middleware for the global shared loader and all + * Adds a Loader plugin for the global shared loader and all * new Loader instances created. * * @static - * @method useMiddleware - * @memberof PIXI.loaders.Loader - * @param {Function} fn - The middleware to add. + * @method registerPlugin + * @memberof PIXI.Loader + * @param {PIXI.Loader~LoaderPlugin} plugin - The plugin to add + * @return {PIXI.Loader} Reference to PIXI.Loader for chaining */ -Loader.useMiddleware = function useMiddleware(fn) +Loader.registerPlugin = function registerPlugin(plugin) { - // Install for current shared loader - shared.use(fn); + Loader._plugins.push(plugin); - // Install for all future loaders - Loader._middleware.push(fn); + if (plugin.add) + { + plugin.add(); + } + + return Loader; }; // parse any blob into more usable objects (e.g. Image) -Loader.useMiddleware(blobMiddlewareFactory); +Loader.registerPlugin({ use: blobMiddlewareFactory() }); // parse any Image objects into textures -Loader.useMiddleware(textureParser); +Loader.registerPlugin(TextureLoader); + +/** + * Plugin to be installed for handling specific Loader resources. + * @typedef {object} PIXI.Loader~LoaderPlugin + * @property {function} [plugin.add] - Function to call immediate after registering plugin. + * @property {PIXI.Loader~loaderMiddleware} [plugin.pre] - Middleware function to run before load, the + * arguments for this are `(resource, next)` + * @property {PIXI.Loader~loaderMiddleware} [plugin.use] - Middleware function to run after load, the + * arguments for this are `(resource, next)` + */ + +/** + * @callback PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ diff --git a/packages/loaders/src/TextureLoader.js b/packages/loaders/src/TextureLoader.js new file mode 100644 index 0000000..5094c8e --- /dev/null +++ b/packages/loaders/src/TextureLoader.js @@ -0,0 +1,31 @@ +import { Resource } from 'resource-loader'; +import { Texture } from '@pixi/core'; + +/** + * Loader plugin for handling Texture resources. + * @class + * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin + */ +export default class TextureLoader +{ + /** + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ + static use(resource, next) + { + // create a new texture if the data is an Image object + if (resource.data && resource.type === Resource.TYPE.IMAGE) + { + resource.texture = Texture.fromLoader( + resource.data, + resource.url, + resource.name + ); + } + next(); + } +} diff --git a/packages/loaders/src/index.js b/packages/loaders/src/index.js index 8e816cc..3e877fe 100644 --- a/packages/loaders/src/index.js +++ b/packages/loaders/src/index.js @@ -1,24 +1,11 @@ +import { Resource } from 'resource-loader'; /** * Reference to **{@link https://github.com/englercj/resource-loader * resource-loader}**'s Resource class. * @see http://englercj.github.io/resource-loader/Resource.html - * @class Resource - * @memberof PIXI.loaders + * @class LoaderResource + * @memberof PIXI */ -export { Resource } from 'resource-loader'; - -/** - * This namespace contains APIs which extends the {@link https://github.com/englercj/resource-loader resource-loader} module - * for loading assets, data, and other resources dynamically. - * @example - * const loader = new PIXI.loaders.Loader(); - * loader.add('bunny', 'data/bunny.png') - * .add('spaceship', 'assets/spritesheet.json'); - * loader.load((loader, resources) => { - * // resources.bunny - * // resources.spaceship - * }); - * @namespace PIXI.loaders - */ -export { Loader, shared } from './Loader'; -export { default as textureParser } from './textureParser'; +export const LoaderResource = Resource; +export { default as Loader } from './Loader'; +export { default as TextureLoader } from './TextureLoader'; diff --git a/packages/loaders/src/textureParser.js b/packages/loaders/src/textureParser.js deleted file mode 100644 index 9dba8bd..0000000 --- a/packages/loaders/src/textureParser.js +++ /dev/null @@ -1,19 +0,0 @@ -import { Resource } from 'resource-loader'; -import { Texture } from '@pixi/core'; - -export default function () -{ - return function textureParser(resource, next) - { - // create a new texture if the data is an Image object - if (resource.data && resource.type === Resource.TYPE.IMAGE) - { - resource.texture = Texture.fromLoader( - resource.data, - resource.url, - resource.name - ); - } - next(); - }; -} diff --git a/packages/loaders/test/Loader.js b/packages/loaders/test/Loader.js new file mode 100644 index 0000000..1a62a86 --- /dev/null +++ b/packages/loaders/test/Loader.js @@ -0,0 +1,15 @@ +const { Loader } = require('../'); + +describe('PIXI.Loader', function () +{ + it('should exist', function () + { + expect(Loader).to.be.a('function'); + }); + + it('should have shared loader', function () + { + expect(Loader.shared).to.not.be.undefined; + expect(Loader.shared).to.be.instanceof(Loader); + }); +}); diff --git a/packages/loaders/test/TextureLoader.js b/packages/loaders/test/TextureLoader.js new file mode 100644 index 0000000..db53f7c --- /dev/null +++ b/packages/loaders/test/TextureLoader.js @@ -0,0 +1,52 @@ +const { TextureLoader, LoaderResource } = require('../'); +const { Texture } = require('@pixi/core'); +const { BaseTextureCache, TextureCache } = require('@pixi/utils'); + +describe('PIXI.TextureLoader', function () +{ + it('should exist and return a function', function () + { + expect(TextureLoader).to.not.be.undefined; + expect(TextureLoader.use).to.be.a('function'); + }); + + it('should do nothing if the resource is not an image', function () + { + const spy = sinon.spy(); + const res = {}; + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.undefined; + }); + + it('should create a texture if resource is an image', function () + { + const spy = sinon.spy(); + const res = createMockResource(LoaderResource.TYPE.IMAGE, new Image()); + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.an.instanceof(Texture); + + expect(BaseTextureCache).to.have.property(res.name, res.texture.baseTexture); + expect(BaseTextureCache).to.have.property(res.url, res.texture.baseTexture); + + expect(TextureCache).to.have.property(res.name, res.texture); + expect(TextureCache).to.have.property(res.url, res.texture); + }); +}); + +function createMockResource(type, data) +{ + const name = `${Math.floor(Date.now() * Math.random())}`; + + return { + url: `http://localhost/doesnt_exist/${name}`, + name, + type, + data, + }; +} diff --git a/packages/loaders/test/index.js b/packages/loaders/test/index.js index 72c6554..8913167 100644 --- a/packages/loaders/test/index.js +++ b/packages/loaders/test/index.js @@ -1,2 +1,2 @@ -require('./loader'); -require('./textureParser'); +require('./Loader'); +require('./TextureLoader'); diff --git a/packages/loaders/test/loader.js b/packages/loaders/test/loader.js deleted file mode 100644 index 5b8571b..0000000 --- a/packages/loaders/test/loader.js +++ /dev/null @@ -1,9 +0,0 @@ -const { Loader } = require('../'); - -describe('PIXI.loaders.Loader', function () -{ - it('should exist', function () - { - expect(Loader).to.be.a('function'); - }); -}); diff --git a/packages/loaders/test/textureParser.js b/packages/loaders/test/textureParser.js deleted file mode 100644 index b5b2179..0000000 --- a/packages/loaders/test/textureParser.js +++ /dev/null @@ -1,52 +0,0 @@ -const { textureParser, Resource } = require('../'); -const { Texture } = require('@pixi/core'); -const { BaseTextureCache, TextureCache } = require('@pixi/utils'); - -describe('PIXI.loaders.textureParser', function () -{ - it('should exist and return a function', function () - { - expect(textureParser).to.be.a('function'); - expect(textureParser()).to.be.a('function'); - }); - - it('should do nothing if the resource is not an image', function () - { - const spy = sinon.spy(); - const res = {}; - - textureParser()(res, spy); - - expect(spy).to.have.been.calledOnce; - expect(res.texture).to.be.undefined; - }); - - it('should create a texture if resource is an image', function () - { - const spy = sinon.spy(); - const res = createMockResource(Resource.TYPE.IMAGE, new Image()); - - textureParser()(res, spy); - - expect(spy).to.have.been.calledOnce; - expect(res.texture).to.be.an.instanceof(Texture); - - expect(BaseTextureCache).to.have.property(res.name, res.texture.baseTexture); - expect(BaseTextureCache).to.have.property(res.url, res.texture.baseTexture); - - expect(TextureCache).to.have.property(res.name, res.texture); - expect(TextureCache).to.have.property(res.url, res.texture); - }); -}); - -function createMockResource(type, data) -{ - const name = `${Math.floor(Date.now() * Math.random())}`; - - return { - url: `http://localhost/doesnt_exist/${name}`, - name, - type, - data, - }; -} diff --git a/packages/mixin-app-loader/src/index.js b/packages/mixin-app-loader/src/index.js index 354997a..ab28882 100644 --- a/packages/mixin-app-loader/src/index.js +++ b/packages/mixin-app-loader/src/index.js @@ -1,12 +1,12 @@ import { Application } from '@pixi/app'; -import { Loader, shared } from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; Application.prototype._loader = null; /** * Loader instance to help with asset loading. * @name PIXI.Application#loader - * @type {PIXI.loaders.Loader} + * @type {PIXI.Loader} */ Object.defineProperties(Application.prototype, { loader: { @@ -16,7 +16,7 @@ { const { sharedLoader } = this._options; - this._loader = sharedLoader ? shared : new Loader(); + this._loader = sharedLoader ? Loader.shared : new Loader(); } return this._loader; diff --git a/packages/mixin-app-loader/test/index.js b/packages/mixin-app-loader/test/index.js index 4739863..7eb948b 100644 --- a/packages/mixin-app-loader/test/index.js +++ b/packages/mixin-app-loader/test/index.js @@ -1,5 +1,5 @@ const { Application } = require('@pixi/app'); -const { Loader, shared } = require('@pixi/loaders'); +const { Loader } = require('@pixi/loaders'); const { skipHello } = require('@pixi/utils'); const { autoDetectRenderer } = require('@pixi/canvas-renderer'); @@ -30,7 +30,7 @@ expect(obj.loader).to.be.not.undefined; expect(obj.loader).to.be.instanceof(Loader); - expect(obj.loader).to.equal(shared); + expect(obj.loader).to.equal(Loader.shared); obj.destroy(); diff --git a/packages/spritesheet/README.md b/packages/spritesheet/README.md index 2bf764b..7c26b10 100644 --- a/packages/spritesheet/README.md +++ b/packages/spritesheet/README.md @@ -9,5 +9,7 @@ ## Usage ```js -import * as spritesheet from '@pixi/spritesheet'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { Loader } from '@pixi/loaders'; +Loader.registerPlugin(SpritesheetLoader); ``` \ No newline at end of file diff --git a/bundles/pixi.js-legacy/test/index.js b/bundles/pixi.js-legacy/test/index.js index c7cc855..a29651e 100755 --- a/bundles/pixi.js-legacy/test/index.js +++ b/bundles/pixi.js-legacy/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js/src/PIXI.js b/bundles/pixi.js/src/PIXI.js index 75e5658..ae40c7e 100644 --- a/bundles/pixi.js/src/PIXI.js +++ b/bundles/pixi.js/src/PIXI.js @@ -12,6 +12,7 @@ export * from '@pixi/display'; export * from '@pixi/mesh'; export * from '@pixi/ticker'; +export * from '@pixi/loaders'; import { Renderer } from '@pixi/core'; import * as interaction from '@pixi/interaction'; @@ -22,10 +23,12 @@ import { TilingSpriteRenderer } from '@pixi/sprite-tiling'; import { GraphicsRenderer } from '@pixi/graphics'; import * as accessibility from '@pixi/accessibility'; -import * as loaders from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; import * as filters from './filters'; import * as utils from '@pixi/utils'; import { settings } from '@pixi/settings'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager); Renderer.registerPlugin('extract', extract.Extract); @@ -36,6 +39,9 @@ Renderer.registerPlugin('sprite', SpriteRenderer); Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer); +Loader.registerPlugin(SpritesheetLoader); +Loader.registerPlugin(BitmapFontLoader); + import '@pixi/mixin-cache-as-bitmap'; import '@pixi/mixin-get-child-by-name'; import '@pixi/mixin-get-global-position'; @@ -43,20 +49,11 @@ utils.mixins.performMixins(); -/** - * Alias for {@link PIXI.loaders.shared}. - * @name loader - * @memberof PIXI - * @type {PIXI.loader.Loader} - */ -export const loader = loaders.shared; - export { accessibility, extract, filters, interaction, - loaders, prepare, utils, settings, diff --git a/bundles/pixi.js/src/deprecated.js b/bundles/pixi.js/src/deprecated.js index 402176f..e59c66a 100644 --- a/bundles/pixi.js/src/deprecated.js +++ b/bundles/pixi.js/src/deprecated.js @@ -131,6 +131,22 @@ return PIXI.utils.CanvasRenderTarget; }, }, + + /** + * @memberof PIXI + * @name loader + * @type {PIXI.Loader} + * @see PIXI.Loader.shared + * @deprecated since 5.0.0 + */ + loader: { + get() + { + warn('PIXI.loader has moved to PIXI.Loader.shared'); + + return PIXI.Loader.shared; + }, + }, }); /** @@ -351,34 +367,51 @@ }, }); - Object.defineProperties(PIXI.loaders.Loader, { - /** - * @function PIXI.loaders.Loader.addPixiMiddleware - * @see PIXI.loaders.Loader.useMiddleware - * @deprecated since 5.0.0 - */ - addPixiMiddleware: { - get() - { - warn('PIXI.loaders.Loader.addPixiMiddleware has moved to PIXI.loaders.Loader.useMiddleware'); - - return PIXI.loaders.Loader.useMiddleware; - }, - }, - }); + /** + * All classes on this namespace have moved to the high-level `PIXI` object. + * @namespace PIXI.loaders + * @deprecated since 5.0.0 + */ + PIXI.loaders = {}; Object.defineProperties(PIXI.loaders, { /** + * @class PIXI.loaders.Loader + * @see PIXI.Loader + * @deprecated since 5.0.0 + */ + Loader: { + get() + { + warn('PIXI.loaders.Loader has moved to PIXI.Loader'); + + return PIXI.Loader; + }, + }, + /** + * @class PIXI.loaders.Resource + * @see PIXI.LoaderResource + * @deprecated since 5.0.0 + */ + Resource: { + get() + { + warn('PIXI.loaders.Resource has moved to PIXI.LoaderResource'); + + return PIXI.LoaderResource; + }, + }, + /** * @function PIXI.loaders.bitmapFontParser - * @see PIXI.BitmapFontLoader.middleware + * @see PIXI.BitmapFontLoader.use * @deprecated since 5.0.0 */ bitmapFontParser: { get() { - warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.middleware'); + warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.use'); - return PIXI.BitmapFontLoader.middleware; + return PIXI.BitmapFontLoader.use; }, }, /** @@ -396,15 +429,15 @@ }, /** * @function PIXI.loaders.spritesheetParser - * @see PIXI.SpritesheetLoader.middleware + * @see PIXI.SpritesheetLoader.use * @deprecated since 5.0.0 */ spritesheetParser: { get() { - warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.middleware'); + warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.use'); - return PIXI.SpritesheetLoader.middleware; + return PIXI.SpritesheetLoader.use; }, }, /** @@ -423,6 +456,19 @@ }); /** + * @function PIXI.loaders.Loader.addPixiMiddleware + * @see PIXI.Loader.registerPlugin + * @deprecated since 5.0.0 + * @param {function} middleware + */ + PIXI.Loader.addPixiMiddleware = function addPixiMiddleware(middleware) + { + warn('PIXI.loaders.Loader.addPixiMiddleware is deprecated, use PIXI.loaders.Loader.registerPlugin'); + + return PIXI.loaders.Loader.registerPlugin({ use: middleware() }); + }; + + /** * @class PIXI.extract.WebGLExtract * @deprecated since 5.0.0 * @see PIXI.extract.Prepare diff --git a/bundles/pixi.js/test/index.js b/bundles/pixi.js/test/index.js index c7cc855..a29651e 100644 --- a/bundles/pixi.js/test/index.js +++ b/bundles/pixi.js/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/packages/app/src/Application.js b/packages/app/src/Application.js index 50f9fa1..ef40610 100644 --- a/packages/app/src/Application.js +++ b/packages/app/src/Application.js @@ -51,7 +51,7 @@ * @param {string} [options.powerPreference] - Parameter passed to webgl context, set to "high-performance" * for devices with dual graphics card **webgl only** * @param {boolean} [options.sharedTicker=false] - `true` to use PIXI.Ticker.shared, `false` to create new ticker. - * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.loaders.shared, `false` to create new Loader. + * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.Loaders.shared, `false` to create new Loader. */ constructor(options, arg2, arg3, arg4, arg5) { diff --git a/packages/loaders/src/Loader.js b/packages/loaders/src/Loader.js index 6f6e9bd..ecba1b0 100644 --- a/packages/loaders/src/Loader.js +++ b/packages/loaders/src/Loader.js @@ -1,16 +1,16 @@ import ResourceLoader from 'resource-loader'; import EventEmitter from 'eventemitter3'; import { blobMiddlewareFactory } from 'resource-loader/lib/middlewares/parsing/blob'; -import textureParser from './textureParser'; +import TextureLoader from './TextureLoader'; /** * * The new loader, extends Resource Loader by Chad Engler: https://github.com/englercj/resource-loader * * ```js - * const loader = PIXI.loader; // PixiJS exposes a premade instance for you to use. + * const loader = PIXI.Loader.shared; // PixiJS exposes a premade instance for you to use. * //or - * const loader = new PIXI.loaders.Loader(); // you can also create your own if you want + * const loader = new PIXI.Loader(); // you can also create your own if you want * * const sprites = {}; * @@ -52,20 +52,31 @@ * * @class Loader * @extends module:resource-loader.ResourceLoader - * @memberof PIXI.loaders + * @memberof PIXI * @param {string} [baseUrl=''] - The base url for all resources loaded by this loader. * @param {number} [concurrency=10] - The number of resources to load concurrently. */ -export class Loader extends ResourceLoader +export default class Loader extends ResourceLoader { constructor(baseUrl, concurrency) { super(baseUrl, concurrency); EventEmitter.call(this); - for (let i = 0; i < Loader._middleware.length; ++i) + for (let i = 0; i < Loader._plugins.length; ++i) { - this.use(Loader._middleware[i]()); + const plugin = Loader._plugins[i]; + const { pre, use } = plugin; + + if (pre) + { + this.pre(pre.bind(plugin)); + } + + if (use) + { + this.use(use.bind(plugin)); + } } // Compat layer, translate the new v2 signals into old v1 events. @@ -95,50 +106,82 @@ this.reset(); } } + + /** + * A premade instance of the loader that can be used to load resources. + * @name shared + * @type {PIXI.Loader} + * @static + * @memberof PIXI.Loader + */ + static get shared() + { + let shared = Loader._shared; + + if (!shared) + { + shared = new Loader(); + shared._protected = true; + Loader._shared = shared; + } + + return shared; + } } // Copy EE3 prototype (mixin) Object.assign(Loader.prototype, EventEmitter.prototype); /** - * Collection of all installed middleware for Loader. + * Collection of all installed `use` middleware for Loader. * * @static - * @member {Array} - * @memberof PIXI.loaders.Loader + * @member {Array} + * @memberof PIXI.Loader * @private */ -Loader._middleware = []; +Loader._plugins = []; /** - * A premade instance of the loader that can be used to load resources. - * @name shared - * @memberof PIXI.loaders - * @type {PIXI.loaders.Loader} - */ -export const shared = new Loader(); -shared._protected = true; - -/** - * Adds a middleware for the global shared loader and all + * Adds a Loader plugin for the global shared loader and all * new Loader instances created. * * @static - * @method useMiddleware - * @memberof PIXI.loaders.Loader - * @param {Function} fn - The middleware to add. + * @method registerPlugin + * @memberof PIXI.Loader + * @param {PIXI.Loader~LoaderPlugin} plugin - The plugin to add + * @return {PIXI.Loader} Reference to PIXI.Loader for chaining */ -Loader.useMiddleware = function useMiddleware(fn) +Loader.registerPlugin = function registerPlugin(plugin) { - // Install for current shared loader - shared.use(fn); + Loader._plugins.push(plugin); - // Install for all future loaders - Loader._middleware.push(fn); + if (plugin.add) + { + plugin.add(); + } + + return Loader; }; // parse any blob into more usable objects (e.g. Image) -Loader.useMiddleware(blobMiddlewareFactory); +Loader.registerPlugin({ use: blobMiddlewareFactory() }); // parse any Image objects into textures -Loader.useMiddleware(textureParser); +Loader.registerPlugin(TextureLoader); + +/** + * Plugin to be installed for handling specific Loader resources. + * @typedef {object} PIXI.Loader~LoaderPlugin + * @property {function} [plugin.add] - Function to call immediate after registering plugin. + * @property {PIXI.Loader~loaderMiddleware} [plugin.pre] - Middleware function to run before load, the + * arguments for this are `(resource, next)` + * @property {PIXI.Loader~loaderMiddleware} [plugin.use] - Middleware function to run after load, the + * arguments for this are `(resource, next)` + */ + +/** + * @callback PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ diff --git a/packages/loaders/src/TextureLoader.js b/packages/loaders/src/TextureLoader.js new file mode 100644 index 0000000..5094c8e --- /dev/null +++ b/packages/loaders/src/TextureLoader.js @@ -0,0 +1,31 @@ +import { Resource } from 'resource-loader'; +import { Texture } from '@pixi/core'; + +/** + * Loader plugin for handling Texture resources. + * @class + * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin + */ +export default class TextureLoader +{ + /** + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ + static use(resource, next) + { + // create a new texture if the data is an Image object + if (resource.data && resource.type === Resource.TYPE.IMAGE) + { + resource.texture = Texture.fromLoader( + resource.data, + resource.url, + resource.name + ); + } + next(); + } +} diff --git a/packages/loaders/src/index.js b/packages/loaders/src/index.js index 8e816cc..3e877fe 100644 --- a/packages/loaders/src/index.js +++ b/packages/loaders/src/index.js @@ -1,24 +1,11 @@ +import { Resource } from 'resource-loader'; /** * Reference to **{@link https://github.com/englercj/resource-loader * resource-loader}**'s Resource class. * @see http://englercj.github.io/resource-loader/Resource.html - * @class Resource - * @memberof PIXI.loaders + * @class LoaderResource + * @memberof PIXI */ -export { Resource } from 'resource-loader'; - -/** - * This namespace contains APIs which extends the {@link https://github.com/englercj/resource-loader resource-loader} module - * for loading assets, data, and other resources dynamically. - * @example - * const loader = new PIXI.loaders.Loader(); - * loader.add('bunny', 'data/bunny.png') - * .add('spaceship', 'assets/spritesheet.json'); - * loader.load((loader, resources) => { - * // resources.bunny - * // resources.spaceship - * }); - * @namespace PIXI.loaders - */ -export { Loader, shared } from './Loader'; -export { default as textureParser } from './textureParser'; +export const LoaderResource = Resource; +export { default as Loader } from './Loader'; +export { default as TextureLoader } from './TextureLoader'; diff --git a/packages/loaders/src/textureParser.js b/packages/loaders/src/textureParser.js deleted file mode 100644 index 9dba8bd..0000000 --- a/packages/loaders/src/textureParser.js +++ /dev/null @@ -1,19 +0,0 @@ -import { Resource } from 'resource-loader'; -import { Texture } from '@pixi/core'; - -export default function () -{ - return function textureParser(resource, next) - { - // create a new texture if the data is an Image object - if (resource.data && resource.type === Resource.TYPE.IMAGE) - { - resource.texture = Texture.fromLoader( - resource.data, - resource.url, - resource.name - ); - } - next(); - }; -} diff --git a/packages/loaders/test/Loader.js b/packages/loaders/test/Loader.js new file mode 100644 index 0000000..1a62a86 --- /dev/null +++ b/packages/loaders/test/Loader.js @@ -0,0 +1,15 @@ +const { Loader } = require('../'); + +describe('PIXI.Loader', function () +{ + it('should exist', function () + { + expect(Loader).to.be.a('function'); + }); + + it('should have shared loader', function () + { + expect(Loader.shared).to.not.be.undefined; + expect(Loader.shared).to.be.instanceof(Loader); + }); +}); diff --git a/packages/loaders/test/TextureLoader.js b/packages/loaders/test/TextureLoader.js new file mode 100644 index 0000000..db53f7c --- /dev/null +++ b/packages/loaders/test/TextureLoader.js @@ -0,0 +1,52 @@ +const { TextureLoader, LoaderResource } = require('../'); +const { Texture } = require('@pixi/core'); +const { BaseTextureCache, TextureCache } = require('@pixi/utils'); + +describe('PIXI.TextureLoader', function () +{ + it('should exist and return a function', function () + { + expect(TextureLoader).to.not.be.undefined; + expect(TextureLoader.use).to.be.a('function'); + }); + + it('should do nothing if the resource is not an image', function () + { + const spy = sinon.spy(); + const res = {}; + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.undefined; + }); + + it('should create a texture if resource is an image', function () + { + const spy = sinon.spy(); + const res = createMockResource(LoaderResource.TYPE.IMAGE, new Image()); + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.an.instanceof(Texture); + + expect(BaseTextureCache).to.have.property(res.name, res.texture.baseTexture); + expect(BaseTextureCache).to.have.property(res.url, res.texture.baseTexture); + + expect(TextureCache).to.have.property(res.name, res.texture); + expect(TextureCache).to.have.property(res.url, res.texture); + }); +}); + +function createMockResource(type, data) +{ + const name = `${Math.floor(Date.now() * Math.random())}`; + + return { + url: `http://localhost/doesnt_exist/${name}`, + name, + type, + data, + }; +} diff --git a/packages/loaders/test/index.js b/packages/loaders/test/index.js index 72c6554..8913167 100644 --- a/packages/loaders/test/index.js +++ b/packages/loaders/test/index.js @@ -1,2 +1,2 @@ -require('./loader'); -require('./textureParser'); +require('./Loader'); +require('./TextureLoader'); diff --git a/packages/loaders/test/loader.js b/packages/loaders/test/loader.js deleted file mode 100644 index 5b8571b..0000000 --- a/packages/loaders/test/loader.js +++ /dev/null @@ -1,9 +0,0 @@ -const { Loader } = require('../'); - -describe('PIXI.loaders.Loader', function () -{ - it('should exist', function () - { - expect(Loader).to.be.a('function'); - }); -}); diff --git a/packages/loaders/test/textureParser.js b/packages/loaders/test/textureParser.js deleted file mode 100644 index b5b2179..0000000 --- a/packages/loaders/test/textureParser.js +++ /dev/null @@ -1,52 +0,0 @@ -const { textureParser, Resource } = require('../'); -const { Texture } = require('@pixi/core'); -const { BaseTextureCache, TextureCache } = require('@pixi/utils'); - -describe('PIXI.loaders.textureParser', function () -{ - it('should exist and return a function', function () - { - expect(textureParser).to.be.a('function'); - expect(textureParser()).to.be.a('function'); - }); - - it('should do nothing if the resource is not an image', function () - { - const spy = sinon.spy(); - const res = {}; - - textureParser()(res, spy); - - expect(spy).to.have.been.calledOnce; - expect(res.texture).to.be.undefined; - }); - - it('should create a texture if resource is an image', function () - { - const spy = sinon.spy(); - const res = createMockResource(Resource.TYPE.IMAGE, new Image()); - - textureParser()(res, spy); - - expect(spy).to.have.been.calledOnce; - expect(res.texture).to.be.an.instanceof(Texture); - - expect(BaseTextureCache).to.have.property(res.name, res.texture.baseTexture); - expect(BaseTextureCache).to.have.property(res.url, res.texture.baseTexture); - - expect(TextureCache).to.have.property(res.name, res.texture); - expect(TextureCache).to.have.property(res.url, res.texture); - }); -}); - -function createMockResource(type, data) -{ - const name = `${Math.floor(Date.now() * Math.random())}`; - - return { - url: `http://localhost/doesnt_exist/${name}`, - name, - type, - data, - }; -} diff --git a/packages/mixin-app-loader/src/index.js b/packages/mixin-app-loader/src/index.js index 354997a..ab28882 100644 --- a/packages/mixin-app-loader/src/index.js +++ b/packages/mixin-app-loader/src/index.js @@ -1,12 +1,12 @@ import { Application } from '@pixi/app'; -import { Loader, shared } from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; Application.prototype._loader = null; /** * Loader instance to help with asset loading. * @name PIXI.Application#loader - * @type {PIXI.loaders.Loader} + * @type {PIXI.Loader} */ Object.defineProperties(Application.prototype, { loader: { @@ -16,7 +16,7 @@ { const { sharedLoader } = this._options; - this._loader = sharedLoader ? shared : new Loader(); + this._loader = sharedLoader ? Loader.shared : new Loader(); } return this._loader; diff --git a/packages/mixin-app-loader/test/index.js b/packages/mixin-app-loader/test/index.js index 4739863..7eb948b 100644 --- a/packages/mixin-app-loader/test/index.js +++ b/packages/mixin-app-loader/test/index.js @@ -1,5 +1,5 @@ const { Application } = require('@pixi/app'); -const { Loader, shared } = require('@pixi/loaders'); +const { Loader } = require('@pixi/loaders'); const { skipHello } = require('@pixi/utils'); const { autoDetectRenderer } = require('@pixi/canvas-renderer'); @@ -30,7 +30,7 @@ expect(obj.loader).to.be.not.undefined; expect(obj.loader).to.be.instanceof(Loader); - expect(obj.loader).to.equal(shared); + expect(obj.loader).to.equal(Loader.shared); obj.destroy(); diff --git a/packages/spritesheet/README.md b/packages/spritesheet/README.md index 2bf764b..7c26b10 100644 --- a/packages/spritesheet/README.md +++ b/packages/spritesheet/README.md @@ -9,5 +9,7 @@ ## Usage ```js -import * as spritesheet from '@pixi/spritesheet'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { Loader } from '@pixi/loaders'; +Loader.registerPlugin(SpritesheetLoader); ``` \ No newline at end of file diff --git a/packages/spritesheet/src/SpritesheetLoader.js b/packages/spritesheet/src/SpritesheetLoader.js index c7b34ea..0a19954 100644 --- a/packages/spritesheet/src/SpritesheetLoader.js +++ b/packages/spritesheet/src/SpritesheetLoader.js @@ -1,70 +1,70 @@ import url from 'url'; -import { Resource, Loader } from '@pixi/loaders'; +import { LoaderResource } from '@pixi/loaders'; import Spritesheet from './Spritesheet'; /** - * {@link PIXI.loaders.Loader Loader} middleware for loading + * {@link PIXI.Loader Loader} middleware for loading * texture atlases that have been created with TexturePacker or * similar JSON-based spritesheet. This automatically generates * Texture resources. * @class * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin */ export default class SpritesheetLoader { /** - * Middleware function to support Spritesheets, this is automatically installed. - * @see PIXI.loaders.Loader.useMiddleware + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next */ - static middleware() + static use(resource, next) { - return function spritesheetLoader(resource, next) + const imageResourceName = `${resource.name}_image`; + + // skip if no data, its not json, it isn't spritesheet data, or the image resource already exists + if (!resource.data + || resource.type !== LoaderResource.TYPE.JSON + || !resource.data.frames + || this.resources[imageResourceName] + ) { - const imageResourceName = `${resource.name}_image`; + next(); - // skip if no data, its not json, it isn't spritesheet data, or the image resource already exists - if (!resource.data - || resource.type !== Resource.TYPE.JSON - || !resource.data.frames - || this.resources[imageResourceName] - ) - { - next(); + return; + } - return; - } - - const loadOptions = { - crossOrigin: resource.crossOrigin, - loadType: Resource.LOAD_TYPE.IMAGE, - metadata: resource.metadata.imageMetadata, - parentResource: resource, - }; - - const resourcePath = SpritesheetLoader.getResourcePath(resource, this.baseUrl); - - // load the image for this sheet - this.add(imageResourceName, resourcePath, loadOptions, function onImageLoad(res) - { - const spritesheet = new Spritesheet( - res.texture.baseTexture, - resource.data, - resource.url - ); - - spritesheet.parse(() => - { - resource.spritesheet = spritesheet; - resource.textures = spritesheet.textures; - next(); - }); - }); + const loadOptions = { + crossOrigin: resource.crossOrigin, + loadType: LoaderResource.LOAD_TYPE.IMAGE, + metadata: resource.metadata.imageMetadata, + parentResource: resource, }; + + const resourcePath = SpritesheetLoader.getResourcePath(resource, this.baseUrl); + + // load the image for this sheet + this.add(imageResourceName, resourcePath, loadOptions, function onImageLoad(res) + { + const spritesheet = new Spritesheet( + res.texture.baseTexture, + resource.data, + resource.url + ); + + spritesheet.parse(() => + { + resource.spritesheet = spritesheet; + resource.textures = spritesheet.textures; + next(); + }); + }); } /** * Get the spritesheets root path - * @param {PIXI.loader.Resource} resource - Resource to check path + * @param {PIXI.LoaderResource} resource - Resource to check path * @param {string} baseUrl - Base root url */ static getResourcePath(resource, baseUrl) @@ -78,6 +78,3 @@ return url.resolve(resource.url.replace(baseUrl, ''), resource.data.meta.image); } } - -// Install loader support for Spritesheet objects -Loader.useMiddleware(SpritesheetLoader.middleware); diff --git a/bundles/pixi.js-legacy/test/index.js b/bundles/pixi.js-legacy/test/index.js index c7cc855..a29651e 100755 --- a/bundles/pixi.js-legacy/test/index.js +++ b/bundles/pixi.js-legacy/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js/src/PIXI.js b/bundles/pixi.js/src/PIXI.js index 75e5658..ae40c7e 100644 --- a/bundles/pixi.js/src/PIXI.js +++ b/bundles/pixi.js/src/PIXI.js @@ -12,6 +12,7 @@ export * from '@pixi/display'; export * from '@pixi/mesh'; export * from '@pixi/ticker'; +export * from '@pixi/loaders'; import { Renderer } from '@pixi/core'; import * as interaction from '@pixi/interaction'; @@ -22,10 +23,12 @@ import { TilingSpriteRenderer } from '@pixi/sprite-tiling'; import { GraphicsRenderer } from '@pixi/graphics'; import * as accessibility from '@pixi/accessibility'; -import * as loaders from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; import * as filters from './filters'; import * as utils from '@pixi/utils'; import { settings } from '@pixi/settings'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager); Renderer.registerPlugin('extract', extract.Extract); @@ -36,6 +39,9 @@ Renderer.registerPlugin('sprite', SpriteRenderer); Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer); +Loader.registerPlugin(SpritesheetLoader); +Loader.registerPlugin(BitmapFontLoader); + import '@pixi/mixin-cache-as-bitmap'; import '@pixi/mixin-get-child-by-name'; import '@pixi/mixin-get-global-position'; @@ -43,20 +49,11 @@ utils.mixins.performMixins(); -/** - * Alias for {@link PIXI.loaders.shared}. - * @name loader - * @memberof PIXI - * @type {PIXI.loader.Loader} - */ -export const loader = loaders.shared; - export { accessibility, extract, filters, interaction, - loaders, prepare, utils, settings, diff --git a/bundles/pixi.js/src/deprecated.js b/bundles/pixi.js/src/deprecated.js index 402176f..e59c66a 100644 --- a/bundles/pixi.js/src/deprecated.js +++ b/bundles/pixi.js/src/deprecated.js @@ -131,6 +131,22 @@ return PIXI.utils.CanvasRenderTarget; }, }, + + /** + * @memberof PIXI + * @name loader + * @type {PIXI.Loader} + * @see PIXI.Loader.shared + * @deprecated since 5.0.0 + */ + loader: { + get() + { + warn('PIXI.loader has moved to PIXI.Loader.shared'); + + return PIXI.Loader.shared; + }, + }, }); /** @@ -351,34 +367,51 @@ }, }); - Object.defineProperties(PIXI.loaders.Loader, { - /** - * @function PIXI.loaders.Loader.addPixiMiddleware - * @see PIXI.loaders.Loader.useMiddleware - * @deprecated since 5.0.0 - */ - addPixiMiddleware: { - get() - { - warn('PIXI.loaders.Loader.addPixiMiddleware has moved to PIXI.loaders.Loader.useMiddleware'); - - return PIXI.loaders.Loader.useMiddleware; - }, - }, - }); + /** + * All classes on this namespace have moved to the high-level `PIXI` object. + * @namespace PIXI.loaders + * @deprecated since 5.0.0 + */ + PIXI.loaders = {}; Object.defineProperties(PIXI.loaders, { /** + * @class PIXI.loaders.Loader + * @see PIXI.Loader + * @deprecated since 5.0.0 + */ + Loader: { + get() + { + warn('PIXI.loaders.Loader has moved to PIXI.Loader'); + + return PIXI.Loader; + }, + }, + /** + * @class PIXI.loaders.Resource + * @see PIXI.LoaderResource + * @deprecated since 5.0.0 + */ + Resource: { + get() + { + warn('PIXI.loaders.Resource has moved to PIXI.LoaderResource'); + + return PIXI.LoaderResource; + }, + }, + /** * @function PIXI.loaders.bitmapFontParser - * @see PIXI.BitmapFontLoader.middleware + * @see PIXI.BitmapFontLoader.use * @deprecated since 5.0.0 */ bitmapFontParser: { get() { - warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.middleware'); + warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.use'); - return PIXI.BitmapFontLoader.middleware; + return PIXI.BitmapFontLoader.use; }, }, /** @@ -396,15 +429,15 @@ }, /** * @function PIXI.loaders.spritesheetParser - * @see PIXI.SpritesheetLoader.middleware + * @see PIXI.SpritesheetLoader.use * @deprecated since 5.0.0 */ spritesheetParser: { get() { - warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.middleware'); + warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.use'); - return PIXI.SpritesheetLoader.middleware; + return PIXI.SpritesheetLoader.use; }, }, /** @@ -423,6 +456,19 @@ }); /** + * @function PIXI.loaders.Loader.addPixiMiddleware + * @see PIXI.Loader.registerPlugin + * @deprecated since 5.0.0 + * @param {function} middleware + */ + PIXI.Loader.addPixiMiddleware = function addPixiMiddleware(middleware) + { + warn('PIXI.loaders.Loader.addPixiMiddleware is deprecated, use PIXI.loaders.Loader.registerPlugin'); + + return PIXI.loaders.Loader.registerPlugin({ use: middleware() }); + }; + + /** * @class PIXI.extract.WebGLExtract * @deprecated since 5.0.0 * @see PIXI.extract.Prepare diff --git a/bundles/pixi.js/test/index.js b/bundles/pixi.js/test/index.js index c7cc855..a29651e 100644 --- a/bundles/pixi.js/test/index.js +++ b/bundles/pixi.js/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/packages/app/src/Application.js b/packages/app/src/Application.js index 50f9fa1..ef40610 100644 --- a/packages/app/src/Application.js +++ b/packages/app/src/Application.js @@ -51,7 +51,7 @@ * @param {string} [options.powerPreference] - Parameter passed to webgl context, set to "high-performance" * for devices with dual graphics card **webgl only** * @param {boolean} [options.sharedTicker=false] - `true` to use PIXI.Ticker.shared, `false` to create new ticker. - * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.loaders.shared, `false` to create new Loader. + * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.Loaders.shared, `false` to create new Loader. */ constructor(options, arg2, arg3, arg4, arg5) { diff --git a/packages/loaders/src/Loader.js b/packages/loaders/src/Loader.js index 6f6e9bd..ecba1b0 100644 --- a/packages/loaders/src/Loader.js +++ b/packages/loaders/src/Loader.js @@ -1,16 +1,16 @@ import ResourceLoader from 'resource-loader'; import EventEmitter from 'eventemitter3'; import { blobMiddlewareFactory } from 'resource-loader/lib/middlewares/parsing/blob'; -import textureParser from './textureParser'; +import TextureLoader from './TextureLoader'; /** * * The new loader, extends Resource Loader by Chad Engler: https://github.com/englercj/resource-loader * * ```js - * const loader = PIXI.loader; // PixiJS exposes a premade instance for you to use. + * const loader = PIXI.Loader.shared; // PixiJS exposes a premade instance for you to use. * //or - * const loader = new PIXI.loaders.Loader(); // you can also create your own if you want + * const loader = new PIXI.Loader(); // you can also create your own if you want * * const sprites = {}; * @@ -52,20 +52,31 @@ * * @class Loader * @extends module:resource-loader.ResourceLoader - * @memberof PIXI.loaders + * @memberof PIXI * @param {string} [baseUrl=''] - The base url for all resources loaded by this loader. * @param {number} [concurrency=10] - The number of resources to load concurrently. */ -export class Loader extends ResourceLoader +export default class Loader extends ResourceLoader { constructor(baseUrl, concurrency) { super(baseUrl, concurrency); EventEmitter.call(this); - for (let i = 0; i < Loader._middleware.length; ++i) + for (let i = 0; i < Loader._plugins.length; ++i) { - this.use(Loader._middleware[i]()); + const plugin = Loader._plugins[i]; + const { pre, use } = plugin; + + if (pre) + { + this.pre(pre.bind(plugin)); + } + + if (use) + { + this.use(use.bind(plugin)); + } } // Compat layer, translate the new v2 signals into old v1 events. @@ -95,50 +106,82 @@ this.reset(); } } + + /** + * A premade instance of the loader that can be used to load resources. + * @name shared + * @type {PIXI.Loader} + * @static + * @memberof PIXI.Loader + */ + static get shared() + { + let shared = Loader._shared; + + if (!shared) + { + shared = new Loader(); + shared._protected = true; + Loader._shared = shared; + } + + return shared; + } } // Copy EE3 prototype (mixin) Object.assign(Loader.prototype, EventEmitter.prototype); /** - * Collection of all installed middleware for Loader. + * Collection of all installed `use` middleware for Loader. * * @static - * @member {Array} - * @memberof PIXI.loaders.Loader + * @member {Array} + * @memberof PIXI.Loader * @private */ -Loader._middleware = []; +Loader._plugins = []; /** - * A premade instance of the loader that can be used to load resources. - * @name shared - * @memberof PIXI.loaders - * @type {PIXI.loaders.Loader} - */ -export const shared = new Loader(); -shared._protected = true; - -/** - * Adds a middleware for the global shared loader and all + * Adds a Loader plugin for the global shared loader and all * new Loader instances created. * * @static - * @method useMiddleware - * @memberof PIXI.loaders.Loader - * @param {Function} fn - The middleware to add. + * @method registerPlugin + * @memberof PIXI.Loader + * @param {PIXI.Loader~LoaderPlugin} plugin - The plugin to add + * @return {PIXI.Loader} Reference to PIXI.Loader for chaining */ -Loader.useMiddleware = function useMiddleware(fn) +Loader.registerPlugin = function registerPlugin(plugin) { - // Install for current shared loader - shared.use(fn); + Loader._plugins.push(plugin); - // Install for all future loaders - Loader._middleware.push(fn); + if (plugin.add) + { + plugin.add(); + } + + return Loader; }; // parse any blob into more usable objects (e.g. Image) -Loader.useMiddleware(blobMiddlewareFactory); +Loader.registerPlugin({ use: blobMiddlewareFactory() }); // parse any Image objects into textures -Loader.useMiddleware(textureParser); +Loader.registerPlugin(TextureLoader); + +/** + * Plugin to be installed for handling specific Loader resources. + * @typedef {object} PIXI.Loader~LoaderPlugin + * @property {function} [plugin.add] - Function to call immediate after registering plugin. + * @property {PIXI.Loader~loaderMiddleware} [plugin.pre] - Middleware function to run before load, the + * arguments for this are `(resource, next)` + * @property {PIXI.Loader~loaderMiddleware} [plugin.use] - Middleware function to run after load, the + * arguments for this are `(resource, next)` + */ + +/** + * @callback PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ diff --git a/packages/loaders/src/TextureLoader.js b/packages/loaders/src/TextureLoader.js new file mode 100644 index 0000000..5094c8e --- /dev/null +++ b/packages/loaders/src/TextureLoader.js @@ -0,0 +1,31 @@ +import { Resource } from 'resource-loader'; +import { Texture } from '@pixi/core'; + +/** + * Loader plugin for handling Texture resources. + * @class + * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin + */ +export default class TextureLoader +{ + /** + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ + static use(resource, next) + { + // create a new texture if the data is an Image object + if (resource.data && resource.type === Resource.TYPE.IMAGE) + { + resource.texture = Texture.fromLoader( + resource.data, + resource.url, + resource.name + ); + } + next(); + } +} diff --git a/packages/loaders/src/index.js b/packages/loaders/src/index.js index 8e816cc..3e877fe 100644 --- a/packages/loaders/src/index.js +++ b/packages/loaders/src/index.js @@ -1,24 +1,11 @@ +import { Resource } from 'resource-loader'; /** * Reference to **{@link https://github.com/englercj/resource-loader * resource-loader}**'s Resource class. * @see http://englercj.github.io/resource-loader/Resource.html - * @class Resource - * @memberof PIXI.loaders + * @class LoaderResource + * @memberof PIXI */ -export { Resource } from 'resource-loader'; - -/** - * This namespace contains APIs which extends the {@link https://github.com/englercj/resource-loader resource-loader} module - * for loading assets, data, and other resources dynamically. - * @example - * const loader = new PIXI.loaders.Loader(); - * loader.add('bunny', 'data/bunny.png') - * .add('spaceship', 'assets/spritesheet.json'); - * loader.load((loader, resources) => { - * // resources.bunny - * // resources.spaceship - * }); - * @namespace PIXI.loaders - */ -export { Loader, shared } from './Loader'; -export { default as textureParser } from './textureParser'; +export const LoaderResource = Resource; +export { default as Loader } from './Loader'; +export { default as TextureLoader } from './TextureLoader'; diff --git a/packages/loaders/src/textureParser.js b/packages/loaders/src/textureParser.js deleted file mode 100644 index 9dba8bd..0000000 --- a/packages/loaders/src/textureParser.js +++ /dev/null @@ -1,19 +0,0 @@ -import { Resource } from 'resource-loader'; -import { Texture } from '@pixi/core'; - -export default function () -{ - return function textureParser(resource, next) - { - // create a new texture if the data is an Image object - if (resource.data && resource.type === Resource.TYPE.IMAGE) - { - resource.texture = Texture.fromLoader( - resource.data, - resource.url, - resource.name - ); - } - next(); - }; -} diff --git a/packages/loaders/test/Loader.js b/packages/loaders/test/Loader.js new file mode 100644 index 0000000..1a62a86 --- /dev/null +++ b/packages/loaders/test/Loader.js @@ -0,0 +1,15 @@ +const { Loader } = require('../'); + +describe('PIXI.Loader', function () +{ + it('should exist', function () + { + expect(Loader).to.be.a('function'); + }); + + it('should have shared loader', function () + { + expect(Loader.shared).to.not.be.undefined; + expect(Loader.shared).to.be.instanceof(Loader); + }); +}); diff --git a/packages/loaders/test/TextureLoader.js b/packages/loaders/test/TextureLoader.js new file mode 100644 index 0000000..db53f7c --- /dev/null +++ b/packages/loaders/test/TextureLoader.js @@ -0,0 +1,52 @@ +const { TextureLoader, LoaderResource } = require('../'); +const { Texture } = require('@pixi/core'); +const { BaseTextureCache, TextureCache } = require('@pixi/utils'); + +describe('PIXI.TextureLoader', function () +{ + it('should exist and return a function', function () + { + expect(TextureLoader).to.not.be.undefined; + expect(TextureLoader.use).to.be.a('function'); + }); + + it('should do nothing if the resource is not an image', function () + { + const spy = sinon.spy(); + const res = {}; + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.undefined; + }); + + it('should create a texture if resource is an image', function () + { + const spy = sinon.spy(); + const res = createMockResource(LoaderResource.TYPE.IMAGE, new Image()); + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.an.instanceof(Texture); + + expect(BaseTextureCache).to.have.property(res.name, res.texture.baseTexture); + expect(BaseTextureCache).to.have.property(res.url, res.texture.baseTexture); + + expect(TextureCache).to.have.property(res.name, res.texture); + expect(TextureCache).to.have.property(res.url, res.texture); + }); +}); + +function createMockResource(type, data) +{ + const name = `${Math.floor(Date.now() * Math.random())}`; + + return { + url: `http://localhost/doesnt_exist/${name}`, + name, + type, + data, + }; +} diff --git a/packages/loaders/test/index.js b/packages/loaders/test/index.js index 72c6554..8913167 100644 --- a/packages/loaders/test/index.js +++ b/packages/loaders/test/index.js @@ -1,2 +1,2 @@ -require('./loader'); -require('./textureParser'); +require('./Loader'); +require('./TextureLoader'); diff --git a/packages/loaders/test/loader.js b/packages/loaders/test/loader.js deleted file mode 100644 index 5b8571b..0000000 --- a/packages/loaders/test/loader.js +++ /dev/null @@ -1,9 +0,0 @@ -const { Loader } = require('../'); - -describe('PIXI.loaders.Loader', function () -{ - it('should exist', function () - { - expect(Loader).to.be.a('function'); - }); -}); diff --git a/packages/loaders/test/textureParser.js b/packages/loaders/test/textureParser.js deleted file mode 100644 index b5b2179..0000000 --- a/packages/loaders/test/textureParser.js +++ /dev/null @@ -1,52 +0,0 @@ -const { textureParser, Resource } = require('../'); -const { Texture } = require('@pixi/core'); -const { BaseTextureCache, TextureCache } = require('@pixi/utils'); - -describe('PIXI.loaders.textureParser', function () -{ - it('should exist and return a function', function () - { - expect(textureParser).to.be.a('function'); - expect(textureParser()).to.be.a('function'); - }); - - it('should do nothing if the resource is not an image', function () - { - const spy = sinon.spy(); - const res = {}; - - textureParser()(res, spy); - - expect(spy).to.have.been.calledOnce; - expect(res.texture).to.be.undefined; - }); - - it('should create a texture if resource is an image', function () - { - const spy = sinon.spy(); - const res = createMockResource(Resource.TYPE.IMAGE, new Image()); - - textureParser()(res, spy); - - expect(spy).to.have.been.calledOnce; - expect(res.texture).to.be.an.instanceof(Texture); - - expect(BaseTextureCache).to.have.property(res.name, res.texture.baseTexture); - expect(BaseTextureCache).to.have.property(res.url, res.texture.baseTexture); - - expect(TextureCache).to.have.property(res.name, res.texture); - expect(TextureCache).to.have.property(res.url, res.texture); - }); -}); - -function createMockResource(type, data) -{ - const name = `${Math.floor(Date.now() * Math.random())}`; - - return { - url: `http://localhost/doesnt_exist/${name}`, - name, - type, - data, - }; -} diff --git a/packages/mixin-app-loader/src/index.js b/packages/mixin-app-loader/src/index.js index 354997a..ab28882 100644 --- a/packages/mixin-app-loader/src/index.js +++ b/packages/mixin-app-loader/src/index.js @@ -1,12 +1,12 @@ import { Application } from '@pixi/app'; -import { Loader, shared } from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; Application.prototype._loader = null; /** * Loader instance to help with asset loading. * @name PIXI.Application#loader - * @type {PIXI.loaders.Loader} + * @type {PIXI.Loader} */ Object.defineProperties(Application.prototype, { loader: { @@ -16,7 +16,7 @@ { const { sharedLoader } = this._options; - this._loader = sharedLoader ? shared : new Loader(); + this._loader = sharedLoader ? Loader.shared : new Loader(); } return this._loader; diff --git a/packages/mixin-app-loader/test/index.js b/packages/mixin-app-loader/test/index.js index 4739863..7eb948b 100644 --- a/packages/mixin-app-loader/test/index.js +++ b/packages/mixin-app-loader/test/index.js @@ -1,5 +1,5 @@ const { Application } = require('@pixi/app'); -const { Loader, shared } = require('@pixi/loaders'); +const { Loader } = require('@pixi/loaders'); const { skipHello } = require('@pixi/utils'); const { autoDetectRenderer } = require('@pixi/canvas-renderer'); @@ -30,7 +30,7 @@ expect(obj.loader).to.be.not.undefined; expect(obj.loader).to.be.instanceof(Loader); - expect(obj.loader).to.equal(shared); + expect(obj.loader).to.equal(Loader.shared); obj.destroy(); diff --git a/packages/spritesheet/README.md b/packages/spritesheet/README.md index 2bf764b..7c26b10 100644 --- a/packages/spritesheet/README.md +++ b/packages/spritesheet/README.md @@ -9,5 +9,7 @@ ## Usage ```js -import * as spritesheet from '@pixi/spritesheet'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { Loader } from '@pixi/loaders'; +Loader.registerPlugin(SpritesheetLoader); ``` \ No newline at end of file diff --git a/packages/spritesheet/src/SpritesheetLoader.js b/packages/spritesheet/src/SpritesheetLoader.js index c7b34ea..0a19954 100644 --- a/packages/spritesheet/src/SpritesheetLoader.js +++ b/packages/spritesheet/src/SpritesheetLoader.js @@ -1,70 +1,70 @@ import url from 'url'; -import { Resource, Loader } from '@pixi/loaders'; +import { LoaderResource } from '@pixi/loaders'; import Spritesheet from './Spritesheet'; /** - * {@link PIXI.loaders.Loader Loader} middleware for loading + * {@link PIXI.Loader Loader} middleware for loading * texture atlases that have been created with TexturePacker or * similar JSON-based spritesheet. This automatically generates * Texture resources. * @class * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin */ export default class SpritesheetLoader { /** - * Middleware function to support Spritesheets, this is automatically installed. - * @see PIXI.loaders.Loader.useMiddleware + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next */ - static middleware() + static use(resource, next) { - return function spritesheetLoader(resource, next) + const imageResourceName = `${resource.name}_image`; + + // skip if no data, its not json, it isn't spritesheet data, or the image resource already exists + if (!resource.data + || resource.type !== LoaderResource.TYPE.JSON + || !resource.data.frames + || this.resources[imageResourceName] + ) { - const imageResourceName = `${resource.name}_image`; + next(); - // skip if no data, its not json, it isn't spritesheet data, or the image resource already exists - if (!resource.data - || resource.type !== Resource.TYPE.JSON - || !resource.data.frames - || this.resources[imageResourceName] - ) - { - next(); + return; + } - return; - } - - const loadOptions = { - crossOrigin: resource.crossOrigin, - loadType: Resource.LOAD_TYPE.IMAGE, - metadata: resource.metadata.imageMetadata, - parentResource: resource, - }; - - const resourcePath = SpritesheetLoader.getResourcePath(resource, this.baseUrl); - - // load the image for this sheet - this.add(imageResourceName, resourcePath, loadOptions, function onImageLoad(res) - { - const spritesheet = new Spritesheet( - res.texture.baseTexture, - resource.data, - resource.url - ); - - spritesheet.parse(() => - { - resource.spritesheet = spritesheet; - resource.textures = spritesheet.textures; - next(); - }); - }); + const loadOptions = { + crossOrigin: resource.crossOrigin, + loadType: LoaderResource.LOAD_TYPE.IMAGE, + metadata: resource.metadata.imageMetadata, + parentResource: resource, }; + + const resourcePath = SpritesheetLoader.getResourcePath(resource, this.baseUrl); + + // load the image for this sheet + this.add(imageResourceName, resourcePath, loadOptions, function onImageLoad(res) + { + const spritesheet = new Spritesheet( + res.texture.baseTexture, + resource.data, + resource.url + ); + + spritesheet.parse(() => + { + resource.spritesheet = spritesheet; + resource.textures = spritesheet.textures; + next(); + }); + }); } /** * Get the spritesheets root path - * @param {PIXI.loader.Resource} resource - Resource to check path + * @param {PIXI.LoaderResource} resource - Resource to check path * @param {string} baseUrl - Base root url */ static getResourcePath(resource, baseUrl) @@ -78,6 +78,3 @@ return url.resolve(resource.url.replace(baseUrl, ''), resource.data.meta.image); } } - -// Install loader support for Spritesheet objects -Loader.useMiddleware(SpritesheetLoader.middleware); diff --git a/packages/spritesheet/test/SpritesheetLoader.js b/packages/spritesheet/test/SpritesheetLoader.js index e4205ec..4f2f79b 100644 --- a/packages/spritesheet/test/SpritesheetLoader.js +++ b/packages/spritesheet/test/SpritesheetLoader.js @@ -1,5 +1,5 @@ const path = require('path'); -const { Loader, Resource } = require('@pixi/loaders'); +const { Loader, LoaderResource } = require('@pixi/loaders'); const { Texture, BaseTexture } = require('@pixi/core'); const { SpritesheetLoader } = require('../'); @@ -7,8 +7,13 @@ { it('should exist and return a function', function () { - expect(SpritesheetLoader.middleware).to.be.a('function'); - expect(SpritesheetLoader.middleware()).to.be.a('function'); + expect(SpritesheetLoader).to.not.be.undefined; + expect(SpritesheetLoader.use).to.be.a('function'); + }); + + it('should install middleware', function () + { + Loader.registerPlugin(SpritesheetLoader); }); it('should do nothing if the resource is not JSON', function () @@ -16,7 +21,7 @@ const spy = sinon.spy(); const res = {}; - SpritesheetLoader.middleware()(res, spy); + SpritesheetLoader.use(res, spy); expect(spy).to.have.been.calledOnce; expect(res.textures).to.be.undefined; @@ -25,9 +30,9 @@ it('should do nothing if the resource is JSON, but improper format', function () { const spy = sinon.spy(); - const res = createMockResource(Resource.TYPE.JSON, {}); + const res = createMockResource(LoaderResource.TYPE.JSON, {}); - SpritesheetLoader.middleware()(res, spy); + SpritesheetLoader.use(res, spy); expect(spy).to.have.been.calledOnce; expect(res.textures).to.be.undefined; @@ -36,16 +41,16 @@ it('should load the image & create textures if json is properly formatted', function () { const spy = sinon.spy(); - const res = createMockResource(Resource.TYPE.JSON, getJsonSpritesheet()); + const res = createMockResource(LoaderResource.TYPE.JSON, getJsonSpritesheet()); const loader = new Loader(); const addStub = sinon.stub(loader, 'add'); - const imgRes = createMockResource(Resource.TYPE.IMAGE, new Image()); + const imgRes = createMockResource(LoaderResource.TYPE.IMAGE, new Image()); imgRes.texture = new Texture(new BaseTexture(imgRes.data)); addStub.yields(imgRes); - SpritesheetLoader.middleware().call(loader, res, spy); + SpritesheetLoader.use.call(loader, res, spy); addStub.restore(); diff --git a/bundles/pixi.js-legacy/test/index.js b/bundles/pixi.js-legacy/test/index.js index c7cc855..a29651e 100755 --- a/bundles/pixi.js-legacy/test/index.js +++ b/bundles/pixi.js-legacy/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js/src/PIXI.js b/bundles/pixi.js/src/PIXI.js index 75e5658..ae40c7e 100644 --- a/bundles/pixi.js/src/PIXI.js +++ b/bundles/pixi.js/src/PIXI.js @@ -12,6 +12,7 @@ export * from '@pixi/display'; export * from '@pixi/mesh'; export * from '@pixi/ticker'; +export * from '@pixi/loaders'; import { Renderer } from '@pixi/core'; import * as interaction from '@pixi/interaction'; @@ -22,10 +23,12 @@ import { TilingSpriteRenderer } from '@pixi/sprite-tiling'; import { GraphicsRenderer } from '@pixi/graphics'; import * as accessibility from '@pixi/accessibility'; -import * as loaders from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; import * as filters from './filters'; import * as utils from '@pixi/utils'; import { settings } from '@pixi/settings'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager); Renderer.registerPlugin('extract', extract.Extract); @@ -36,6 +39,9 @@ Renderer.registerPlugin('sprite', SpriteRenderer); Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer); +Loader.registerPlugin(SpritesheetLoader); +Loader.registerPlugin(BitmapFontLoader); + import '@pixi/mixin-cache-as-bitmap'; import '@pixi/mixin-get-child-by-name'; import '@pixi/mixin-get-global-position'; @@ -43,20 +49,11 @@ utils.mixins.performMixins(); -/** - * Alias for {@link PIXI.loaders.shared}. - * @name loader - * @memberof PIXI - * @type {PIXI.loader.Loader} - */ -export const loader = loaders.shared; - export { accessibility, extract, filters, interaction, - loaders, prepare, utils, settings, diff --git a/bundles/pixi.js/src/deprecated.js b/bundles/pixi.js/src/deprecated.js index 402176f..e59c66a 100644 --- a/bundles/pixi.js/src/deprecated.js +++ b/bundles/pixi.js/src/deprecated.js @@ -131,6 +131,22 @@ return PIXI.utils.CanvasRenderTarget; }, }, + + /** + * @memberof PIXI + * @name loader + * @type {PIXI.Loader} + * @see PIXI.Loader.shared + * @deprecated since 5.0.0 + */ + loader: { + get() + { + warn('PIXI.loader has moved to PIXI.Loader.shared'); + + return PIXI.Loader.shared; + }, + }, }); /** @@ -351,34 +367,51 @@ }, }); - Object.defineProperties(PIXI.loaders.Loader, { - /** - * @function PIXI.loaders.Loader.addPixiMiddleware - * @see PIXI.loaders.Loader.useMiddleware - * @deprecated since 5.0.0 - */ - addPixiMiddleware: { - get() - { - warn('PIXI.loaders.Loader.addPixiMiddleware has moved to PIXI.loaders.Loader.useMiddleware'); - - return PIXI.loaders.Loader.useMiddleware; - }, - }, - }); + /** + * All classes on this namespace have moved to the high-level `PIXI` object. + * @namespace PIXI.loaders + * @deprecated since 5.0.0 + */ + PIXI.loaders = {}; Object.defineProperties(PIXI.loaders, { /** + * @class PIXI.loaders.Loader + * @see PIXI.Loader + * @deprecated since 5.0.0 + */ + Loader: { + get() + { + warn('PIXI.loaders.Loader has moved to PIXI.Loader'); + + return PIXI.Loader; + }, + }, + /** + * @class PIXI.loaders.Resource + * @see PIXI.LoaderResource + * @deprecated since 5.0.0 + */ + Resource: { + get() + { + warn('PIXI.loaders.Resource has moved to PIXI.LoaderResource'); + + return PIXI.LoaderResource; + }, + }, + /** * @function PIXI.loaders.bitmapFontParser - * @see PIXI.BitmapFontLoader.middleware + * @see PIXI.BitmapFontLoader.use * @deprecated since 5.0.0 */ bitmapFontParser: { get() { - warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.middleware'); + warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.use'); - return PIXI.BitmapFontLoader.middleware; + return PIXI.BitmapFontLoader.use; }, }, /** @@ -396,15 +429,15 @@ }, /** * @function PIXI.loaders.spritesheetParser - * @see PIXI.SpritesheetLoader.middleware + * @see PIXI.SpritesheetLoader.use * @deprecated since 5.0.0 */ spritesheetParser: { get() { - warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.middleware'); + warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.use'); - return PIXI.SpritesheetLoader.middleware; + return PIXI.SpritesheetLoader.use; }, }, /** @@ -423,6 +456,19 @@ }); /** + * @function PIXI.loaders.Loader.addPixiMiddleware + * @see PIXI.Loader.registerPlugin + * @deprecated since 5.0.0 + * @param {function} middleware + */ + PIXI.Loader.addPixiMiddleware = function addPixiMiddleware(middleware) + { + warn('PIXI.loaders.Loader.addPixiMiddleware is deprecated, use PIXI.loaders.Loader.registerPlugin'); + + return PIXI.loaders.Loader.registerPlugin({ use: middleware() }); + }; + + /** * @class PIXI.extract.WebGLExtract * @deprecated since 5.0.0 * @see PIXI.extract.Prepare diff --git a/bundles/pixi.js/test/index.js b/bundles/pixi.js/test/index.js index c7cc855..a29651e 100644 --- a/bundles/pixi.js/test/index.js +++ b/bundles/pixi.js/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/packages/app/src/Application.js b/packages/app/src/Application.js index 50f9fa1..ef40610 100644 --- a/packages/app/src/Application.js +++ b/packages/app/src/Application.js @@ -51,7 +51,7 @@ * @param {string} [options.powerPreference] - Parameter passed to webgl context, set to "high-performance" * for devices with dual graphics card **webgl only** * @param {boolean} [options.sharedTicker=false] - `true` to use PIXI.Ticker.shared, `false` to create new ticker. - * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.loaders.shared, `false` to create new Loader. + * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.Loaders.shared, `false` to create new Loader. */ constructor(options, arg2, arg3, arg4, arg5) { diff --git a/packages/loaders/src/Loader.js b/packages/loaders/src/Loader.js index 6f6e9bd..ecba1b0 100644 --- a/packages/loaders/src/Loader.js +++ b/packages/loaders/src/Loader.js @@ -1,16 +1,16 @@ import ResourceLoader from 'resource-loader'; import EventEmitter from 'eventemitter3'; import { blobMiddlewareFactory } from 'resource-loader/lib/middlewares/parsing/blob'; -import textureParser from './textureParser'; +import TextureLoader from './TextureLoader'; /** * * The new loader, extends Resource Loader by Chad Engler: https://github.com/englercj/resource-loader * * ```js - * const loader = PIXI.loader; // PixiJS exposes a premade instance for you to use. + * const loader = PIXI.Loader.shared; // PixiJS exposes a premade instance for you to use. * //or - * const loader = new PIXI.loaders.Loader(); // you can also create your own if you want + * const loader = new PIXI.Loader(); // you can also create your own if you want * * const sprites = {}; * @@ -52,20 +52,31 @@ * * @class Loader * @extends module:resource-loader.ResourceLoader - * @memberof PIXI.loaders + * @memberof PIXI * @param {string} [baseUrl=''] - The base url for all resources loaded by this loader. * @param {number} [concurrency=10] - The number of resources to load concurrently. */ -export class Loader extends ResourceLoader +export default class Loader extends ResourceLoader { constructor(baseUrl, concurrency) { super(baseUrl, concurrency); EventEmitter.call(this); - for (let i = 0; i < Loader._middleware.length; ++i) + for (let i = 0; i < Loader._plugins.length; ++i) { - this.use(Loader._middleware[i]()); + const plugin = Loader._plugins[i]; + const { pre, use } = plugin; + + if (pre) + { + this.pre(pre.bind(plugin)); + } + + if (use) + { + this.use(use.bind(plugin)); + } } // Compat layer, translate the new v2 signals into old v1 events. @@ -95,50 +106,82 @@ this.reset(); } } + + /** + * A premade instance of the loader that can be used to load resources. + * @name shared + * @type {PIXI.Loader} + * @static + * @memberof PIXI.Loader + */ + static get shared() + { + let shared = Loader._shared; + + if (!shared) + { + shared = new Loader(); + shared._protected = true; + Loader._shared = shared; + } + + return shared; + } } // Copy EE3 prototype (mixin) Object.assign(Loader.prototype, EventEmitter.prototype); /** - * Collection of all installed middleware for Loader. + * Collection of all installed `use` middleware for Loader. * * @static - * @member {Array} - * @memberof PIXI.loaders.Loader + * @member {Array} + * @memberof PIXI.Loader * @private */ -Loader._middleware = []; +Loader._plugins = []; /** - * A premade instance of the loader that can be used to load resources. - * @name shared - * @memberof PIXI.loaders - * @type {PIXI.loaders.Loader} - */ -export const shared = new Loader(); -shared._protected = true; - -/** - * Adds a middleware for the global shared loader and all + * Adds a Loader plugin for the global shared loader and all * new Loader instances created. * * @static - * @method useMiddleware - * @memberof PIXI.loaders.Loader - * @param {Function} fn - The middleware to add. + * @method registerPlugin + * @memberof PIXI.Loader + * @param {PIXI.Loader~LoaderPlugin} plugin - The plugin to add + * @return {PIXI.Loader} Reference to PIXI.Loader for chaining */ -Loader.useMiddleware = function useMiddleware(fn) +Loader.registerPlugin = function registerPlugin(plugin) { - // Install for current shared loader - shared.use(fn); + Loader._plugins.push(plugin); - // Install for all future loaders - Loader._middleware.push(fn); + if (plugin.add) + { + plugin.add(); + } + + return Loader; }; // parse any blob into more usable objects (e.g. Image) -Loader.useMiddleware(blobMiddlewareFactory); +Loader.registerPlugin({ use: blobMiddlewareFactory() }); // parse any Image objects into textures -Loader.useMiddleware(textureParser); +Loader.registerPlugin(TextureLoader); + +/** + * Plugin to be installed for handling specific Loader resources. + * @typedef {object} PIXI.Loader~LoaderPlugin + * @property {function} [plugin.add] - Function to call immediate after registering plugin. + * @property {PIXI.Loader~loaderMiddleware} [plugin.pre] - Middleware function to run before load, the + * arguments for this are `(resource, next)` + * @property {PIXI.Loader~loaderMiddleware} [plugin.use] - Middleware function to run after load, the + * arguments for this are `(resource, next)` + */ + +/** + * @callback PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ diff --git a/packages/loaders/src/TextureLoader.js b/packages/loaders/src/TextureLoader.js new file mode 100644 index 0000000..5094c8e --- /dev/null +++ b/packages/loaders/src/TextureLoader.js @@ -0,0 +1,31 @@ +import { Resource } from 'resource-loader'; +import { Texture } from '@pixi/core'; + +/** + * Loader plugin for handling Texture resources. + * @class + * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin + */ +export default class TextureLoader +{ + /** + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ + static use(resource, next) + { + // create a new texture if the data is an Image object + if (resource.data && resource.type === Resource.TYPE.IMAGE) + { + resource.texture = Texture.fromLoader( + resource.data, + resource.url, + resource.name + ); + } + next(); + } +} diff --git a/packages/loaders/src/index.js b/packages/loaders/src/index.js index 8e816cc..3e877fe 100644 --- a/packages/loaders/src/index.js +++ b/packages/loaders/src/index.js @@ -1,24 +1,11 @@ +import { Resource } from 'resource-loader'; /** * Reference to **{@link https://github.com/englercj/resource-loader * resource-loader}**'s Resource class. * @see http://englercj.github.io/resource-loader/Resource.html - * @class Resource - * @memberof PIXI.loaders + * @class LoaderResource + * @memberof PIXI */ -export { Resource } from 'resource-loader'; - -/** - * This namespace contains APIs which extends the {@link https://github.com/englercj/resource-loader resource-loader} module - * for loading assets, data, and other resources dynamically. - * @example - * const loader = new PIXI.loaders.Loader(); - * loader.add('bunny', 'data/bunny.png') - * .add('spaceship', 'assets/spritesheet.json'); - * loader.load((loader, resources) => { - * // resources.bunny - * // resources.spaceship - * }); - * @namespace PIXI.loaders - */ -export { Loader, shared } from './Loader'; -export { default as textureParser } from './textureParser'; +export const LoaderResource = Resource; +export { default as Loader } from './Loader'; +export { default as TextureLoader } from './TextureLoader'; diff --git a/packages/loaders/src/textureParser.js b/packages/loaders/src/textureParser.js deleted file mode 100644 index 9dba8bd..0000000 --- a/packages/loaders/src/textureParser.js +++ /dev/null @@ -1,19 +0,0 @@ -import { Resource } from 'resource-loader'; -import { Texture } from '@pixi/core'; - -export default function () -{ - return function textureParser(resource, next) - { - // create a new texture if the data is an Image object - if (resource.data && resource.type === Resource.TYPE.IMAGE) - { - resource.texture = Texture.fromLoader( - resource.data, - resource.url, - resource.name - ); - } - next(); - }; -} diff --git a/packages/loaders/test/Loader.js b/packages/loaders/test/Loader.js new file mode 100644 index 0000000..1a62a86 --- /dev/null +++ b/packages/loaders/test/Loader.js @@ -0,0 +1,15 @@ +const { Loader } = require('../'); + +describe('PIXI.Loader', function () +{ + it('should exist', function () + { + expect(Loader).to.be.a('function'); + }); + + it('should have shared loader', function () + { + expect(Loader.shared).to.not.be.undefined; + expect(Loader.shared).to.be.instanceof(Loader); + }); +}); diff --git a/packages/loaders/test/TextureLoader.js b/packages/loaders/test/TextureLoader.js new file mode 100644 index 0000000..db53f7c --- /dev/null +++ b/packages/loaders/test/TextureLoader.js @@ -0,0 +1,52 @@ +const { TextureLoader, LoaderResource } = require('../'); +const { Texture } = require('@pixi/core'); +const { BaseTextureCache, TextureCache } = require('@pixi/utils'); + +describe('PIXI.TextureLoader', function () +{ + it('should exist and return a function', function () + { + expect(TextureLoader).to.not.be.undefined; + expect(TextureLoader.use).to.be.a('function'); + }); + + it('should do nothing if the resource is not an image', function () + { + const spy = sinon.spy(); + const res = {}; + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.undefined; + }); + + it('should create a texture if resource is an image', function () + { + const spy = sinon.spy(); + const res = createMockResource(LoaderResource.TYPE.IMAGE, new Image()); + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.an.instanceof(Texture); + + expect(BaseTextureCache).to.have.property(res.name, res.texture.baseTexture); + expect(BaseTextureCache).to.have.property(res.url, res.texture.baseTexture); + + expect(TextureCache).to.have.property(res.name, res.texture); + expect(TextureCache).to.have.property(res.url, res.texture); + }); +}); + +function createMockResource(type, data) +{ + const name = `${Math.floor(Date.now() * Math.random())}`; + + return { + url: `http://localhost/doesnt_exist/${name}`, + name, + type, + data, + }; +} diff --git a/packages/loaders/test/index.js b/packages/loaders/test/index.js index 72c6554..8913167 100644 --- a/packages/loaders/test/index.js +++ b/packages/loaders/test/index.js @@ -1,2 +1,2 @@ -require('./loader'); -require('./textureParser'); +require('./Loader'); +require('./TextureLoader'); diff --git a/packages/loaders/test/loader.js b/packages/loaders/test/loader.js deleted file mode 100644 index 5b8571b..0000000 --- a/packages/loaders/test/loader.js +++ /dev/null @@ -1,9 +0,0 @@ -const { Loader } = require('../'); - -describe('PIXI.loaders.Loader', function () -{ - it('should exist', function () - { - expect(Loader).to.be.a('function'); - }); -}); diff --git a/packages/loaders/test/textureParser.js b/packages/loaders/test/textureParser.js deleted file mode 100644 index b5b2179..0000000 --- a/packages/loaders/test/textureParser.js +++ /dev/null @@ -1,52 +0,0 @@ -const { textureParser, Resource } = require('../'); -const { Texture } = require('@pixi/core'); -const { BaseTextureCache, TextureCache } = require('@pixi/utils'); - -describe('PIXI.loaders.textureParser', function () -{ - it('should exist and return a function', function () - { - expect(textureParser).to.be.a('function'); - expect(textureParser()).to.be.a('function'); - }); - - it('should do nothing if the resource is not an image', function () - { - const spy = sinon.spy(); - const res = {}; - - textureParser()(res, spy); - - expect(spy).to.have.been.calledOnce; - expect(res.texture).to.be.undefined; - }); - - it('should create a texture if resource is an image', function () - { - const spy = sinon.spy(); - const res = createMockResource(Resource.TYPE.IMAGE, new Image()); - - textureParser()(res, spy); - - expect(spy).to.have.been.calledOnce; - expect(res.texture).to.be.an.instanceof(Texture); - - expect(BaseTextureCache).to.have.property(res.name, res.texture.baseTexture); - expect(BaseTextureCache).to.have.property(res.url, res.texture.baseTexture); - - expect(TextureCache).to.have.property(res.name, res.texture); - expect(TextureCache).to.have.property(res.url, res.texture); - }); -}); - -function createMockResource(type, data) -{ - const name = `${Math.floor(Date.now() * Math.random())}`; - - return { - url: `http://localhost/doesnt_exist/${name}`, - name, - type, - data, - }; -} diff --git a/packages/mixin-app-loader/src/index.js b/packages/mixin-app-loader/src/index.js index 354997a..ab28882 100644 --- a/packages/mixin-app-loader/src/index.js +++ b/packages/mixin-app-loader/src/index.js @@ -1,12 +1,12 @@ import { Application } from '@pixi/app'; -import { Loader, shared } from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; Application.prototype._loader = null; /** * Loader instance to help with asset loading. * @name PIXI.Application#loader - * @type {PIXI.loaders.Loader} + * @type {PIXI.Loader} */ Object.defineProperties(Application.prototype, { loader: { @@ -16,7 +16,7 @@ { const { sharedLoader } = this._options; - this._loader = sharedLoader ? shared : new Loader(); + this._loader = sharedLoader ? Loader.shared : new Loader(); } return this._loader; diff --git a/packages/mixin-app-loader/test/index.js b/packages/mixin-app-loader/test/index.js index 4739863..7eb948b 100644 --- a/packages/mixin-app-loader/test/index.js +++ b/packages/mixin-app-loader/test/index.js @@ -1,5 +1,5 @@ const { Application } = require('@pixi/app'); -const { Loader, shared } = require('@pixi/loaders'); +const { Loader } = require('@pixi/loaders'); const { skipHello } = require('@pixi/utils'); const { autoDetectRenderer } = require('@pixi/canvas-renderer'); @@ -30,7 +30,7 @@ expect(obj.loader).to.be.not.undefined; expect(obj.loader).to.be.instanceof(Loader); - expect(obj.loader).to.equal(shared); + expect(obj.loader).to.equal(Loader.shared); obj.destroy(); diff --git a/packages/spritesheet/README.md b/packages/spritesheet/README.md index 2bf764b..7c26b10 100644 --- a/packages/spritesheet/README.md +++ b/packages/spritesheet/README.md @@ -9,5 +9,7 @@ ## Usage ```js -import * as spritesheet from '@pixi/spritesheet'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { Loader } from '@pixi/loaders'; +Loader.registerPlugin(SpritesheetLoader); ``` \ No newline at end of file diff --git a/packages/spritesheet/src/SpritesheetLoader.js b/packages/spritesheet/src/SpritesheetLoader.js index c7b34ea..0a19954 100644 --- a/packages/spritesheet/src/SpritesheetLoader.js +++ b/packages/spritesheet/src/SpritesheetLoader.js @@ -1,70 +1,70 @@ import url from 'url'; -import { Resource, Loader } from '@pixi/loaders'; +import { LoaderResource } from '@pixi/loaders'; import Spritesheet from './Spritesheet'; /** - * {@link PIXI.loaders.Loader Loader} middleware for loading + * {@link PIXI.Loader Loader} middleware for loading * texture atlases that have been created with TexturePacker or * similar JSON-based spritesheet. This automatically generates * Texture resources. * @class * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin */ export default class SpritesheetLoader { /** - * Middleware function to support Spritesheets, this is automatically installed. - * @see PIXI.loaders.Loader.useMiddleware + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next */ - static middleware() + static use(resource, next) { - return function spritesheetLoader(resource, next) + const imageResourceName = `${resource.name}_image`; + + // skip if no data, its not json, it isn't spritesheet data, or the image resource already exists + if (!resource.data + || resource.type !== LoaderResource.TYPE.JSON + || !resource.data.frames + || this.resources[imageResourceName] + ) { - const imageResourceName = `${resource.name}_image`; + next(); - // skip if no data, its not json, it isn't spritesheet data, or the image resource already exists - if (!resource.data - || resource.type !== Resource.TYPE.JSON - || !resource.data.frames - || this.resources[imageResourceName] - ) - { - next(); + return; + } - return; - } - - const loadOptions = { - crossOrigin: resource.crossOrigin, - loadType: Resource.LOAD_TYPE.IMAGE, - metadata: resource.metadata.imageMetadata, - parentResource: resource, - }; - - const resourcePath = SpritesheetLoader.getResourcePath(resource, this.baseUrl); - - // load the image for this sheet - this.add(imageResourceName, resourcePath, loadOptions, function onImageLoad(res) - { - const spritesheet = new Spritesheet( - res.texture.baseTexture, - resource.data, - resource.url - ); - - spritesheet.parse(() => - { - resource.spritesheet = spritesheet; - resource.textures = spritesheet.textures; - next(); - }); - }); + const loadOptions = { + crossOrigin: resource.crossOrigin, + loadType: LoaderResource.LOAD_TYPE.IMAGE, + metadata: resource.metadata.imageMetadata, + parentResource: resource, }; + + const resourcePath = SpritesheetLoader.getResourcePath(resource, this.baseUrl); + + // load the image for this sheet + this.add(imageResourceName, resourcePath, loadOptions, function onImageLoad(res) + { + const spritesheet = new Spritesheet( + res.texture.baseTexture, + resource.data, + resource.url + ); + + spritesheet.parse(() => + { + resource.spritesheet = spritesheet; + resource.textures = spritesheet.textures; + next(); + }); + }); } /** * Get the spritesheets root path - * @param {PIXI.loader.Resource} resource - Resource to check path + * @param {PIXI.LoaderResource} resource - Resource to check path * @param {string} baseUrl - Base root url */ static getResourcePath(resource, baseUrl) @@ -78,6 +78,3 @@ return url.resolve(resource.url.replace(baseUrl, ''), resource.data.meta.image); } } - -// Install loader support for Spritesheet objects -Loader.useMiddleware(SpritesheetLoader.middleware); diff --git a/packages/spritesheet/test/SpritesheetLoader.js b/packages/spritesheet/test/SpritesheetLoader.js index e4205ec..4f2f79b 100644 --- a/packages/spritesheet/test/SpritesheetLoader.js +++ b/packages/spritesheet/test/SpritesheetLoader.js @@ -1,5 +1,5 @@ const path = require('path'); -const { Loader, Resource } = require('@pixi/loaders'); +const { Loader, LoaderResource } = require('@pixi/loaders'); const { Texture, BaseTexture } = require('@pixi/core'); const { SpritesheetLoader } = require('../'); @@ -7,8 +7,13 @@ { it('should exist and return a function', function () { - expect(SpritesheetLoader.middleware).to.be.a('function'); - expect(SpritesheetLoader.middleware()).to.be.a('function'); + expect(SpritesheetLoader).to.not.be.undefined; + expect(SpritesheetLoader.use).to.be.a('function'); + }); + + it('should install middleware', function () + { + Loader.registerPlugin(SpritesheetLoader); }); it('should do nothing if the resource is not JSON', function () @@ -16,7 +21,7 @@ const spy = sinon.spy(); const res = {}; - SpritesheetLoader.middleware()(res, spy); + SpritesheetLoader.use(res, spy); expect(spy).to.have.been.calledOnce; expect(res.textures).to.be.undefined; @@ -25,9 +30,9 @@ it('should do nothing if the resource is JSON, but improper format', function () { const spy = sinon.spy(); - const res = createMockResource(Resource.TYPE.JSON, {}); + const res = createMockResource(LoaderResource.TYPE.JSON, {}); - SpritesheetLoader.middleware()(res, spy); + SpritesheetLoader.use(res, spy); expect(spy).to.have.been.calledOnce; expect(res.textures).to.be.undefined; @@ -36,16 +41,16 @@ it('should load the image & create textures if json is properly formatted', function () { const spy = sinon.spy(); - const res = createMockResource(Resource.TYPE.JSON, getJsonSpritesheet()); + const res = createMockResource(LoaderResource.TYPE.JSON, getJsonSpritesheet()); const loader = new Loader(); const addStub = sinon.stub(loader, 'add'); - const imgRes = createMockResource(Resource.TYPE.IMAGE, new Image()); + const imgRes = createMockResource(LoaderResource.TYPE.IMAGE, new Image()); imgRes.texture = new Texture(new BaseTexture(imgRes.data)); addStub.yields(imgRes); - SpritesheetLoader.middleware().call(loader, res, spy); + SpritesheetLoader.use.call(loader, res, spy); addStub.restore(); diff --git a/packages/text-bitmap/README.md b/packages/text-bitmap/README.md index 4db8d56..72fcdb3 100644 --- a/packages/text-bitmap/README.md +++ b/packages/text-bitmap/README.md @@ -9,5 +9,7 @@ ## Usage ```js -import '@pixi/text-bitmap'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; +import { Loader } from '@pixi/loders'; +Loader.registerPlugin(BitmapFontLoader); ``` \ No newline at end of file diff --git a/bundles/pixi.js-legacy/test/index.js b/bundles/pixi.js-legacy/test/index.js index c7cc855..a29651e 100755 --- a/bundles/pixi.js-legacy/test/index.js +++ b/bundles/pixi.js-legacy/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js/src/PIXI.js b/bundles/pixi.js/src/PIXI.js index 75e5658..ae40c7e 100644 --- a/bundles/pixi.js/src/PIXI.js +++ b/bundles/pixi.js/src/PIXI.js @@ -12,6 +12,7 @@ export * from '@pixi/display'; export * from '@pixi/mesh'; export * from '@pixi/ticker'; +export * from '@pixi/loaders'; import { Renderer } from '@pixi/core'; import * as interaction from '@pixi/interaction'; @@ -22,10 +23,12 @@ import { TilingSpriteRenderer } from '@pixi/sprite-tiling'; import { GraphicsRenderer } from '@pixi/graphics'; import * as accessibility from '@pixi/accessibility'; -import * as loaders from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; import * as filters from './filters'; import * as utils from '@pixi/utils'; import { settings } from '@pixi/settings'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager); Renderer.registerPlugin('extract', extract.Extract); @@ -36,6 +39,9 @@ Renderer.registerPlugin('sprite', SpriteRenderer); Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer); +Loader.registerPlugin(SpritesheetLoader); +Loader.registerPlugin(BitmapFontLoader); + import '@pixi/mixin-cache-as-bitmap'; import '@pixi/mixin-get-child-by-name'; import '@pixi/mixin-get-global-position'; @@ -43,20 +49,11 @@ utils.mixins.performMixins(); -/** - * Alias for {@link PIXI.loaders.shared}. - * @name loader - * @memberof PIXI - * @type {PIXI.loader.Loader} - */ -export const loader = loaders.shared; - export { accessibility, extract, filters, interaction, - loaders, prepare, utils, settings, diff --git a/bundles/pixi.js/src/deprecated.js b/bundles/pixi.js/src/deprecated.js index 402176f..e59c66a 100644 --- a/bundles/pixi.js/src/deprecated.js +++ b/bundles/pixi.js/src/deprecated.js @@ -131,6 +131,22 @@ return PIXI.utils.CanvasRenderTarget; }, }, + + /** + * @memberof PIXI + * @name loader + * @type {PIXI.Loader} + * @see PIXI.Loader.shared + * @deprecated since 5.0.0 + */ + loader: { + get() + { + warn('PIXI.loader has moved to PIXI.Loader.shared'); + + return PIXI.Loader.shared; + }, + }, }); /** @@ -351,34 +367,51 @@ }, }); - Object.defineProperties(PIXI.loaders.Loader, { - /** - * @function PIXI.loaders.Loader.addPixiMiddleware - * @see PIXI.loaders.Loader.useMiddleware - * @deprecated since 5.0.0 - */ - addPixiMiddleware: { - get() - { - warn('PIXI.loaders.Loader.addPixiMiddleware has moved to PIXI.loaders.Loader.useMiddleware'); - - return PIXI.loaders.Loader.useMiddleware; - }, - }, - }); + /** + * All classes on this namespace have moved to the high-level `PIXI` object. + * @namespace PIXI.loaders + * @deprecated since 5.0.0 + */ + PIXI.loaders = {}; Object.defineProperties(PIXI.loaders, { /** + * @class PIXI.loaders.Loader + * @see PIXI.Loader + * @deprecated since 5.0.0 + */ + Loader: { + get() + { + warn('PIXI.loaders.Loader has moved to PIXI.Loader'); + + return PIXI.Loader; + }, + }, + /** + * @class PIXI.loaders.Resource + * @see PIXI.LoaderResource + * @deprecated since 5.0.0 + */ + Resource: { + get() + { + warn('PIXI.loaders.Resource has moved to PIXI.LoaderResource'); + + return PIXI.LoaderResource; + }, + }, + /** * @function PIXI.loaders.bitmapFontParser - * @see PIXI.BitmapFontLoader.middleware + * @see PIXI.BitmapFontLoader.use * @deprecated since 5.0.0 */ bitmapFontParser: { get() { - warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.middleware'); + warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.use'); - return PIXI.BitmapFontLoader.middleware; + return PIXI.BitmapFontLoader.use; }, }, /** @@ -396,15 +429,15 @@ }, /** * @function PIXI.loaders.spritesheetParser - * @see PIXI.SpritesheetLoader.middleware + * @see PIXI.SpritesheetLoader.use * @deprecated since 5.0.0 */ spritesheetParser: { get() { - warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.middleware'); + warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.use'); - return PIXI.SpritesheetLoader.middleware; + return PIXI.SpritesheetLoader.use; }, }, /** @@ -423,6 +456,19 @@ }); /** + * @function PIXI.loaders.Loader.addPixiMiddleware + * @see PIXI.Loader.registerPlugin + * @deprecated since 5.0.0 + * @param {function} middleware + */ + PIXI.Loader.addPixiMiddleware = function addPixiMiddleware(middleware) + { + warn('PIXI.loaders.Loader.addPixiMiddleware is deprecated, use PIXI.loaders.Loader.registerPlugin'); + + return PIXI.loaders.Loader.registerPlugin({ use: middleware() }); + }; + + /** * @class PIXI.extract.WebGLExtract * @deprecated since 5.0.0 * @see PIXI.extract.Prepare diff --git a/bundles/pixi.js/test/index.js b/bundles/pixi.js/test/index.js index c7cc855..a29651e 100644 --- a/bundles/pixi.js/test/index.js +++ b/bundles/pixi.js/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/packages/app/src/Application.js b/packages/app/src/Application.js index 50f9fa1..ef40610 100644 --- a/packages/app/src/Application.js +++ b/packages/app/src/Application.js @@ -51,7 +51,7 @@ * @param {string} [options.powerPreference] - Parameter passed to webgl context, set to "high-performance" * for devices with dual graphics card **webgl only** * @param {boolean} [options.sharedTicker=false] - `true` to use PIXI.Ticker.shared, `false` to create new ticker. - * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.loaders.shared, `false` to create new Loader. + * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.Loaders.shared, `false` to create new Loader. */ constructor(options, arg2, arg3, arg4, arg5) { diff --git a/packages/loaders/src/Loader.js b/packages/loaders/src/Loader.js index 6f6e9bd..ecba1b0 100644 --- a/packages/loaders/src/Loader.js +++ b/packages/loaders/src/Loader.js @@ -1,16 +1,16 @@ import ResourceLoader from 'resource-loader'; import EventEmitter from 'eventemitter3'; import { blobMiddlewareFactory } from 'resource-loader/lib/middlewares/parsing/blob'; -import textureParser from './textureParser'; +import TextureLoader from './TextureLoader'; /** * * The new loader, extends Resource Loader by Chad Engler: https://github.com/englercj/resource-loader * * ```js - * const loader = PIXI.loader; // PixiJS exposes a premade instance for you to use. + * const loader = PIXI.Loader.shared; // PixiJS exposes a premade instance for you to use. * //or - * const loader = new PIXI.loaders.Loader(); // you can also create your own if you want + * const loader = new PIXI.Loader(); // you can also create your own if you want * * const sprites = {}; * @@ -52,20 +52,31 @@ * * @class Loader * @extends module:resource-loader.ResourceLoader - * @memberof PIXI.loaders + * @memberof PIXI * @param {string} [baseUrl=''] - The base url for all resources loaded by this loader. * @param {number} [concurrency=10] - The number of resources to load concurrently. */ -export class Loader extends ResourceLoader +export default class Loader extends ResourceLoader { constructor(baseUrl, concurrency) { super(baseUrl, concurrency); EventEmitter.call(this); - for (let i = 0; i < Loader._middleware.length; ++i) + for (let i = 0; i < Loader._plugins.length; ++i) { - this.use(Loader._middleware[i]()); + const plugin = Loader._plugins[i]; + const { pre, use } = plugin; + + if (pre) + { + this.pre(pre.bind(plugin)); + } + + if (use) + { + this.use(use.bind(plugin)); + } } // Compat layer, translate the new v2 signals into old v1 events. @@ -95,50 +106,82 @@ this.reset(); } } + + /** + * A premade instance of the loader that can be used to load resources. + * @name shared + * @type {PIXI.Loader} + * @static + * @memberof PIXI.Loader + */ + static get shared() + { + let shared = Loader._shared; + + if (!shared) + { + shared = new Loader(); + shared._protected = true; + Loader._shared = shared; + } + + return shared; + } } // Copy EE3 prototype (mixin) Object.assign(Loader.prototype, EventEmitter.prototype); /** - * Collection of all installed middleware for Loader. + * Collection of all installed `use` middleware for Loader. * * @static - * @member {Array} - * @memberof PIXI.loaders.Loader + * @member {Array} + * @memberof PIXI.Loader * @private */ -Loader._middleware = []; +Loader._plugins = []; /** - * A premade instance of the loader that can be used to load resources. - * @name shared - * @memberof PIXI.loaders - * @type {PIXI.loaders.Loader} - */ -export const shared = new Loader(); -shared._protected = true; - -/** - * Adds a middleware for the global shared loader and all + * Adds a Loader plugin for the global shared loader and all * new Loader instances created. * * @static - * @method useMiddleware - * @memberof PIXI.loaders.Loader - * @param {Function} fn - The middleware to add. + * @method registerPlugin + * @memberof PIXI.Loader + * @param {PIXI.Loader~LoaderPlugin} plugin - The plugin to add + * @return {PIXI.Loader} Reference to PIXI.Loader for chaining */ -Loader.useMiddleware = function useMiddleware(fn) +Loader.registerPlugin = function registerPlugin(plugin) { - // Install for current shared loader - shared.use(fn); + Loader._plugins.push(plugin); - // Install for all future loaders - Loader._middleware.push(fn); + if (plugin.add) + { + plugin.add(); + } + + return Loader; }; // parse any blob into more usable objects (e.g. Image) -Loader.useMiddleware(blobMiddlewareFactory); +Loader.registerPlugin({ use: blobMiddlewareFactory() }); // parse any Image objects into textures -Loader.useMiddleware(textureParser); +Loader.registerPlugin(TextureLoader); + +/** + * Plugin to be installed for handling specific Loader resources. + * @typedef {object} PIXI.Loader~LoaderPlugin + * @property {function} [plugin.add] - Function to call immediate after registering plugin. + * @property {PIXI.Loader~loaderMiddleware} [plugin.pre] - Middleware function to run before load, the + * arguments for this are `(resource, next)` + * @property {PIXI.Loader~loaderMiddleware} [plugin.use] - Middleware function to run after load, the + * arguments for this are `(resource, next)` + */ + +/** + * @callback PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ diff --git a/packages/loaders/src/TextureLoader.js b/packages/loaders/src/TextureLoader.js new file mode 100644 index 0000000..5094c8e --- /dev/null +++ b/packages/loaders/src/TextureLoader.js @@ -0,0 +1,31 @@ +import { Resource } from 'resource-loader'; +import { Texture } from '@pixi/core'; + +/** + * Loader plugin for handling Texture resources. + * @class + * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin + */ +export default class TextureLoader +{ + /** + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ + static use(resource, next) + { + // create a new texture if the data is an Image object + if (resource.data && resource.type === Resource.TYPE.IMAGE) + { + resource.texture = Texture.fromLoader( + resource.data, + resource.url, + resource.name + ); + } + next(); + } +} diff --git a/packages/loaders/src/index.js b/packages/loaders/src/index.js index 8e816cc..3e877fe 100644 --- a/packages/loaders/src/index.js +++ b/packages/loaders/src/index.js @@ -1,24 +1,11 @@ +import { Resource } from 'resource-loader'; /** * Reference to **{@link https://github.com/englercj/resource-loader * resource-loader}**'s Resource class. * @see http://englercj.github.io/resource-loader/Resource.html - * @class Resource - * @memberof PIXI.loaders + * @class LoaderResource + * @memberof PIXI */ -export { Resource } from 'resource-loader'; - -/** - * This namespace contains APIs which extends the {@link https://github.com/englercj/resource-loader resource-loader} module - * for loading assets, data, and other resources dynamically. - * @example - * const loader = new PIXI.loaders.Loader(); - * loader.add('bunny', 'data/bunny.png') - * .add('spaceship', 'assets/spritesheet.json'); - * loader.load((loader, resources) => { - * // resources.bunny - * // resources.spaceship - * }); - * @namespace PIXI.loaders - */ -export { Loader, shared } from './Loader'; -export { default as textureParser } from './textureParser'; +export const LoaderResource = Resource; +export { default as Loader } from './Loader'; +export { default as TextureLoader } from './TextureLoader'; diff --git a/packages/loaders/src/textureParser.js b/packages/loaders/src/textureParser.js deleted file mode 100644 index 9dba8bd..0000000 --- a/packages/loaders/src/textureParser.js +++ /dev/null @@ -1,19 +0,0 @@ -import { Resource } from 'resource-loader'; -import { Texture } from '@pixi/core'; - -export default function () -{ - return function textureParser(resource, next) - { - // create a new texture if the data is an Image object - if (resource.data && resource.type === Resource.TYPE.IMAGE) - { - resource.texture = Texture.fromLoader( - resource.data, - resource.url, - resource.name - ); - } - next(); - }; -} diff --git a/packages/loaders/test/Loader.js b/packages/loaders/test/Loader.js new file mode 100644 index 0000000..1a62a86 --- /dev/null +++ b/packages/loaders/test/Loader.js @@ -0,0 +1,15 @@ +const { Loader } = require('../'); + +describe('PIXI.Loader', function () +{ + it('should exist', function () + { + expect(Loader).to.be.a('function'); + }); + + it('should have shared loader', function () + { + expect(Loader.shared).to.not.be.undefined; + expect(Loader.shared).to.be.instanceof(Loader); + }); +}); diff --git a/packages/loaders/test/TextureLoader.js b/packages/loaders/test/TextureLoader.js new file mode 100644 index 0000000..db53f7c --- /dev/null +++ b/packages/loaders/test/TextureLoader.js @@ -0,0 +1,52 @@ +const { TextureLoader, LoaderResource } = require('../'); +const { Texture } = require('@pixi/core'); +const { BaseTextureCache, TextureCache } = require('@pixi/utils'); + +describe('PIXI.TextureLoader', function () +{ + it('should exist and return a function', function () + { + expect(TextureLoader).to.not.be.undefined; + expect(TextureLoader.use).to.be.a('function'); + }); + + it('should do nothing if the resource is not an image', function () + { + const spy = sinon.spy(); + const res = {}; + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.undefined; + }); + + it('should create a texture if resource is an image', function () + { + const spy = sinon.spy(); + const res = createMockResource(LoaderResource.TYPE.IMAGE, new Image()); + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.an.instanceof(Texture); + + expect(BaseTextureCache).to.have.property(res.name, res.texture.baseTexture); + expect(BaseTextureCache).to.have.property(res.url, res.texture.baseTexture); + + expect(TextureCache).to.have.property(res.name, res.texture); + expect(TextureCache).to.have.property(res.url, res.texture); + }); +}); + +function createMockResource(type, data) +{ + const name = `${Math.floor(Date.now() * Math.random())}`; + + return { + url: `http://localhost/doesnt_exist/${name}`, + name, + type, + data, + }; +} diff --git a/packages/loaders/test/index.js b/packages/loaders/test/index.js index 72c6554..8913167 100644 --- a/packages/loaders/test/index.js +++ b/packages/loaders/test/index.js @@ -1,2 +1,2 @@ -require('./loader'); -require('./textureParser'); +require('./Loader'); +require('./TextureLoader'); diff --git a/packages/loaders/test/loader.js b/packages/loaders/test/loader.js deleted file mode 100644 index 5b8571b..0000000 --- a/packages/loaders/test/loader.js +++ /dev/null @@ -1,9 +0,0 @@ -const { Loader } = require('../'); - -describe('PIXI.loaders.Loader', function () -{ - it('should exist', function () - { - expect(Loader).to.be.a('function'); - }); -}); diff --git a/packages/loaders/test/textureParser.js b/packages/loaders/test/textureParser.js deleted file mode 100644 index b5b2179..0000000 --- a/packages/loaders/test/textureParser.js +++ /dev/null @@ -1,52 +0,0 @@ -const { textureParser, Resource } = require('../'); -const { Texture } = require('@pixi/core'); -const { BaseTextureCache, TextureCache } = require('@pixi/utils'); - -describe('PIXI.loaders.textureParser', function () -{ - it('should exist and return a function', function () - { - expect(textureParser).to.be.a('function'); - expect(textureParser()).to.be.a('function'); - }); - - it('should do nothing if the resource is not an image', function () - { - const spy = sinon.spy(); - const res = {}; - - textureParser()(res, spy); - - expect(spy).to.have.been.calledOnce; - expect(res.texture).to.be.undefined; - }); - - it('should create a texture if resource is an image', function () - { - const spy = sinon.spy(); - const res = createMockResource(Resource.TYPE.IMAGE, new Image()); - - textureParser()(res, spy); - - expect(spy).to.have.been.calledOnce; - expect(res.texture).to.be.an.instanceof(Texture); - - expect(BaseTextureCache).to.have.property(res.name, res.texture.baseTexture); - expect(BaseTextureCache).to.have.property(res.url, res.texture.baseTexture); - - expect(TextureCache).to.have.property(res.name, res.texture); - expect(TextureCache).to.have.property(res.url, res.texture); - }); -}); - -function createMockResource(type, data) -{ - const name = `${Math.floor(Date.now() * Math.random())}`; - - return { - url: `http://localhost/doesnt_exist/${name}`, - name, - type, - data, - }; -} diff --git a/packages/mixin-app-loader/src/index.js b/packages/mixin-app-loader/src/index.js index 354997a..ab28882 100644 --- a/packages/mixin-app-loader/src/index.js +++ b/packages/mixin-app-loader/src/index.js @@ -1,12 +1,12 @@ import { Application } from '@pixi/app'; -import { Loader, shared } from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; Application.prototype._loader = null; /** * Loader instance to help with asset loading. * @name PIXI.Application#loader - * @type {PIXI.loaders.Loader} + * @type {PIXI.Loader} */ Object.defineProperties(Application.prototype, { loader: { @@ -16,7 +16,7 @@ { const { sharedLoader } = this._options; - this._loader = sharedLoader ? shared : new Loader(); + this._loader = sharedLoader ? Loader.shared : new Loader(); } return this._loader; diff --git a/packages/mixin-app-loader/test/index.js b/packages/mixin-app-loader/test/index.js index 4739863..7eb948b 100644 --- a/packages/mixin-app-loader/test/index.js +++ b/packages/mixin-app-loader/test/index.js @@ -1,5 +1,5 @@ const { Application } = require('@pixi/app'); -const { Loader, shared } = require('@pixi/loaders'); +const { Loader } = require('@pixi/loaders'); const { skipHello } = require('@pixi/utils'); const { autoDetectRenderer } = require('@pixi/canvas-renderer'); @@ -30,7 +30,7 @@ expect(obj.loader).to.be.not.undefined; expect(obj.loader).to.be.instanceof(Loader); - expect(obj.loader).to.equal(shared); + expect(obj.loader).to.equal(Loader.shared); obj.destroy(); diff --git a/packages/spritesheet/README.md b/packages/spritesheet/README.md index 2bf764b..7c26b10 100644 --- a/packages/spritesheet/README.md +++ b/packages/spritesheet/README.md @@ -9,5 +9,7 @@ ## Usage ```js -import * as spritesheet from '@pixi/spritesheet'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { Loader } from '@pixi/loaders'; +Loader.registerPlugin(SpritesheetLoader); ``` \ No newline at end of file diff --git a/packages/spritesheet/src/SpritesheetLoader.js b/packages/spritesheet/src/SpritesheetLoader.js index c7b34ea..0a19954 100644 --- a/packages/spritesheet/src/SpritesheetLoader.js +++ b/packages/spritesheet/src/SpritesheetLoader.js @@ -1,70 +1,70 @@ import url from 'url'; -import { Resource, Loader } from '@pixi/loaders'; +import { LoaderResource } from '@pixi/loaders'; import Spritesheet from './Spritesheet'; /** - * {@link PIXI.loaders.Loader Loader} middleware for loading + * {@link PIXI.Loader Loader} middleware for loading * texture atlases that have been created with TexturePacker or * similar JSON-based spritesheet. This automatically generates * Texture resources. * @class * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin */ export default class SpritesheetLoader { /** - * Middleware function to support Spritesheets, this is automatically installed. - * @see PIXI.loaders.Loader.useMiddleware + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next */ - static middleware() + static use(resource, next) { - return function spritesheetLoader(resource, next) + const imageResourceName = `${resource.name}_image`; + + // skip if no data, its not json, it isn't spritesheet data, or the image resource already exists + if (!resource.data + || resource.type !== LoaderResource.TYPE.JSON + || !resource.data.frames + || this.resources[imageResourceName] + ) { - const imageResourceName = `${resource.name}_image`; + next(); - // skip if no data, its not json, it isn't spritesheet data, or the image resource already exists - if (!resource.data - || resource.type !== Resource.TYPE.JSON - || !resource.data.frames - || this.resources[imageResourceName] - ) - { - next(); + return; + } - return; - } - - const loadOptions = { - crossOrigin: resource.crossOrigin, - loadType: Resource.LOAD_TYPE.IMAGE, - metadata: resource.metadata.imageMetadata, - parentResource: resource, - }; - - const resourcePath = SpritesheetLoader.getResourcePath(resource, this.baseUrl); - - // load the image for this sheet - this.add(imageResourceName, resourcePath, loadOptions, function onImageLoad(res) - { - const spritesheet = new Spritesheet( - res.texture.baseTexture, - resource.data, - resource.url - ); - - spritesheet.parse(() => - { - resource.spritesheet = spritesheet; - resource.textures = spritesheet.textures; - next(); - }); - }); + const loadOptions = { + crossOrigin: resource.crossOrigin, + loadType: LoaderResource.LOAD_TYPE.IMAGE, + metadata: resource.metadata.imageMetadata, + parentResource: resource, }; + + const resourcePath = SpritesheetLoader.getResourcePath(resource, this.baseUrl); + + // load the image for this sheet + this.add(imageResourceName, resourcePath, loadOptions, function onImageLoad(res) + { + const spritesheet = new Spritesheet( + res.texture.baseTexture, + resource.data, + resource.url + ); + + spritesheet.parse(() => + { + resource.spritesheet = spritesheet; + resource.textures = spritesheet.textures; + next(); + }); + }); } /** * Get the spritesheets root path - * @param {PIXI.loader.Resource} resource - Resource to check path + * @param {PIXI.LoaderResource} resource - Resource to check path * @param {string} baseUrl - Base root url */ static getResourcePath(resource, baseUrl) @@ -78,6 +78,3 @@ return url.resolve(resource.url.replace(baseUrl, ''), resource.data.meta.image); } } - -// Install loader support for Spritesheet objects -Loader.useMiddleware(SpritesheetLoader.middleware); diff --git a/packages/spritesheet/test/SpritesheetLoader.js b/packages/spritesheet/test/SpritesheetLoader.js index e4205ec..4f2f79b 100644 --- a/packages/spritesheet/test/SpritesheetLoader.js +++ b/packages/spritesheet/test/SpritesheetLoader.js @@ -1,5 +1,5 @@ const path = require('path'); -const { Loader, Resource } = require('@pixi/loaders'); +const { Loader, LoaderResource } = require('@pixi/loaders'); const { Texture, BaseTexture } = require('@pixi/core'); const { SpritesheetLoader } = require('../'); @@ -7,8 +7,13 @@ { it('should exist and return a function', function () { - expect(SpritesheetLoader.middleware).to.be.a('function'); - expect(SpritesheetLoader.middleware()).to.be.a('function'); + expect(SpritesheetLoader).to.not.be.undefined; + expect(SpritesheetLoader.use).to.be.a('function'); + }); + + it('should install middleware', function () + { + Loader.registerPlugin(SpritesheetLoader); }); it('should do nothing if the resource is not JSON', function () @@ -16,7 +21,7 @@ const spy = sinon.spy(); const res = {}; - SpritesheetLoader.middleware()(res, spy); + SpritesheetLoader.use(res, spy); expect(spy).to.have.been.calledOnce; expect(res.textures).to.be.undefined; @@ -25,9 +30,9 @@ it('should do nothing if the resource is JSON, but improper format', function () { const spy = sinon.spy(); - const res = createMockResource(Resource.TYPE.JSON, {}); + const res = createMockResource(LoaderResource.TYPE.JSON, {}); - SpritesheetLoader.middleware()(res, spy); + SpritesheetLoader.use(res, spy); expect(spy).to.have.been.calledOnce; expect(res.textures).to.be.undefined; @@ -36,16 +41,16 @@ it('should load the image & create textures if json is properly formatted', function () { const spy = sinon.spy(); - const res = createMockResource(Resource.TYPE.JSON, getJsonSpritesheet()); + const res = createMockResource(LoaderResource.TYPE.JSON, getJsonSpritesheet()); const loader = new Loader(); const addStub = sinon.stub(loader, 'add'); - const imgRes = createMockResource(Resource.TYPE.IMAGE, new Image()); + const imgRes = createMockResource(LoaderResource.TYPE.IMAGE, new Image()); imgRes.texture = new Texture(new BaseTexture(imgRes.data)); addStub.yields(imgRes); - SpritesheetLoader.middleware().call(loader, res, spy); + SpritesheetLoader.use.call(loader, res, spy); addStub.restore(); diff --git a/packages/text-bitmap/README.md b/packages/text-bitmap/README.md index 4db8d56..72fcdb3 100644 --- a/packages/text-bitmap/README.md +++ b/packages/text-bitmap/README.md @@ -9,5 +9,7 @@ ## Usage ```js -import '@pixi/text-bitmap'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; +import { Loader } from '@pixi/loders'; +Loader.registerPlugin(BitmapFontLoader); ``` \ No newline at end of file diff --git a/packages/text-bitmap/src/BitmapFontLoader.js b/packages/text-bitmap/src/BitmapFontLoader.js index 3956060..8750945 100644 --- a/packages/text-bitmap/src/BitmapFontLoader.js +++ b/packages/text-bitmap/src/BitmapFontLoader.js @@ -1,20 +1,21 @@ import * as path from 'path'; import { TextureCache } from '@pixi/utils'; -import { Resource, Loader } from '@pixi/loaders'; +import { LoaderResource } from '@pixi/loaders'; import BitmapText from './BitmapText'; /** - * {@link PIXI.loaders.Loader Loader} middleware for loading + * {@link PIXI.Loader Loader} middleware for loading * bitmap-based fonts suitable for using with {@link PIXI.BitmapText}. * @class * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin */ export default class BitmapFontLoader { /** * Register a BitmapText font from loader resource. * - * @param {PIXI.loaders.Resource} resource - Loader resource. + * @param {PIXI.LoaderResource} resource - Loader resource. * @param {PIXI.Texture} texture - Reference to texture. */ static parse(resource, texture) @@ -23,90 +24,93 @@ } /** - * Middleware function to support BitmapText fonts, this is automatically installed. - * @see PIXI.loaders.Loader.useMiddleware + * Called when the plugin is installed. + * + * @see PIXI.Loader.registerPlugin */ - static middleware() + static add() { - return function bitmapFontLoader(resource, next) + LoaderResource.setExtensionXhrType('fnt', LoaderResource.XHR_RESPONSE_TYPE.DOCUMENT); + } + + /** + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ + static use(resource, next) + { + // skip if no data or not xml data + if (!resource.data || resource.type !== LoaderResource.TYPE.XML) { - // skip if no data or not xml data - if (!resource.data || resource.type !== Resource.TYPE.XML) - { - next(); + next(); - return; + return; + } + + // skip if not bitmap font data, using some silly duck-typing + if (resource.data.getElementsByTagName('page').length === 0 + || resource.data.getElementsByTagName('info').length === 0 + || resource.data.getElementsByTagName('info')[0].getAttribute('face') === null + ) + { + next(); + + return; + } + + let xmlUrl = !resource.isDataUrl ? path.dirname(resource.url) : ''; + + if (resource.isDataUrl) + { + if (xmlUrl === '.') + { + xmlUrl = ''; } - // skip if not bitmap font data, using some silly duck-typing - if (resource.data.getElementsByTagName('page').length === 0 - || resource.data.getElementsByTagName('info').length === 0 - || resource.data.getElementsByTagName('info')[0].getAttribute('face') === null - ) + if (this.baseUrl && xmlUrl) { - next(); - - return; - } - - let xmlUrl = !resource.isDataUrl ? path.dirname(resource.url) : ''; - - if (resource.isDataUrl) - { - if (xmlUrl === '.') + // if baseurl has a trailing slash then add one to xmlUrl so the replace works below + if (this.baseUrl.charAt(this.baseUrl.length - 1) === '/') { - xmlUrl = ''; - } - - if (this.baseUrl && xmlUrl) - { - // if baseurl has a trailing slash then add one to xmlUrl so the replace works below - if (this.baseUrl.charAt(this.baseUrl.length - 1) === '/') - { - xmlUrl += '/'; - } + xmlUrl += '/'; } } + } - // remove baseUrl from xmlUrl - xmlUrl = xmlUrl.replace(this.baseUrl, ''); + // remove baseUrl from xmlUrl + xmlUrl = xmlUrl.replace(this.baseUrl, ''); - // if there is an xmlUrl now, it needs a trailing slash. Ensure that it does if the string isn't empty. - if (xmlUrl && xmlUrl.charAt(xmlUrl.length - 1) !== '/') + // if there is an xmlUrl now, it needs a trailing slash. Ensure that it does if the string isn't empty. + if (xmlUrl && xmlUrl.charAt(xmlUrl.length - 1) !== '/') + { + xmlUrl += '/'; + } + + const textureUrl = xmlUrl + resource.data.getElementsByTagName('page')[0].getAttribute('file'); + + if (TextureCache[textureUrl]) + { + // reuse existing texture + BitmapFontLoader.parse(resource, TextureCache[textureUrl]); + next(); + } + else + { + const loadOptions = { + crossOrigin: resource.crossOrigin, + loadType: LoaderResource.LOAD_TYPE.IMAGE, + metadata: resource.metadata.imageMetadata, + parentResource: resource, + }; + + // load the texture for the font + this.add(`${resource.name}_image`, textureUrl, loadOptions, (res) => { - xmlUrl += '/'; - } - - const textureUrl = xmlUrl + resource.data.getElementsByTagName('page')[0].getAttribute('file'); - - if (TextureCache[textureUrl]) - { - // reuse existing texture - BitmapFontLoader.parse(resource, TextureCache[textureUrl]); + BitmapFontLoader.parse(resource, res.texture); next(); - } - else - { - const loadOptions = { - crossOrigin: resource.crossOrigin, - loadType: Resource.LOAD_TYPE.IMAGE, - metadata: resource.metadata.imageMetadata, - parentResource: resource, - }; - - // load the texture for the font - this.add(`${resource.name}_image`, textureUrl, loadOptions, (res) => - { - BitmapFontLoader.parse(resource, res.texture); - next(); - }); - } - }; + }); + } } } - -// Add custom add support for loading fnt files as XML -Resource.setExtensionXhrType('fnt', Resource.XHR_RESPONSE_TYPE.DOCUMENT); - -// Install loader support for BitmapText -Loader.useMiddleware(BitmapFontLoader.middleware); diff --git a/bundles/pixi.js-legacy/test/index.js b/bundles/pixi.js-legacy/test/index.js index c7cc855..a29651e 100755 --- a/bundles/pixi.js-legacy/test/index.js +++ b/bundles/pixi.js-legacy/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/bundles/pixi.js/src/PIXI.js b/bundles/pixi.js/src/PIXI.js index 75e5658..ae40c7e 100644 --- a/bundles/pixi.js/src/PIXI.js +++ b/bundles/pixi.js/src/PIXI.js @@ -12,6 +12,7 @@ export * from '@pixi/display'; export * from '@pixi/mesh'; export * from '@pixi/ticker'; +export * from '@pixi/loaders'; import { Renderer } from '@pixi/core'; import * as interaction from '@pixi/interaction'; @@ -22,10 +23,12 @@ import { TilingSpriteRenderer } from '@pixi/sprite-tiling'; import { GraphicsRenderer } from '@pixi/graphics'; import * as accessibility from '@pixi/accessibility'; -import * as loaders from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; import * as filters from './filters'; import * as utils from '@pixi/utils'; import { settings } from '@pixi/settings'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager); Renderer.registerPlugin('extract', extract.Extract); @@ -36,6 +39,9 @@ Renderer.registerPlugin('sprite', SpriteRenderer); Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer); +Loader.registerPlugin(SpritesheetLoader); +Loader.registerPlugin(BitmapFontLoader); + import '@pixi/mixin-cache-as-bitmap'; import '@pixi/mixin-get-child-by-name'; import '@pixi/mixin-get-global-position'; @@ -43,20 +49,11 @@ utils.mixins.performMixins(); -/** - * Alias for {@link PIXI.loaders.shared}. - * @name loader - * @memberof PIXI - * @type {PIXI.loader.Loader} - */ -export const loader = loaders.shared; - export { accessibility, extract, filters, interaction, - loaders, prepare, utils, settings, diff --git a/bundles/pixi.js/src/deprecated.js b/bundles/pixi.js/src/deprecated.js index 402176f..e59c66a 100644 --- a/bundles/pixi.js/src/deprecated.js +++ b/bundles/pixi.js/src/deprecated.js @@ -131,6 +131,22 @@ return PIXI.utils.CanvasRenderTarget; }, }, + + /** + * @memberof PIXI + * @name loader + * @type {PIXI.Loader} + * @see PIXI.Loader.shared + * @deprecated since 5.0.0 + */ + loader: { + get() + { + warn('PIXI.loader has moved to PIXI.Loader.shared'); + + return PIXI.Loader.shared; + }, + }, }); /** @@ -351,34 +367,51 @@ }, }); - Object.defineProperties(PIXI.loaders.Loader, { - /** - * @function PIXI.loaders.Loader.addPixiMiddleware - * @see PIXI.loaders.Loader.useMiddleware - * @deprecated since 5.0.0 - */ - addPixiMiddleware: { - get() - { - warn('PIXI.loaders.Loader.addPixiMiddleware has moved to PIXI.loaders.Loader.useMiddleware'); - - return PIXI.loaders.Loader.useMiddleware; - }, - }, - }); + /** + * All classes on this namespace have moved to the high-level `PIXI` object. + * @namespace PIXI.loaders + * @deprecated since 5.0.0 + */ + PIXI.loaders = {}; Object.defineProperties(PIXI.loaders, { /** + * @class PIXI.loaders.Loader + * @see PIXI.Loader + * @deprecated since 5.0.0 + */ + Loader: { + get() + { + warn('PIXI.loaders.Loader has moved to PIXI.Loader'); + + return PIXI.Loader; + }, + }, + /** + * @class PIXI.loaders.Resource + * @see PIXI.LoaderResource + * @deprecated since 5.0.0 + */ + Resource: { + get() + { + warn('PIXI.loaders.Resource has moved to PIXI.LoaderResource'); + + return PIXI.LoaderResource; + }, + }, + /** * @function PIXI.loaders.bitmapFontParser - * @see PIXI.BitmapFontLoader.middleware + * @see PIXI.BitmapFontLoader.use * @deprecated since 5.0.0 */ bitmapFontParser: { get() { - warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.middleware'); + warn('PIXI.loaders.bitmapFontParser has moved to PIXI.BitmapFontLoader.use'); - return PIXI.BitmapFontLoader.middleware; + return PIXI.BitmapFontLoader.use; }, }, /** @@ -396,15 +429,15 @@ }, /** * @function PIXI.loaders.spritesheetParser - * @see PIXI.SpritesheetLoader.middleware + * @see PIXI.SpritesheetLoader.use * @deprecated since 5.0.0 */ spritesheetParser: { get() { - warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.middleware'); + warn('PIXI.loaders.spritesheetParser has moved to PIXI.SpritesheetLoader.use'); - return PIXI.SpritesheetLoader.middleware; + return PIXI.SpritesheetLoader.use; }, }, /** @@ -423,6 +456,19 @@ }); /** + * @function PIXI.loaders.Loader.addPixiMiddleware + * @see PIXI.Loader.registerPlugin + * @deprecated since 5.0.0 + * @param {function} middleware + */ + PIXI.Loader.addPixiMiddleware = function addPixiMiddleware(middleware) + { + warn('PIXI.loaders.Loader.addPixiMiddleware is deprecated, use PIXI.loaders.Loader.registerPlugin'); + + return PIXI.loaders.Loader.registerPlugin({ use: middleware() }); + }; + + /** * @class PIXI.extract.WebGLExtract * @deprecated since 5.0.0 * @see PIXI.extract.Prepare diff --git a/bundles/pixi.js/test/index.js b/bundles/pixi.js/test/index.js index c7cc855..a29651e 100644 --- a/bundles/pixi.js/test/index.js +++ b/bundles/pixi.js/test/index.js @@ -9,7 +9,6 @@ expect(PIXI).to.not.be.undefined; expect(PIXI.interaction).to.not.be.undefined; expect(PIXI.settings).to.not.be.undefined; - expect(PIXI.loaders).to.not.be.undefined; expect(PIXI.extract).to.not.be.undefined; expect(PIXI.prepare).to.not.be.undefined; expect(PIXI.utils).to.not.be.undefined; diff --git a/packages/app/src/Application.js b/packages/app/src/Application.js index 50f9fa1..ef40610 100644 --- a/packages/app/src/Application.js +++ b/packages/app/src/Application.js @@ -51,7 +51,7 @@ * @param {string} [options.powerPreference] - Parameter passed to webgl context, set to "high-performance" * for devices with dual graphics card **webgl only** * @param {boolean} [options.sharedTicker=false] - `true` to use PIXI.Ticker.shared, `false` to create new ticker. - * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.loaders.shared, `false` to create new Loader. + * @param {boolean} [options.sharedLoader=false] - `true` to use PIXI.Loaders.shared, `false` to create new Loader. */ constructor(options, arg2, arg3, arg4, arg5) { diff --git a/packages/loaders/src/Loader.js b/packages/loaders/src/Loader.js index 6f6e9bd..ecba1b0 100644 --- a/packages/loaders/src/Loader.js +++ b/packages/loaders/src/Loader.js @@ -1,16 +1,16 @@ import ResourceLoader from 'resource-loader'; import EventEmitter from 'eventemitter3'; import { blobMiddlewareFactory } from 'resource-loader/lib/middlewares/parsing/blob'; -import textureParser from './textureParser'; +import TextureLoader from './TextureLoader'; /** * * The new loader, extends Resource Loader by Chad Engler: https://github.com/englercj/resource-loader * * ```js - * const loader = PIXI.loader; // PixiJS exposes a premade instance for you to use. + * const loader = PIXI.Loader.shared; // PixiJS exposes a premade instance for you to use. * //or - * const loader = new PIXI.loaders.Loader(); // you can also create your own if you want + * const loader = new PIXI.Loader(); // you can also create your own if you want * * const sprites = {}; * @@ -52,20 +52,31 @@ * * @class Loader * @extends module:resource-loader.ResourceLoader - * @memberof PIXI.loaders + * @memberof PIXI * @param {string} [baseUrl=''] - The base url for all resources loaded by this loader. * @param {number} [concurrency=10] - The number of resources to load concurrently. */ -export class Loader extends ResourceLoader +export default class Loader extends ResourceLoader { constructor(baseUrl, concurrency) { super(baseUrl, concurrency); EventEmitter.call(this); - for (let i = 0; i < Loader._middleware.length; ++i) + for (let i = 0; i < Loader._plugins.length; ++i) { - this.use(Loader._middleware[i]()); + const plugin = Loader._plugins[i]; + const { pre, use } = plugin; + + if (pre) + { + this.pre(pre.bind(plugin)); + } + + if (use) + { + this.use(use.bind(plugin)); + } } // Compat layer, translate the new v2 signals into old v1 events. @@ -95,50 +106,82 @@ this.reset(); } } + + /** + * A premade instance of the loader that can be used to load resources. + * @name shared + * @type {PIXI.Loader} + * @static + * @memberof PIXI.Loader + */ + static get shared() + { + let shared = Loader._shared; + + if (!shared) + { + shared = new Loader(); + shared._protected = true; + Loader._shared = shared; + } + + return shared; + } } // Copy EE3 prototype (mixin) Object.assign(Loader.prototype, EventEmitter.prototype); /** - * Collection of all installed middleware for Loader. + * Collection of all installed `use` middleware for Loader. * * @static - * @member {Array} - * @memberof PIXI.loaders.Loader + * @member {Array} + * @memberof PIXI.Loader * @private */ -Loader._middleware = []; +Loader._plugins = []; /** - * A premade instance of the loader that can be used to load resources. - * @name shared - * @memberof PIXI.loaders - * @type {PIXI.loaders.Loader} - */ -export const shared = new Loader(); -shared._protected = true; - -/** - * Adds a middleware for the global shared loader and all + * Adds a Loader plugin for the global shared loader and all * new Loader instances created. * * @static - * @method useMiddleware - * @memberof PIXI.loaders.Loader - * @param {Function} fn - The middleware to add. + * @method registerPlugin + * @memberof PIXI.Loader + * @param {PIXI.Loader~LoaderPlugin} plugin - The plugin to add + * @return {PIXI.Loader} Reference to PIXI.Loader for chaining */ -Loader.useMiddleware = function useMiddleware(fn) +Loader.registerPlugin = function registerPlugin(plugin) { - // Install for current shared loader - shared.use(fn); + Loader._plugins.push(plugin); - // Install for all future loaders - Loader._middleware.push(fn); + if (plugin.add) + { + plugin.add(); + } + + return Loader; }; // parse any blob into more usable objects (e.g. Image) -Loader.useMiddleware(blobMiddlewareFactory); +Loader.registerPlugin({ use: blobMiddlewareFactory() }); // parse any Image objects into textures -Loader.useMiddleware(textureParser); +Loader.registerPlugin(TextureLoader); + +/** + * Plugin to be installed for handling specific Loader resources. + * @typedef {object} PIXI.Loader~LoaderPlugin + * @property {function} [plugin.add] - Function to call immediate after registering plugin. + * @property {PIXI.Loader~loaderMiddleware} [plugin.pre] - Middleware function to run before load, the + * arguments for this are `(resource, next)` + * @property {PIXI.Loader~loaderMiddleware} [plugin.use] - Middleware function to run after load, the + * arguments for this are `(resource, next)` + */ + +/** + * @callback PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ diff --git a/packages/loaders/src/TextureLoader.js b/packages/loaders/src/TextureLoader.js new file mode 100644 index 0000000..5094c8e --- /dev/null +++ b/packages/loaders/src/TextureLoader.js @@ -0,0 +1,31 @@ +import { Resource } from 'resource-loader'; +import { Texture } from '@pixi/core'; + +/** + * Loader plugin for handling Texture resources. + * @class + * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin + */ +export default class TextureLoader +{ + /** + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ + static use(resource, next) + { + // create a new texture if the data is an Image object + if (resource.data && resource.type === Resource.TYPE.IMAGE) + { + resource.texture = Texture.fromLoader( + resource.data, + resource.url, + resource.name + ); + } + next(); + } +} diff --git a/packages/loaders/src/index.js b/packages/loaders/src/index.js index 8e816cc..3e877fe 100644 --- a/packages/loaders/src/index.js +++ b/packages/loaders/src/index.js @@ -1,24 +1,11 @@ +import { Resource } from 'resource-loader'; /** * Reference to **{@link https://github.com/englercj/resource-loader * resource-loader}**'s Resource class. * @see http://englercj.github.io/resource-loader/Resource.html - * @class Resource - * @memberof PIXI.loaders + * @class LoaderResource + * @memberof PIXI */ -export { Resource } from 'resource-loader'; - -/** - * This namespace contains APIs which extends the {@link https://github.com/englercj/resource-loader resource-loader} module - * for loading assets, data, and other resources dynamically. - * @example - * const loader = new PIXI.loaders.Loader(); - * loader.add('bunny', 'data/bunny.png') - * .add('spaceship', 'assets/spritesheet.json'); - * loader.load((loader, resources) => { - * // resources.bunny - * // resources.spaceship - * }); - * @namespace PIXI.loaders - */ -export { Loader, shared } from './Loader'; -export { default as textureParser } from './textureParser'; +export const LoaderResource = Resource; +export { default as Loader } from './Loader'; +export { default as TextureLoader } from './TextureLoader'; diff --git a/packages/loaders/src/textureParser.js b/packages/loaders/src/textureParser.js deleted file mode 100644 index 9dba8bd..0000000 --- a/packages/loaders/src/textureParser.js +++ /dev/null @@ -1,19 +0,0 @@ -import { Resource } from 'resource-loader'; -import { Texture } from '@pixi/core'; - -export default function () -{ - return function textureParser(resource, next) - { - // create a new texture if the data is an Image object - if (resource.data && resource.type === Resource.TYPE.IMAGE) - { - resource.texture = Texture.fromLoader( - resource.data, - resource.url, - resource.name - ); - } - next(); - }; -} diff --git a/packages/loaders/test/Loader.js b/packages/loaders/test/Loader.js new file mode 100644 index 0000000..1a62a86 --- /dev/null +++ b/packages/loaders/test/Loader.js @@ -0,0 +1,15 @@ +const { Loader } = require('../'); + +describe('PIXI.Loader', function () +{ + it('should exist', function () + { + expect(Loader).to.be.a('function'); + }); + + it('should have shared loader', function () + { + expect(Loader.shared).to.not.be.undefined; + expect(Loader.shared).to.be.instanceof(Loader); + }); +}); diff --git a/packages/loaders/test/TextureLoader.js b/packages/loaders/test/TextureLoader.js new file mode 100644 index 0000000..db53f7c --- /dev/null +++ b/packages/loaders/test/TextureLoader.js @@ -0,0 +1,52 @@ +const { TextureLoader, LoaderResource } = require('../'); +const { Texture } = require('@pixi/core'); +const { BaseTextureCache, TextureCache } = require('@pixi/utils'); + +describe('PIXI.TextureLoader', function () +{ + it('should exist and return a function', function () + { + expect(TextureLoader).to.not.be.undefined; + expect(TextureLoader.use).to.be.a('function'); + }); + + it('should do nothing if the resource is not an image', function () + { + const spy = sinon.spy(); + const res = {}; + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.undefined; + }); + + it('should create a texture if resource is an image', function () + { + const spy = sinon.spy(); + const res = createMockResource(LoaderResource.TYPE.IMAGE, new Image()); + + TextureLoader.use(res, spy); + + expect(spy).to.have.been.calledOnce; + expect(res.texture).to.be.an.instanceof(Texture); + + expect(BaseTextureCache).to.have.property(res.name, res.texture.baseTexture); + expect(BaseTextureCache).to.have.property(res.url, res.texture.baseTexture); + + expect(TextureCache).to.have.property(res.name, res.texture); + expect(TextureCache).to.have.property(res.url, res.texture); + }); +}); + +function createMockResource(type, data) +{ + const name = `${Math.floor(Date.now() * Math.random())}`; + + return { + url: `http://localhost/doesnt_exist/${name}`, + name, + type, + data, + }; +} diff --git a/packages/loaders/test/index.js b/packages/loaders/test/index.js index 72c6554..8913167 100644 --- a/packages/loaders/test/index.js +++ b/packages/loaders/test/index.js @@ -1,2 +1,2 @@ -require('./loader'); -require('./textureParser'); +require('./Loader'); +require('./TextureLoader'); diff --git a/packages/loaders/test/loader.js b/packages/loaders/test/loader.js deleted file mode 100644 index 5b8571b..0000000 --- a/packages/loaders/test/loader.js +++ /dev/null @@ -1,9 +0,0 @@ -const { Loader } = require('../'); - -describe('PIXI.loaders.Loader', function () -{ - it('should exist', function () - { - expect(Loader).to.be.a('function'); - }); -}); diff --git a/packages/loaders/test/textureParser.js b/packages/loaders/test/textureParser.js deleted file mode 100644 index b5b2179..0000000 --- a/packages/loaders/test/textureParser.js +++ /dev/null @@ -1,52 +0,0 @@ -const { textureParser, Resource } = require('../'); -const { Texture } = require('@pixi/core'); -const { BaseTextureCache, TextureCache } = require('@pixi/utils'); - -describe('PIXI.loaders.textureParser', function () -{ - it('should exist and return a function', function () - { - expect(textureParser).to.be.a('function'); - expect(textureParser()).to.be.a('function'); - }); - - it('should do nothing if the resource is not an image', function () - { - const spy = sinon.spy(); - const res = {}; - - textureParser()(res, spy); - - expect(spy).to.have.been.calledOnce; - expect(res.texture).to.be.undefined; - }); - - it('should create a texture if resource is an image', function () - { - const spy = sinon.spy(); - const res = createMockResource(Resource.TYPE.IMAGE, new Image()); - - textureParser()(res, spy); - - expect(spy).to.have.been.calledOnce; - expect(res.texture).to.be.an.instanceof(Texture); - - expect(BaseTextureCache).to.have.property(res.name, res.texture.baseTexture); - expect(BaseTextureCache).to.have.property(res.url, res.texture.baseTexture); - - expect(TextureCache).to.have.property(res.name, res.texture); - expect(TextureCache).to.have.property(res.url, res.texture); - }); -}); - -function createMockResource(type, data) -{ - const name = `${Math.floor(Date.now() * Math.random())}`; - - return { - url: `http://localhost/doesnt_exist/${name}`, - name, - type, - data, - }; -} diff --git a/packages/mixin-app-loader/src/index.js b/packages/mixin-app-loader/src/index.js index 354997a..ab28882 100644 --- a/packages/mixin-app-loader/src/index.js +++ b/packages/mixin-app-loader/src/index.js @@ -1,12 +1,12 @@ import { Application } from '@pixi/app'; -import { Loader, shared } from '@pixi/loaders'; +import { Loader } from '@pixi/loaders'; Application.prototype._loader = null; /** * Loader instance to help with asset loading. * @name PIXI.Application#loader - * @type {PIXI.loaders.Loader} + * @type {PIXI.Loader} */ Object.defineProperties(Application.prototype, { loader: { @@ -16,7 +16,7 @@ { const { sharedLoader } = this._options; - this._loader = sharedLoader ? shared : new Loader(); + this._loader = sharedLoader ? Loader.shared : new Loader(); } return this._loader; diff --git a/packages/mixin-app-loader/test/index.js b/packages/mixin-app-loader/test/index.js index 4739863..7eb948b 100644 --- a/packages/mixin-app-loader/test/index.js +++ b/packages/mixin-app-loader/test/index.js @@ -1,5 +1,5 @@ const { Application } = require('@pixi/app'); -const { Loader, shared } = require('@pixi/loaders'); +const { Loader } = require('@pixi/loaders'); const { skipHello } = require('@pixi/utils'); const { autoDetectRenderer } = require('@pixi/canvas-renderer'); @@ -30,7 +30,7 @@ expect(obj.loader).to.be.not.undefined; expect(obj.loader).to.be.instanceof(Loader); - expect(obj.loader).to.equal(shared); + expect(obj.loader).to.equal(Loader.shared); obj.destroy(); diff --git a/packages/spritesheet/README.md b/packages/spritesheet/README.md index 2bf764b..7c26b10 100644 --- a/packages/spritesheet/README.md +++ b/packages/spritesheet/README.md @@ -9,5 +9,7 @@ ## Usage ```js -import * as spritesheet from '@pixi/spritesheet'; +import { SpritesheetLoader } from '@pixi/spritesheet'; +import { Loader } from '@pixi/loaders'; +Loader.registerPlugin(SpritesheetLoader); ``` \ No newline at end of file diff --git a/packages/spritesheet/src/SpritesheetLoader.js b/packages/spritesheet/src/SpritesheetLoader.js index c7b34ea..0a19954 100644 --- a/packages/spritesheet/src/SpritesheetLoader.js +++ b/packages/spritesheet/src/SpritesheetLoader.js @@ -1,70 +1,70 @@ import url from 'url'; -import { Resource, Loader } from '@pixi/loaders'; +import { LoaderResource } from '@pixi/loaders'; import Spritesheet from './Spritesheet'; /** - * {@link PIXI.loaders.Loader Loader} middleware for loading + * {@link PIXI.Loader Loader} middleware for loading * texture atlases that have been created with TexturePacker or * similar JSON-based spritesheet. This automatically generates * Texture resources. * @class * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin */ export default class SpritesheetLoader { /** - * Middleware function to support Spritesheets, this is automatically installed. - * @see PIXI.loaders.Loader.useMiddleware + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next */ - static middleware() + static use(resource, next) { - return function spritesheetLoader(resource, next) + const imageResourceName = `${resource.name}_image`; + + // skip if no data, its not json, it isn't spritesheet data, or the image resource already exists + if (!resource.data + || resource.type !== LoaderResource.TYPE.JSON + || !resource.data.frames + || this.resources[imageResourceName] + ) { - const imageResourceName = `${resource.name}_image`; + next(); - // skip if no data, its not json, it isn't spritesheet data, or the image resource already exists - if (!resource.data - || resource.type !== Resource.TYPE.JSON - || !resource.data.frames - || this.resources[imageResourceName] - ) - { - next(); + return; + } - return; - } - - const loadOptions = { - crossOrigin: resource.crossOrigin, - loadType: Resource.LOAD_TYPE.IMAGE, - metadata: resource.metadata.imageMetadata, - parentResource: resource, - }; - - const resourcePath = SpritesheetLoader.getResourcePath(resource, this.baseUrl); - - // load the image for this sheet - this.add(imageResourceName, resourcePath, loadOptions, function onImageLoad(res) - { - const spritesheet = new Spritesheet( - res.texture.baseTexture, - resource.data, - resource.url - ); - - spritesheet.parse(() => - { - resource.spritesheet = spritesheet; - resource.textures = spritesheet.textures; - next(); - }); - }); + const loadOptions = { + crossOrigin: resource.crossOrigin, + loadType: LoaderResource.LOAD_TYPE.IMAGE, + metadata: resource.metadata.imageMetadata, + parentResource: resource, }; + + const resourcePath = SpritesheetLoader.getResourcePath(resource, this.baseUrl); + + // load the image for this sheet + this.add(imageResourceName, resourcePath, loadOptions, function onImageLoad(res) + { + const spritesheet = new Spritesheet( + res.texture.baseTexture, + resource.data, + resource.url + ); + + spritesheet.parse(() => + { + resource.spritesheet = spritesheet; + resource.textures = spritesheet.textures; + next(); + }); + }); } /** * Get the spritesheets root path - * @param {PIXI.loader.Resource} resource - Resource to check path + * @param {PIXI.LoaderResource} resource - Resource to check path * @param {string} baseUrl - Base root url */ static getResourcePath(resource, baseUrl) @@ -78,6 +78,3 @@ return url.resolve(resource.url.replace(baseUrl, ''), resource.data.meta.image); } } - -// Install loader support for Spritesheet objects -Loader.useMiddleware(SpritesheetLoader.middleware); diff --git a/packages/spritesheet/test/SpritesheetLoader.js b/packages/spritesheet/test/SpritesheetLoader.js index e4205ec..4f2f79b 100644 --- a/packages/spritesheet/test/SpritesheetLoader.js +++ b/packages/spritesheet/test/SpritesheetLoader.js @@ -1,5 +1,5 @@ const path = require('path'); -const { Loader, Resource } = require('@pixi/loaders'); +const { Loader, LoaderResource } = require('@pixi/loaders'); const { Texture, BaseTexture } = require('@pixi/core'); const { SpritesheetLoader } = require('../'); @@ -7,8 +7,13 @@ { it('should exist and return a function', function () { - expect(SpritesheetLoader.middleware).to.be.a('function'); - expect(SpritesheetLoader.middleware()).to.be.a('function'); + expect(SpritesheetLoader).to.not.be.undefined; + expect(SpritesheetLoader.use).to.be.a('function'); + }); + + it('should install middleware', function () + { + Loader.registerPlugin(SpritesheetLoader); }); it('should do nothing if the resource is not JSON', function () @@ -16,7 +21,7 @@ const spy = sinon.spy(); const res = {}; - SpritesheetLoader.middleware()(res, spy); + SpritesheetLoader.use(res, spy); expect(spy).to.have.been.calledOnce; expect(res.textures).to.be.undefined; @@ -25,9 +30,9 @@ it('should do nothing if the resource is JSON, but improper format', function () { const spy = sinon.spy(); - const res = createMockResource(Resource.TYPE.JSON, {}); + const res = createMockResource(LoaderResource.TYPE.JSON, {}); - SpritesheetLoader.middleware()(res, spy); + SpritesheetLoader.use(res, spy); expect(spy).to.have.been.calledOnce; expect(res.textures).to.be.undefined; @@ -36,16 +41,16 @@ it('should load the image & create textures if json is properly formatted', function () { const spy = sinon.spy(); - const res = createMockResource(Resource.TYPE.JSON, getJsonSpritesheet()); + const res = createMockResource(LoaderResource.TYPE.JSON, getJsonSpritesheet()); const loader = new Loader(); const addStub = sinon.stub(loader, 'add'); - const imgRes = createMockResource(Resource.TYPE.IMAGE, new Image()); + const imgRes = createMockResource(LoaderResource.TYPE.IMAGE, new Image()); imgRes.texture = new Texture(new BaseTexture(imgRes.data)); addStub.yields(imgRes); - SpritesheetLoader.middleware().call(loader, res, spy); + SpritesheetLoader.use.call(loader, res, spy); addStub.restore(); diff --git a/packages/text-bitmap/README.md b/packages/text-bitmap/README.md index 4db8d56..72fcdb3 100644 --- a/packages/text-bitmap/README.md +++ b/packages/text-bitmap/README.md @@ -9,5 +9,7 @@ ## Usage ```js -import '@pixi/text-bitmap'; +import { BitmapFontLoader } from '@pixi/text-bitmap'; +import { Loader } from '@pixi/loders'; +Loader.registerPlugin(BitmapFontLoader); ``` \ No newline at end of file diff --git a/packages/text-bitmap/src/BitmapFontLoader.js b/packages/text-bitmap/src/BitmapFontLoader.js index 3956060..8750945 100644 --- a/packages/text-bitmap/src/BitmapFontLoader.js +++ b/packages/text-bitmap/src/BitmapFontLoader.js @@ -1,20 +1,21 @@ import * as path from 'path'; import { TextureCache } from '@pixi/utils'; -import { Resource, Loader } from '@pixi/loaders'; +import { LoaderResource } from '@pixi/loaders'; import BitmapText from './BitmapText'; /** - * {@link PIXI.loaders.Loader Loader} middleware for loading + * {@link PIXI.Loader Loader} middleware for loading * bitmap-based fonts suitable for using with {@link PIXI.BitmapText}. * @class * @memberof PIXI + * @extends PIXI.Loader~LoaderPlugin */ export default class BitmapFontLoader { /** * Register a BitmapText font from loader resource. * - * @param {PIXI.loaders.Resource} resource - Loader resource. + * @param {PIXI.LoaderResource} resource - Loader resource. * @param {PIXI.Texture} texture - Reference to texture. */ static parse(resource, texture) @@ -23,90 +24,93 @@ } /** - * Middleware function to support BitmapText fonts, this is automatically installed. - * @see PIXI.loaders.Loader.useMiddleware + * Called when the plugin is installed. + * + * @see PIXI.Loader.registerPlugin */ - static middleware() + static add() { - return function bitmapFontLoader(resource, next) + LoaderResource.setExtensionXhrType('fnt', LoaderResource.XHR_RESPONSE_TYPE.DOCUMENT); + } + + /** + * Called after a resource is loaded. + * @see PIXI.Loader~loaderMiddleware + * @param {PIXI.LoaderResource} resource + * @param {function} next + */ + static use(resource, next) + { + // skip if no data or not xml data + if (!resource.data || resource.type !== LoaderResource.TYPE.XML) { - // skip if no data or not xml data - if (!resource.data || resource.type !== Resource.TYPE.XML) - { - next(); + next(); - return; + return; + } + + // skip if not bitmap font data, using some silly duck-typing + if (resource.data.getElementsByTagName('page').length === 0 + || resource.data.getElementsByTagName('info').length === 0 + || resource.data.getElementsByTagName('info')[0].getAttribute('face') === null + ) + { + next(); + + return; + } + + let xmlUrl = !resource.isDataUrl ? path.dirname(resource.url) : ''; + + if (resource.isDataUrl) + { + if (xmlUrl === '.') + { + xmlUrl = ''; } - // skip if not bitmap font data, using some silly duck-typing - if (resource.data.getElementsByTagName('page').length === 0 - || resource.data.getElementsByTagName('info').length === 0 - || resource.data.getElementsByTagName('info')[0].getAttribute('face') === null - ) + if (this.baseUrl && xmlUrl) { - next(); - - return; - } - - let xmlUrl = !resource.isDataUrl ? path.dirname(resource.url) : ''; - - if (resource.isDataUrl) - { - if (xmlUrl === '.') + // if baseurl has a trailing slash then add one to xmlUrl so the replace works below + if (this.baseUrl.charAt(this.baseUrl.length - 1) === '/') { - xmlUrl = ''; - } - - if (this.baseUrl && xmlUrl) - { - // if baseurl has a trailing slash then add one to xmlUrl so the replace works below - if (this.baseUrl.charAt(this.baseUrl.length - 1) === '/') - { - xmlUrl += '/'; - } + xmlUrl += '/'; } } + } - // remove baseUrl from xmlUrl - xmlUrl = xmlUrl.replace(this.baseUrl, ''); + // remove baseUrl from xmlUrl + xmlUrl = xmlUrl.replace(this.baseUrl, ''); - // if there is an xmlUrl now, it needs a trailing slash. Ensure that it does if the string isn't empty. - if (xmlUrl && xmlUrl.charAt(xmlUrl.length - 1) !== '/') + // if there is an xmlUrl now, it needs a trailing slash. Ensure that it does if the string isn't empty. + if (xmlUrl && xmlUrl.charAt(xmlUrl.length - 1) !== '/') + { + xmlUrl += '/'; + } + + const textureUrl = xmlUrl + resource.data.getElementsByTagName('page')[0].getAttribute('file'); + + if (TextureCache[textureUrl]) + { + // reuse existing texture + BitmapFontLoader.parse(resource, TextureCache[textureUrl]); + next(); + } + else + { + const loadOptions = { + crossOrigin: resource.crossOrigin, + loadType: LoaderResource.LOAD_TYPE.IMAGE, + metadata: resource.metadata.imageMetadata, + parentResource: resource, + }; + + // load the texture for the font + this.add(`${resource.name}_image`, textureUrl, loadOptions, (res) => { - xmlUrl += '/'; - } - - const textureUrl = xmlUrl + resource.data.getElementsByTagName('page')[0].getAttribute('file'); - - if (TextureCache[textureUrl]) - { - // reuse existing texture - BitmapFontLoader.parse(resource, TextureCache[textureUrl]); + BitmapFontLoader.parse(resource, res.texture); next(); - } - else - { - const loadOptions = { - crossOrigin: resource.crossOrigin, - loadType: Resource.LOAD_TYPE.IMAGE, - metadata: resource.metadata.imageMetadata, - parentResource: resource, - }; - - // load the texture for the font - this.add(`${resource.name}_image`, textureUrl, loadOptions, (res) => - { - BitmapFontLoader.parse(resource, res.texture); - next(); - }); - } - }; + }); + } } } - -// Add custom add support for loading fnt files as XML -Resource.setExtensionXhrType('fnt', Resource.XHR_RESPONSE_TYPE.DOCUMENT); - -// Install loader support for BitmapText -Loader.useMiddleware(BitmapFontLoader.middleware); diff --git a/packages/text-bitmap/test/BitmapFontLoader.js b/packages/text-bitmap/test/BitmapFontLoader.js index a76fc1c..7a64297 100644 --- a/packages/text-bitmap/test/BitmapFontLoader.js +++ b/packages/text-bitmap/test/BitmapFontLoader.js @@ -80,8 +80,8 @@ it('should exist and return a function', function () { - expect(BitmapFontLoader.middleware).to.be.a('function'); - expect(BitmapFontLoader.middleware()).to.be.a('function'); + expect(BitmapFontLoader).to.not.be.undefined; + expect(BitmapFontLoader.use).to.be.a('function'); }); it('should do nothing if the resource is not XML', function () @@ -89,7 +89,7 @@ const spy = sinon.spy(); const res = {}; - BitmapFontLoader.middleware()(res, spy); + BitmapFontLoader.use(res, spy); expect(spy).to.have.been.calledOnce; expect(res.textures).to.be.undefined; @@ -100,7 +100,7 @@ const spy = sinon.spy(); const res = { data: document.createDocumentFragment() }; - BitmapFontLoader.middleware()(res, spy); + BitmapFontLoader.use(res, spy); expect(spy).to.have.been.calledOnce; expect(res.textures).to.be.undefined;