Interactivity Added

-Interaction Manager added to pixi.js to enable mouse and touch
interactivity.

- Interactive example added to examples folder

- docs updated

- build file updated
This commit is contained in:
Mat Groves 2013-03-20 20:21:27 +00:00
parent 9a0cd873b5
commit f5cc062922
63 changed files with 4844 additions and 280 deletions

View file

@ -15,11 +15,11 @@
<div id="hd" class="yui3-g header">
<div class="yui3-u-3-4">
<h1><img src="..&#x2F;logo_small.png" title="Pixi.js API"></h1>
<h1><img src="http:&#x2F;&#x2F;www.goodboydigital.com&#x2F;pixijs&#x2F;logo_small.png" title="Pixi.js API"></h1>
</div>
<div class="yui3-u-1-4 version">
<em>API Docs for: 0.9</em>
<em>API Docs for: 1.0</em>
</div>
</div>
<div id="bd" class="yui3-g">
@ -51,6 +51,10 @@
<li><a href="..&#x2F;classes/DisplayObjectContainer.html">DisplayObjectContainer</a></li>
<li><a href="..&#x2F;classes/InteractionData.html">InteractionData</a></li>
<li><a href="..&#x2F;classes/InteractionManager.html">InteractionManager</a></li>
<li><a href="..&#x2F;classes/MovieClip.html">MovieClip</a></li>
<li><a href="..&#x2F;classes/Point.html">Point</a></li>
@ -269,6 +273,13 @@
</li>
<li class="index-item method">
<a href="#method_click">click</a>
</li>
<li class="index-item method">
@ -287,6 +298,34 @@
<span class="flag static">static</span>
</li>
<li class="index-item method">
<a href="#method_mousedown">mousedown</a>
</li>
<li class="index-item method">
<a href="#method_mouseout">mouseout</a>
</li>
<li class="index-item method">
<a href="#method_mouseover">mouseover</a>
</li>
<li class="index-item method">
<a href="#method_mouseup">mouseup</a>
</li>
<li class="index-item method inherited">
@ -294,6 +333,13 @@
</li>
<li class="index-item method">
<a href="#method_setInteractive">setInteractive</a>
</li>
<li class="index-item method">
@ -301,6 +347,27 @@
</li>
<li class="index-item method">
<a href="#method_tap">tap</a>
</li>
<li class="index-item method">
<a href="#method_touchend">touchend</a>
</li>
<li class="index-item method">
<a href="#method_touchstart">touchstart</a>
</li>
</ul>
@ -604,6 +671,93 @@
</div>
<div id="method_click" class="method item">
<h3 class="name"><code>click</code></h3>
<div class="args">
<span class="paren">(</span><ul class="args-list inline commas">
<li class="arg">
<code>interactionData</code>
</li>
</ul><span class="paren">)</span>
</div>
<div class="meta">
<p>
Defined in
<a href="..&#x2F;files&#x2F;pixi_Sprite.js.html#l86"><code>pixi&#x2F;Sprite.js:86</code></a>
</p>
</div>
<div class="description">
<p>A callback that is used when the users clicks on the sprite with thier mouse</p>
</div>
<div class="params">
<h4>Parameters:</h4>
<ul class="params-list">
<li class="param">
<code class="param-name">interactionData</code>
<span class="type"><a href="../classes/InteractionData.html" class="crosslink">InteractionData</a></span>
<div class="param-description">
</div>
</li>
</ul>
</div>
</div>
@ -655,7 +809,7 @@
<a href="..&#x2F;files&#x2F;pixi_Sprite.js.html#l111"><code>pixi&#x2F;Sprite.js:111</code></a>
<a href="..&#x2F;files&#x2F;pixi_Sprite.js.html#l189"><code>pixi&#x2F;Sprite.js:189</code></a>
</p>
@ -666,7 +820,7 @@
</div>
<div class="description">
<p>Helper function that creates a sprite that will contain a texture from the TextureCache based on tjhe frameId
<p>Helper function that creates a sprite that will contain a texture from the TextureCache based on the frameId
The frame ids are created when a Texture packer file has been loaded</p>
</div>
@ -762,7 +916,7 @@
<a href="..&#x2F;files&#x2F;pixi_Sprite.js.html#l127"><code>pixi&#x2F;Sprite.js:127</code></a>
<a href="..&#x2F;files&#x2F;pixi_Sprite.js.html#l205"><code>pixi&#x2F;Sprite.js:205</code></a>
</p>
@ -818,6 +972,355 @@
</div>
<div id="method_mousedown" class="method item">
<h3 class="name"><code>mousedown</code></h3>
<div class="args">
<span class="paren">(</span><ul class="args-list inline commas">
<li class="arg">
<code>interactionData</code>
</li>
</ul><span class="paren">)</span>
</div>
<div class="meta">
<p>
Defined in
<a href="..&#x2F;files&#x2F;pixi_Sprite.js.html#l92"><code>pixi&#x2F;Sprite.js:92</code></a>
</p>
</div>
<div class="description">
<p>A callback that is used when the user clicks the mouse down over the sprite</p>
</div>
<div class="params">
<h4>Parameters:</h4>
<ul class="params-list">
<li class="param">
<code class="param-name">interactionData</code>
<span class="type"><a href="../classes/InteractionData.html" class="crosslink">InteractionData</a></span>
<div class="param-description">
</div>
</li>
</ul>
</div>
</div>
<div id="method_mouseout" class="method item">
<h3 class="name"><code>mouseout</code></h3>
<div class="args">
<span class="paren">(</span><ul class="args-list inline commas">
<li class="arg">
<code>interactionData</code>
</li>
</ul><span class="paren">)</span>
</div>
<div class="meta">
<p>
Defined in
<a href="..&#x2F;files&#x2F;pixi_Sprite.js.html#l111"><code>pixi&#x2F;Sprite.js:111</code></a>
</p>
</div>
<div class="description">
<p>A callback that is used when the users mouse leaves the sprite</p>
</div>
<div class="params">
<h4>Parameters:</h4>
<ul class="params-list">
<li class="param">
<code class="param-name">interactionData</code>
<span class="type"><a href="../classes/InteractionData.html" class="crosslink">InteractionData</a></span>
<div class="param-description">
</div>
</li>
</ul>
</div>
</div>
<div id="method_mouseover" class="method item">
<h3 class="name"><code>mouseover</code></h3>
<div class="args">
<span class="paren">(</span><ul class="args-list inline commas">
<li class="arg">
<code>interactionData</code>
</li>
</ul><span class="paren">)</span>
</div>
<div class="meta">
<p>
Defined in
<a href="..&#x2F;files&#x2F;pixi_Sprite.js.html#l105"><code>pixi&#x2F;Sprite.js:105</code></a>
</p>
</div>
<div class="description">
<p>A callback that is used when the users mouse rolls over the sprite</p>
</div>
<div class="params">
<h4>Parameters:</h4>
<ul class="params-list">
<li class="param">
<code class="param-name">interactionData</code>
<span class="type"><a href="../classes/InteractionData.html" class="crosslink">InteractionData</a></span>
<div class="param-description">
</div>
</li>
</ul>
</div>
</div>
<div id="method_mouseup" class="method item">
<h3 class="name"><code>mouseup</code></h3>
<div class="args">
<span class="paren">(</span><ul class="args-list inline commas">
<li class="arg">
<code>interactionData</code>
</li>
</ul><span class="paren">)</span>
</div>
<div class="meta">
<p>
Defined in
<a href="..&#x2F;files&#x2F;pixi_Sprite.js.html#l98"><code>pixi&#x2F;Sprite.js:98</code></a>
</p>
</div>
<div class="description">
<p>A callback that is used when the user releases the mouse that was over the sprite
for this callback to be fired the mouse must have been pressed down over the sprite</p>
</div>
<div class="params">
<h4>Parameters:</h4>
<ul class="params-list">
<li class="param">
<code class="param-name">interactionData</code>
<span class="type"><a href="../classes/InteractionData.html" class="crosslink">InteractionData</a></span>
<div class="param-description">
</div>
</li>
</ul>
</div>
</div>
@ -902,6 +1405,93 @@
</div>
<div id="method_setInteractive" class="method item">
<h3 class="name"><code>setInteractive</code></h3>
<div class="args">
<span class="paren">(</span><ul class="args-list inline commas">
<li class="arg">
<code>interactive</code>
</li>
</ul><span class="paren">)</span>
</div>
<div class="meta">
<p>
Defined in
<a href="..&#x2F;files&#x2F;pixi_Sprite.js.html#l164"><code>pixi&#x2F;Sprite.js:164</code></a>
</p>
</div>
<div class="description">
<p>Indicates if the sprite will have touch and mouse interactivity. It is false by default</p>
</div>
<div class="params">
<h4>Parameters:</h4>
<ul class="params-list">
<li class="param">
<code class="param-name">interactive</code>
<span class="type">Boolean</span>
<div class="param-description">
</div>
</li>
</ul>
</div>
</div>
@ -947,7 +1537,7 @@
<a href="..&#x2F;files&#x2F;pixi_Sprite.js.html#l79"><code>pixi&#x2F;Sprite.js:79</code></a>
<a href="..&#x2F;files&#x2F;pixi_Sprite.js.html#l146"><code>pixi&#x2F;Sprite.js:146</code></a>
</p>
@ -989,6 +1579,269 @@
</div>
<div id="method_tap" class="method item">
<h3 class="name"><code>tap</code></h3>
<div class="args">
<span class="paren">(</span><ul class="args-list inline commas">
<li class="arg">
<code>interactionData</code>
</li>
</ul><span class="paren">)</span>
</div>
<div class="meta">
<p>
Defined in
<a href="..&#x2F;files&#x2F;pixi_Sprite.js.html#l121"><code>pixi&#x2F;Sprite.js:121</code></a>
</p>
</div>
<div class="description">
<p>A callback that is used when the users taps on the sprite with thier finger
basically a touch version of click</p>
</div>
<div class="params">
<h4>Parameters:</h4>
<ul class="params-list">
<li class="param">
<code class="param-name">interactionData</code>
<span class="type"><a href="../classes/InteractionData.html" class="crosslink">InteractionData</a></span>
<div class="param-description">
</div>
</li>
</ul>
</div>
</div>
<div id="method_touchend" class="method item">
<h3 class="name"><code>touchend</code></h3>
<div class="args">
<span class="paren">(</span><ul class="args-list inline commas">
<li class="arg">
<code>interactionData</code>
</li>
</ul><span class="paren">)</span>
</div>
<div class="meta">
<p>
Defined in
<a href="..&#x2F;files&#x2F;pixi_Sprite.js.html#l134"><code>pixi&#x2F;Sprite.js:134</code></a>
</p>
</div>
<div class="description">
<p>A callback that is used when the user releases the touch that was over the sprite
for this callback to be fired. The touch must have started over the sprite</p>
</div>
<div class="params">
<h4>Parameters:</h4>
<ul class="params-list">
<li class="param">
<code class="param-name">interactionData</code>
<span class="type"><a href="../classes/InteractionData.html" class="crosslink">InteractionData</a></span>
<div class="param-description">
</div>
</li>
</ul>
</div>
</div>
<div id="method_touchstart" class="method item">
<h3 class="name"><code>touchstart</code></h3>
<div class="args">
<span class="paren">(</span><ul class="args-list inline commas">
<li class="arg">
<code>interactionData</code>
</li>
</ul><span class="paren">)</span>
</div>
<div class="meta">
<p>
Defined in
<a href="..&#x2F;files&#x2F;pixi_Sprite.js.html#l128"><code>pixi&#x2F;Sprite.js:128</code></a>
</p>
</div>
<div class="description">
<p>A callback that is used when the user touch's over the sprite</p>
</div>
<div class="params">
<h4>Parameters:</h4>
<ul class="params-list">
<li class="param">
<code class="param-name">interactionData</code>
<span class="type"><a href="../classes/InteractionData.html" class="crosslink">InteractionData</a></span>
<div class="param-description">
</div>
</li>
</ul>
</div>
</div>