<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>AtlasLoader - pixi.js</title>
<link rel="stylesheet" href="http://yui.yahooapis.com/3.9.1/build/cssgrids/cssgrids-min.css">
<link rel="stylesheet" href="../assets/vendor/prettify/prettify-min.css">
<link rel="stylesheet" href="../assets/css/main.css" id="site_styles">
<link rel="shortcut icon" type="image/png" href="../assets/favicon.png">
<script src="http://yui.yahooapis.com/combo?3.9.1/build/yui/yui-min.js"></script>
</head>
<body class="yui3-skin-sam">
<div id="doc">
<div id="hd" class="yui3-g header">
<div class="yui3-u-3-4">
<h1><img src="http://www.goodboydigital.com/pixijs/logo_small.png" title="pixi.js"></h1>
</div>
<div class="yui3-u-1-4 version">
<em>API Docs for: 2.1.0</em>
</div>
</div>
<div id="bd" class="yui3-g">
<div class="yui3-u-1-4">
<div id="docs-sidebar" class="sidebar apidocs">
<div id="api-list">
<h2 class="off-left">APIs</h2>
<div id="api-tabview" class="tabview">
<ul class="tabs">
<li><a href="#api-classes">Classes</a></li>
<li><a href="#api-modules">Modules</a></li>
</ul>
<div id="api-tabview-filter">
<input type="search" id="api-filter" placeholder="Type to filter APIs">
</div>
<div id="api-tabview-panel">
<ul id="api-classes" class="apis classes">
<li><a href="../classes/AbstractFilter.html">AbstractFilter</a></li>
<li><a href="../classes/AjaxRequest.html">AjaxRequest</a></li>
<li><a href="../classes/AlphaMaskFilter.html">AlphaMaskFilter</a></li>
<li><a href="../classes/AsciiFilter.html">AsciiFilter</a></li>
<li><a href="../classes/AssetLoader.html">AssetLoader</a></li>
<li><a href="../classes/AtlasLoader.html">AtlasLoader</a></li>
<li><a href="../classes/autoDetectRecommendedRenderer.html">autoDetectRecommendedRenderer</a></li>
<li><a href="../classes/autoDetectRenderer.html">autoDetectRenderer</a></li>
<li><a href="../classes/BaseTexture.html">BaseTexture</a></li>
<li><a href="../classes/BitmapFontLoader.html">BitmapFontLoader</a></li>
<li><a href="../classes/BitmapText.html">BitmapText</a></li>
<li><a href="../classes/BlurFilter.html">BlurFilter</a></li>
<li><a href="../classes/BlurXFilter.html">BlurXFilter</a></li>
<li><a href="../classes/BlurYFilter.html">BlurYFilter</a></li>
<li><a href="../classes/CanvasBuffer.html">CanvasBuffer</a></li>
<li><a href="../classes/CanvasGraphics.html">CanvasGraphics</a></li>
<li><a href="../classes/CanvasMaskManager.html">CanvasMaskManager</a></li>
<li><a href="../classes/CanvasRenderer.html">CanvasRenderer</a></li>
<li><a href="../classes/CanvasTinter.html">CanvasTinter</a></li>
<li><a href="../classes/Circle.html">Circle</a></li>
<li><a href="../classes/ColorMatrixFilter.html">ColorMatrixFilter</a></li>
<li><a href="../classes/ColorStepFilter.html">ColorStepFilter</a></li>
<li><a href="../classes/ComplexPrimitiveShader.html">ComplexPrimitiveShader</a></li>
<li><a href="../classes/ConvolutionFilter.html">ConvolutionFilter</a></li>
<li><a href="../classes/CrossHatchFilter.html">CrossHatchFilter</a></li>
<li><a href="../classes/DisplacementFilter.html">DisplacementFilter</a></li>
<li><a href="../classes/DisplayObject.html">DisplayObject</a></li>
<li><a href="../classes/DisplayObjectContainer.html">DisplayObjectContainer</a></li>
<li><a href="../classes/DotScreenFilter.html">DotScreenFilter</a></li>
<li><a href="../classes/Ellipse.html">Ellipse</a></li>
<li><a href="../classes/Event.html">Event</a></li>
<li><a href="../classes/EventTarget.html">EventTarget</a></li>
<li><a href="../classes/FilterBlock.html">FilterBlock</a></li>
<li><a href="../classes/FilterTexture.html">FilterTexture</a></li>
<li><a href="../classes/Graphics.html">Graphics</a></li>
<li><a href="../classes/GraphicsData.html">GraphicsData</a></li>
<li><a href="../classes/GrayFilter.html">GrayFilter</a></li>
<li><a href="../classes/ImageLoader.html">ImageLoader</a></li>
<li><a href="../classes/InteractionData.html">InteractionData</a></li>
<li><a href="../classes/InteractionManager.html">InteractionManager</a></li>
<li><a href="../classes/InvertFilter.html">InvertFilter</a></li>
<li><a href="../classes/JsonLoader.html">JsonLoader</a></li>
<li><a href="../classes/Matrix.html">Matrix</a></li>
<li><a href="../classes/MovieClip.html">MovieClip</a></li>
<li><a href="../classes/NoiseFilter.html">NoiseFilter</a></li>
<li><a href="../classes/NormalMapFilter.html">NormalMapFilter</a></li>
<li><a href="../classes/PixelateFilter.html">PixelateFilter</a></li>
<li><a href="../classes/PixiFastShader.html">PixiFastShader</a></li>
<li><a href="../classes/PixiShader.html">PixiShader</a></li>
<li><a href="../classes/Point.html">Point</a></li>
<li><a href="../classes/Polygon.html">Polygon</a></li>
<li><a href="../classes/PolyK.html">PolyK</a></li>
<li><a href="../classes/PrimitiveShader.html">PrimitiveShader</a></li>
<li><a href="../classes/Rectangle.html">Rectangle</a></li>
<li><a href="../classes/RenderTexture.html">RenderTexture</a></li>
<li><a href="../classes/RGBSplitFilter.html">RGBSplitFilter</a></li>
<li><a href="../classes/Rope.html">Rope</a></li>
<li><a href="../classes/Rounded Rectangle.html">Rounded Rectangle</a></li>
<li><a href="../classes/SepiaFilter.html">SepiaFilter</a></li>
<li><a href="../classes/SmartBlurFilter.html">SmartBlurFilter</a></li>
<li><a href="../classes/Spine.html">Spine</a></li>
<li><a href="../classes/SpineLoader.html">SpineLoader</a></li>
<li><a href="../classes/Sprite.html">Sprite</a></li>
<li><a href="../classes/SpriteBatch.html">SpriteBatch</a></li>
<li><a href="../classes/SpriteSheetLoader.html">SpriteSheetLoader</a></li>
<li><a href="../classes/Stage.html">Stage</a></li>
<li><a href="../classes/Strip.html">Strip</a></li>
<li><a href="../classes/StripShader.html">StripShader</a></li>
<li><a href="../classes/Text.html">Text</a></li>
<li><a href="../classes/Texture.html">Texture</a></li>
<li><a href="../classes/TilingSprite.html">TilingSprite</a></li>
<li><a href="../classes/TiltShiftFilter.html">TiltShiftFilter</a></li>
<li><a href="../classes/TiltShiftXFilter.html">TiltShiftXFilter</a></li>
<li><a href="../classes/TiltShiftYFilter.html">TiltShiftYFilter</a></li>
<li><a href="../classes/TwistFilter.html">TwistFilter</a></li>
<li><a href="../classes/WebGLBlendModeManager.html">WebGLBlendModeManager</a></li>
<li><a href="../classes/WebGLFastSpriteBatch.html">WebGLFastSpriteBatch</a></li>
<li><a href="../classes/WebGLFilterManager.html">WebGLFilterManager</a></li>
<li><a href="../classes/WebGLGraphics.html">WebGLGraphics</a></li>
<li><a href="../classes/WebGLGraphicsData.html">WebGLGraphicsData</a></li>
<li><a href="../classes/WebGLMaskManager.html">WebGLMaskManager</a></li>
<li><a href="../classes/WebGLRenderer.html">WebGLRenderer</a></li>
<li><a href="../classes/WebGLShaderManager.html">WebGLShaderManager</a></li>
<li><a href="../classes/WebGLSpriteBatch.html">WebGLSpriteBatch</a></li>
<li><a href="../classes/WebGLStencilManager.html">WebGLStencilManager</a></li>
</ul>
<ul id="api-modules" class="apis modules">
<li><a href="../modules/PIXI.html">PIXI</a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="yui3-u-3-4">
<div id="api-options">
Show:
<label for="api-show-inherited">
<input type="checkbox" id="api-show-inherited" checked>
Inherited
</label>
<label for="api-show-protected">
<input type="checkbox" id="api-show-protected">
Protected
</label>
<label for="api-show-private">
<input type="checkbox" id="api-show-private">
Private
</label>
<label for="api-show-deprecated">
<input type="checkbox" id="api-show-deprecated">
Deprecated
</label>
</div>
<div class="apidocs">
<div id="docs-main">
<div class="content">
<h1>AtlasLoader Class</h1>
<div class="box meta">
<div class="uses">
Uses
<ul class="inline commas">
<li><a href="EventTarget.html">EventTarget</a></li>
</ul>
</div>
<div class="foundat">
Defined in: <a href="../files/src_pixi_loaders_AtlasLoader.js.html#l5"><code>src/pixi/loaders/AtlasLoader.js:5</code></a>
</div>
Module: <a href="../modules/PIXI.html">PIXI</a>
</div>
<div class="box intro">
<p>The atlas file loader is used to load in Texture Atlas data and parse it. When loaded this class will dispatch a 'loaded' event. If loading fails this class will dispatch an 'error' event.</p>
<p>To generate the data you can use <a href="http://www.codeandweb.com/texturepacker">http://www.codeandweb.com/texturepacker</a> and publish in the 'JSON' format.</p>
<p>It is highly recommended to use texture atlases (also know as 'sprite sheets') as it allowed sprites to be batched and drawn together for highly increased rendering speed.
Once the data has been loaded the frames are stored in the PIXI texture cache and can be accessed though PIXI.Texture.fromFrameId() and PIXI.Sprite.fromFrameId()</p>
</div>
<div class="constructor">
<h2>Constructor</h2>
<div id="method_AtlasLoader" class="method item">
<h3 class="name"><code>AtlasLoader</code></h3>
<div class="args">
<span class="paren">(</span><ul class="args-list inline commas">
<li class="arg">
<code>url</code>
</li>
<li class="arg">
<code>crossorigin</code>
</li>
</ul><span class="paren">)</span>
</div>
<div class="meta">
<p>
Defined in
<a href="../files/src_pixi_loaders_AtlasLoader.js.html#l5"><code>src/pixi/loaders/AtlasLoader.js:5</code></a>
</p>
</div>
<div class="description">
</div>
<div class="params">
<h4>Parameters:</h4>
<ul class="params-list">
<li class="param">
<code class="param-name">url</code>
<span class="type">String</span>
<div class="param-description">
<p>The url of the JSON file</p>
</div>
</li>
<li class="param">
<code class="param-name">crossorigin</code>
<span class="type">Boolean</span>
<div class="param-description">
<p>Whether requests should be treated as crossorigin</p>
</div>
</li>
</ul>
</div>
</div>
</div>
<div id="classdocs" class="tabview">
<ul class="api-class-tabs">
<li class="api-class-tab index"><a href="#index">Index</a></li>
<li class="api-class-tab methods"><a href="#methods">Methods</a></li>
</ul>
<div>
<div id="index" class="api-class-tabpanel index">
<h2 class="off-left">Item Index</h2>
<div class="index-section methods">
<h3>Methods</h3>
<ul class="index-list methods">
<li class="index-item method inherited">
<a href="#method_emit">emit</a>
</li>
<li class="index-item method inherited">
<a href="#method_listeners">listeners</a>
</li>
<li class="index-item method">
<a href="#method_load">load</a>
</li>
<li class="index-item method inherited">
<a href="#method_mixin">mixin</a>
</li>
<li class="index-item method inherited">
<a href="#method_off">off</a>
</li>
<li class="index-item method inherited">
<a href="#method_on">on</a>
</li>
<li class="index-item method private">
<a href="#method_onAtlasLoaded">onAtlasLoaded</a>
</li>
<li class="index-item method inherited">
<a href="#method_once">once</a>
</li>
<li class="index-item method private">
<a href="#method_onError">onError</a>
</li>
<li class="index-item method private">
<a href="#method_onLoaded">onLoaded</a>
</li>
<li class="index-item method inherited">
<a href="#method_removeAllListeners">removeAllListeners</a>
</li>
</ul>
</div>
</div>
<div id="methods" class="api-class-tabpanel">
<h2 class="off-left">Methods</h2>
<div id="method_emit" class="method item inherited">
<h3 class="name"><code>emit</code></h3>
<div class="args">
<span class="paren">(</span><ul class="args-list inline commas">
<li class="arg">
<code>eventName</code>
</li>
</ul><span class="paren">)</span>
</div>
<span class="returns-inline">
<span class="type">Boolean</span>
</span>
<div class="meta">
<p>Inherited from
<a href="../classes/EventTarget.html#method_emit">EventTarget</a>:
<a href="../files/src_pixi_utils_EventTarget.js.html#l54"><code>src/pixi/utils/EventTarget.js:54</code></a>
</p>
</div>
<div class="description">
<p>Emit an event to all registered event listeners.</p>
</div>
<div class="params">
<h4>Parameters:</h4>
<ul class="params-list">
<li class="param">
<code class="param-name">eventName</code>
<span class="type">String</span>
<div class="param-description">
<p>The name of the event.</p>
</div>
</li>
</ul>
</div>
<div class="returns">
<h4>Returns:</h4>
<div class="returns-description">
<span class="type">Boolean</span>:
<p>Indication if we've emitted an event.</p>
</div>
</div>
</div>
<div id="method_listeners" class="method item inherited">
<h3 class="name"><code>listeners</code></h3>
<div class="args">
<span class="paren">(</span><ul class="args-list inline commas">
<li class="arg">
<code>eventName</code>
</li>
</ul><span class="paren">)</span>
</div>
<span class="returns-inline">
<span class="type">Array</span>
</span>
<div class="meta">
<p>Inherited from
<a href="../classes/EventTarget.html#method_listeners">EventTarget</a>:
<a href="../files/src_pixi_utils_EventTarget.js.html#l41"><code>src/pixi/utils/EventTarget.js:41</code></a>
</p>
</div>
<div class="description">
<p>Return a list of assigned event listeners.</p>
</div>
<div class="params">
<h4>Parameters:</h4>
<ul class="params-list">
<li class="param">
<code class="param-name">eventName</code>
<span class="type">String</span>
<div class="param-description">
<p>The events that should be listed.</p>
</div>
</li>
</ul>
</div>
<div class="returns">
<h4>Returns:</h4>
<div class="returns-description">
<span class="type">Array</span>:
<p>An array of listener functions</p>
</div>
</div>
</div>
<div id="method_load" class="method item">
<h3 class="name"><code>load</code></h3>
<span class="paren">()</span>
<div class="meta">
<p>
Defined in
<a href="../files/src_pixi_loaders_AtlasLoader.js.html#l32"><code>src/pixi/loaders/AtlasLoader.js:32</code></a>
</p>
</div>
<div class="description">
<p>Starts loading the JSON file</p>
</div>
</div>
<div id="method_mixin" class="method item inherited">
<h3 class="name"><code>mixin</code></h3>
<div class="args">
<span class="paren">(</span><ul class="args-list inline commas">
<li class="arg">
<code>object</code>
</li>
</ul><span class="paren">)</span>
</div>
<div class="meta">
<p>Inherited from
<a href="../classes/EventTarget.html#method_mixin">EventTarget</a>:
<a href="../files/src_pixi_utils_EventTarget.js.html#l34"><code>src/pixi/utils/EventTarget.js:34</code></a>
</p>
</div>
<div class="description">
<p>Mixes in the properties of the EventTarget prototype onto another object</p>
</div>
<div class="params">
<h4>Parameters:</h4>
<ul class="params-list">
<li class="param">
<code class="param-name">object</code>
<span class="type">Object</span>
<div class="param-description">
<p>The obj to mix into</p>
</div>
</li>
</ul>
</div>
</div>
<div id="method_off" class="method item inherited">
<h3 class="name"><code>off</code></h3>
<div class="args">
<span class="paren">(</span><ul class="args-list inline commas">
<li class="arg">
<code>eventName</code>
</li>
<li class="arg">
<code>callback</code>
</li>
</ul><span class="paren">)</span>
</div>
<div class="meta">
<p>Inherited from
<a href="../classes/EventTarget.html#method_off">EventTarget</a>:
<a href="../files/src_pixi_utils_EventTarget.js.html#l143"><code>src/pixi/utils/EventTarget.js:143</code></a>
</p>
</div>
<div class="description">
<p>Remove event listeners.</p>
</div>
<div class="params">
<h4>Parameters:</h4>
<ul class="params-list">
<li class="param">
<code class="param-name">eventName</code>
<span class="type">String</span>
<div class="param-description">
<p>The event we want to remove.</p>
</div>
</li>
<li class="param">
<code class="param-name">callback</code>
<span class="type">Function</span>
<div class="param-description">
<p>The listener that we need to find.</p>
</div>
</li>
</ul>
</div>
</div>
<div id="method_on" class="method item inherited">
<h3 class="name"><code>on</code></h3>
<div class="args">
<span class="paren">(</span><ul class="args-list inline commas">
<li class="arg">
<code>eventName</code>
</li>
<li class="arg">
<code>callback</code>
</li>
</ul><span class="paren">)</span>
</div>
<div class="meta">
<p>Inherited from
<a href="../classes/EventTarget.html#method_on">EventTarget</a>:
<a href="../files/src_pixi_utils_EventTarget.js.html#l107"><code>src/pixi/utils/EventTarget.js:107</code></a>
</p>
</div>
<div class="description">
<p>Register a new EventListener for the given event.</p>
</div>
<div class="params">
<h4>Parameters:</h4>
<ul class="params-list">
<li class="param">
<code class="param-name">eventName</code>
<span class="type">String</span>
<div class="param-description">
<p>Name of the event.</p>
</div>
</li>
<li class="param">
<code class="param-name">callback</code>
<span class="type">Functon</span>
<div class="param-description">
<p>fn Callback function.</p>
</div>
</li>
</ul>
</div>
</div>
<div id="method_onAtlasLoaded" class="method item private">
<h3 class="name"><code>onAtlasLoaded</code></h3>
<span class="paren">()</span>
<span class="flag private">private</span>
<div class="meta">
<p>
Defined in
<a href="../files/src_pixi_loaders_AtlasLoader.js.html#l46"><code>src/pixi/loaders/AtlasLoader.js:46</code></a>
</p>
</div>
<div class="description">
<p>Invoked when the Atlas has fully loaded. Parses the JSON and builds the texture frames.</p>
</div>
</div>
<div id="method_once" class="method item inherited">
<h3 class="name"><code>once</code></h3>
<div class="args">
<span class="paren">(</span><ul class="args-list inline commas">
<li class="arg">
<code>eventName</code>
</li>
<li class="arg">
<code>callback</code>
</li>
</ul><span class="paren">)</span>
</div>
<div class="meta">
<p>Inherited from
<a href="../classes/EventTarget.html#method_once">EventTarget</a>:
<a href="../files/src_pixi_utils_EventTarget.js.html#l124"><code>src/pixi/utils/EventTarget.js:124</code></a>
</p>
</div>
<div class="description">
<p>Add an EventListener that's only called once.</p>
</div>
<div class="params">
<h4>Parameters:</h4>
<ul class="params-list">
<li class="param">
<code class="param-name">eventName</code>
<span class="type">String</span>
<div class="param-description">
<p>Name of the event.</p>
</div>
</li>
<li class="param">
<code class="param-name">callback</code>
<span class="type">Function</span>
<div class="param-description">
<p>Callback function.</p>
</div>
</li>
</ul>
</div>
</div>
<div id="method_onError" class="method item private">
<h3 class="name"><code>onError</code></h3>
<span class="paren">()</span>
<span class="flag private">private</span>
<div class="meta">
<p>
Defined in
<a href="../files/src_pixi_loaders_AtlasLoader.js.html#l182"><code>src/pixi/loaders/AtlasLoader.js:182</code></a>
</p>
</div>
<div class="description">
<p>Invoked when an error occurs.</p>
</div>
</div>
<div id="method_onLoaded" class="method item private">
<h3 class="name"><code>onLoaded</code></h3>
<span class="paren">()</span>
<span class="flag private">private</span>
<div class="meta">
<p>
Defined in
<a href="../files/src_pixi_loaders_AtlasLoader.js.html#l166"><code>src/pixi/loaders/AtlasLoader.js:166</code></a>
</p>
</div>
<div class="description">
<p>Invoked when json file has loaded.</p>
</div>
</div>
<div id="method_removeAllListeners" class="method item inherited">
<h3 class="name"><code>removeAllListeners</code></h3>
<div class="args">
<span class="paren">(</span><ul class="args-list inline commas">
<li class="arg">
<code>eventName</code>
</li>
</ul><span class="paren">)</span>
</div>
<div class="meta">
<p>Inherited from
<a href="../classes/EventTarget.html#method_removeAllListeners">EventTarget</a>:
<a href="../files/src_pixi_utils_EventTarget.js.html#l173"><code>src/pixi/utils/EventTarget.js:173</code></a>
</p>
</div>
<div class="description">
<p>Remove all listeners or only the listeners for the specified event.</p>
</div>
<div class="params">
<h4>Parameters:</h4>
<ul class="params-list">
<li class="param">
<code class="param-name">eventName</code>
<span class="type">String</span>
<div class="param-description">
<p>The event you want to remove all listeners for.</p>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="../assets/vendor/prettify/prettify-min.js"></script>
<script>prettyPrint();</script>
<script src="../assets/js/yui-prettify.js"></script>
<script src="../assets/../api.js"></script>
<script src="../assets/js/api-filter.js"></script>
<script src="../assets/js/api-list.js"></script>
<script src="../assets/js/api-search.js"></script>
<script src="../assets/js/apidocs.js"></script>
</body>
</html>
