<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>src/pixi/MovieClip.js - Pixi.JS</title>
<link rel="stylesheet" href="http://yui.yahooapis.com/3.8.0/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.8.0/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: 1.0.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/AssetLoader.html">AssetLoader</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/CanvasRenderer.html">CanvasRenderer</a></li>
<li><a href="../classes/DisplayObject.html">DisplayObject</a></li>
<li><a href="../classes/DisplayObjectContainer.html">DisplayObjectContainer</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/MovieClip.html">MovieClip</a></li>
<li><a href="../classes/Point.html">Point</a></li>
<li><a href="../classes/Rectangle.html">Rectangle</a></li>
<li><a href="../classes/Sprite.html">Sprite</a></li>
<li><a href="../classes/SpriteSheetLoader.html">SpriteSheetLoader</a></li>
<li><a href="../classes/Stage.html">Stage</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/WebGLBatch.html">WebGLBatch</a></li>
<li><a href="../classes/WebGLRenderer.html">WebGLRenderer</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 class="file-heading">File: src/pixi/MovieClip.js</h1>
<div class="file">
<pre class="code prettyprint linenums">
/**
* @author Mat Groves http://matgroves.com/ @Doormat23
*/
/**
* A MovieClip is a simple way to display an animation depicted by a list of textures.
* @class MovieClip
* @extends Sprite
* @constructor
* @param textures {Array} an array of {Texture} objects that make up the animation
*/
PIXI.MovieClip = function(textures)
{
PIXI.Sprite.call( this, textures[0]);
/**
* The array of textures that make up the animation
* @property textures
* @type Array
*/
this.textures = textures;
/**
* [read only] The index MovieClips current frame (this may not have to be a whole number)
* @property currentFrame
* @type Number
*/
this.currentFrame = 0;
/**
* The speed that the MovieClip will play at. Higher is faster, lower is slower
* @property animationSpeed
* @type Number
*/
this.animationSpeed = 1;
/**
* Whether or not the movie clip repeats after playing.
* @property loop
* @type Boolean
*/
this.loop = true;
/**
* Function to call when a MovieClip finishes playing
* @property onComplete
* @type Function
*/
this.onComplete = null;
/**
* [read only] indicates if the MovieClip is currently playing
* @property playing
* @type Boolean
*/
this.playing;
}
// constructor
PIXI.MovieClip.constructor = PIXI.MovieClip;
PIXI.MovieClip.prototype = Object.create( PIXI.Sprite.prototype );
/**
* Stops the MovieClip
* @method stop
*/
PIXI.MovieClip.prototype.stop = function()
{
this.playing = false;
}
/**
* Plays the MovieClip
* @method play
*/
PIXI.MovieClip.prototype.play = function()
{
this.playing = true;
}
/**
* Stops the MovieClip and goes to a specific frame
* @method gotoAndStop
* @param frameNumber {Number} frame index to stop at
*/
PIXI.MovieClip.prototype.gotoAndStop = function(frameNumber)
{
this.playing = false;
this.currentFrame = frameNumber;
var round = (this.currentFrame + 0.5) | 0;
this.setTexture(this.textures[round % this.textures.length]);
}
/**
* Goes to a specific frame and begins playing the MovieClip
* @method gotoAndPlay
* @param frameNumber {Number} frame index to start at
*/
PIXI.MovieClip.prototype.gotoAndPlay = function(frameNumber)
{
this.currentFrame = frameNumber;
this.playing = true;
}
PIXI.MovieClip.prototype.updateTransform = function()
{
PIXI.Sprite.prototype.updateTransform.call(this);
if(!this.playing)return;
this.currentFrame += this.animationSpeed;
var round = (this.currentFrame + 0.5) | 0;
if(this.loop || round < this.textures.length)
{
this.setTexture(this.textures[round % this.textures.length]);
}
else if(round >= this.textures.length)
{
this.gotoAndStop(this.textures.length - 1);
if(this.onComplete)
{
this.onComplete();
}
}
}
</pre>
</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>
